@import 'reset.css';
@import 'text.css';
@import '960_responsive.css';
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,700,400italic);
body { font-family: 'Open Sans', Helvetica, Verdana, Arial, Sans-Serif; background: #FFF; }

a { color: #359F28; }
a:focus, a:hover { color: #1EE705; }
div.mgbt {padding-bottom:1em;}

div.cldrd {background:#fafafa; margin:2em 0 0 0; padding:0.5em 1em 0.5em 0;}

.cleaner {clear:both;height:0px;padding:0px;margin:0px;border:0px;overflow:hidden}
.clearfix:before, .clearfix:after {content:"\0020";display:block;height:0;visibility:hidden}
.clearfix:after {clear:both}
.clearfix {zoom:1}
.sgl {text-align:center;}
.cntinfo {float:left; width:46%; margin:0 2% 1.5em 0}
.telinfo {text-align:center; line-height:2em; padding:1em; border:1px solid #ddd; -moz-border-radius:6px; border-radius:6px; -webkit-border-radius:6px; -o-border-radius:6px; background: #e3e5e7; 
background: -moz-linear-gradient(top, #fafafa 0%, #e3e5e7 100%); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fafafa), color-stop(100%,#e3e5e7)); 
background: -webkit-linear-gradient(top, #fafafa 0%,#e3e5e7 100%); 
background: -o-linear-gradient(top, #fafafa 0%,#e3e5e7 100%); 
background: -ms-linear-gradient(top, #fafafa 0%,#e3e5e7 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#e3e5e7',GradientType=0 ); 
background: linear-gradient(top, #fafafa 0%,#e3e5e7 100%);}

.bc { color:#888; font-size:0.9em; }
.bc a { color:#888;}
.footnote {color:#888; font-size:0.8em; }
.r {text-align:right;}

/* HEAD
########################## */
#header-wrapper { background: rgba(255,255,255,0.9); position: fixed; top: 0; width: 100%; border-bottom: 1px solid #EEE; z-index:1; box-shadow: 3px 0 3px rgba(0,0,0,0.3); }
#header { overflow: hidden; padding: 10px 0 0; }
#logo { float: left; margin: 20px 0 10px 30px; }
#header div { margin: 0; }
#header img { max-width: none; }
#header a { color: #333; }
#header a:hover { color: #17DF01; }
#header #nav {margin-top:2.6em;}
#nav ul { text-align: right; margin: 1px 0 0; }
#nav ul li { padding-top: 20px; margin: 0 10px; list-style: none; display: inline-block; }
#nav a { text-decoration: none; }


/* DETAILPAGE
########################## */
#page { border-top: 1px solid #aaa; margin: 15px 0 0 0; padding: 20px 0 10px; text-align: left; position: relative; }
#imgs { border-top: 1px solid #aaa; padding: 40px 20px; margin-bottom: 0; }

#page h2, #page h3, #page h4, #page h5 { margin-bottom:10px; }


/* INTRO
########################## */
#intro { margin-bottom: 0; padding: 40px 0 10px; color: #FFF; text-align: center; position: relative; background: #444 url('../images/buehne.jpg') no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
}

#intro img { padding: 0 2em 0 0; float:left; }
#intro h1 { font-size: 2.6em; line-height: 1.2em; }
#intro p, #intro ul { font-size: 1.1em; }

/* INFOS
########################## */
#infos { padding: 50px 0 20px; margin-bottom: 0; overflow: hidden; background: #EEE; }
#info2 { padding: 40px 0 40px; margin-bottom: 0; }
#imgct { text-align:center; margin:0 }


/* OFFER
########################## */
#offer { padding: 40px 0 40px; margin-bottom: 0; text-align:center; }
#offer h2 { text-align: center; margin: 0 0 10px; font-size:2.2em; }
#info2 li, #offer li, ul.cf_side li { list-style: none; overflow: hidden; margin-bottom: 10px; }
.cf_side {font-size:0.9em;}

#offer form { overflow: hidden; max-width: 700px; display: block; margin: 20px auto; padding: 20px; background: #aaa; border-radius: 4px; }
#offer input.inputform { width:70%; margin-right:20px; }
#offer input { font: normal 1.2em/1.6em 'Open Sans', Sans-Serif; padding: 3px; background: #FFF; border: none; border-radius: 6px; }
#offer br {clear: both;}
#offer input.actbtn { padding: 3px 1em; background: #17DF01; color: #FFF; border: 1px solid #17DF01; cursor: pointer;	box-shadow: 2px 2px 8px #777; width:auto; }
#offer input.actbtn:hover { border: 1px solid #222; box-shadow: 2px 2px 8px #000; color: #222; }

#sblock { margin-bottom:1.5em; }
#sblock input.inputform { width:70%; font: normal 1.3em/1.6em 'Open Sans', Sans-Serif; margin-right:20px; }
#sblock input { padding: 3px; background: #FFF; border: 1px solid #aaa; border-radius: 6px; }
#sblock br {clear: both;}
#sblock input.actbtn { padding: 3px 1em; background: #17DF01; color: #FFF; border: 1px solid #17DF01; cursor: pointer;	box-shadow: 2px 2px 8px #777; width:auto; }
#sblock input.actbtn:hover { border: 1px solid #222; box-shadow: 2px 2px 8px #000; color: #222; }


/* CONTACT
########################## */
#contact { background: #222; color:#fff; padding: 40px 0; margin-bottom: 0; }
#contact li { list-style: none; overflow: hidden; margin-bottom: 10px; }
a.dyntel, a.tl, a.alllinks {text-decoration:none;}
a.dyntel:hover, a.alllinks:hover, a.tl:hover {text-decoration:underline;}
a.tl { font-weight:bold; font-size:1.5em;}
a.mllnk { padding-top:12px; display:inline-block}

#contact h2 { text-align: center; color: #FFF; }
#contact form { overflow: hidden; max-width: 700px; margin: 20px auto; }
#kontaktform { display: block; padding: 20px; background: #EEE; border-radius: 4px;}

#kontaktform input, #kontaktform textarea, 
#contact input, #contact textarea { font: normal 1.5em/2em 'Open Sans', Sans-Serif; float: left; width: 70%; padding: 5px; background: #FFF; border: none; border-radius: 6px;
 width:90%; }
#kontaktform .errordiv p.error { color:#c33!important; font-weight: bold!important; }
#kontaktform label.ft {display:block; font-weight: bold; margin: 1em 0 -1em 0; font-size: 1em;color: #444;}
#kontaktform br {clear: both;}
#kontaktform input[type="radio"] { float: none; width: auto; padding: 5px; }
#kontaktform.sml input, #kontaktform.sml textarea { font: normal 1.2em/1.6 'Open Sans', Sans-Serif; }

#kontaktform input.actbtn { padding: 10px 3em; font: bold 1em/1.3em 'Open Sans', Sans-Serif; background: #17DF01; color: #FFF; border: 1px solid #17DF01; cursor: pointer;	box-shadow: 2px 2px 8px #777; width:auto; }
#kontaktform input.actbtn:hover { border: 1px solid #222; box-shadow: 2px 2px 8px #000; color: #222; }
#contact p { padding-top: 7px; margin: 0; }
#kontaktform span.error { color: red; padding-left: 10px; }
#error { font-size: 1.5em; text-align: center; color: red; }
h3.checkmark {margin:0!important; padding: 6px 0 6px 35px; background: url('../images/check.gif') no-repeat 0 6px;}

ul.staedte, ul#laender {padding:0; margin:0 0 1em 0; list-style-type:none;}
ul.staedte li {margin:0; padding: 0 0; display:block; float:left; width:32%; margin-right:1% }
ul#laender li {margin:0; padding: 0 0; display:block; }
ul#laender li a, ul.staedte li a {text-decoration:none; display:block }
ul#laender li a:hover, ul.staedte li a:hover {background-color:#359F28; color:#fff }

.brdrd {border:1px solid #ccc; margin-bottom:1em;}
.colr2 {background:#fafafa; padding:1em; }

/* STAGE
########################## */
a.dyntel {text-decoration:none;color:#fff;}
a.dyntel:hover {text-decoration:underline;}
.product {text-align:left;}
.product_info {text-align:left; padding-top:1em; }
.product_info h2, .product_info h3 {margin-bottom:10px;}
#intro .priceinfo {font-size:3em; font-weight:bold;text-shadow:2px 2px 5px #555; margin-bottom:10px;}
#intro .addpriceinfo {font-size:1.5em;margin-bottom:2em; }
.fl_buy1 {float:left; width:220px; }
.fl_buy2 {float:left; padding-top:3.2em;}
#contact input.mainaction,
a.mainaction { padding: 10px 30px; text-decoration:none; font: bold 1em/1.5em 'Open Sans', Sans-Serif; background: #17DF01 ; color: #FFF; border-radius: 8px; border: 1px solid #17DF01;
 box-shadow: 2px 2px 8px #555; }

a.mainlink { padding: 8px; text-decoration:none; font: bold 2em/2.5em 'Open Sans', Sans-Serif; color: #17DF01 ; border-radius: 8px; border: 1px solid #17DF01; }

#contact input.mainaction:hover, 
a.mainaction:hover { border: 1px solid #222;	box-shadow: 2px 2px 8px #000; color: #222; }

.intr { margin: 0 auto; text-align:center; max-width:800px; padding:1em 0 2em 0}

ul.imglist {padding:0;margin:0;}
.imglst li {list-style-type:none;float:left; margin:0; padding:0.5em}

.marker1 {background:#359F28 }
.marker2 {background:#1EE705 }

/* FOOTER
########################## */
#footer { background: #000; color: #FFF; padding: 30px 0 10px; border: none; text-align: center; }
#footer a { text-decoration: none; color: #FFF; }
#footer a:hover {text-decoration: underline;}

/*Scroller*/
#stw{position:fixed;filter:alpha(opacity:0);-khtml-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";visibility:hidden;overflow:hidden;text-align:center;z-index:99999999;background-color:#777777;width:32px;height:32px;line-height:30px;right:10px;bottom:10px;font-size:18px;color:#fff;text-decoration:none;-moz-border-radius:10px;-webkit-border-radius:10px;-o-border-radius:10px;border-radius:10px;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
#stw:hover{background-color:#30bea2;filter:alpha(opacity:100);-khtml-opacity:1.0;-moz-opacity:1.0;opacity:1.0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
#stw.show-stw{visibility:visible;cursor:pointer;filter:alpha(opacity:60);-khtml-opacity:0.6;-moz-opacity:0.6;opacity:0.6;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";}

/*Bilderliste*/
.player-images span{display:block; float:left;}
.player-images span img{display:block; margin-right:10px;}
#player-buttons{padding:5px; display:block; text-align:center;}
#player-buttons span{color:#359F28;padding:0 5px;cursor:pointer;}
#player-buttons span.active, .buttons span:hover{background:#359F28;color:#fff}
#bilder-cnt-outer img{max-width:100%}
#bilder-cnt-outer{max-width:100%; overflow:hidden}


/* RESPONSIVE
########################## */
@media screen and (max-width: 1000px) {
#header img {max-width: 100%;}
#header #nav{ display: block; width:100%; margin:0 0 10px}
#header .grid-2 {width:100%} 
#intro h1, #offer h2 { font-size: 2.1em; }
ul.staedte li {margin:0; padding: 0 0; display:block; float:left; width:32%; margin-right:1% }
.cntinfo {float:none; width:auto; margin:0 0 1em 0}
}

@media screen and (max-width: 520px) { 
#offer, #infos {padding:15px 0;}
a.dyntel, a.tl {text-decoration:underline}
#intro h1, #offer h2 { font-size: 1.8em; }
#offer input.inputform { width:90%; margin-bottom:10px; }
ul.staedte li {width:48%; margin-right:1% }
div.cldrd {margin-top:5px ;}
#nav ul li:first-child { display:none; }
#header img {max-width: 90%;}
}

@media screen and (max-width: 480px) {
.hidemob{display:none!important} 
#intro {padding-top:18px}
#intro img {float:none; margin:10px auto}
#handler { width: 50px; display: block; margin: auto; text-align: center; } 
#header img {max-width: 80%;}
#logo { float: none; display: block; text-align: center; font-size: 1.2em; margin: 0 auto; }
#header-wrapper { margin-top: -160px; }
#nav ul { text-align: center; margin: 0 0 20px; }
#nav ul li { font-size:0.9em; padding: 0; }
#contact input, #contact button { font-size: 0.85em; }
.fl_buy2 {padding:0;}
#page{margin-top:1px;padding-top:6px;}
.bc{margin-bottom:5px;}
h1{line-height:1.2em;}
}