/*
Theme Name: Backauf Theme
Theme URI: https://www.backauf.de
Author: Niklas Hasch
Description: Theme
Version: 3.0.1
License: GNU General Public License v2
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
@import "theme.css";
/*******************
*** RESET
*******************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {font-family: arial, helvetica, sans-serif}

ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table{border-collapse: collapse;border-spacing: 0;}
/**** VORGEGEBENE REGELN ****/
html{overflow-x: hidden}
.right{text-align:right;}
p{margin-bottom:1em;line-height:1.5;}
h1, h2, h3, h4, h5, h6{margin-bottom:0.5em;}
#giant404{font-size:120px;text-align:center;}
#sub404{font-size:26px;text-align:center;}
#rightside{position:fixed;clear:both;height:150px;padding-top:20px;right:-880px;width:1000px;top:66%;transition:right 2.2s ease-in-out;background-color:black;z-index:1003;-webkit-border-top-left-radius:10px;-webkit-border-bottom-left-radius:10px;-moz-border-radius-topleft:10px;-moz-border-radius-bottomleft:10px;border-top-left-radius:10px;border-bottom-left-radius:10px}
#rightside.MagicDingDong{right:-1px}
.rightside_left{height:50%;}
.rightside_right{height:50%;}
.clear{clear:both;}
strong{font-weight:bold;}
.center{text-align:center;}
#header_infos{border-bottom:none !important;padding:5px 50px;}
#header_infos a{text-decoration:none;color::#006b4b;}
#header_infos a:hover{text-decoration:underline;}
#header_infos p{margin-bottom:0px;color:#006b4b;font-size:13px}
#header_infos .fa-envelope{margin-left:15px;}
.product-category {box-sizing: border-box;}
.product-category a{text-decoration:none !important;}
.woocommerce-loop-category__title > .count{display:none;}
.woocommerce-loop-category__title{font-size:18px !important;font-weight:bold;font-family:sans-serif;text-align:center;}
.woocommerce ul.products li.product a img{margin-bottom:0px;}
.posted_in{display:none;}
/**** EIGENE CSS REGELN ****/
 #logo a > img{max-width: 350px; width: 276px!important; height: auto;}
 #logo{position:relative!important;top:unset!important}
main{max-width:1920px;width: calc(100% - 475px);margin:0 auto;margin-left:275px;padding:20px 100px !important;}
.heroIMG{margin-left:-100px;margin-right:-100px;margin-top:-30px;}
.smallHero{margin-left:-100px;margin-right:-100px;margin-top:-30px;}
#logo{position:fixed;top:20px;left:0;width:275px;text-align:center;z-index:1000;}
#logo img{width:150px;margin:0 auto;display:block;}
body{margin:0;padding:0;font-family:Arial, sans-serif;}

nav{position:fixed;top:0;left:0;width:275px;height:calc(100% - 25px);background-color:#f4f4f4;box-shadow:2px 0 5px rgba(0, 0, 0, 0.1);overflow-y:auto;overflow-x:hidden;}
nav ul{list-style:none;padding:0;margin:0;}
nav ul ul{margin-top:10px;}
nav ul li{margin-bottom:10px;}
nav div ul li.current-menu-item a{background-color:#dedede;}
nav div ul li.current-menu-item ul li a{background-color:#f4f4f4;}
nav div ul li ul li a:hover{background-color:#dedede;}
nav > div > ul > li ul li.current-menu-item a:hover{background-color:#f4f4f4;}
nav ul > li > a{display:block;text-decoration:none;font-size:14px;color:#0e4f8d;text-align:left;padding-left:0px;background-color:#f4f4f4;position:relative;padding:10px;}
nav ul ul li a{display:block;text-decoration:none;font-size:14px;color:#0e4f8d;text-align:left;padding-left:0px;background-color:#f4f4f4;position:relative;padding-left:25px;}
nav ul > li > a:hover{background-color:#f4f4f4;}
nav ul ul li a:hover{background-color:#f4f4f4;}

/* Untermenü-Pfeil: runder Button mit Chevron, dreht sich beim Öffnen um 180° */
li.menu-item-has-children > a{position:relative;padding-right:40px;}
.submenu-toggle{position:absolute;right:8px;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;background-color:#e5e8ec;display:flex;align-items:center;justify-content:center;transition:transform 0.3s ease;cursor:pointer;}
.submenu-toggle::after{content:"";width:7px;height:7px;border-right:2px solid #0e4f8d;border-bottom:2px solid #0e4f8d;transform:rotate(45deg);margin-top:-3px;}
.submenu-toggle:hover{background-color:#d7dce2;}
li.menu-item-has-children.open > a .submenu-toggle{transform:rotate(180deg);}
.sub-menu{display:none;}
li.menu-item-has-children.open > .sub-menu{display:block;}
nav ul li a:hover{background-color:#ddd;}

h1{font-size:36px;margin-bottom:30px;}
h2{font-size:30px;font-weight:bold;margin-top:25px;margin-bottom:15px;}
h3{font-size:24px;font-weight:bold;margin-top:20px;margin-bottom:12px;}
h4{font-size:20px;font-weight:bold;margin-top:15px;margin-bottom:10px;}
h5{font-size:18px;font-weight:bold;margin-top:12px;margin-bottom:8px;}
h6{font-size:16px;font-weight:bold;margin-top:10px;margin-bottom:8px;}

em, i, cite, dfn, var{font-style:italic;}

.Historie h3.widget-title,.Zebra h3.widget-title,h3.widget-title{font-size:36px;margin-bottom:30px;;font-weight:bold;margin-top:30px;}

.Historie p,.Zebra p{line-height:26px;}
.Historie a,.Zebra a{color:black;text-decoration:none;}
.Historie h1,.Zebra h1{text-align:center;margin-top:100px;}
.Historie > div > div,.Zebra > div > div{margin-bottom:75px!important;}
.Historie > div > div:nth-child(even),.Zebra > div > div:nth-child(even){background-color:#f4f4f4;margin:-20px;padding:20px;}

.lightgrey_bg{background-color:#f4f4f4;margin:-20px;padding:20px;}

table{width:100%;border-collapse:collapse;margin:20px 0;font-size:16px;text-align:left;}
table th, table td{padding:10px;border:1px solid #ddd;}
table th{background-color:#f4f4f4;font-weight:bold;}
table tr:nth-child(even){background-color:#f9f9f9;}
table td{vertical-align:top;white-space:nowrap;line-height:1.5}

#page ul{list-style-type: disc;margin:20px;padding:0 20px;font-size:16px;line-height:1.6;}
#page ul li{margin-bottom:15px;}
#page ul li em{font-style:italic;color:#555;}
#page ul ul{list-style-type:circle;margin-top:10px;margin-left:20px;}
#page ul ul li{margin-bottom:10px;}

footer{width:calc(100% - 275px) !important;float:right;position: relative;min-height:80px;margin-top:130px;background-color:#0e4f8d;}
footer::before{content:"";display:block;width:25%;height:100px;background-image:url('/wp-content/uploads/2024/11/Titanic_footer-scaled.webp');background-size:cover;
background-repeat: no-repeat;background-position: center;position:absolute;top:-100px;left:60%;z-index:-1;}
footer::after{content:"";display:block;width:10%;height:55px;background-image:url('/wp-content/uploads/2024/11/Eisberg.webp');background-size:cover;background-repeat:no-repeat;background-position: center;
position:absolute;top:-55px;left:88%;z-index:-2;}
footer p{color:white;text-align:center;line-height:80px;margin-bottom:0px;}
footer a{color:white;text-decoration:none;}
.darkFooter{background-color:#072746;margin-left:-222px;margin-right:-222px;}
.darkFooter p{line-height:40px;}

@media screen and (max-width:1920px) and (min-width:1366px){
footer::before { width: 30%;left:40%}
footer::after {width:9% ;left:80%}
/*main{width: calc(100% - 253px);} */

}
@media screen and (max-width:1920px) and (min-width:1024px)   {
footer,.darkFooter{width:100% !important;margin-left:unset;margin-right:unset;}
   footer #content {max-width: unset;}
     }
@media screen and (max-width:1366px){
    html *{
        overflow-x: hidden;
    }

    main{width: calc(100% - 253px);}   }
@media screen and (max-width:1366px)and (min-width:1182px){
footer::before { width: 31%;left:25%}
footer::after {width:14% ;left:85%}
}
@media screen and (max-width:1181px) and (min-width:1082px){
    footer::before { width: 35%;left:25%}
}
@media screen and (max-width:1081px) and (min-width:1025px){
    footer::before { width: 38%;left:29%}
    footer::after {width:16% ;left:85%}
}
@media screen and (max-width:1024px){
    footer::before { width:41%;left:10%}
    footer::after {width:16% ;left:70%}
main{margin-left:0;width:calc(100% - 200px);}
footer,.darkFooter{width:100% !important;margin-left:unset;margin-right:unset;}
header{height:10px!important}
.submenu-toggle{display:none;}

}
@media screen and (max-width:941px)and (min-width:822px){
footer::before {width: 45%;left: 10%;}
}
 @media screen and (max-width:821px){
 footer::before {width:53%;left:15%}
  footer::after {width:19% ;left:85%}
  main{width:calc(100% - 70px);padding:10px 35px !important}
  header{height:10px!important}

 }
  @media screen and (max-width:621px){
        footer::before { width: 92%;left:-25%}
  footer::after {width:38% ;left:90%}
  }