/*******************************/
/* layout page, layout classes */
/*******************************/
html, body { margin:0 0 0 0; padding:0 0 0 0; }
body { background:#333333; }
.mainDiv { width:100%; max-width:1024px; margin-left:auto; margin-right:auto; }
.mainNav { width:20%; float:left; background:#424242; position:relative; }
.mainSection { width:100%; float:left; }
.mainHeader { float:left; width:100%; height:240px; background-size:cover; background-image:url("../Images/header.jpg"); background-repeat: no-repeat; }
.logo { float:left; width:25.4%; height:240px; background-color:rgba(255,255,255,0.6); }
.logo img { margin-left:15.4%; margin-top:110px; margin-bottom:11px; }



.middleDiv { float:left; position:relative; width:100%; background:#ffffff; }
.content { float:left; width:63%; min-height:390px; margin-left:7.8%; margin-top:85px; margin-bottom:40px; }
.social { float:right; width:140px; height:25px; margin-right:3%; padding-top:2px; }
.social a img { width:22px; height:22px; margin-right:6px; }
.mobileSocial { display:none; float:left; width:100%; padding-bottom:25px; padding-left:9%; background-color:#FFFFFF; }
.mobileSocial .social { display:none; float:left; }
iframe { width:100%; }

body div .giShowThumbs { bottom:1px; padding-top:1px; }

/* Navigations */
.mainNav a { display:block; text-decoration:none; }
.mainNav { width:25.4%; float:left; min-width:178px; margin-top:77px; }
.navBackground { width:25.4%; min-width:178px; left:0; top:2px; bottom:2px; position:absolute; z-index:0; background-color:#424242; }

.mainNav img { padding-left:25px; }


.serviceNav { float:right; width:auto; margin-top:5px; margin-right:4%; margin-bottom:5px; color:#424242; text-decoration:none; }
.serviceNav a { display:inline; color:#424242; padding-right:6px; border-right:1px solid #424242; margin-right:6px; font-size:14px; }
.serviceNav a:hover { text-decoration:underline; }
.serviceNav a:last-child { border-right:0; padding-right:0px; margin-right:0px; }
.subFooter .serviceNav { display:none; float:left; height:20px; margin-top:9px; margin-left:42px; margin-right:20px; }
.subFooter .serviceNav a:hover { color:#FFFFFF; }

.mainNav .serviceNav { display:block; float:left; margin-top:30px; color:#FFFFFF; }
.mainNav .serviceNav a { display:block; height:40px; padding-top:10px; padding-left:43px; color:#FFFFFF; font-size:20px; }
.mainNav .serviceNav a:hover { text-decoration:none; }
.mainNav .serviceNav a:last-child { margin-bottom:20px; }
.mainNav .serviceNav .serviceNO, .serviceACT { font-size:20px; text-transform:uppercase; color:#FFFFFF; }
.mainNav .serviceNav .serviceACT, .serviceNO:hover { background:rgba(0, 0, 0, 0) url("../Icons/navigation-arrow.svg") no-repeat 24px center/17px 14px; }


/* first level */
.mainNavFirst {}
.mainNavFirst a { height:50px; padding-top:14px; padding-left:43px; }
.firstACT, .firstNO:hover { color:#FFFFFF; background:rgba(0, 0, 0, 0) url("../Icons/navigation-arrow.svg") no-repeat 24px center/17px 14px; }
.firstNO, .firstACT { font-size:20px; text-transform:uppercase; color:#FFFFFF; }


/* second level */
.mainNavSecond { color:#FFFFFF; }
.mainNavSecond a:hover { color:#FFFFFF; }
.mainNavSecond a { height:27px; padding-top:4px; border-top: 1px solid #9A9A9A; padding-left:54px; font-size:16px; }
.mainNavSecond a:last-child { border-bottom: 1px solid #9A9A9A; }

.secondNO { color:#ffffff; }
.secondACT { background:#ef0000 url("../Icons/navigation-second-arrow.svg") no-repeat 35px center/19px 15px; color:#FFFFFF; }
.secondACT:hover { background: #ef0000 url("../Icons/navigation-second-arrow.svg") no-repeat 35px center/19px 15px; }
.mainNavSecond .secondNO:hover { background: #424242 url("../Icons/navigation-second-arrow.svg") no-repeat 35px center/19px 15px; }


/* third level */ 

.mainNavThird { color:#FFFFFF; } 
.mainNavThird a:hover { color:#FFFFFF; }
.mainNavThird a { height:27px; padding-top:4px; border-top: 1px solid #FFFFFF; padding-left:70px; font-size:16px; }
.mainNavThird a:last-child { border-bottom: 1px solid #FFFFFF; }

.thirdNO { color:#ffffff; }
.thirdACT { background:#ef0000 url("../Icons/navigation-second-arrow.svg") no-repeat 51px center/19px 15px; color:#FFFFFF; }
.thirdACT:hover { background: #ef0000 url("../Icons/navigation-second-arrow.svg") no-repeat 51px center/19px 15px; }
.mainNavThird .thirdNO:hover { background: #424242 url("../Icons/navigation-second-arrow.svg") no-repeat 51px center/19px 15px; color:#ef0000; }


/* mobile */
.mobileHeader { display:none; float:left; width:100%; height:70px; background:#FFFFFF; }
.mobileNav { display:none; }
.mobileLogo { float:right;  margin-top:18px; margin-right:40px; }
.mobileLogo img { width:auto; height:36px; }
.mobileNavShowOrHide { display:none; }


/*Info: muss so aufgebaut sein*/
.mobileMenu { float:left; width:35px; height:34px; margin-left:32px; margin-top:20px; background-image:url('../Icons/mobile-button-open.svg'); background-size:100% 100%; cursor:pointer; }
html .closeMenu { background-image:url('../Icons/mobile-button-close.svg'); background-repeat:no-repeat; }
	

.imgHeader { display:none; float:left; width:100%; min-height:20px; background-color:#FFFFFF; }
.imgHeader img { width:100%; height:auto; }



/* mobile: first level */ 
.mobileNav { max-width:1024px; position:absolute; top:70px; z-index:10; }
.mobileNav, .mobileNavFirst { float:left; width:100%; z-index:101; background-color:#424242; }
.mobileNav * { color:#FFFFFF; }

.mobileIcon { float:left; display:block; width:38px; min-width:32px; height:29px; }
.mobileFirstNO, .mobileFirstACT { float:left; width:100%; padding:8px 0 12px 0; font-size:20px; text-transform:uppercase; border-bottom:1px solid #FFFFFF; background-color:#424242; 
                                  height:38px; }
.mobileFirstNO span, .mobileFirstACT span { float:left; }
div .mobileFirstACT span, .mobileFirstACT:hover span, .mobileFirstNO:hover span { color:#ef0000; }


/* mobile: second level */
.mobileNavSecond { display:none; float:left; width:100%; border-bottom-color:#FFFFFF; border-bottom-width:1px; border-bottom-style:solid; background-color:#424242; }
.mobileNavSecond a:hover {  }
.mobileSecondNO, .mobileSecondACT { float:left; width:100%; padding:5px 0 5px 38px; }
.mobileNav .mobileNavSecond .mobileSecondNO:hover span { color:#ef0000; }
.mobileSecondNO span, .mobileSecondACT span { float:left; margin-left:11px; font-size:18px; }
.mobileSecondACT { background-color:#ef0000; color:#FFFFFF; }

html .closeMenu { background-image:url('../Icons/mobile-button-close.svg'); background-repeat:no-repeat; }


.mobileOpenSub { cursor:pointer; background:url('../Icons/mobile-navigation-closed.svg') 15px center/15px 21px no-repeat; }
.mobileIconClosed { background:url('../Icons/mobile-navigation-closed.svg') 70% center/15px 21px no-repeat; }
.mobileIconOpened { background:url('../Icons/mobile-navigation-opened.svg') 70% center/15px 21px no-repeat; }

/* mobile: third level */
.mobileNavThird { float:left; width:100%; background-color:#424242; }
.mobileNavThird a:hover {  }
.mobileNavThird a span { color:#ef0000; }
.mobileNavThird a { background-color:#333333; }
.mobileThirdNO, .mobileThirdACT { float:left; width:100%; padding:5px 0 5px 38px; }
.mobileNav .mobileNavThird .mobileThirdNO:hover span { color:#FFFFFF; }
.mobileThirdNO span, .mobileThirdACT span { float:left; margin-left:20px; font-size:18px; }
.mobileThirdACT { background-color:#FFFFFF; color:#ef0000; }


/* all Titles */
.ceHeader { text-transform:uppercase; letter-spacing:-2px; margin-bottom:20px; }
.mainSection h2 { color:#000000; text-transform:none; }

/* content elements */
.ceTextImage { float:left; width:100%; }
.ceTextImageText { float:left; width:48%; padding-right:22px; padding-bottom:14px; }
.ceTextOnly { float:left; width:100%; padding-bottom:14px; padding-right:3px; }

.ceTextImage img { float:left; width:45%; height:auto; padding-bottom:14px; }

.ceTextImage .smallImageLeft { max-width:310px; }
.ceTextImage .smallImageRight { float:right; max-width:280px;  }

.ceTextImage .ceTextFloatLeft { float:right; width:52%; max-width:340px; }
.ceTextImage .ceTextFloatRight { float:left; width:52%; max-width:340px; }

.ceImage { float:left; width:100%; margin-bottom:20px; }
.ceImage img { width:100%; }

.image1 { width:100%; float:left; margin-bottom:0.5%; }
.image1 img { width:100%; height:auto; }
.image2 { width:50%; float:left; margin-bottom:0.5%; }
.image2 img { width:97%; height:auto; }

/*imuxgallery*/
.tx-imuxgallery { float:left; margin-bottom:30px;  }
.tx-imuxgallery a { color:#000000; }

/* footer */
.mainFooter { float:left; width:100%; height:50px; background:rgb(112, 112, 112); color:#ffffff; }
.mainFooter div { color:#ffffff; font-size:16px; }
.mainFooter p { color:#ffffff; font-size:16px; }
.mainFooter a { color:#ffffff; }
.subFooter { float:left; display:none; width:100%; height:44px; background-color:#5d5d5d; }
.companyText { float:right; min-width:250px; margin-right:40px; padding-top:16px; color:#FFFFFF; }
.companyName { float:left; width:25.4%; height:50px; margin:0; padding-top:18px; padding-left:43px; background-color:#1B1B1B; font-size:25px; color:#FFFFFF; font-weight:bold; letter-spacing:1px; }
.address { float:left; color:#FFFFFF; margin-right:10px; border-right: 1px solid #FFFFFF; }
.address:last-child { border-right:none; }
.address a { font-size:16px; }
.day { float:left; width:90px; color:#FFFFFF; }
.time { float:left; width:auto; color:#FFFFFF; }
.openingTime { float:left; width:31.3%; height:120px; min-width:150px; padding-top:6px; margin-left:7.8%; border-right:1px solid #FFFFFF; }
.mainFooter .unternehmen { display:none; color:#000000; }

@media only screen and ( max-width:900px ){
   .mainFooter .serviceNav { display:none; }
   .subFooter .serviceNav { display:block; }
   .serviceNav { float:none; }
   .subFooter { display:block; }
   .companyName { display:none; }
   .middleDiv .serviceNav { display:none; }
   .serviceNav a { color:#FFFFFF; border-right:1px solid #FFFFFF; }
   .mainFooter .unternehmen { display:block; }
}

@media only screen and ( max-width:810px ) {
 
   .mainHeader { display:none; }
   .mobileHeader { display:block; }
   .imgHeader { display:block; }
   .mobileNavShowOrHide { display:block; }
   
   .mainNav { display:none; }
   .navBackground { display:none; }
   
   .content { width:85%; margin-top:50px; }
   .ceTextImageText { width:100%; }
   .ceTextImage img { width:100%; float:left; }
   .ceTextImage .smallImageLeft { max-width:none; }
   .ceTextImage .smallImageRight { max-width:none; }
   .ceTextImage .ceTextFloatLeft { float:left; width:100%; max-width:none; }
   .ceTextImage .ceTextFloatRight { width:100%; max-width:none; }
   .ceTextOnly { padding-right:0; }
   
   .openingTime { width:50%; border-right:none; }
   .mainFooter .social { display:none; }
   .mainFooter { height:72px; padding-left:31px; }
   .mobileSocial { display:block; }
   .mobileSocial .social { display:block; }
   .social { display:none; }
   .subFooter .serviceNav { margin-left:31px; }
   .mainNav .serviceNav .serviceACT, .serviceNO:hover { background:none; }
}

@media only screen and ( max-width:455px ) {
   .image2 { width:100% }
   .image2 img { width:100%; }
   iframe { height:300px; }
   
   .mainFooter { height:150px; padding-left:20px; }
   .mainFooter .unternehmen { margin-bottom:5px; font-size:18px; font-weight:bold; }
   .address { width:200px; border-right:none; }
   .companyText { float:left; width:80%; border-right:none; }
   .subFooter .serviceNav { margin-left:20px; }
}