* {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

body {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 10px;
}

.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 80px;
    z-index: 500;
    background: #fff;
}

.logo {
    position: fixed;
    right: 0;
    height: 50px;
    width: 175px;
}

.logo img {position: fixed; right: 0; height: 50px; width: 175px; margin: 10px 0 0 0;}

/*******************************************************/
/* N A V I G A T I O N */

.navigation {
    position: fixed;
    float: left;
    width: auto;
    height: auto;
    margin: 30px 0 0 30px;

}

.navigation a {color: #000; text-decoration: none; cursor: pointer; margin: 0 30px 0 0;font-size: 1.3em;}

.menu {
    position: fixed;
    width: 50px;
    height: 20px;
    top: 25px;
    left: 70px;
    font-size: 1.3em;
}

/*******************************************************/
/* C O U N T R Y  N A V */

.countrynav {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
}
.countrynav p {color: #fff; margin: 60px 40px 0 40px; padding-bottom: 5px; border-bottom: 1px solid #fff;font-size: 1.3em;}
.cd-primary-nav .countrynav a {font-size: 1.3em; color: #fff; margin: 10px 0 0 40px;}


/*******************************************************/
/* KONTAKT TEASER */

.contact_button_wrapper {
	position: fixed;
	width: 50px;
	height: auto;
	bottom: 60px;
    right: 0;
	z-index: 500;
}

.single_contact_button {
	position: relative;
	float: right;
	clear: right;
	width: 170px;
	height: auto;
	margin-right: -130px;
	margin-top: 5px;
	margin-bottom: 5px;
	text-align: left;
	background: #0ba1e2;
    border-radius: 200px 10px 10px 200px;
    -moz-border-radius: 200px 10px 10px 200px;
    -webkit-border-radius: 200px 10px 10px 200px;
    border: 1px solid #fff;
    cursor: pointer;

}

.single_contact_button:hover  {
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    margin-right: -1px;
}

.single_contact_button span {position: relative; font-size: 1.2em; margin: 6px 0 0 10px; display: inline-block; color: #fff;}

.single_contact_button_icon {
	position: relative;
	float: left;
	width: auto;
	margin: 5px 5px 5px 10px;
	height: 20px;
	cursor: pointer;
}

.single_contact_button_icon img {height: 20px;}

@media screen and (min-width: 1000px) {
    
    .contact_button_wrapper {position: fixed;width: 70px;	height: auto;	bottom: 60px;  right: 0; z-index: 500; }
    .single_contact_button {
        position: relative;
        float: right;
        clear: right;
        width: 170px;
        height: auto;
        margin-right: -110px;
        margin-top: 5px;
        margin-bottom: 5px;
        text-align: left;
        background: #0ba1e2;
        border-radius: 200px 10px 10px 200px;
        -moz-border-radius: 200px 10px 10px 200px;
        -webkit-border-radius: 200px 10px 10px 200px;
        border: 1px solid #fff;
        cursor: pointer;
    }
    
    .single_contact_button_icon {position: relative;float: left;width: auto;margin: 8px 8px 8px 15px;height: 30px;	cursor: pointer;    }
    .single_contact_button span {position: relative; font-size: 1.2em; margin: 14px 0 0 10px; display: inline-block; color: #fff;}
    .single_contact_button_icon img {height: 30px;}
}


/*******************************************************/
/* F A Q  A C C O R D I O N */

.accordion {
	position: relative;
	float: left;
	clear: left;
	width: 100%;
	margin: 80px 0 20px 0;
}

.accordion h1 {font-size: 1.8em; line-height: 1.5em; font-weight: 700; margin: 0 0 10px 0; color: #000;}

.squeezhead {
border-top: 1px solid #000;
padding: 15px 15px 15px 0;
position: relative;
cursor: pointer;
}

.squeezhead_icon {position: relative; float: left; width: 40px; height: 30px;}
/*.squeezhead p { margin: 5px 15px; }*/

.squeezhead .icon-arrow-right {
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
transition: all 0.7s;
display: inline-block;
top: 10px;
right: 15px;
position: absolute;
}

.icon-arrow-right img {width: 15px;}
.squeezecnt {position: relative; width: 100%; height: auto;}
.squeezecnt p {font-size: 1.3em; line-height: 1.5em; margin: 0 50px 30px 0;}

.squeezecnt a {text-decoration: none; color: #0ba1e2;}

.squeezecnt ul {
     list-style-type: disc;
     font-size: 1.3em; line-height: 1.5em;
     margin-bottom: 15px;
}

.squeezecnt li {
    margin: 0 0 0 20px;
}

.squeezecnt ol {
     list-style-type: decimal;
     font-size: 1.3em; line-height: 1.5em;
     margin-bottom: 15px;
}



.faq_wrapper {
    position: relative;
    width: auto;
    max-width: 1000px;
    height: auto;
    margin: 0 auto;
}

/*
.accordion_open .icon-arrow-right {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
*/

.accordion h1 {font-size: 1.8em; line-height: 1.5em; font-weight: 700; margin: 0 0 10px 0; color: #000;}

.squeezhead h2 {font-size: 1.8em; letter-spacing: 1px; font-weight: normal; color: #0ba1e2; margin: 0 50px 0 0;}
.squeezhead p {font-size: 1.3em; line-height: 1.5em; color: #000;}

.faq_headline {font-weight: 300; font-size: 2.6em; color: #0ba1e2; margin: 100px 0 0 0;}
.faq_subline {font-size: 1.3em; line-height: 1.5em; color: #000;font-weight: 300; margin: 20px 0 0 0;}

/*******************************************************/
/* I N T R O */

.intro {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    height: 760px;
    margin: 100px 0 0 0;
    background-image: url(../_img/pay-per-wash-bg-intro.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover !important;
    -webkit-background-size: cover !important;
    overflow: hidden;
}

.intro_wrapper {
    position: relative;
    width: auto;
    max-width: 1000px;
    height: 760px;
    margin: 0 auto;
}

.headline1 {position: relative; float: left; clear: left; margin: 0 0 0 140px;}
.headline1 h2 {font-weight: 300; font-size: 5em; letter-spacing: 1px;}
.headline2 {position: relative; float: left; clear: left; margin: -10px 0 0 0;}
.headline2 h2 {font-weight: 300; font-size: 5em; letter-spacing: 1px;}
.headline3 {position: relative; float: left; clear: left; width: auto; height: auto; margin: -20px 0 0 0;}
.headline3 h1 {font-weight: 300; font-size: 7em; color: #0ba1e2; letter-spacing: 1px; margin: 0 0 0 60px;}

.intro_distancer {position: relative; float: left; clear: left; width: 100%; height: 1px;}

.keyvisual {
    position: absolute;
    right: 160px;
    margin: 220px 0 0 0;
    clear: both;
    width: 420px;
    height: auto;
}

.keyvisual img {width: 100%; height: auto;}

.cw_teaser {
    position: absolute;
    bottom: 0px;
    width: 100%;
    max-width: 1000px;
    height: auto;
}

.cw_logo {
    position: relative;
    float: left;
    width: 145px;
    height: auto;

}

.cw_description {
    position: relative;
    float: left;
    width: 400px;
    margin: 20px 0 40px 20px;
    font-size: 1.3em;
    line-height: 1.5em;
}

.cw_logo img {width: 145px; height: auto;}




.scroll_icon {
    position: relative;
    width: 30px;
    height: auto;
    clear: both;
    margin: 0 auto 0 auto;

}

.scroll_icon_2 {
    position: absolute;
    width: 30px;
    height: auto;
    bottom: 0px;
    left: 50%;
    margin-left: -25px;
    margin-bottom: 40px;
}

.scroll_icon_3 {
    position: relative;
    width: 30px;
    height: auto;
    bottom: 0px;
    left: 50%;
    margin-left: -25px;
}

.scroll_icon_4 {
    position: relative;
    width: 30px;
    height: auto;
    bottom: 0px;
    left: 50%;
    margin-left: -25px;
}


.scroll_icon img {width: 30px; cursor: pointer;}
.scroll_icon_2 img {width: 30px; cursor: pointer;}
.scroll_icon_3 img {width: 30px; cursor: pointer;}
.scroll_icon_4 img {width: 30px; cursor: pointer;}

/*******************************************************/
/* VIDEO OVERLAY */

.video_button {
    position: relative;
    width: 60px;
    height: auto;
    float: right;
    margin: 40px 280px 0 0;
    cursor: pointer;
    color: #0ba1e2;
    font-weight: 400;
}

.video_button img {width: 60px; margin: 0 0 0 0;}

.video_overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.8);
    z-index: 500;
    display: none;
}

.video_close {
    position: relative;
    float: right;
    clear: right;
    width: 30px;
    height: 30px;
    margin: 40px 40px 0 0;
    z-index: 501;
    cursor: pointer;
}

.video_close img {width: 30px; height: auto;}

.overlay_video {
    position: relative;
    width: 750px;
    height: 422px;
    margin: 100px auto 100px auto;
}

.overlay_video video {width: 750px; height: 422px;}

/*******************************************************/
/* B E N E F I T S */

.benefit_wrapper {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    height: auto;
    margin: 50px 0 0 0;
    background: #0ba1e2;
}

.benefit_intro {
    position: relative;
    width: auto;
    max-width: 1000px;
    height: auto;
    margin: 100px auto 100px auto;
}

.benefit_intro h2 {font-weight: 300; color: #fff; font-size: 5em; margin: 0 0 20px 0;}
.benefit_intro p {color: #fff; font-size: 1.3em; line-height: 1.5em;}


.graphic_wrapper {
    position: relative;
    width: auto;
    max-width: 1000px;
    height: 600px;
    margin: 0 auto 0 auto;
}

.line_1 {position: absolute; width: 960px; height: 1px; border-top: 1px solid #fff;}
.line_2 {position: absolute; right: 0; width: 40px; height: 200px; border-top: 1px solid #fff; border-right: 1px solid #fff; border-bottom: 1px solid #fff; border-radius: 0px 40px 40px 0px; -moz-border-radius: 0px 40px 40px 0px; -webkit-border-radius: 0px 40px 40px 0px;}
.line_3 {position: absolute; top: 201px; right: 40px; width: 920px; height: 1px; border-top: 1px solid #fff;}
.line_4 {position: absolute; left: 0; top: 201px; width: 40px; height: 200px; border-top: 1px solid #fff; border-left: 1px solid #fff; border-bottom: 1px solid #fff; border-radius: 40px 0px 0px 40px; -moz-border-radius: 40px 0px 0px 40px; -webkit-border-radius: 40px 0px 0px 40px;}
.line_5 {position: absolute; top: 402px; left: 40px; width: 530px; height: 1px; border-top: 1px solid #fff;}


.benefit_1 {position: absolute; width: 200px; height: auto; top: -26px;}

.benefit_1_icon {position: relative; float: left; clear: left; width: 40px; height: auto;}
.benefit_1_icon img {width: 50px;}
.benefit_1_copy {position: relative; float: left; clear: left; width: 200px; height: auto; color: #fff; margin: 20px 0 0 0;}
.benefit_1_copy h3 {font-size: 1.3em; line-height: 1.5em; font-weight: 400; margin: 0 0 10px 0;}
.benefit_1_copy p {font-size: 1.3em; line-height: 1.5em;}

.benefit_3 {position: absolute; width: 200px; height: auto; top: -26px; right: 260px;}
.benefit_5 {position: absolute; width: 200px; height: auto; top: 176px; right: 120px;}
.benefit_6 {position: absolute; width: 200px; height: auto; top: 176px; left: 260px;}
.benefit_7 {position: absolute; width: 200px; height: auto; top: 376px; left: 120px;}
.benefit_8 {position: absolute; width: 200px; height: auto; top: 376px; left: 540px;}



/*******************************************************/
/* H A R D  F A C T S */


.facts {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    height: auto;
    margin: 0 0 50px 0;
}

.facts_intro {
    position: relative;
    width: auto;
    max-width: 1000px;
    height: auto;
    margin: 100px auto 100px auto;
}

.facts_intro h2 {font-weight: 300; font-size: 5em; margin: 0 0 20px 0; color: #0ba1e2;}
.facts_intro p {font-size: 1.3em; line-height: 1.5em;}

.fact_wrapper {
    position: relative;
    width: auto;
    max-width: 1000px;
    height: auto;
    margin: 80px auto 80px auto;
}

.fact {
    position: relative;
    float: left;
    width: 310px;
    height: auto;
    margin: 0 20px 60px 0;
}

.fact_icon {position: relative; float: left; width: 40px; height: auto; }
.fact_icon img {width: 40px;}
.fact_copy {position: relative; float: left; width: 250px; margin: 7px 0 0 20px;}

.fact_copy h3 {font-size: 1.8em; line-height: 1.5em; font-weight: 700; margin: 0 0 10px 0; color: #0ba1e2;}
.fact_copy p {font-size: 1.3em; line-height: 1.5em;}

.fact_distancer {position: relative; float: left; clear: left; width: 100%;}
.fact_distancer_half {position: relative; float: left; clear: left; width: 100%; display: none;}


/*******************************************************/
/* S L I D E R */


.sliderarea {
    position: relative;
    clear: left;
    width: 100%;
    max-width: 1300px;
    margin: 50px auto 50px auto;
    height: auto;
    /*min-height: 700px;*/

}

.slider_head {
    position: relative;
    left: 150px;
    width: auto;
    height: auto;
    z-index: 12;
}

.slider_head h2 { font-weight: 300; font-size: 5.0em; margin: 0 0 20px 0; color: #0ba1e2; text-transform: uppercase; }

@media screen and (max-width: 1200px) {
    .slider_head {
    position: relative;
    left: 150px;
    width: auto;
    height: auto;
    z-index: 12;
}
}


.single_slides {display: none;}

/*******************************************************/
/* V I D E O */

.videowrapper {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    height: auto;
    background-image: url(../_img/pay-per-wash-bg.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover !important;
    -webkit-background-size: cover !important;
    overflow: hidden;
}

.videoarea {
    position: relative;
    width: 750px;
    height: 422px;
    margin: 100px auto 100px auto;
}

.videoarea video {width: 750px; height: 422px;}
.video_headline {
    position: relative;
    width: auto;
    max-width: 1000px;
    height: auto;
    margin: 100px auto 100px auto;
    }

    .video_headline h2 {font-weight: 300; font-size: 5em; margin: 0 0 20px 0; color: #0ba1e2;}


/*******************************************************/
/* NEXT LEVEL SOLUTION */

.nls_wrapper {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    background: #eee;
    height: auto;
    margin: 40px 0 0 0;
    padding-bottom: 50px;
}

.nls_content {
    position: relative;
    clear: left;
    width: 100%;
    max-width: 1000px;
    height: auto;
    margin: 100px auto 100px auto;
}

.nls_logo {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    margin: 0 0 30px 0;
}

.nls_logo img {width: 110px;}

.nls_copy {
    position: relative;
    float: left;
    width: 45%;
    margin: 0 5% 50px 0;
}

.nls_wrapper h2 {font-weight: 300; font-size: 5em; margin: 0 0 0 0; color: #0ba1e2; text-transform: uppercase;}
.nls_wrapper h3 {font-size: 1.8em; line-height: 1.5em; font-weight: 700; margin: 0 0 30px 0; color: #000;}
.nls_wrapper p {font-size: 1.3em; line-height: 1.5em; color: #000;}
.nls_wrapper a {font-weight: 700; text-decoration: none; color: #000;}



/*******************************************************/
/* FORMULAR */

.form_wrapper {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    height: auto;
    margin: 100px 0 100px 0;
}

.form_content {
    position: relative;
    clear: left;
    width: 100%;
    max-width: 1000px;
    height: auto;
    margin: 0 auto;
}

.form {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
}


.wh_contact {
    position: relative;
    float: left;
    width: 45%;
    height: auto;
    margin: 0 5% 0 0;

}
.form_content h2 {font-weight: 300; font-size: 5em; margin: 0 0 0 0; color: #0ba1e2; text-transform: uppercase;}
.form_content h3 {font-size: 1.8em; line-height: 1.5em; font-weight: 700; color: #000; margin: 0 0 30px 0;}
.form_content p {font-size: 1.3em; line-height: 1.5em; color: #000; margin: 0 0 30px 0;}
.wh_contact a {font-size: 1.3em; text-decoration: none;}

.directcontact {
    position: relative;
    float: left;
    clear: left;
    cursor: pointer;
    background: #0ba1e2;
    border: 1px solid #0ba1e2;
    padding: 10px 15px;
    color:#fff;
    border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius:5px;
    margin: 0 0 40px 0;
}


/*******************************************************/
/* FOOTER */

.footer_wrapper {
    position: relative;
    float: left;
    clear: left;
    width: 100%;
    height: auto;
    min-height: 80px;
}

.footer_content {
    position: relative;
    clear: left;
    width: 100%;
    max-width: 1000px;
    height: auto;
    margin: 30px auto;
    
    
}

.footer_content a {margin: 0 20px 0 0;color: #000; text-decoration: none; cursor: pointer;}

/*******************************************************/
/* text only */

.textonly_wrapper {
    position: relative;
    clear: left;
    width: 100%;
    max-width: 1000px;
    height: auto;
    margin: 100px auto 50px auto;
}

.textonly_wrapper h1 {font-size: 1.8em; line-height: 1.5em; font-weight: 700; margin: 0 0 30px 0; color: #000;}
.textonly_wrapper p {font-size: 1.3em; line-height: 1.5em; color: #000;}



.maschine_img {position: relative; float: left; clear: left; width: 100%;}
.maschine_img img {position: relative; float: left; clear: left; width: 100%; }
.uc_mob {display: none;}

/*******************************************************/
/*******************************************************/
/*******************************************************/
/*******************************************************/
/*******************************************************/
/*******************************************************/
/* R E S P O N S I V E */

@media screen and (max-width: 1000px)  {

    .header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 50px;
        background: #fff;

    }

    .logo {
        position: fixed;
        right: 0;
        width: 130px;
        height: 37px;
    }

    .logo img {width: 130px; height: 37px; margin: 4px 0 0 0;}
    
     .menu {
      display: none;
    }



   /*******************************************************/
    /* F A Q  A C C O R D I O N */

    .accordion {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        margin: 80px 0 20px 0;
    }

    .squeezhead {
    border-top: 1px solid #000;
    padding: 15px 15px 15px 0;
    position: relative;
    cursor: pointer;
    }


    .faq_wrapper {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 0 5% 0 5%;
    }
    
    .accordion h1 {font-size: 1.3em; line-height: 1.5em; font-weight: 700; margin: 0 0 10px 0; color: #000;}

.squeezhead h2 {font-size: 1.6em; letter-spacing: 1px; font-weight: normal; color: #0ba1e2;margin: 0 50px 0 0;}
.squeezhead p {font-size: 1.3em; line-height: 1.5em; color: #000;}

    /*******************************************************/
    /* I N T R O */

    .intro {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        background-image: url(../_img/pay-per-wash-bg-intro.jpg);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover !important;
        -webkit-background-size: cover !important;
        overflow: hidden;
    }

    .intro_wrapper {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 0 5% 0 5%;
    }

    .headline1 {position: relative; float: left; clear: left; margin: 0 0 0 140px;}
    .headline1 h2 {font-weight: 300; font-size: 3em; letter-spacing: 1px;}
    .headline2 {position: relative; float: left; clear: left;}
    .headline2 h2 {font-weight: 300; font-size: 3em; letter-spacing: 1px;}
    .headline3 {position: relative; float: left; clear: left;}
    .headline3 h1 {font-weight: 300; font-size: 5em; color: #0ba1e2; letter-spacing: 1px; margin: 0 0 0 60px;}

    .keyvisual {
        position: relative;
        float: right;
        clear: both;
        width: 390px;
        margin: 100px 60px 0 0;
        height: auto;
        right: 10%;
    }

    .keyvisual img {width: 100%;}

    .cw_teaser {
        position: relative;
        float: left;
        width: 100%;
        max-width: 100%;
        height: auto;
        margin: 30px 0 50px 0;
    }

    .cw_logo {
        position: relative;
        float: left;
        width: 145px;
        height: auto;
    }

    .cw_description {
        position: relative;
        float: left;
        width: 100%;
        margin: 30px 0 0 0;
        font-size: 1.3em;
        line-height: 1.5em;
    }

    .scroll_icon {display: none;}
    .scroll_icon_2 {display: none;}
    .scroll_icon_3 {display: none;}
    .scroll_icon_4 {display: none;}

    /*******************************************************/
    /* VIDEO OVERLAY */
    
    .video_button {
        position: relative;
        width: 60px;
        height: auto;
        float: right;
        margin: 20px 0 0 0;
        cursor: pointer;
        color: #0ba1e2;
        font-weight: 400;
    }
    
    .video_button img {width: 60px; margin: 0 0 0 0;}


    .video_overlay {
        position: fixed;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.8);
        z-index: 500;
        display: none;
    }

    .video_close {
        position: relative;
        float: right;
        clear: right;
        width: 20px;
        height: 20px;
        margin: 40px 40px 0 0;
        z-index: 501;
        cursor: pointer;
    }

    .video_close img {width: 20px; height: auto;}

    .overlay_video {
        position: relative;
        width: 90%;
        height: auto;
        margin: 100px 5% 0 5%;
    }

    .overlay_video video {width: 100%; height: auto;}


    /*******************************************************/
    /* B E N E F I T S */

    .benefit_wrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 0 0 0 0;
        background: #0ba1e2;
    }

    .benefit_intro {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 80px 5% 20px 5%;
    }

    .benefit_intro h2 {font-weight: 300; color: #fff; font-size: 3em; margin: 0 0 20px 0;}
    .benefit_intro p {color: #fff; font-size: 1.3em; line-height: 1.5em;}


    .graphic_wrapper {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 0 5% 0 5%;
    }

    .line_1 {display: none;}
    .line_2 {display: none;}
    .line_3 {display: none;}
    .line_4 {display: none;}
    .line_5 {display: none;}
    .line_6 {display: none;}
    .line_7 {display: none;}



   .benefit_1 {position: relative; float: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}

    .benefit_1_icon {position: relative; float: left; clear: left; width: 40px; height: auto;}
    .benefit_1_icon img {height: 52px;}
    .benefit_1_copy {position: relative; float: left; clear: left; width: 100%; height: auto; color: #fff; margin: 20px 0 0 0;}
    .benefit_1_copy h3 {font-size: 1.3em; line-height: 1.5em; font-weight: 400;}
    .benefit_1_copy p {font-size: 1.3em; line-height: 1.5em;}

    .benefit_2 {position: relative; float: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}
    .benefit_3 {position: relative; float: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}
    .benefit_4 {position: relative; float: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}
    .benefit_5 {position: relative; float: left; clear: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}
    .benefit_6 {position: relative; float: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}
    .benefit_7 {position: relative; float: left; clear: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}
    .benefit_8 {position: relative; float: left; width: 45%; height: auto; margin: 0 5% 20px 0; top: 0; left: 0;}



    /*******************************************************/
    /* H A R D  F A C T S */


    .facts {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 0 0 0 0;

    }

    .facts_intro {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 100px 5% 20px 5%;
    }

    .facts_intro h2 {font-weight: 300; font-size: 3em; margin: 0 0 20px 0;}
    .facts_intro p {font-size: 1.3em; line-height: 1.5em; color: #000;}

    .fact_wrapper {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 0px 5% 80px 5%;
    }

    .fact {
        position: relative;
        float: left;
        width: 45%;
        height: auto;
        margin: 0 5% 60px 0;
    }

    .fact_icon {position: relative; float: left; width: 40px; height: auto; }
    .fact_icon img {width: 40px;}
    .fact_copy {position: relative; float: left; clear: left; width: auto; margin: 20px 0 0 0;}

    .fact_copy h3 {font-size: 1.3em; line-height: 1.5em; font-weight: 700; margin: 0 0 10px 0; color: #0ba1e2;}
    .fact_copy p {font-size: 1.3em; line-height: 1.5em; color: #000;}

    .fact_distancer {position: relative; float: left; clear: left; width: 100%; display: none;}
    .fact_distancer_half {position: relative; float: left; clear: left; width: 100%; display: block;}


    /*******************************************************/
    /* S L I D E R */

    .sliderarea {
        position: relative;
        clear: left;
        float: left;
        width: 100%;
        max-width: 100%;
        margin: 50px 0 0 0;
        height: auto;
    }
    
    .slider_head {
        position: relative;
        float: left;
        clear: left;
        left: 0;
        top: 0;
        width: 90%;
        height: auto;
        z-index: 12;
        margin: 50px 5% 0 5%;
    }

    .slider_head h2 {font-weight: 300; font-size: 3em; margin: 0 0 0 0; color: #0ba1e2; text-transform: uppercase; z-index: 12;}

    .single_slides {display: block; position: relative; float: left; clear: left; width: 100%;}

    .single_slide_wrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        margin: 25px 0 0 0;
    }

    .single_slide_wrapper img {position: relative; width: 100%; height: auto; margin: 0 0 30px 0;}
    .single_slide_wrapper h2 {font-size: 1.3em; line-height: 1.5em; font-weight: 700; margin: 0 5% 10px 5%; color: #0ba1e2;}
    .single_slide_wrapper p {font-size: 1.3em; line-height: 1.5em; margin: 0 5% 0 5%; color: #000;}



    /*******************************************************/
    /* V I D E O */

    .videowrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        background-image: none;
    }

    .videoarea {
        position: relative;
        width: 90%;
        margin: 0 5% 50px 5%;
    }

    .videoarea video {width: 100%;}
    .video_headline {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 80px 5% 30px 5%;
    }

    .video_headline h2 {font-weight: 300; font-size: 3em; margin: 0 0 0 0; color: #0ba1e2;}

    /*******************************************************/
    /* NEXT LEVEL SOLUTION */

    .nls_wrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        background: #eee;
        height: auto;
        margin: 40px 0 0 0;
        padding: 0;
    }

    .nls_content {
        position: relative;
        clear: left;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 50px 5% 100px 5%;
    }

    .nls_copy {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        margin: 0 0 50px 0;
    }

    .nls_wrapper h2 {font-weight: 300; font-size: 3em; margin: 0 0 0 0; color: #0ba1e2; text-transform: uppercase;}
    .nls_wrapper h3 {font-size: 1.3em; line-height: 1.5em; font-weight: 700; margin: 0 0 30px 0; color: #000;}
    .nls_wrapper p {font-size: 1.3em; line-height: 1.5em; color: #000;}
    .nls_wrapper a {font-weight: 700; text-decoration: none;}




    /*******************************************************/
    /* FORMULAR */

    .form_wrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 100px 0 100px 0;
    }

    .form_content {
        position: relative;
        clear: left;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 0 5%;
    }

    .form {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 50px 0 0 0;
    }

    .wh_contact {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 0 0 0 0;

    }
    .form_content h2 {font-weight: 300; font-size: 3em; margin: 0 0 0 0; color: #0ba1e2; text-transform: uppercase;}
    .form_content h3 {font-size: 1.3em; line-height: 1.5em; font-weight: 700; color: #000; margin: 0 0 30px 0;}
    .form_content p {font-size: 1.3em; line-height: 1.5em; color: #000; margin: 0 0 30px 0;}
    
    
    /*******************************************************/
    /* FOOTER */
    
    .footer_wrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        min-height: 80px;
    }
    
    .footer_content {
        position: relative;
        clear: left;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 30px 5%;
    }
    
    .footer_content a {margin: 0 20px 0 0;color: #000;}
    
     /*******************************************************/
    /* text only */
    
    .textonly_wrapper {
        position: relative;
        clear: left;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 100px 5% 50px auto;
    }
    
    .textonly_wrapper h1 {font-size: 1.8em; line-height: 1.5em; font-weight: 700; margin: 0 0 30px 0; color: #000;}
    .textonly_wrapper p {font-size: 1.3em; line-height: 1.5em; color: #000;}


/* ende responsive 1 */
}



/*******************************************************/
/*******************************************************/
/*******************************************************/
/*******************************************************/
/*******************************************************/
/*******************************************************/
/* R E S P O N S I V E */

@media screen and (max-width: 600px)  {



    /*******************************************************/
    /* I N T R O */

    .intro {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 64px 0 0 0;
        background-image: url(../_img/pay-per-wash-bg.jpg);
        background-position: left -120px;
        background-repeat: no-repeat;
        background-size: cover !important;
        -webkit-background-size: cover !important;
        overflow: hidden;
    }

    .intro_wrapper {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 0 5% 0 5%;
    }

    .headline1 {position: relative; float: left; clear: left; margin: 0 0 0 0;}
    .headline1 h2 {font-weight: 300; font-size: 2.0em; letter-spacing: 1px;}
    .headline2 {position: relative; float: left; clear: left; margin: 0;}
    .headline2 h2 {font-weight: 300; font-size: 2.0em; letter-spacing: 1px;}
    .headline3 {position: relative; float: left; clear: left; height: auto; width: auto; margin: 0;}
    .headline3 h1 {font-weight: 300; font-size: 3.0em; line-height: 1em; color: #0ba1e2; letter-spacing: 1px; margin: 0 0 0 0;}

    .keyvisual {
        position: relative;
        float: right;
        width: 300px;
        margin: 30px -10% 0 0;
        height: auto;
    }

    .keyvisual img {width: 100%;}

    .cw_teaser {
        position: relative;
        float: left;
        width: 100%;
        max-width: 100%;
        height: auto;
        margin: 40px 0 50px 0;
    }

    .cw_logo {
        position: relative;
        float: left;
        width: 145px;
        height: auto;
    }

    .cw_description {
        position: relative;
        float: left;
        width: 100%;
        margin: 20px 0 0 0;
        font-size: 1.3em;
        line-height: 1.5em;
    }

       /*******************************************************/
        /* VIDEO OVERLAY */


        .video_overlay {
            position: fixed;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.8);
            z-index: 500;
            display: none;
        }

        .video_close {
            position: relative;
            float: right;
            clear: right;
            width: 20px;
            height: 20px;
            margin: 40px 40px 0 0;
            z-index: 501;
            cursor: pointer;
        }

        .video_close img {width: 20px; height: auto;}

        .overlay_video {
            position: relative;
            width: 90%;
            margin: 40px 5% 0 5%;
        }

        .overlay_video video {width: 100%; max-width: 1024px;}



    /*******************************************************/
    /* B E N E F I T S */

    .benefit_wrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 0 0 0 0;
        background: #0ba1e2;
        padding-bottom: 40px;
    }

    .benefit_intro {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 80px 5% 20px 5%;
    }

    .benefit_intro h2 {font-weight: 300; color: #fff; font-size: 3em; margin: 0 0 20px 0;}
    .benefit_intro p {color: #fff; font-size: 1.3em; line-height: 1.5em;}

    .graphic_wrapper {
        position: relative;
        width: 90%;
        max-width: 90%;
        height: auto;
        margin: 0 5% 0 5%;
    }

    .benefit_1 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}

    .benefit_1_icon {position: relative; float: left; clear: left; width: 40px; height: auto;}
    .benefit_1_icon img {width: 40px; height: 40px;}
    .benefit_1_copy {position: relative; float: left; clear: left; width: 100%; height: auto; color: #fff; margin: 10px 0 20px 0;}
    .benefit_1_copy h3 {font-size: 1.3em; line-height: 1.5em; font-weight: 400;}
    .benefit_1_copy p {font-size: 1.3em; line-height: 1.5em;}

    .benefit_2 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}
    .benefit_3 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}
    .benefit_4 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}
    .benefit_5 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}
    .benefit_6 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}
    .benefit_7 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}
    .benefit_8 {position: relative; float: left; width: 100%; height: auto; margin: 0 0 0 0; top: 0; left: 0;}

    /* F A C T S */

    .fact {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        margin: 0 5% 40px 0;
    }


    /*******************************************************/
    /* V I D E O */

    .videowrapper {
        position: relative;
        float: left;
        clear: left;
        width: 100%;
        height: auto;
        background-image: none;
    }

    .videoarea {
        position: relative;
        width: 90%;
        min-width: 90%;
        height: auto;
        margin: 50px 5% 50px 5%;
    }

    .videoarea video {width: 100%; height: auto; margin: 0;}
    
    
        .uc_mob {display: block;}
    .uc_desk {display: none;}






/* ende responsive 2 */
}