*{box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box}
body{padding:0; margin:0; color:#666; font-size:100%; font-family:Arial; font-weight:200}
.wrapper{width:100vw}
.container{max-width:75em; margin:auto; padding:0 1em}
.sandwich{position:absolute; top:.75em; right:.75em; transform:rotate(90deg); -webkit-transform:rotate(90deg); font-size:2em; cursor:pointer}
.item-page img{max-width:100%}


.rc{-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
.sw{-webkit-box-shadow: 0px 0px 26px -4px rgba(0,0,0,1); -moz-box-shadow: 0px 0px 26px -4px rgba(0,0,0,1); box-shadow: 0px 0px 26px -4px rgba(0,0,0,1);}

h2{font-size:1.5em}
h3{font-size:1.25em}
a{color:#3396d8; text-decoration:none}
a.button{float:right; background:#3396d8; color:#fff; text-decoration:none; padding:.5em 1em; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px}
a.bottom{position:absolute; bottom:2.5em; right:2.5em}
b{font-weight:bold!important; color:#000}


/* WRAPPER FÜR PUSH-OVER-MENÜ */
.outer-wrapper{overflow:hidden!important}
.outer-wrapper.fixed{position:absolute; width:100vw; height:100vh;}
.inner-wrapper{transition:transform 0.5s ease-in-out; transition:transform 0.5s ease-in-out}
.inner-wrapper.right-open{transform:translateX(-80%); -webkit-transform:translateX(-80%)}
.overlay{transition:opacity 1.5s ease; position:fixed; top:0; left:0; width:100vw; height:100vh; background:#000; opacity:0; transform:translateY(100vh); -webkit-transform:translateY(100vh); z-index:9999}
.overlay.open{transform:translateY(0); -webkit-transform:translateY(0); opacity:.6}

/* HEADER */
.header.wrapper{background:#fff}
.header .left{width:75%; float:left}
.header .left img{max-width:100%}
.header .right{width:100%; clear:both; padding:.5em}


.topmenu ul{list-style-type:none; margin:0; padding:0}
ul.menu li:first-of-type{padding-left:0}

.hauptmenu{position:absolute; top:0; right:0; height:100vh; overflow:auto; background:#fff; z-index:999999; border-left:solid 2px #d5e0e1; transform:translateX(100%); -webkit-transform:translateX(100%); background:#f8f8f8}
.hauptmenu .menu{list-style-type:none; margin:0; display:block; padding:0; width:100vw}
.hauptmenu .menu li{background:#d5e0e1; border-top:solid 1px #fff; border-bottom:solid 1px #fff}
.hauptmenu .menu li a{display:block; padding:.5em 1em; color:#333}

.hauptmenu .menu li ul{padding:1em 0; background:#f8f8f8}
.hauptmenu .menu li ul li{border:0; background:#f8f8f8}
.hauptmenu .menu li ul li a{padding:.25em 2em; color:#3396d8}

/* KONTAKT TOP */
.topmenu{list-style-type:none; margin:.25em 0; padding:0}
.topmenu li{float:left; padding:0 .5em; border-right:solid 1px}
.topmenu li a{color:#474747}
.topmenu li:last-of-type{border:0}




/* STAGE */
.stage.wrapper{background:#d5e0e1}
.stage .container{padding:1em 0}

/* BOXEN */
.box{position:relative}
.box .finanzierung-prozent{position:absolute; left:0; background:#f00; color:#fff; font-family:courier; font-size:1.5em; margin:1em 0 0 .5em; padding:.5em; transform:rotate(-5deg); -webkit-transform:rotate(-5deg)}
.box .bwvv{position:absolute; right:0; z-index:9999; background:#f00; padding:.5em; font-size:1em; color:#fff; font-family:courier; margin:1.5em 1em 0 0em; transform:rotate(5deg); -webkit-transform:rotate(5deg)}

.box-image{position:relative; border-top:solid 4px #fff}

.box{width:100%; margin:1em 0; padding:.25em 0em 2em 0em; background:#fff}
.box .custom{border-top:solid 2px #d5e0e1}

.box:first-of-type{margin-left:0}
.box:last-of-type{margin-right:0}

.box .jcemediabox-image{display:none}
.box .jcemediabox-image:first-of-type, .box .jcemediabox-image:last-of-type{display:block}
.box img{width:100%}


/* CONTENT */
.content{position:relative}
.content .container{background-image:url('../../../images/images/Skyline_Muenster.jpg'); background-repeat:no-repeat; background-position: left 0 bottom -1em}
.content .container .left{width:100%; padding-bottom:7em}
.content .container .right{width:100%; float:right; padding:1em 0 7em 0; margin-top:2em; text-align:center}


/** RSFORM **/
fieldset{padding:0; border-bottom:solid 1px #ccc!important; margin:0px 0px 0px 0px!important}
fieldset h2{margin:20px 0px 0px 0px; color:#00a2c7; text-transform:uppercase}
.rsform-block-one, .rsform-block-two, .rsform-block-three, .rsform-block-four, .rsform-block-five{display:none!important}
.rsform-block{display:inline-block; width:49.5%; vertical-align:top; margin:0px 0px 0px 0px!important}
.rsform-calendar-box, .rsform-input-box{width:90%!important; font-size:18px!important; line-height:25px!important; padding:.25em!important; border:solid 1px #00a2c7!important; height:auto!important}
.rsform-calendar-box{width:70%!important}
.rsform-input-box, textarea, select{border:solid 1px #00a2c7!important; background-color:#fff!important}
.rsform-block-anrede, .rsform-block-nachricht, .rsform-block-senden, #rsform_1_page_0 .rsform-block, .rsform-block-fahrzeug-bilder, .rsform-block-fahrzeug-generell, .rsform-block-fahrzeug-details, .rsform-block-besonderheiten, .rsform-block-preis-kommunikation, .rsform-block-termin-kommunikation{display:block; width:100%}
#sendenPrev{display:none}
.formControlLabel, .formControls{display:block!important; width:100%!important; text-align:left!important; margin:0px 0px 0px 0px!important}
.rsform-block textarea{width:95%}


/** Finanzierungsrechner **/
.min_value{float:left}
.max_value{float:right}

.slider_container{border-bottom:solid 1px #ccc; padding:10px; margin:0px 0px 20px 0px}
.slider_container h2{margin:0px; color:#00a2c7}

.summe_container .kreditsumme{display:block; clear:both; text-align:right; font-size:24px; padding:10px 0px 0px 40px; color:#00a2c7}
.laufzeit_container .laufzeit{display:block; clear:both; text-align:right; font-size:24px; padding:10px 0px 0px 40px; color:#00a2c7}

.ergebnis_container{text-align:right; padding:50px 20px 50px 0px; border-radius:10px; font-size:.75em}
.ergebnis_container .finanzierung{background-color:#d5e0e1; max-width:100%; width:100%; padding:2em; color:#000}
.ergebnis_container .finanzierung td{padding:.25em}
.ergebnis_container .bigger{font-size:1.5em}
.ergebnis_container .label{display:inline-block}
.label_print{padding:0px!important}

.ui-slider-handle{width:30px!important; height:30px!important}
.ui-slider-horizontal{margin:0px 0px 12px 0px!important}

.print{color:#fff; cursor:pointer; padding:5px 10px; font-size:20px; background:#3396d8}
.print:hover{text-decoration:none; background:#ccc!important}


/* FOOTER */
.footer{background:#000; color:#fff!important; margin:0; padding:3em 3em 5em 3em; line-height:1.5em}
.footer .right{width:100%; padding:0}

.footer .left{width:100%}


@media screen and (min-width:48em){
	
.box .finanzierung-prozent{position:relative; top:.5em; left:0; padding:0 .5em}
.fixed-header{position:fixed; top:0; z-index:999999; opacity:.9}
.sandwich{display:none}


/* HAUPTNAV */
.hauptmenu{position:relative; height:auto; background:#fff; text-align:center; padding:.75em 0 0 0; margin:.5em 0 0 0; border-top:solid 2px #d5e0e1; transform:translateX(0); -webkit-transform:translateX(0); border-left:0; overflow:visible}

.header .left{width:25%; float:left}
.header .right{width:75%; float:right; clear:none}

.header .menu{list-style-type:none; margin:0; padding:0; display:block; width:auto}
.header .menu li{float:left; padding:0 .325em; font-size:.75em; background:#fff}
.header .menu li a{text-decoration:none; text-transform:uppercase; color:#666; padding:0}
.header .menu li a:hover, .menu li.active a, .menu li.active ul li a:hover{color:#00a2c7}
.header .menu li.active ul li a, .menu li:hover ul li a{color:#000}

.header .menu li ul{position:absolute; margin:0px 0px 0px -20px; padding:5px 0px 0px 0px; min-width:150px; display:none; z-index:999999; width:auto; border:0; background:none}
.header .menu li ul li{display:block; text-align:left; width:100%; clear:both; margin:0px 0px 1px 0px; padding:3px 20px 3px 20px; background-color:#fff; opacity:0.9; border:0px}
.header .menu li ul li:first-of-type, .menu li ul li:last-of-type{border-radius:0px!important}
.header .menu li ul li a{font-size:16px; display:block; padding:7px}
.header .menu li ul li a:hover{color:#00a2c7!important}
	

.stage .container{padding:0}

a.button{font-size:.875em}
a.bottom{right:1em; bottom:1.5em}
.box{float:left; width:32%; margin:2em 1%; padding:.25em 0em 2em 0em; background:#fff}
.footer .left{width:50%; float:left}
.footer .right{float:right; width:50%; padding:0 1em}
}


.sph{max-width:66.66666%; margin:auto}

@media screen and (min-width:60em){

.box .finanzierung-prozent{position:absolute; top:auto; left:0; margin-top:1em; padding:.5em}
.header .menu li{padding:0 .5em; font-size:.875em}	
.content .container .left{width:66%; float:left}
.content .container .right{width:32%; margin-left:2%; float:right}
	
}

@media screen and (min-width:75em){

.header .menu li{padding:0 1em; font-size:1em}	
.container{padding:0}

}

@media print {
html, body{height:99%; page-break-after: avoid; page-break-before: avoid;}	
.item-page{width:100%!important}
*{color:#000!important; background:none!important; background-image:none!important; box-shadow:none!important; -webkit-box-shadow:none}
.right, .menu, .stage, .footer .wrapper .left, .print, .boxen, .footer, .page-header, .hauptmenu{display:none!important}
.finanzierung td{font-size:12px!important; padding:.125em}
.ergebnis_container{padding:0!important}
.finanzierung-hinweis{font-size:12px}
.slider_container{margin:0!important}
.header .left{width:250px}
.sandwich{display:none}
.content{width:100%!important}
.footer .wrapper div{display:block!important; color:#000!important}
*{font-size:16px}
.footer .wrapper div a{color:#000!important}

}

.ju-slide-navigation{display:none!important}

.wrapper:after,
.container:after,
ul:after{
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}