/*
 Theme Name:   Leftsell - Ashe Child
 Theme URI:    https://leftsell.com/
 Description:  LeftSell Theme - Child of Ashe
 Author:       Kundschaft Schweiz
 Author URI:   https://kundschaft.ch
 Template:     ashe
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  ashe
*/

/* normal styles */
h1.page-title { display:none }
h1 { text-align:left }
.post-content h2 { font-size: x-large; font-weight: 500; letter-spacing: 1px }
.textshadow { text-shadow: 2px 2px 3px #000000; }
.dropshadow { filter: drop-shadow( 1px 1px 2px rgb(0, 0, 0, .3) ); }
.block { text-align: justify !important; }
.mid50, .div50 { width: 50%; margin: 0 auto 0 auto;  }
.mid30, .div30 { width: 30%; margin: 0 auto 0 auto;  }
.mid40, .div40 { width: 40%; margin: 0 auto 0 auto;  }
.mid60, .div60 { width: 60%; margin: 0 auto 0 auto;  }
.mid70, .div70 { width: 70%; margin: 0 auto 0 auto;  }
.mid80, .div80 { width: 80%; margin: 0 auto 0 auto;  }
.mid90, .div90 { width: 90%; margin: 0 auto 0 auto;  }
.white { background-color: rgb( 255,255,255,.8); padding:20px; color:black}
.white ul li { color:black}
.wp-block-media-text .wp-block-media-text__content { padding: 0 }
.post-media { display:none }
.main-content .clear-fix { padding:0 }

/* layout */
.main-content { width: 100%; }
.main-container, .main-container.clearfix { min-width: 100%; float:none; display: block; outline: none; overflow: visible;}
#main-nav { background:#ffffff !important }
.sidebar-left { display: none }
.sidebar-right { display: none }
.post-content { overflow: visible; }
.fulltop { margin: -40px 0 0 -40px; width: calc( 100% + 80px ) }
.full, .fullback    { margin: 0 0 0 -40px; width: calc( 100% + 80px ) }
.wp-block-cover__inner-container { padding-left:10px; padding-right:10px; width: calc( 100% - 20px) !important}
@media screen and ( max-width: 640px ) {
   .main-content { width: 100%; padding: 40px 20px 40px 20px !important; }
   .fulltop { margin: -40px 0 0 -20px; width: calc( 100% + 40px ) }
   .full, .fullback    { margin: 0 0 0 -20px; width: calc( 100% + 40px ) }
   .mid50, .mid60, .mid70, .mid80, .mid90, .mid30, .mid40   { width: 100% }
   .div50, .div60, .div70, .div80, .div90, .div30, .div40   { width: 100% }
}

/* header icons */
div.mini-logo { margin-right: 20px }
.main-nav-leftsellicons { float: right; position: relative; line-height: 60px; padding-top:2px; margin-right:10px  }
.main-nav-leftsellicons img { cursor: pointer; display: inline-block; margin:4px 10px 0 10px; height: 15px !important; }
@media screen and ( max-width: 640px ) {
   .main-nav-leftsellicons { float: none; }
}

/* special styles */
.leftsellbox { background-color: rgb(247, 247, 247); padding: 15px; overflow: hidden; display: inline-block; margin-bottom: 30px; -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.8), inset 0 0 1px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.8), inset 0 0 1px rgba(0, 0, 0, 0.1); box-shadow: inset 0px 0px 1px rgba(0, 0, 0, 0.3);}
.leftsellbox > figure { display: inline-block; overflow: hidden; margin: -15px 0 20px -15px; min-width: calc( 100% + 30px); display: block;  }
.leftsellbox img, .leftsellbox .wp-block-image img { transition: scale .8s; height:150px; max-height: 150px; max-width: 2000px; min-width:100%; width:auto }
.leftsellbox:hover img { scale: 1.5; transform-origin: 50% 50%; height:150px; max-height: 150px; overflow: hidden; }
#main-menu li:last-child  { vertical-align: middle; padding-top: 12px }
#main-menu li:last-child a { line-height: 16px; }
#main-menu li:last-child a img { width: 16px; margin-right:10px }
#main-menu li:last-child.menu-item-has-children > a::after { content: ""; }
.leftsellpin { cursor:pointer }
.leftsellpin:hover {animation: pulse 1s; }
img.webicon  { max-width:100px }
.webicons div  { text-align:center;  }
.webicons div img, .webicons figure img { max-width:100px!important; height:auto; margin: 0 auto 0 auto; opacity: .8 }


@media screen and ( max-width: 640px ) {
   .mobile-menu-btn { display:block; float:right; text-align:center; width:100%;  }
   .menu-item img { max-width:20px; }
   .main-nav-icons { float:right; white-space: nowrap; }
   .main-nav-leftsellicons { padding-right: 20px; }
   .main-menu-container { display:none; }
   .mobile-menu-btn { line-height: 40px}
   img.webicon  { max-width:100px !important }
}
@media screen and ( max-width: 600px ) {
   .leftsellbox > figure { height:auto !important; box-sizing: content-box; }
   .leftsellbox img { border-bottom:1px solid black; scale: 1.1; max-height: 400px !important; height:auto !important; width:auto !important; transition: none !important; }
   .leftsellbox:hover img { scale: 1.1; max-height: auto; height:auto; }
   .mobile-menu-btn { display:block }
   .main-menu-container { display:none; }
   img.webicon, .webicon img  { max-width:100px !important }
}
@media screen and ( max-width: 782px ) { .wp-block-column .nobreak { display: flex; flex-grow: 0 } }
@media screen and ( max-width: 599px ) { 
   .nobreak .wp-block-column { display: inline-flexbox; flex-grow: 0; max-width:50% } 
   .webicons div img, .webicons figure img { max-width:80px!important; }
}

.whitebox { background-color: rgb( 255,255,255,.3) !important; padding: 20px 15px 0 15px }
.whitebox a { color: white }
.whitebox a:hover { color: white }

/* woocommerce */
.wc-block-grid__product {list-style-type: none}
ul.products li.product a.button { display:none }
.woocommerce ul.products li.product .price { display:none}
ul.wc-block-grid__products { padding-left:0}
.main-nav-sidebar { display:none}
.woocommerce-product-gallery__image img.wp-post-image { max-height: 300px; object-fit: cover; }
.smallproducts img { max-width:130px!important; height:auto; margin: 0 auto 0 auto }

/* kartenlegen plugin */
img.showselectedcard { float:left; margin:0 0 20px 0}
img.showselectedcard:first-child { margin-left:20px}
img.showselectedcard:last-child { margin-right:30px}

/* footer ***********/
footer#leftsell_footer { padding: 40px 5% 10px 5%; margin:80px 0 0 0; color:rgb(255,255,255,.8); text-align:left; color:rgb(255,255,255,.8); min-height:120px; overflow:hidden; 
                         background-color:rgb(0, 0, 0); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.8), inset 0 0 1px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.8), inset 0 0 1px rgba(0, 0, 0, 0.1); box-shadow: 0 0 1px rgba(0, 0, 0, 0.8), inset 0 0 1px rgba(0, 0, 0, 0.1);
}
footer#leftsell_footer p {color:rgb(255,255,255,1); line-height:22pt}
footer#leftsell_footer a {color:rgb(255,255,255,.8); }
footer#leftsell_footer a:hover {color:rgb(255,255,255,1)}

footer#leftsell_footer .small, footer#leftsell_footer .small a { font-size:12px; line-height:22pt }
#leftsell_footer #rechtliches { padding-top:20px; padding-left:4px}
#leftsell_footer #rechtliches a { font-size:small; font-weight:bold; color: #336699; letter-spacing: -.07em}
footer#leftsell_footer .logo { opacity: .3 }
@media screen and (max-width: 800px) {
   footer#leftsell_footer { display: block;  }
   footer#leftsell_footer .logo { margin-top: 40px}
}

/* ashe */
.credit { display:none }
#accordion-section-ashe_skins { display: none !important }

/* landing pages 
   add html tag:
   <script type="text/javascript">
   var body = document.body;
   body.classList.add("landing");
   </script>
*/
.landing { background-color: rgb(255, 255, 255) !important }
.landing > footer { display:none !important }
.landing #page-header { display:none !important;  }
.landing .page-content, .landing .main-content { background-color: rgb(255, 255, 255) !important;  }