/* SlidesJS Hack */
/*
.slidesjs-navigation {display:none;}
.slidesjs-pagination {z-index: 100;position: absolute;right: 9px;bottom: 9px;}
.slidesjs-pagination li {float:left;}
.slidesjs-pagination li a {display: block; width: 11px; height: 11px; text-indent: -9999px; margin-left: 3px; background: url(data:image/gif;base64,R0lGODlhCwALAKU3AGtmYGpmY2tmYmhnYmpnYGpnYmtoY2hpY21oZG1oZWppZWxpZGlqZGpqYmlqZW5pY2tqZXBpYW1qY21qZW9qZG5qZ29qZm5rZG9rYm5rZm9sZXNsYnFtYXRuYufo7ero6eno7enp5+jp6+np6enp6+rq6Ors6/Hw9fLw8/Hx7/Dx8/Hx8fLy9Pj5+/n5+fr6+Pn6/v7+///+//z/////+/7//////f///////////////////////////////////yH+EUNyZWF0ZWQgd2l0aCBHSU1QACH5BAEKAD8ALAAAAAALAAsAAAZgwI4EMnlQLpNMZYMAeUgfEggqOlhAtdrtJpPdVApMqWaj2by2VeIx0t6yWdSCMordbNvtanEJ3c9oKQ0abXlvNSwMEyIzbnAnDhcmMC4vLi0tLiwKHAYBAgAEAwUAAxFBADs=) no-repeat;}
.slidesjs-pagination li a.active {background: url(data:image/gif;base64,R0lGODlhCgALAIQZAAAAAAAAAgEAAAAABAEAAgMAAAABAAQAAAEBAAABAwABBAEBAwUEAAkEAAYFAAgFAAkFAAYGABcQChQRDBYRDRUSCxUSDRcSDhYTDP///////////////////////////yH5BAEKAB8ALAAAAAAKAAsAAAU/oDRZF1VhFUUdwxC88FIELgwXQK7nxvHyugAOIBDsiLmirih4GZcEgULxSgQAi0HTkEtwEQHI4xFxMB4QSCMEADs=) no-repeat;}
*/
#home-header {
    text-align: center;font-weight: bold;padding-top: 1rem;
}
#home-subheader {
    font-size: 2rem;
    color: var(--middle-grey-color);
    font-weight: bold;
    text-align: center;
}
@media (max-width: 840px) {
    #home-header {
        font-size: 1.6rem;
        line-height: 3rem;
        margin: 1rem 0 0 0;
    }
    #home-subheader {
        font-size: 1.4rem;
        line-height: 1.6rem;margin:0;
    }
}
@media (max-width: 680px) {
    #home-header {
        margin:0;padding:0;
    }
}
/* Featured categories widget */
#featured-categories a {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    width: max(33.3% - 2rem, 400px);
    margin: 1rem;
    max-width: 400px;
    max-height: 225px;
    aspect-ratio: 16/9;
    background-color: var(--light-grey-color);
}

#featured-categories {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    margin-top:1rem;
}
@media (max-width: 680px){
    #featured-categories {
        margin-top:1rem
    }
}
@media (max-width: 840px) {
    #featured-categories a {
        width: clamp(300px, 50% - 1rem, 420px - 1rem);
        margin:0.5rem;
    }
}
@media (max-width: 640px) {
    #featured-categories a {
        width: calc(100% - 2rem);
    }
}
#featured-categories .featured-category-name {
    bottom: 0;
    background-color: #00000080;
    left: 0;
    position: absolute;
    line-height: 4rem;
    font-size: 2rem;
    color: white;
    text-align: center;
    display: block;
    width: 100%;
    font-weight: bold;
}
#featured-categories a:hover .featured-category-name {
    opacity: .85;
}

/* Latest products widget */

.widget .price,
.widget .price-old,
.widget .price-new {
    display: inline-block;
    font-size:1.3rem;
    font-weight: bold;
    margin: 0 5px 1px 5px;
}
.widget .price-old {
    color: grey;
    text-decoration: line-through;
}

@media (max-width: 680px) {
    /* margin і фіксована width: 130px прибрані: віджет тепер grid, ширину
       клітинки задає колонка (1fr), а картки мусять стикатися.
       min-height теж зайвий — висоту вирівнює grid-auto-rows: 1fr. */
    .widget .price,
    .widget .price-old,
    .widget .price-new {
        margin: 0 3px 1px 3px;
    }
    .widget.latest-products .product-cell a,
    .widget.specials .product-cell a {
        font-size: 1.1rem;
    }
    .widget.cartbutton {
        padding: 2px 5px;
    }
}

.all-spec {font-size:1.6rem;justify-content:space-evenly;opacity:.8}
.all-spec:hover {opacity:1;}