/* CSS Document */


.its-redFadingHR {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(201,40,33,0.1), rgba(201,40,33,0.99), rgba(201,40,33,0.1));
    background-image: -moz-linear-gradient(left, rgba(201,40,33,0.3), rgba(201,40,33,0.99), rgba(201,40,33,0.3));
    background-image: -ms-linear-gradient(left, rgba(201,40,33,0.3), rgba(201,40,33,0.99), rgba(201,40,33,0.3));
    background-image: -o-linear-gradient(left, rgba(201,40,33,0.3), rgba(201,40,33,0.99), rgba(201,40,33,0.3));
}

.its-redHR {
    border: 1px;
    -moz-border-image: -moz-linear-gradient(left, rgba(201,40,33,0.3), rgba(201,40,33,0.99), rgba(201,40,33,0.3));
    height: 1px;
    width:100%;
}

#its-scrollWrapper {
    height:100%;
    overflow:hidden;
}

#its-mainContentWrapper > #its-scrollWrapper {
    width: 76em;
    margin-left:12em;
}

.mCSB_draggerContainer {
    z-index: 1000;
}

/*
div#its-gp-mainContentContainer div.mCSB_scrollTools_horizontal {
    display: none !important;
}*/

#its-mainContentKeyvis {
    position:fixed;
    top:70px;
    height:25em;
    width:76.05em;
    background: #686568;
    overflow: hidden;
    -webkit-border-top-left-radius: 12px;
    -webkit-border-top-right-radius: 12px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    background-size: cover;
}

#its-mainContentKeyvis div {
    color: white;
    position:absolute;
    top: 5em;
    left: 5em;
    text-shadow: 1px 1px #000;
}

#its-mainContentKeyvis div p {
    font-size: 1.2em;
    margin: 0;
    padding: 0;
}

#its-mainContentKeyvis div h1 {
    font-size: 2em;
    margin: 0;
    padding: 0;
}

/* --------------------------------------------------------- */

.its-contextTeaser-content {
    margin-top: 2em;
}

.its-contextTeaser-content a {
    color: #e1e1e1;
    text-decoration: none;
}

.its-contextTeaser-content .its-contextTeaser-content-innerWrapper {
    background-color: #26262f;
    border-radius: 0.5em;
}

.its-contextTeaser-content .its-contextTeaser-content-innerWrapper h3 {
    padding: 0.8em 0.6em 0.4em  0.6em;
    margin: 0 0 0.3em 0;
    font-size: 0.96em;
    font-weight: normal;
    color: #dd5957;
    /*     color: #cb504e; */
}

.its-contextTeaser-content .its-contextTeaser-content-innerWrapper p {
    padding: 1em 0.6em 0.4em 0.6em;
    font-size: 0.87em;
    margin: 0;
}

.its-contextTeaser-content .its-contextTeaser-content-linkBtnWrapper {
    text-align: right;
    font-size: 0.85em;
    padding: 0 0.7em 0.4em 0;
}

.its-contextTeaser-content .its-contextTeaser-content-linkBtnWrapper a {
    color: #cb504e;
}

.its-contextTeaser-content .its-contextTeaser-content-textWrapper {
    padding: 0 0 0.6em 0;
}

/* --------------------------------------------------------- */

#its-mainContentWrapper {
    position:absolute;
    top: 70px;
    bottom: 26px;
    width: 100%;
    overflow: hidden;
}

#its-mainContentBlock {
    margin-top: 15em;
    margin-left:3em;
    width:54em;
    bottom:0;
    color:#CCC;
    background-color: #1D1D1D;
    z-index:10;
    padding:1.5em 2em 2em 2em;
    min-height:100%;
    position: relative;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    line-height: 1.5;
}

#its-mainContentBlock p a {
    font-style: italic;
    color: #d2cece;
    text-decoration: none;
    padding: 0 0 0 11px;
    background-image: url("../assets/link-icon-red.png");
    background-size: auto 60%;
    background-repeat: no-repeat;
    background-position-y: center;
    border-bottom: 1px dotted #992214;
}

#its-mainContentBlock em {
    color: #DFC9AB
}

#its-mainContentBlock h1 {
    font-size: 1.3em;
}

#its-mainContentBlock h3 {
    padding: 0.5em 0 0.2em 0;
    margin: 0;
}

#its-mainContentBlock h4 {
    padding: 0.3em 0 0 0;
    margin: 0;
    font-size: 1.05em;
    font-weight: bold;
}

#its-mainContentBlock div.ce-bodytext .highlightingBlock {
    border: 1px dotted rgba(215, 209, 146, 0.5);
    background-color: #5d170d;
    color: #d4ccb2;
    padding: 0.4em;
    margin: 0.15em 0 0 0;
    border-radius: 5px;
}

#its-mainContentBlock div.ce-bodytext {
}

#its-mainContentBlock .ce-bodytext p {
    padding: 0.2em 0 1em 0;
    margin: 0 0 0 0;
    font-size: 0.9em;
}

#its-mainContentBlock ul {
    padding: 0.2em 0.2em 0.6em 0.2em;
    margin: 0;
}

#its-mainContentBlock ul li {
    margin: 0;
    padding: 0.3em 0.8em;
    position: relative;
}

#its-mainContentBlock ul li::before {
    content: "■  ";
    color: #bd2715;
    font-size: 80%;
    top: 0.5em;
    left: -0.1em;
    position: absolute;
}

#its-mainContentBlock div.ce-bodytext ol {
    margin: 0;
    padding: 0 0 0.5em 1em;
}


#its-mainContentBlock div.ce-bodytext ol li {
    margin: 0;
    padding: 0.3em 0.8em;
    position: relative;
}

#its-mainContentBlock h1, #its-mainContentBlock h2, #its-mainContentBlock h3, #its-mainContentBlock h4{
    color: #ddd;
}

#its-mainContentBlock div {
}

#its-contentWrapperHeader {
    background: url(../assets/backgrounds/content-central-top-background-k2.png) no-repeat bottom right;
    position:absolute;
    left:15em;
    width:58em;
    top: 51px;
    height:28px;
    opacity:.68;
    filter:alpha(opacity=68);
}

#its-contentWrapperHeader div:nth-child(1){
    background: url(../assets/backgrounds/content-central-top-background-k2.png) no-repeat;
    background-position: center;
    width: 9px;
    height: 28px;
    position: absolute;
}

#its-contentWrapperHeader div:nth-child(2){
    background: url(../assets/backgrounds/content-central-top-background-k2.png) repeat-x top left;
    height: 28px;
    margin: 0 9px;
}

/* ============================ fading blocks ===================================== */

#its-mainContentTopFadeOutBlock {
    position:absolute;
    width:58em;
    height: 42px;
    top: 0;
    left: 15em;
    z-index: 20;
}

#its-mainContentWrapper > #its-scrollWrapper #its-mainContentTopFadeOutBlock {
    top: 15em;
    left: 3em;
}

#its-mainContentTopFadeOutBlock div.its-mainContentFadeInnerNoGrad {
    background-color:#1D1D1D;
    position:absolute;
    top:0;
    left:4px;
    width: calc(100% - 8px);
    height:6px;

    -webkit-border-top-left-radius: 33px;
    -webkit-border-top-right-radius: 33px;
    border-top-left-radius: 33px;
    border-top-right-radius: 33px;
}

#its-mainContentTopFadeOutBlock div.its-mainContentFadeInnerGrad {
    background: -moz-linear-gradient(top,  rgba(29,29,29,1) 0%, rgba(29,29,29,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(29,29,29,1)), color-stop(100%,rgba(29,29,29,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(29,29,29,1) 0%,rgba(29,29,29,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(29,29,29,1) 0%,rgba(29,29,29,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(29,29,29,1) 0%,rgba(29,29,29,0) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(29,29,29,1) 0%,rgba(29,29,29,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1D1D1DFF', endColorstr='#1D1D1D00',GradientType=0 ); /* IE6-9 */

    position:relative;
    top:0;
    left:0;
    height:36px;

    -webkit-border-top-left-radius: 12px;
    -webkit-border-top-right-radius: 12px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

#its-mainContentTopFadeOutBlock .its-redFadingHR {
    position:absolute;
    top:0;
    left: 10px;
    margin: 0;
    padding: 0;
    width: calc(100% - 20px);
}


/* ---------------------------------------------------------------------------------- */

#its-mainContentBottomFadeOutBlock {
    position:fixed;
    left:15em;
    width:58em;
    bottom: 0;
    height: 48px;
    z-index: 60;
}

#its-mainContentBottomFadeOutBlock div.its-mainContentFadeInnerGrad {
    background: -moz-linear-gradient(top,  rgba(29,29,29,0) 0%, rgba(29,29,29,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(29,29,29,0)), color-stop(100%,rgba(29,29,29,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(29,29,29,0) 0%,rgba(29,29,29,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(29,29,29,0) 0%,rgba(29,29,29,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(29,29,29,0) 0%,rgba(29,29,29,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(29,29,29,0) 0%,rgba(29,29,29,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1D1D1D00', endColorstr='#1D1D1DFF',GradientType=0 ); /* IE6-9 */
    height:18px;
}

#its-mainContentBottomFadeOutBlock div.its-mainContentFadeInnerNoGrad {
    background-color:#1D1D1D;
    height:8px;
}


/* =========================Layout of Content Element ================================= */

.its-lightboxGroupWrapper {
    text-align: center;
}

.its-lightboxGroup {
    border: 1px solid rgba(255, 23, 0, 0.29);
    text-align: center;
    padding: 8px 8px 6px 8px;
    background-color: rgba(49, 30, 29, 0.62);
    margin: 15px 0;
    display: inline-block;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.its-lightboxGroup a {
    text-decoration: none;
    border: none;
    padding: 0;
    margin: 0;
    font-size: 1px;
}

.its-lightboxGroup img {
    padding: 0;
    margin: 4px 4px 0 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;

}

#its-mainContentBlock .its-lightboxGroup p {
    font-style: italic;
    padding:0;
    font-size: 0.8em;
    margin: 0.1em 0 1em 0;
}

/* ---------------------------------------------------------------------------
     Fading Box (Lightbox) styling
------------------------------------------------------------------------------*/

.its-lightboxFadingWrapper {
    position:relative;
    width: 65%;
    padding-top: 46%;
    margin:0 auto 0.8em auto;
}

.its-lightboxFadingWrapper ol {
    position: absolute;
    top: 0;
    padding: 0;
    margin: 0;
}


.its-lightboxFadingWrapper ol, .its-lightboxFadingWrapper ol:after {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
}
.its-lightboxFadingWrapper ol:after {
    content: '';
}

.its-lightboxFadingWrapper ol li {
    list-style: none;
}

.its-lightboxFadingWrapper ol li span {
    width: calc(100% - 1.6em);
    height: calc(100% - 1.6em);
    position: absolute;
    top: 0.8em;
    left: 0.8em;
    color: transparent;
    background-size: cover;
    opacity: 0;
    z-index: 0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.its-lightboxFadingWrapper ol li div {
    z-index: 1000;
    position: absolute;
    bottom: 0.8em;
    left: 0.8em;
    text-align: center;
    opacity: 0;
    color: #fff;
    width: calc(100% - 1.6em);
    border-radius: 0 0 4px 4px;
    background-color: rgba(0,0,0,0.5);

}
.its-lightboxFadingWrapper ol li div h3 {
    font-size: 0.9em;
    font-weight: normal;
    padding: 0;
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation {
    0% { opacity: 0;
        -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
        -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-moz-keyframes imageAnimation {
    0% { opacity: 0;
        -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
        -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-o-keyframes imageAnimation {
    0% { opacity: 0;
        -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
        -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-ms-keyframes imageAnimation {
    0% { opacity: 0;
        -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
        -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@keyframes imageAnimation {
    0% { opacity: 0; animation-timing-function: ease-in; }
    16.67% { opacity: 1; animation-timing-function: ease-out; }
    33.34% { opacity: 1 }
    50% { opacity: 0 }
    100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation {
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-moz-keyframes titleAnimation {
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-o-keyframes titleAnimation {
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-ms-keyframes titleAnimation {
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@keyframes titleAnimation {
    0% { opacity: 0; animation-timing-function: ease-in; }
    16.67% { opacity: 1; animation-timing-function: ease-out; }
    33.34% { opacity: 1 }
    50% { opacity: 0 }
    100% { opacity: 0 }
}

/* ========================= Layout of SubTeaser page elements ================================= */

.its-subteaser-groupTitle {
    background-color: #501400;
    padding: 0.2em 0.4em;
    margin: 1.5em 0 -0.25em 0;
    font-size: 1.15em;

    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    border-top-right-radius: 6px;

    -webkit-border-top-left-radius: 6px;
    -moz-border-radius-topleft: 6px;
    border-top-left-radius: 6px;
}

.its-subteaser-row {
    margin: 0.5em 0 0 0;
    /*border-top: 1px solid #501400;*/
    padding: 1em 0 0 0;
    width: 100%;
}

#its-mainContentBlock .its-subteaser-row h3 {
    padding: 0;
    margin: 0;
}

.its-subteaser-row::after, .its-subteaser-headline {
    content: "";
    clear: both;
    display: table;
}

.its-subteaser-row a {
    color: #e9e9e9;
}

[class*="its-subteaser-col-"] {
    float: left;
    padding: 0;
    margin: 0;
}

.its-subteaser-headline {
    float: right;
    margin: 0;
    padding: 0;
    width: 80%;
    text-align: left;
}

.its-subteaser-headline h3 {
    float: left;
    width: 520px;
    /* border:1px solid yellow; */
    margin: 0;
    padding: 0;
    font-size: 1.05em;
}

.its-subteaser-headline h3 a {
    text-decoration: none;
    font-size: 0.9em;
}

.its-subteaser-headline p {
    float: right;
    width: 100px;
    margin: 0;
    padding: 0 1em 0 0;
    text-align: right;
    font-size: 0.9em;
}


.its-subteaser-col-1 {
    width: 20%;
}

.its-subteaser-col-1 img {
    margin: 0.2em 0.5em 0.5em 0.5em;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}


.its-subteaser-col-2 {
    width: 80%;
}
.its-subteaser-full {
    width: 100% !important;
}

.its-subteaser-block .its-redFadingHR {
    background-image: -webkit-linear-gradient(left, rgba(201,40,33,0.05), rgba(201,40,33,0.6), rgba(201,40,33,0.05));
    background-image: -moz-linear-gradient(left, rgba(201,40,33,0.05), rgba(201,40,33,0.6), rgba(201,40,33,0.05));
    background-image: -ms-linear-gradient(left, rgba(201,40,33,0.05), rgba(201,40,33,0.6), rgba(201,40,33,0.05));
    background-image: -o-linear-gradient(left, rgba(201,40,33,0.05), rgba(201,40,33,0.6), rgba(201,40,33,0.05));
}

/* ========================== Layout of contact form ============================== */

.contenttable {
    font-size: 0.9em;
}

.contenttable a {
    color: #d2cece;
}

#its-contact-form {
    margin: 3em 0 0 0;
    font-size: 0.9em;
}

#its-contact-form label{
    float:left;
    display: block;
    width: 7em;

    margin: 0.5em 0;
}

#its-contact-form input, #its-contact-form textarea  {
    background-color: #3f3f3f;
    width: 100%;
    border:1px solid #4d4b44;
    margin: 0.5em 0.5em 0 0;
    color: #cbc0be;

    padding:0.2em;
}

#its-contact-form input.parsley-error, #its-contact-form textarea.parsley-error {
    /*background-color: #4a1b17;*/
    border:1px solid #992214;
}

#its-contact-form .powermail_fieldwrap_type_submit {
    margin: 0.5em 0 0 7.0em;
}

#its-contact-form input.powermail_submit {
    background-color: #4f1c18;
    border-color: #3f3f3f;
    width: calc(100% + 2px);
}

#its-contact-form input.powermail_submit:hover {
    background-color: #6c1a1a;
}

#its-contact-form input.powermail_submit:active {
    background-color: #a41e14;
}

#its-contact-form div.powermail_fieldwrap {
    clear: both;
}

#its-contact-form div.powermail_field {
    width: 23em;
    float:left;
    position: relative;
}

#its-contact-form .powermail_fieldwrap_type_submit .powermail_field {
    width: 23.4em;
}

#its-contact-form ul.parsley-errors-list {
    position: absolute;
    right: -21.5em;
    top: 0.75em;
    padding: 0;
    margin: 0;
}

#its-contact-form ul.parsley-errors-list li {
    padding: 0;
    color: #bd2715;
    margin: 0;
    width: 20em;
    text-align: left;
}

#its-contact-form textarea {
    height: 15em;
}

#its-contact-form fieldset {
    border: 1px solid #501400;
    background-color: #231b16;
    background-image: url("../assets/letter.png");
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: right;
}

#its-contact-form fieldset legend {
    color: #d2cece;
}

/* ============================  404 error page =================================== */

.its-404-page {
    text-align: center;
}

.its-404-page h1 {
    color: white;
    font-size: 5em;
    margin: 1em 0 0 0;
}

.its-404-page p {
    color: #e4ce8b;
    font-size: 3.4em;
    margin: 0;
    text-shadow: 2px 2px rgba(0, 0, 0, 0.5);
}

.its-404-page a {
    color: #e8e4dc;
    font-size: 1.4em;
    text-decoration: none;
    margin: 0;
}

/* =============================== sidebar ======================================== */

#its-backgroundContentSideBars {
    position:absolute;
    top:70px;
    width:76em;
    left:12em;
    bottom:0;
    background-color: rgba(22,22,22, 0.7);

    -webkit-border-top-left-radius: 12px;
    -moz-border-radius-topleft: 12px;
    border-top-left-radius: 12px;

    -webkit-border-top-right-radius: 12px;
    -moz-border-radius-topright: 12px;
    border-top-right-radius: 12px;
}

#its-backgroundContentSideBars div {
    margin-left:3em;
    width:58em;
    bottom:0;
    background-color:#1D1D1D;
    height:100%;
}

#its-rightContentSideBar {
    position:fixed;
    left:73.5em;
    top:74px;
    width:12em;
    bottom:0;
    color:#CCC;
    padding-top:12.8em;
    padding-left:1em;
    padding-right:1em;
    padding-bottom:1em;
}


/* ================================ responsive behavior ==================================== */

@media only screen and ( max-width: 92em ) { /* 1472px */

    /* --- make content area smaller --- */
    #its-backgroundContentSideBars { left:8em; width:66em; }
    #its-backgroundContentSideBars div { width:48em; }
    #its-contentWrapperHeader { width:48em; }
    #its-mainContentWrapper > #its-scrollWrapper { margin-left:8em; width:66em; }
    #its-mainContentBlock { width: 44em }
    #its-mainContentWrapper > #its-mainContentTopFadeOutBlock { left:11em; width:48em;}
    #its-mainContentWrapper > #its-scrollWrapper #its-mainContentTopFadeOutBlock { width:48em; }
    #its-mainContentBottomFadeOutBlock { width:48em;  }
    #its-mainContentBottomFadeOutBlock, #its-contentWrapperHeader  { left:11em; }
    #its-mainContentKeyvis { left:8em; width:66em; }
    #its-rightContentSideBar { left:59.5em; }

    .its-subteaser-col-1 { width: 10em; }
    .its-subteaser-col-2 { width: 30em;}
    .its-subteaser-headline { width: 34em; }
    .its-subteaser-headline h3 { width: 26em; }
    .its-subteaser-headline p { width: 5em; }

    .its-subteaser-full h3  { width: 35em; }

    #its-contact-form ul.parsley-errors-list { right: -21.0em; }
}


@media only screen and ( max-width: 75em ) /* 1200px */ {
    #its-mainContentWrapper > #its-scrollWrapper {  margin-left:4em; }
    #its-mainContentBlock { margin-left:3em; }
    #its-contentWrapperHeader, #its-mainContentBottomFadeOutBlock {  left:7em; }
    #its-mainContentWrapper > #its-mainContentTopFadeOutBlock { left:7em; }
    #its-mainContentWrapper > #its-scrollWrapper #its-mainContentTopFadeOutBlock {  left:3em; }
    #its-backgroundContentSideBars { left:4em;  width:66em; }
    #its-mainContentKeyvis { left:4em; width:66em; }
    #its-rightContentSideBar { left:55.5em; }
}

@media only screen and ( max-width: 68em ) /* 1088px */ {
    #its-mainContentWrapper > #its-scrollWrapper { width:56em; }
    #its-rightContentSideBar { display:none; }
    #its-backgroundContentSideBars { width:56em; }
    #its-mainContentKeyvis { width:56em; }
    #its-mainContentBlock p, #its-mainContentBlock li { font-size: 1.0em; }

}


@media only screen and ( max-width: 59em ) /* 1000 */ {
    #its-mainContentWrapper > #its-scrollWrapper { margin-left:1em; width:53em; }
    #its-mainContentWrapper > #its-mainContentTopFadeOutBlock { left:2em; }
    #its-mainContentBottomFadeOutBlock, #its-contentWrapperHeader { left:2em; }
    #its-mainContentWrapper > #its-scrollWrapper #its-mainContentTopFadeOutBlock {  left:1em; }
    #its-backgroundContentSideBars { left:1em; width:53em; }
    #its-backgroundContentSideBars div { margin-left:1em; }
    #its-mainContentKeyvis { left:1em; width:53em; }
    #its-rightContentSideBar { left:50em; }
    #its-mainContentBlock { margin-left:1em; }
}

@media only screen and ( max-width: 53em ) /* 640 */ {
    #its-mainContentWrapper > #its-mainContentTopFadeOutBlock { left:0; width: 100vw; top: -1px; z-index: 40; border-top: 1px solid rgba(0,0,0,0); }
    #its-mainContentWrapper > #its-scrollWrapper #its-mainContentTopFadeOutBlock { width: 100vw; margin-top: -1px; z-index: 40; border-top: 1px solid rgba(0,0,0,0); }
    #its-mainContentWrapper > #its-scrollWrapper { margin-left:0; width:100vw;  }
    #its-mainContentBlock {
        width:auto;
        left: 0;
        right: 0;
        margin-left:0;
        -webkit-border-top-left-radius: 0;
        -webkit-border-top-right-radius: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
    #its-mainContentBottomFadeOutBlock, #its-scrollWrapper #its-mainContentTopFadeOutBlock, #its-contentWrapperHeader  { width:100%; left: 0; margin-left:0; right:0; }
    #its-contentWrapperHeader, #its-backgroundContentSideBars, #its-rightContentSideBar { display:none; }
    #its-mainContentWrapper { background:none !important;
        /* this will cause that kinetic scolling works in iOS webkit browsers */
        -webkit-overflow-scrolling: touch;
    }
    #its-mainContentWrapper{ top:42px !important; }
    #its-mainContentKeyvis {
        left:0;
        width:100%;
        top: 42px;
        background-size: 100%;
        background-repeat: no-repeat;
        background-color: black;
        -webkit-border-top-left-radius: 0;
        -webkit-border-top-right-radius: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
    #its-mainContentTopFadeOutBlock .its-redFadingHR { width: 100% !important; left: 0; }



    .its-subteaser-col-1 { width: 21%; min-width: 10em; }
    .its-subteaser-col-1 img { max-width: 9em; }
    .its-subteaser-col-2 { width: 78%; }
    .its-subteaser-headline { width: 79%; }
    .its-subteaser-headline h3 { width: 28em;  }
    .its-subteaser-full h3  { width: 39em;  }
    .its-subteaser-headline p { width: 6em; padding: 0; text-align: left; }

    #its-contact-form ul.parsley-errors-list { position: relative; top: 2px; left: 0;  }
}

@media only screen and ( max-width: 50em ) {
    .its-subteaser-headline { width: 100%; }
    .its-subteaser-headline h3 { width: 100%;  }
    .its-subteaser-headline p { width: 100%; padding: 0.5em 0;}
}

@media only screen and ( max-width: 40em ) {
    #its-mainContentKeyvis div {  top: 4em; left: 3em; font-size: 0.9em }
    #its-mainContentWrapper > #its-scrollWrapper #its-mainContentTopFadeOutBlock { top: 12em }
    #its-mainContentBlock { padding:0.7em 1em 1em 1em; margin-left:0; margin-top: 12em }
}


@media only screen and ( max-width: 30em ) {
    #its-mainContentKeyvis div {  top: 3em; left: 2em; font-size: 0.8em }
    #its-mainContentWrapper > #its-scrollWrapper #its-mainContentTopFadeOutBlock { top: 10em }
    #its-mainContentBlock { padding:0.7em 1em 1em 1em; margin-left:0; margin-top: 10em }
    #its-contact-form input, #its-contact-form textarea  { float:none; margin: 0.2em 0 0.5em 0; }
    #its-contact-form label{ float:none; margin: 0.5em 0 0 0; }
    #its-contact-form input.powermail_submit { margin: 0.5em 0 0 0; }
}