/* html5doctor.com Reset v1.6.1 - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
/* Basics */
html { height: 100%; }
body{
width: 100%; height: 100%; max-height:100%;
font-family:Arial, Helvetica, sans-serif;
color:#FFF; font-size: 14px; line-height: 22px; letter-spacing:0.1pt;
font-weight: normal; font-style: normal;
background: #000 ;
overflow: hidden;
/* -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; */
}
h1, h2, h3, h4, h5, h6{ font-weight: bold; }
h1 { font-size: 30px; letter-spacing: 0.3px; line-height: 38px; padding: 6px 0 20px 0; color: #3D3C3F; font-family: 'PT Serif', Times, serif;}
h2 { font-size: 17px; line-height: 25px; letter-spacing: 0.5pt; color:#000; }
a{ text-decoration: none; font-weight: normal; color: #FFF; border:none; outline:none !important; border: none !important; }
a:hover, a.active{ color: #FFF; text-decoration: underline; }
a:focus, area, area a , map, map area { outline: none; color: #FFF;}
b, strong { font-weight: bold; }
i, em { font-weight: normal; font-style: normal; }
table { border-collapse: collapse; border-spacing: 0; border: 0; }
td{ vertical-align:top;}
hr{ border:none; border-bottom: 1px solid #000; margin: 20px 0 7px 0; padding:0; clear: both; }
img, img a{ border:0; }
sup { margin:0;padding:0; line-height:3px; vertical-align: middle; position: relative; top: -5px; font-size: 10px;}
.clearfloat{ clear:both; height:0px; font-size: 1px; line-height: 0px; margin:0px; padding:0px;display:block; }
.clearfix:after { content:""; display:table; clear:both; }
.rollover { cursor: pointer;}
.hidden { display: none;}
#maincontent ul li { margin: 0 0 0 2px; padding: 0 0 0 16px; list-style: none; background:url(../images/list.gif) 0 8px no-repeat; }
#maincontent ol { margin: 20px 0; }
#maincontent ol li { margin: 0 0 0 18px; padding: 0 0 0 10px; }
/* Top */
#btnTop { position:relative; z-index:100;background-color:rgba(0,0,0,0.95); cursor:pointer; text-align:center; top:98px; left: 50%; margin: 0 0 0 -50px; width: 100px; height:100px; }
#btnTop img { width: 40px; height: auto; position:relative; margin: 60px 0 30px 0;}
#contentTop { display: block; z-index:200; position:fixed; top:-600px; height:600px; width: 100%; padding: 0 0 0px 0; background-color:rgba(0,0,0,0.85); text-align:center; }
#topnav { margin: 40px 0 20px 0;}
#topnav p{ display: inline; cursor:pointer;}
#topnav p:hover, #topnav p.active{ text-decoration: underline;}
#closeup.closeButton { position:absolute; bottom:0px; height: 50px; width: 100%; cursor:pointer; display: block; }
.closeButton img { position: relative; width: 60px; height: auto; padding: 2px 10px; cursor:pointer; }
#arbeiten, #team, #depot { display:block; text-align:center; }
/* Bottom */
#logoBox{ position:absolute; z-index:100;background-color:rgba(0,0,0,0.95); text-align:center; top: -100px; left: 50%; margin: 0 0 0 -90px; width: 180px; height:100px; cursor:pointer;}
#logoBox img { width: 40px; height: auto; position:relative; margin: 0; cursor:pointer; }
#logoBox .logo, #contentBottom .logo { width: 150px; height: auto; position:relative; margin: 20px 0 8px 0; }
#contentBottom { display: block; z-index:30000; position:absolute; bottom:-268px; min-height: 260px; width: 100%; background-color:rgba(0,0,0,0.85); text-align:center;}
#closedown.closeButton { position:relative !important; bottom:auto; display: block; }
.logo { cursor: pointer; }
#bottomnav { cursor: pointer; display: block; min-height: 30px;}
#bottomnav:hover { cursor: pointer;text-decoration:underline;}
#depot { display:none; margin: 10px 0 40px 0; }
#team { display:none; }
#adressBox { padding: 30px 0 20px 0;}
#impressumLink, #datenschutzLink { margin: 15px 0 15px 0; display: inline-block;}
/* Carousel */
#myCarousel{ display: none; position: fixed;}
.carousel-control.right , .carousel-control.left {background-image: none; width: 50% !important;}
.icon-prev img, .icon-next img { height: 60px; width: auto; margin-top: -40px;}
.carousel-control .icon-prev::before, .carousel-control .icon-next::before { content: '';}
/* Impressum */
#impressum, #datenschutz, #form, #message{ display: none; width: 100%; height: 100%; position: absolute; background:rgba(0,0,0,0.9); z-index: 110000; text-align: center;}
#formular { text-align:left; }
.popupContent { position: relative; top: 50%; -webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);padding: 10px;}
.popupContent p {text-align:left; max-width: 500px; margin: 0 auto; }
.popupContent.datenschutz { max-height:100%; overflow:auto; padding: 50px 10px; }
.popupContent.datenschutz p {max-width: 800px; }
.closeBtn { position: absolute; right: 20px; top: 20px ; width:40px; height: auto; cursor:pointer; z-index:100;}
/* Formular */
#form { display:none;}
#form1 { width: 90%; max-width: 600px; margin: 0 auto;}
#form1 label { width: 20%; text-align:left; font-weight: normal; vertical-align:top; padding: 8px 0 0 0 ;}
.input, .textarea { width: 80%; border:none; margin: 0 0 15px 0; padding:8px 1% ; background:rgba(255,255,255,0.3); color: #FFF;}
.textarea { width: 100%; height: 140px; }
.sendbutton, .abbrechbutton{ color:#FFF; font-size: 15px; line-height: 17px; height: 34px; padding: 3px 30px; margin: 0 0 0 10px ; float:right; border: none; background:rgba(255,255,255,0.3); cursor: pointer; }
.sendbutton:hover, .abbrechbutton:hover{ background-color: #999; }
#form1 .inputfehler{ background-color: #ad3030; }
#formularFehler, .fehler { display:none; font-family: 'Signika', sans-serif; font-weight: normal; color:#ad3030; padding: 10px 10px 10px 0;}
.fehler{ display:block; }
#Zusatz{ display:none; }
/* Slider Inhalte */
.slide { display:block; width:100%; height: 100%; }
#slidesContainer, #slidesContainer3{ display:block; width: 85%; max-width: 700px; height: 400px; max-height: 400px; position: relative; padding: 0; margin: 0 auto; }
#slidesContainer2 { display:block; width: 85%; max-width: 400px; height: 300px; max-height: 300px; position: relative; padding: 0; margin: 0 auto; }
#slidesContainer3 { display:block; width: 85%; max-width: 700px; height: 400px; max-height: 400px; position: relative; padding: 0; margin: 40px auto 0 auto; }
#slidesContainer .slidesjs-container, #slidesContainer .slidesjs-control, #slidesContainer3 .slidesjs-container, #slidesContainer3 .slidesjs-control { width: 700px !important; height: 100% !important; display:block; }
#slidesContainer2 .slidesjs-container, #slidesContainer2 .slidesjs-control { width: 350px !important; height: 100% !important; display:block; }
#slides, #slides2, #slides3 { width:100%; height: 100%; display: none; overflow: visible !important;}
#slides2 { width:350px; margin: 0 auto; }
#slides3 { width:700px; }
#slides img, #slides2 img, #slides3 img { width:100%; height: auto; }
#slides3 img { width:auto; height: 90%; }
#slides .slidesjs-navigation, #slides2 .slidesjs-navigation { margin-top:0px; }
a.slidesjs-next, a.slidesjs-previous, a.slidesjs-play, a.slidesjs-stop { background-image: url(../images/btns-next-prev.png); background-repeat: no-repeat; margin: 0; display:block; width:30px; height:100%; text-indent: -9999px;position:absolute; top:0; z-index:10; }
a.slidesjs-next { margin-right:0px; background-position: -20px 50%; right: -30px; }
a.slidesjs-previous { background-position: 5px 50%; left: -30px; }
a.slidesjs-play, a.slidesjs-stop{ background-image: none; width: 1px; }
.slidesjs-pagination { margin: 0; list-style: none; margin: 10px auto 0 auto; padding-left:7px; text-align:center; width: 200px; position:relative; z-index:500; }
.slidesjs-pagination li { display: inline-block; margin: 0 1px; list-style:none; overflow: hidden; padding: 0; }
.slidesjs-pagination li a { display: block; width: 16px; height: 0px; line-height:17px; padding-top: 10px; background-size: 8px; ;background-image:url(../images/pagination.png); background-repeat:no-repeat; background-position: 0 0px; float: left; overflow: hidden; }
.slidesjs-pagination li a.active, .slidesjs-pagination li a:hover.active { background-position: 0 -10px }
.slidesjs-pagination li a:hover { background-position: 0 -11px }
#slides2 .slidesjs-pagination {margin: 10px auto 0 auto; }
#slides3 .slidesjs-pagination {margin: 10px auto 0 auto; }
#slides2 a.slidesjs-previous { background-position: 5px 64%; }
#slides2 a.slidesjs-next { background-position: -20px 64%; }
#slides.noslides a.slidesjs-next, #slides.noslides a.slidesjs-previous, #slides.noslides a.slidesjs-play, #slides.noslides a.slidesjs-stop, #slides.noslides .slidesjs-pagination { display: none; }
#slides .slide { padding-left: 6%;}
#slides .slide a { display:block; float: left; text-align: center; margin: 25px 2% 25px 2%; padding:0 0.5% ; width: 27.5%; height: 80px; }
#slides .slide a img { width: 80% !important; height: auto; display: inline-block; padding-bottom:0px; }
#slidesA4 { width: 100%; }
#slidesA4 .slide { padding-left: 0;}
#slidesA4 .slide a { display:block; float: left; text-align: center; margin: 25px 2% 10px 2% !important; padding: 0 0.5% ; width: 45%; height: 70px !important; }
#slidesA4 .slide a img { width: 80% !important; height: auto; display: inline-block; padding-bottom:5px; }
#slides { display: none; }
#slidesA4 { display:none; }
.teambildtext { height: 25px; width: 300px; position: relative; bottom:0px; margin: 0 auto;}
.bildtext { font-size: 13px; line-height: 17px; height: 75px; width: 100%; position: relative; margin: 0 auto; text-align: center;}
.anfrageBtn { width: 100%; position: absolute; bottom: 3px; z-index:5; text-align: center;}
.anfrageBtn a{ padding: 7px 10px; background-color: #000; }
.carousel-control { opacity:0.85; }
.growtop, .growbottom { transition: all .2s ease-in-out ; }
.growtop:hover { transform: scale(1.2); }
.growbottom:hover { transform: scale(1.1); }
#mainWrap { position:fixed; top: 0; z-index:20; height: 100%; width:100%;}
/* Media Queries ************************************************************/
@media screen and (max-width: 1024px) , screen and (max-height: 700px){
#btnTop { top:32px; left: 50%; margin: 0 0 0 -35px; width: 70px; height:50px; }
#btnTop img { width: 30px; height: auto; margin: 25px 0 20px 0;}
#contentTop { position:fixed; top: -405px; height:405px; }
#closeup.closeButton { height: 40px;}
#topnav { margin: 30px 0 20px 0;}
.closeButton img { width: 50px; }
#arbeiten .slide a { height: 45px; font-size: 12px; line-height: 14px; margin: 48px 0 0 4%; }
#logoBox{ top: -80px; margin: 0 0 0 -60px; width: 120px; height:80px;}
#logoBox img { width: 40px; }
#logoBox .logo, #contentBottom .logo { width: 100px; margin: 12px 0 8px 0; }
#contentBottom { bottom:-207px; min-height:180px; position: fixed;}
#adressBox { padding: 15px 0; font-size: 11px; line-height: 15px;}
#slides3 { width:600px; }
#slidesContainer, #slidesContainer2, #slidesContainer3 { width: 600px; height: 300px; max-height: 300px;}
#slidesContainer3 { margin: 0 auto;}
#slides3 img { width:auto !important; height: 210px !important; margin-top: 20px;}
/*#slidesContainer { height: 250px; max-height: 250px; }*/
#slidesContainer .slidesjs-pagination, #slidesContainer3 .slidesjs-pagination { margin: -35px auto 0 auto;}
#slidesContainer .slidesjs-container, #slidesContainer .slidesjs-control, #slidesContainer2 .slidesjs-container, #slidesContainer2 .slidesjs-control, #slidesContainer3 .slidesjs-container, #slidesContainer3 .slidesjs-control {
width: 100% !important; height: 100% !important; display:block; overflow: visible; }
/*#slides2 img , #slides3 img { width:auto; height: auto; }
*/
#slides .slide a { margin: 15px 2% 25px 2%; }
}
@media screen and (max-width: 600px) , screen and (max-height: 550px){
#contentTop { position:absolute; top: -355px; height:355px; }
#contentBottom { bottom:-182px; min-height:180px; position: absolute;}
#arbeiten .slide a { height: 35px; font-size: 12px; line-height: 14px; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin: 28px 0 0 4%;}
#slidesContainer .slidesjs-container { height: 200px !important; margin-top: 10px;}
#slidesContainer .slidesjs-pagination { margin: 0px auto 0 auto;}
#slidesContainer3 .slidesjs-pagination { margin: -25px auto 0 auto;}
#slides3, #slides2 { width:300px; }
#slides3 img , #slides2 img { width:auto !important; height: 180px !important; margin-top: 20px;}
#slidesContainer, #slidesContainer2, #slidesContainer3 { width: 300px; height: 250px; max-height: 250px;}
.carousel-control { display: none;}
a.slidesjs-next, a.slidesjs-previous, a.slidesjs-play, a.slidesjs-stop { display: none; }
#form1 label { width: 25%; text-align:left; font-weight: normal; vertical-align:top; padding: 4px 0 0 0 ; }
.input, .textarea { width: 75%; margin: 0 0 10px 0; padding:4px 1% ; }
.textarea { width: 100%; height: 80px; }
.closeBtn { width:30px;}
#adressBox { padding: 0 15px;}
}
@media screen and (max-width: 390px) {
#contentBottom { bottom:-200px; min-height:180px; }
}
@media screen and (max-width: 374px) {
#contentBottom { bottom:-190px; min-height:180px; }
}
@media screen and (max-width: 410px) {
#logoBox{ top: -80px; margin: 0 0 0 -60px; width: 120px; height:80px;}
#logoBox img { width: 40px; }
#logoBox .logo, #contentBottom .logo { width: 100px; margin: 12px 0 8px 0; }
}
@media screen and (max-height: 550px) {
body { height: 550px; overflow-y:auto; max-height: 550px;}
#contentBottom { }
#myCarousel { height: 550px; overflow:hidden; position: absolute;}
#contentBottomWrap { position: absolute; height: 500px; overflow: hidden; width: 100%; z-index: 90; top:50px; }
.popupContent p , #form1 label, .anfrageBtn a, .input, .textarea , .sendbutton, .abbrechbutton{ font-size: 12px; line-height: 18px; letter-spacing:0.1pt; }
#impressum, #form { height: 550px; }
}