@import url('base_variables.css');
@import url('edge.css');

@font-face {
    font-family: "Material Icons";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../css/479700ea91d964d295d7.eot);
    src: local("Material Icons"), local("MaterialIcons-Regular"), url(../css/12a47ed5fd5585f0f422.woff2) format("woff2"), url(../css/f2a0933406f783065152.woff) format("woff"), url(../css/00b1fb69fb78ff50fd55.ttf) format("truetype")
}

/**********/
/***** BOOTSTRAP COLOR OVERRIDES *****/
/**********/
a {
    color: var(--SECONDARY);
}

a:focus,
a:hover {
    color: var(--SECONDARY_LIGHTER);
}

.btn-primary,
.btn-primary:hover {
    color: var(--SECONDARY) !important;
    background-color: var(--PRIMARY) !important;
}

.btn-primary:hover {
    background-color: var(--PRIMARY_DARKER) !important;
}

.btn-primary.focus,
.btn-primary:focus {
    color: var(--SECONDARY) !important;
    background-color: var(--PRIMARY_DARKER) !important;
}

.btn-primary.active,
.btn-primary:active,
.open>.btn-primary.dropdown-toggle {
    color: var(--SECONDARY) !important;
    background-color: var(--PRIMARY_DARKER) !important;
}

.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary:active.focus,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open>.btn-primary.dropdown-toggle.focus,
.open>.btn-primary.dropdown-toggle:focus,
.open>.btn-primary.dropdown-toggle:hover {
    color: var(--SECONDARY) !important;
    background-color: var(--PRIMARY) !important;
}

.btn-primary.disabled.focus,
.btn-primary.disabled:focus,
.btn-primary:disabled.focus,
.btn-primary:disabled:focus {
    color: var(--SECONDARY) !important;
    background-color: #aaa !important;
}

.btn-primary.disabled:hover,
.btn-primary:disabled:hover {
    color: var(--SECONDARY) !important;
    background-color: #aaa !important;
}

.btn-secondary {
    color: var(--PRIMARY) !important;
    background-color: var(--SECONDARY) !important;
}

.btn-secondary:hover,
.btn-tertiary:hover {
    color: var(--PRIMARY) !important;
    background-color: var(--SECONDARY_DARKER) !important;
    border-color: 1px solid var(--SECONDARY) !important;
}

.btn-secondary.focus,
.btn-secondary:focus {
    color: var(--PRIMARY) !important;
    background-color: var(--SECONDARY_DARKER) !important;
    border-color: 1px solid var(--SECONDARY) !important;
}

.btn-secondary.active,
.btn-secondary:active,
.open>.btn-secondary.dropdown-toggle {
    color: var(--PRIMARY) !important;
    background-color: var(--SECONDARY_DARKER) !important;
}

.btn-secondary.active.focus,
.btn-secondary.active:focus,
.btn-secondary.active:hover,
.btn-secondary:active.focus,
.btn-secondary:active:focus,
.btn-secondary:active:hover,
.open>.btn-secondary.dropdown-toggle.focus,
.open>.btn-secondary.dropdown-toggle:focus,
.open>.btn-secondary.dropdown-toggle:hover,
.open>.dropdown-toggle.btn-tertiary:focus {
    color: var(--PRIMARY) !important;
    background-color: var(--SECONDARY_DARKER) !important;
}

.btn-secondary.disabled.focus,
.btn-secondary.disabled:focus,
.btn-secondary:disabled.focus,
.btn-secondary:disabled:focus {
    color: #333 !important;
    background-color: #aaa !important;
}

.btn-secondary.disabled:hover,
.btn-secondary:disabled:hover {
    color: #333 !important;
    background-color: #aaa !important;
}

.btn-outline-primary {
    color: var(--PRIMARY) !important;
    border-color: var(--PRIMARY) !important;
}

.btn-outline-primary:hover {
    background-color: var(--PRIMARY) !important;
    border-color: var(--PRIMARY) !important;
}

.btn-outline-primary.focus,
.btn-outline-primary:focus {
    background-color: var(--PRIMARY) !important;
    border-color: var(--PRIMARY) !important;
}

.btn-outline-primary.active,
.btn-outline-primary:active,
.open>.btn-outline-primary.dropdown-toggle {
    background-color: var(--PRIMARY) !important;
    border-color: var(--PRIMARY) !important;
}

.btn-outline-secondary,
.btn-outline-secondary:hover {
    border-color: var(--SECONDARY) !important;
}

.btn-outline-secondary {
    color: var(--SECONDARY) !important;
}

.btn-outline-secondary:hover {
    color: var(--PRIMARY) !important;
    background: var(--SECONDARY) !important;
}

.btn-outline-secondary.focus,
.btn-outline-secondary:focus {
    background-color: var(--SECONDARY) !important;
    border-color: var(--SECONDARY) !important;
}

.btn-outline-secondary.active,
.btn-outline-secondary:active,
.open>.btn-outline-secondary.dropdown-toggle {
    background-color: var(--SECONDARY) !important;
    border-color: var(--SECONDARY) !important;
}

.btn-outline-secondary.active.focus,
.btn-outline-secondary.active:focus,
.btn-outline-secondary.active:hover,
.btn-outline-secondary:active.focus,
.btn-outline-secondary:active:focus,
.btn-outline-secondary:active:hover,
.open>.btn-outline-secondary.dropdown-toggle.focus,
.open>.btn-outline-secondary.dropdown-toggle:focus,
.open>.btn-outline-secondary.dropdown-toggle:hover {
    background-color: var(--SECONDARY) !important;
    border-color: var(--SECONDARY) !important;
}

.btn-link {
    color: var(--PRIMARY) !important;
}

.dropdown-item.active,
.dropdown-item.active:focus,
.dropdown-item.active:hover {
    background-color: var(--PRIMARY);
}

.nav-pills .nav-item.open .nav-link,
.nav-pills .nav-item.open .nav-link:focus,
.nav-pills .nav-item.open .nav-link:hover,
.nav-pills .nav-link.active,
.nav-pills .nav-link.active:focus,
.nav-pills .nav-link.active:hover {
    background-color: var(--PRIMARY)
}

.card-primary {
    background-color: var(--PRIMARY);
    border-color: var(--PRIMARY)
}

.card-outline-primary,
.card-outline-secondary {
    border-color: var(--PRIMARY);
}

.page-item.active .page-link,
.page-item.active .page-link:focus,
.page-item.active .page-link:hover {
    background-color: var(--PRIMARY);
    border-color: var(--PRIMARY);
}

.page-link {
    color: var(--PRIMARY);
}

.tag-primary {
    background-color: var(--PRIMARY);
}

.tag-primary[href]:focus,
.tag-primary[href]:hover {
    background-color: var(--PRIMARY_DARKER);
}

.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
    background-color: var(--PRIMARY);
    border-color: var(--PRIMARY);
}

.bg-primary {
    background-color: var(--PRIMARY) !important;
}

a.bg-primary:focus,
a.bg-primary:hover {
    background-color: var(--PRIMARY_DARKER) !important;
}

.text-primary {
    color: var(--PRIMARY) !important;
}

a.text-primary:focus,
a.text-primary:hover {
    color: var(--PRIMARY_DARKER) !important;
}

.carousel .carousel-control .icon-next:hover i,
.carousel .carousel-control .icon-prev:hover i {
    color: var(--SECONDARY);
}

/**********/
/***** BOOTSTRAP BASIC SMALL OVERRIDES *****/
/**********/
button:focus {
    outline: none;
}

.btn {
    border-radius: 4px;
}

.navbar-toggler {
    width: auto;
    height: 100%;
    background: 0;
}

.breadcrumb {
    margin-bottom: 0;
}


/**********/
/***** BASE THEME OVERRIDES *****/
/**********/

/* CHECKOUT MOBILE HEADER */
@media (max-width: 767px) {
    #checkout #header #_mobile_logo {
        justify-content: flex-end;
        margin-right: 15px;
    }

    #checkout #header #_mobile_logo img {
        height: 36px;
        width: auto;
        max-width: 100%;
    }
}

#header .top-menu a[data-depth="0"]:hover {
    color: var(--PRIMARY);
}

.page-content.page-cms span {
    font-size: .9375rem;
    font-weight: 400;
    color: #7a7a7a;
}

.btn-primary,
.btn-secondary,
.btn-tertiary {
    font-weight: normal;
    text-transform: none;
}

.btn img.svg-icon {
    margin-right: .625rem;
}

.btn img.svg-icon.icononly {
    margin-right: 0;
}

@media (min-width:768px) {
    .btn img.svg-icon.icononly {
        margin-right: .625rem
    }
}

.block_newsletter form input[type=text]:focus+button .search,
.btn-unstyle:focus .expand-more,
.search-widget form input[type=text]:focus+button .search {
    color: var(--PRIMARY)
}

.form-control:focus {
    outline: .1875rem solid var(--PRIMARY)
}

.input-group.focus {
    outline: .1875rem solid var(--PRIMARY)
}

.bootstrap-touchspin .group-span-filestyle .btn-touchspin,
.group-span-filestyle .bootstrap-touchspin .btn-touchspin,
.group-span-filestyle .btn-default {
    background: var(--PRIMARY)
}

.custom-radio input[type=radio]:checked+span {
    position: absolute;
    background-color: var(--SECONDARY);
}

.dropdown-item:focus,
.dropdown-item:hover {
    color: var(--PRIMARY);
}

.search-widget form input[type=text]:focus {
    outline: 3px var(--PRIMARY) solid;
}

.top-menu a[data-depth="0"] {
    padding: .55rem;
}

body#checkout a:hover {
    color: inherit;
}

body#checkout section.checkout-step.-reachable.-current .step-number {
    background-color: var(--SECONDARY_DARKER);
}

body#checkout section.checkout-step .address-item.selected {
    border: var(--SECONDARY_LIGHTER) 3px solid;
}

body#checkout #cart-summary-product-list img {
    width: auto;
    border: none;
    border-radius: 0;
}

.page-my-account #content .links a {
    padding: 0;
    margin: 0;
}

/* products acts as a row: cancel product col +15 padding, align to container gutter */
#products .products,
.featured-products .products,
.product-accessories .products {
    width: auto;
    margin-left: -15px;
    margin-right: -15px;
}

/* no extra padding: gutter comes from container/col only */
.featured-products {
    padding-left: 0;
    padding-right: 0;
}

.product-miniature .thumbnail-container {
    border: 1px solid #E8E8E8;
    border-radius: 4px;
}

.product-miniature .highlighted-informations .quick-view:hover {
    color: var(--PRIMARY)
}

.page-content.page-cms .products-selection ul .select-title i,
.page-content.page-cms .products-selection ul .sort-by i,
.products-selection .page-content.page-cms ul .select-title i,
.products-selection .page-content.page-cms ul .sort-by i {
    height: inherit;
    line-height: inherit
}

.brands-sort .select-list:hover,
.products-sort-order .select-list:hover,
.suppliers-sort .select-list:hover {
    background: var(--PRIMARY);
}

.facet-dropdown.open>.select-title {
    border: 3px solid var(--PRIMARY);
}

.facet-dropdown .select-list:hover {
    background: var(--PRIMARY);
}

.pagination .current a {
    color: var(--PRIMARY);
}

.block-categories .category-sub-menu {
    font-size: 14px;
}

.block-categories .category-sub-menu .category-sub-link {
    font-weight: 300;
    padding-right: 1rem;
    font-size: inherit;
}

.block-categories .category-sub-menu li {
    margin: 1em 0 1em 0.25em;
}

.block-categories .category-sub-menu li a:hover {
    text-decoration: none;
    color: var(--SECONDARY);
}

.block-categories .category-sub-menu li[data-depth="0"] > a {
    display: inline-block;
    width: 100%;
    font-weight: 500;
    padding-bottom: 0;
    margin: 0;
}

.block-categories .category-sub-menu li:not([data-depth="0"]):not([data-depth="1"]) {
    padding-left: .5em;
}

.block-categories .category-sub-menu li:not([data-depth="0"]):not([data-depth="1"])::before {
    margin-right: 0;
    content: none;
}

#subcategories ul li .subcategory-name:hover,
.block-categories .arrows .arrow-down:hover,
.block-categories .arrows .arrow-right:hover,
.block-categories .collapse-icons .add:hover,
.block-categories .collapse-icons .remove:hover,
.cart-grid-body a.label:hover {
    color: var(--PRIMARY)
}

#subcategories ul li:hover .subcategory-image a {
    border: 5px solid var(--PRIMARY)
}

.product-price {
    color: var(--PRIMARY)
}

.block-social ul {
    display: flex
}

.tabs .nav-tabs .nav-link.active {
    color: var(--PRIMARY)
}

.tabs .nav-tabs .nav-link.active,
.tabs .nav-tabs .nav-link:hover {
    border-bottom: var(--PRIMARY) 3px solid
}

#product-modal .modal-content .modal-body .product-images img:hover {
    border: var(--PRIMARY) 3px solid
}

#blockcart-modal .product-name {
    color: var(--PRIMARY)
}



.product-images>li.thumb-container .thumb.selected,
.product-images>li.thumb-container .thumb:hover {
    border: var(--PRIMARY) 3px solid
}

.product-flags li.product-flag {
    background: var(--PRIMARY);
}

.product-customization .product-message:focus {
    outline: .1875rem solid var(--PRIMARY);
}

.block-promo .promo-input+button {
    border: 2px solid var(--PRIMARY);
}

.block-promo .promo-code-button.cancel-promo {
    color: var(--PRIMARY);
}

.account-list a:hover,
.block_newsletter form button[type=submit] .search:hover,
.footer-container li a:hover {
    color: var(--PRIMARY);
}

.block-social ul li {
    background-color: var(--SECONDARY)
}

.block-social ul li:hover {
    background-color: var(--SECONDARY_LIGHTER)
}

.block_newsletter form input[type=text]:focus {
    outline: 3px var(--PRIMARY) solid;
}

.block_newsletter form input[type=email]:focus {
    border: 3px var(--PRIMARY) solid;
}

#header .header-nav .blockcart a:hover {
    color: var(--PRIMARY);
}

#wrapper {
    background: #FFF;
}

#wrapper .breadcrumb {
    font-weight: 300;
    color: #373737;
    font-size: 13px;
}

#wrapper .breadcrumb li:last-child {
    font-weight: 400;
    color: var(--SECONDARY);
    content: "/"
}

#footer-copyright-row {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--SECONDARY);
    color: var(--PRIMARY);
    font-size: 0.75rem;

    a {
        color: var(--PRIMARY);
        margin: 10px 0;
    }
}

@media (min-width:1512px) {
    .container {
        width: 1320px;
        max-width: 100%
    }
}

/* Single grid authority: kill container-in-container double gutter */
#wrapper .container .container {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}



/**************************************************/
/**************************************************/
/**************************************************/
/*********** COMPLETELEY CUSTOM NEW CSS ***********/
/**************************************************/
/**************************************************/
/**************************************************/

html, body {
    background: var(--SECONDARY_DARKER);
}

#main {
    background: #FFF;
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus,
button:focus,
a:focus {
    outline: none;
    outline-offset: 0;
}

img.svg-icon {
    display: inline-block;
    width: auto;
    height: 1em;
    font-size: 1em;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    vertical-align: middle;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: 400;
  font-style: normal;
}

html, body {
    font-family: "Poppins", sans-serif !important;
    font-optical-sizing: auto;
}


@keyframes productAnim {
    0% {
        background-color: var(--PRIMARY);
    }

    100% {
        background-color: var(--PRIMARY_DARKER);
    }
}

@keyframes productBgAnim {
    0% {
        background-color: rgba(97, 72, 63, 0);
    }

    100% {
        background-color: rgba(97, 72, 63, 0.2);
    }
}

@keyframes offerBg {
    0% {
        background-size: 100%;
    }

    100% {
        background-size: 120%;
    }
}

#menu-icon i {
    color: var(--SECONDARY);
}


#new-bread-search-bar {
    margin-bottom: 30px;

    #new-bread-search-bar-breadcrumb-outer {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
    }
}

@media (min-width: 768px) {
    #new-bread-search-bar {
        #new-bread-search-bar-breadcrumb-outer {
            height: 38px;
            margin-bottom: 0;
        }
    }
}

#subcategories {
    padding-bottom: 3em;
}

#subcategories ul.subcategories-list {
    margin: 0;
}

#subcategories ul.subcategories-list li {
    width: 50%;
    min-width: 0;
    padding: 0;
    margin: 0;

    display: flex;
    flex-direction: column;
}

@media (min-width: 576px) {
    #subcategories ul.subcategories-list li {
        width: 33%;
    }
}

@media (min-width: 992px) {
    #subcategories ul.subcategories-list li {
        width: 25%;
    }
}

#subcategories ul.subcategories-list li span a {
    background-color: var(--SECONDARY);
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
    line-height: 1.15em;
    min-height: 4em;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 12px;
    color: white !important;
}

.product-flags li.product-flag {
    background-color: var(--PRIMARY);
}

#header {
    border-bottom: 1px solid #CACACA;
}

#header_page_top {
    color: var(--PRIMARY);
    background: var(--SECONDARY);

    #header_page_top_row {
        display: flex;
        justify-content: space-between;
        height: 35px;
        align-items: center;
        font-size: 12px !important;


        #language_selector {
            margin-left: 40px;
        }

        & > div {

            & a {
                color: var(--PRIMARY);
            }
        }
    }
}

@media (min-width:768px) {
    #header_page_top {
        #header_page_top_row {
            justify-content: end;
        }
    }
}

#header .header-nav {
    max-height: none;
}

#header .header-nav .language-selector,
#header .header-nav .user-info,
#header .header-nav .blockcart {
    height: auto;
    padding: 1em;
    margin: 0;
}

.top-menu li.product {
    width: 100%;
    display: block;
}

.top-menu li.category .sub-menu ul.top-menu li.category {
    width: 100%;
}

.top-menu li.category .sub-menu ul.top-menu {
    display: flex;
    flex-wrap: wrap;
}

.top-menu {
    padding: 0;
    margin: 0;
}

#header .header-top .header-top-right .btn {
    font-size: 12px;
    line-height: 1em;
    font-weight: normal;

    & img.svg-icon,
    & .material-icons {
        line-height: 14px;
        font-size: 14px;
    }
}

#header .header-top .header-top-right {
    display: flex;
}
#header .header-top .header-top-right .menu {
    flex-grow: 2;
}
#header .header-top .header-top-right .user-info,
#header .header-top .header-top-right #static_cart {
    flex-shrink: 0;
}


.top-menu .sub-menu {
    transition-duration: 0.3s, 0.1s;
}

.top-menu[data-depth="1"] {
    margin: 30px 30px 10px 30px;
}

@media (min-width:768px) {
    .top-menu .sub-menu > ul > li.category {
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        flex-basis: 25%;
        width: 25%;
    }
}

.sub-menu ul li.category a.dropdown-item {
    white-space: normal;
    line-height: 1.2em;
}


.top-menu .sub-menu ul li a {
    padding-top: 0;
    bottom: 0;
}

/* TO MAIN MENU */
#header #top-menu > li.category > a {
    color: var(--SECONDARY) !important;
}

/* Main Submenu Category */
ul.top-menu li.category a[data-depth="1"] {
    color: var(--SECONDARY) !important;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;

    &:hover {
        color: var(--SECONDARY_LIGHTER) !important;
    }
}

ul.top-menu li.category a[data-depth="1"] {
    font-size: 14px;
}

ul.top-menu li.category a[data-depth="2"] {
    font-size: 12px;
}

.top-menu[data-depth="1"] > li.category {
    margin-bottom: 10px !important;
}

@media (min-width:768px) {
    ul.top-menu li.category a[data-depth="1"] {
        font-size: 16px;
    }
    ul.top-menu li.category a[data-depth="2"] {
        font-size: 13px;
    }

    .top-menu[data-depth="1"] > li.category {
        margin-bottom: 15px !important;
    }
}

@media (min-width: 960px) {
    ul.top-menu li.category a[data-depth="1"] {
        font-size: 18px;
    }
    ul.top-menu li.category a[data-depth="2"] {
        font-size: 14px;
    }

    .top-menu[data-depth="1"] > li.category {
        margin-bottom: 20px !important;
    }
}

/* Sub categories */
ul.top-menu li.category a[data-depth="2"],
ul.top-menu li.category a[data-depth="3"],
ul.top-menu li.category a[data-depth="4"] {
    font-weight: 300;

    &:hover {
        color: var(--SECONDARY_LIGHTER) !important;
        font-weight: 400;
    }
}

.top-menu a {
    padding: 0
}

@media (max-width: 767.98px) {
    #header.is-open {
        -webkit-box-shadow: none;
        box-shadow: none;
        border-bottom: 0;

        .header-top {
            padding-bottom: 0;
        }
    }

    #mobile_top_menu_wrapper {
        padding-bottom: 0;

        #top-menu {
            margin-bottom: 0;
        }
    }
}



@media (min-width: 768px) and (max-width: 1199.98px) {
    /* Account & cart buttons become icon-only: hide the label text... */
    #header .header-top .header-top-right .user-info .btn span,
    #header .header-top .header-top-right #static_cart .btn span {
        display: none;
    }

    /* ...and zero the icon's right margin (.btn img.svg-icon has margin-right:
       .625rem) so the lone icon sits centered instead of pushed left. */
    #header .header-top .header-top-right .user-info .btn img.svg-icon,
    #header .header-top .header-top-right #static_cart .btn img.svg-icon {
        margin-right: 0;
    }
}

@media (min-width: 768px) {
    #header .header-top .menu {
        padding-left: 0;
    }

    .top-menu a[data-depth="0"] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        font-size: 0.8rem;
    }
}

@media (min-width: 992px) {
    .top-menu a[data-depth="0"] {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        font-size: 0.9rem;
    }
}

@media (min-width: 1200px) {
    .top-menu a[data-depth="0"] {
        padding-left: 0.55rem;
        padding-right: 0.55rem;
        font-size: 1rem;
    }
}

#wrapper {
    overflow-x: clip; /* guard carousel 100vw full-bleed; clip keeps sticky working */
}

#index #wrapper {
    padding: 0;
}

.products-section-title {
    font-size: 1.75em;
}

#footer {
    background-color: #373737;
}

.footer-container {
    padding: 40px 0 10px 0;
    background-color: #373737;

    &, .block-contact {
        color: white;
    }

    & ul li {
        margin-bottom: 10px;
    }

    & a, & ul li a {
        color: white;
        &:hover {
            color: var(--PRIMARY) !important;
        }
    }
}


.footer-container .block-contact-title,
#block_myaccount_infos .title .h3,
.footer-container ul li a,
.footer-container .h3,
.footer-container .links .h3,
.footer-container .links .h4,
.footer-container .block-contact .h3,
.footer-container .collapse-icons .material-icons {
    &, & * {
        font-size: 12px;
        color: var(--PRIMARY) !important;
        font-weight: normal;
    }
}

@media (min-width:768px) {
    .footer-container .block-contact-title,
    #block_myaccount_infos .title .h3,
    .footer-container .h3,
    .footer-container .links .h3,
    .footer-container .links .h4,
    .footer-container .block-contact .h3,
    .footer-container .collapse-icons .material-icons {
        &, & * {
            font-size: 16px;
        }
    }
}

@media (min-width: 960px) {
    .footer-container .block-contact-title,
    #block_myaccount_infos .title .h3,
    .footer-container .h3,
    .footer-container .links .h3,
    .footer-container .links .h4,
    .footer-container .block-contact .h3,
    .footer-container .collapse-icons .material-icons {
        &, & * {
            font-size: 18px;
        }
    }
}

.footer-container .block-contact a {
    white-space: nowrap;
}

.footer-container .block-contact a,
.footer-container .block-contact .material-icons {
    &, & * {
        color: var(--PRIMARY) !important;
        font-weight: normal;
    }
}


.footer-container .links ul {
    background: transparent;
}
.footer-container .links ul > li {
    padding:  0.2rem 1rem;
    border: 0;
}

#contact-infos,
.footer-container .links ul > li a {
    font-size: 11px;
}

@media (min-width:768px) {
    .footer-container .links ul > li {
        padding: 0;
    }

    #contact-infos,
    .footer-container .links ul > li a {
        font-size: 12px;
    }
}

@media (min-width: 960px) {

    #contact-infos,
    .footer-container .links ul > li a {
        font-size: 14px;
    }
}

/*.dropdown:hover .expand-more,*/
.page-my-account #content .links a:hover i,
.search-widget form button[type=submit] .search:hover,
.top-menu .sub-menu a:hover {
    color: var(--SECONDARY) !important;
}

.product-miniature .thumbnail-container:focus .product-description::after,
.product-miniature .thumbnail-container:hover .product-description::after {
    border-color: #a77a6a;
    border-width: 2px;
}

.product-miniature .product-title {
    color: #a77a6a !important;
}

#back-to-top {
    a {
        font-size: 0.75em;
        padding: 0.5em 0.75em;
    }
}

.pagination > div:first-child {
    line-height: 1.1rem;
}

#footer {
	margin: 0;
	padding: 0;
}

.block-category {
    min-height: 0;
    background: white;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.block-category .block-category-inner {
    justify-content: flex-start;
}


#products .page-not-found {
    max-width: 100%;
}

#ubercabinet-categories {
    margin: 30px 0;
}

#ubercabinet-categories .all-categories {
    display: flex;
    flex-flow: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: center;

}

#ubercabinet-categories .all-categories .single-category {
    background: white;
    padding: 30px;
    flex-basis: 25%;
    flex-shrink: 1;
    margin: 30px;
}

#ubercabinet-categories .all-categories .single-category:hover {
    background: #fafafa;
}

#ubercabinet-categories .all-categories .single-category .single-category-title {
    text-align: center;
    border-bottom: var(--PRIMARY) 2px solid;
    margin-bottom: 30px;
}

#ubercabinet-categories .all-categories .single-category .single-category-title h1 {

}

#ubercabinet-categories .all-categories .single-category .single-category-title h1 a {

}

#ubercabinet-categories .all-categories .single-category .single-category-image {

}

#ubercabinet-categories .all-categories .single-category .single-category-image a {

}

#ubercabinet-categories .all-categories .single-category .single-category-image a img {
    height: auto;
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    object-position: center;
}




/* CREATE NEW PROJECT FORM — ORDER HISTORY */
.create-project-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    background: #fafafa;
    border: 1px solid #E8E8E8;
    border-radius: 8px;
}

.create-project-form label {
    margin: 0;
    font-weight: 500;
    color: var(--SECONDARY);
}

.create-project-form input[type="text"] {
    flex: 1 1 220px;
    padding: 0.55rem 0.85rem;
    color: #373737;
    background: #fff;
    border: 1px solid #d6d6d6;
    border-radius: 6px;
}

.create-project-form input[type="text"]:focus {
    outline: none;
    border-color: var(--SECONDARY);
    box-shadow: 0 0 0 3px rgba(49, 76, 61, 0.15);
}

/* NEW CART AND ORDER HISTORY PAGE DESIGN BASE */
.newtable {
    display: flex;
    flex-direction: column;
}

.newrow {
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    background-color: white;
    color: #373737;
    border-bottom: 1px solid #ddd;
}

.newtable .newrow.header {
    background-color: var(--SECONDARY);
    color: var(--PRIMARY);
    font-weight: bold;
}


.newrowtop, .newdetails {
    display: flex;
    width: 100%;
}

.newrowtop > div {
    padding: 10px;
    text-align: left;
    align-content: center;
}

.newrowtop > div:nth-child(1) {
    width: 4%;
}
.newrowtop > div:nth-child(2) {
    width: 20%;
}
.newrowtop > div:nth-child(3) {
    width: 10%;
}
.newrowtop > div:nth-child(4) {
    width: 13%;
}
.newrowtop > div:nth-child(5) {
    width: 21%;
}
.newrowtop > div:nth-child(6) {
    width: 10%;
}
.newrowtop > div:nth-child(7) {
    width: 10%;
}
.newrowtop > div:nth-child(8) {
    width: 10%;
}

.navbar-toggler,
.newrowtop .opendetails.left-toggle,
.quickrow .opencabinetinnerds.left-toggle {

    .svg-container {
        cursor: pointer;
    }

    &:not(.opened) {
        .svg-container {
            &.plus {

            }
            &.minus {
                display: none;
            }
        }
    }

    &.opened {
        .svg-container {
            &.plus {
                display: none;
            }
            &.minus {
            }
        }
    }
}

.newrowtop .opendetails.left-toggle {
    .svg-container {
        width: 20px;
        height: 20px;
    }
}

.quickrow .opencabinetinnerds.left-toggle {
    .svg-container {
        width: 7px;
    }
}

.navbar-toggler {
    .svg-container {
        width: 13px;
        height: 13px;
    }
}

.newdetails {
    display: none;
    border-bottom: 1px solid #ddd;
    flex: 2 1 auto;
}

.newdetails .cartcontent {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
}

.newdetails .cartcontent > div {
    display: flex;
    flex: 2 1 auto;
    align-content: center;
    align-items: center;
}

.newdetails > div {
}

.newrow .newdetails.opened {
    display: flex;
}

.newactions {
    display: flex;
    justify-content: right;
}

.newactions a img,
.newactions span img {
    display: flex;
    cursor: pointer;
    color: black;
    width: 20px;
    height: 20px;
    margin: 0 5px;
    font-size: 20px;
    line-height: 20px;
}

.quickrow {
    display: none;
    flex-direction: row;
    flex-wrap: wrap;
    flex: 2 1 auto;
    justify-content: space-between;
    flex-basis: 100%;
    margin: 0;
    padding: 0;
    background-color: #FAFAFA;
    border-bottom: 1px solid #ddd;
}


.quickrow:last-of-type {
    border-bottom: 0;
}

.quickrow > div:not(.quickrow)  {
    padding: 10px;
    align-content: center;
    align-items: center;
}

.quickrow.opened {
    display: flex;
}

.quickrow.subrow {
    margin-left: 30px;
}

.quickrow.subrow > div:nth-child(3) {
    margin-left: -30px;
}

.quickrow .product-title-block {
    font-size: 14px;
    display: flex;
    align-items: center;
}


.quickrow .product-title-block .frame-wrapper,
.quickrow .product-title-block img.product-image-thumbnail {
    flex-shrink: 0;
}

.quickrow .product-title-block img.product-image-thumbnail {
    width: 50px;
    height: 50px;
    border-radius: 4px;
    margin-right: 10px;
}


.quickrow .product-title-block .frame-wrapper,
.quickrow .edgerow .frame-wrapper {
    margin-right: 10px;
}

.edgesblock {
    display: none;
    padding-left: 100px !important;
}

.edgesblock.opened {
    display: block;
}

.edgerow {
    display: flex;
    margin-bottom: 5px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 12px;
}

.edgerow .edge-image {
    margin-right: 10px;
    width: 40px;
    height: 40px;
}


.quickrow > div:nth-child(1) {
    width: 4%;
    line-height: 0;
    text-align: right;
    font-size: 0;
    padding: 15px 0 15px 15px;
    align-self: center;
    cursor: pointer;
}

.quickrow > div:nth-child(2) {
    width: 60%;
}

.quickrow > div:nth-child(3) {
    width: 25%;
}

.quickrow > div:nth-child(4) {
    width: 10%;
}

.quickrowbreak {
    flex-basis: 100%;
    height: 1px !important;
    padding: 0 !important;
    margin: 0 !important;
}

@media (max-width: 767px) {

    .quickrow > div:nth-child(1) {
        width: 10%;
    }

    .quickrow > div:nth-child(2) {
        width: 90%;
    }

    .quickrow > div:nth-child(3) {
        width: auto;
        flex: 1 1 auto;
        margin-left: 10%;
    }

    .quickrow > div:nth-child(4) {
        width: auto;
        flex: 0 0 auto;
        margin-left: auto;
    }

    .quickrow.subrow > div:nth-child(3) {
        margin-left: 10%;
    }

    .newrowtop .datetime-cell .time-part {
        display: block;
    }

    .newtable .newrow.header {
        display: none;
    }

    .newrowtop {
        flex-wrap: wrap;
        align-items: center;
    }

    .newrowtop > div:nth-child(1) {
        width: auto;
    }

    .newrowtop > div:nth-child(2) {
        width: auto;
        flex: 1 1 auto;
        font-weight: bold;
    }

    .newrowtop > div:nth-child(6) {
        width: auto;
        margin-left: auto;
        text-align: right;
        font-weight: bold;
    }

    .newrowtop > div:nth-child(3),
    .newrowtop > div:nth-child(4),
    .newrowtop > div:nth-child(5) {
        width: 100%;
        flex-basis: 100%;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .newrowtop .datetime-cell .time-part {
        display: inline;
    }

    .newrowtop > div:nth-child(7) {
        display: none;
    }

    .newrowtop > div:nth-child(8) {
        width: 100%;
        flex-basis: 100%;
    }

    .newrowtop > div:nth-child(8) .newactions {
        justify-content: flex-end;
    }

    .newtable {
        margin: 0 -1rem;
    }

    .newtable .newrow {
        margin-bottom: 12px;
        border-radius: 6px;
        overflow: hidden;
    }

    .newtable .newrow[id^="cartrow_order_"] {
        background-color: #f9f9f9;
    }

    .newtable .newrow[id^="cartrow_cart_"] {
        background-color: #fbf6ec;
    }

    .newdetails .cartcontent > h3 {
        padding-left: 10px;
        padding-right: 10px;
    }

    .quickrow .product-title-block {
        font-size: 12px;
    }

    .quickrow.subrow .edgesblock {
        padding-left: 20% !important;
    }

    /* Put the price and the action icons on the same row: price grows to fill the
       left side (left-aligned, larger), the action icons sit at the right. */
    .newrowtop > div:nth-child(6) {
        flex: 1 1 auto;
        margin-left: 0;
        text-align: left;
        font-size: 16px;
    }

    .newrowtop > div:nth-child(8) {
        width: auto;
        flex-basis: auto;
        margin-left: auto;
    }
}


#language_selector,
#language_selector .dropdown,
#language_selector .dropdown .expand-more,
#language_selector .dropdown-menu,
#language_selector .dropdown-menu .dropdown-item,
#language_selector .dropdown-menu .dropdown-item a
{
    color: var(--PRIMARY);
    background: var(--SECONDARY);
}

#language_selector .dropdown-menu .dropdown-item {
    padding: 0.1em 1em;
}

#language_selector .dropdown-menu,
#language_selector .dropdown-menu .dropdown-item,
#language_selector .dropdown-menu .dropdown-item a
{
    font-size: 12px;
}

#static_cart {
    margin-left: 20px;
}


.svg-container {
    position: relative;
    display: inline-block;
    width: auto;
    height: 100%;
    line-height: 0;
    font-size: 0;

    img {
        height: auto;
        width: 100%;
    }
}

.svg-default,
.svg-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.3s ease;
}

.svg-default {
    opacity: 1;
}

.svg-hover {
    opacity: 0;
}

.svg-container:hover .svg-default {
    opacity: 0;
}

.svg-container:hover .svg-hover {
    opacity: 1;
}



/*------------ CATEGORY PAGE / CATEGORY THUMBNAIL BOXES OVERRIDE -----------*/
#subcategories ul.subcategories-list li:hover .subcategory-image {
    animation: productBgAnim ease 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

#subcategories ul.subcategories-list li:hover h5 a {
    animation: productAnim ease 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

#subcategories ul li .subcategory-image {
    padding: 0;
    margin: 0;
}

#subcategories ul.subcategories-list li .subcategory-image a img {
    width: auto;
    height: 150px;
}

#subcategories ul.subcategories-list li .subcategory-image a,
#subcategories ul.subcategories-list li:hover .subcategory-image a {
    margin: 0;
    padding: 0;
    border: 0;
}

.product-prices {
    .current-price {
        font-size: 1rem;
        padding: 1em 2em;
        background: var(--SECONDARY);
        color: var(--PRIMARY)
    }
}

.blockreassurance_product {
    svg {
        path {
            fill: var(--SECONDARY);
        }
    }
}







.frame-wrapper {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 0;
}

.frame-wrapper img.main-image {
    display: block;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: absolute;
    border-radius: 5px;
}

.frame-wrapper .line-svg {
    position: absolute;
}

.line-svg.top {
    top: 4px;
    left: 0;
    width: 100%;
    height: 0;
}

.line-svg.bottom {
    bottom: 4px;
    left: 0;
    width: 100%;
    height: 0;
}

.line-svg.left {
    left: 4px;
    top: 0;
    height: 100%;
    width: 0;
}

.line-svg.right {
    right: 4px;
    top: 0;
    height: 100%;
    width: 0;
}

.line-svg {
    display: block;
    border: 1px solid var(--SECONDARY);
    border-radius: 2px;
    transform: translateZ(0);
    backface-visibility: hidden;
}



body#checkout #cart-summary-product-list {
    background-color: #fafafa;
    border: 1px solid #e8e8e8;

    .new-summary-divider {
        background-color: #E6DACA;
        text-transform: uppercase;
        font-size: 12px;
        padding: 5px 0 5px 3em;
    }

    .new-summary-line {

        display: flex;
        align-items: center;
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
        padding: 10px 0;

        .media-left {
            position: relative;
            padding: 10px 10px 10px 25px;

            img {
                width: 50px;
                height: 50px;
                border-radius: 4px;
            }
        }


        .media-body {
            display: flex;
            align-items: center;

            .product-name {
                flex-basis: 70%;
                font-size: 14px;
                padding: 0 1em;
            }
            .product-pricequantity {
                flex-basis: 30%;
                font-size: 12px;
            }
        }
    }
}

body#checkout section.checkout-step .address-selector {
    align-items: stretch;
}

body#checkout section.checkout-step .address-item {
    background: transparent;
    border: 1px solid #E8E8E8;

    header {
        min-height: auto;
        margin: 0;

        .radio-block {
            width: 100%;
            padding: 40px 20px;
            margin: 0;

            .custom-radio {
                display: none;
            }
        }
    }

    .address-alias {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 1.25em;
    }

    .address {
        margin: 0;
        font-size: 16px;
    }
}

body#checkout section.checkout-step {
    .delivery-options {
        &  > .row {
            border: 0;
        }
        .delivery-option {
            background: #fafafa;

            .carrier-name {
                color: var(--SECONDARY);
            }
        }
    }
}

body#checkout section.checkout-step.-reachable.-complete h1 {
    .done {
        display: none;
    }
    .step-number {
        display: inline-flex;
    }
}

body#checkout section.checkout-step.-complete .step-number {
    background-color: var(--SECONDARY_DARKER);
    color: white;
}


/* SEARCH THINGS */
#search_widget {
    float: none;
}

@media (min-width: 1200px) {
    #search_widget {
        position: absolute;
        right: 0;
    }
}

.search-widgets form input.ui-autocomplete-input {
    padding-left: 40px !important;
}

.searchbar-autocomplete {
    font-family: "Poppins", sans-serif;

    li a {
        padding: 7px 5px !important;
        line-height: 1.1em !important;
    }

    .ui-menu-item,
    .product {
        line-height: 1.1em !important;
        font-size: 14px !important;
    }

    .show-all-results-item {
        border-top: 1px solid #e5e5e5;
    }

    .show-all-results-item a.show-all-results {
        display: flex;
        align-items: center;
        gap: 6px !important;
        padding: 10px 15px !important;
        font-weight: 600;
        color: #333333;
    }

    .show-all-results-item a.show-all-results .material-icons {
        font-size: 18px !important;
    }

    .show-all-results-item a.show-all-results:hover {
        background-color: #F6F6F6;
        cursor: pointer;
    }
}



#block-categories {
    padding: 0;
    margin: 0;
}

/*------------ CATEGORY TREE MOBILE TOGGLE -----------*/
/* The toggle button is hidden on desktop; the tree is always visible there. */
.category-tree-toggle {
    display: none;
}

@media (max-width: 575px) {
    /* Toggle button is always visible on mobile. */
    .category-tree-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 0.75rem 1rem;
        background-color: var(--SECONDARY);
        color: var(--PRIMARY);
        border: none;
        border-radius: 4px;
        font-size: 14px;
        font-weight: 500;
        text-align: left;
        cursor: pointer;
    }

    .category-tree-toggle .material-icons {
        font-size: 20px;
        line-height: 1;
    }

    /* The sidebar menu is hidden by default on mobile. */
    .block-categories .category-top-menu {
        display: none;
    }

    /* Expanded state, shown after clicking the toggle. */
    .block-categories.open .category-top-menu {
        display: block;
        margin-top: 0.75rem;
    }
}


/*------------ CONTACT PAGE — CONTACT FORM FACELIFT -----------*/
/* Scoped to the contact page right-column form only.
   Module: contactform, template views/templates/widget/contactform.tpl.
   .login-form / .form-fields are shared with the authentication page, so
   everything below is scoped under #contact to avoid affecting login. */

#contact .login-form {
    max-width: 640px;
    padding: 1.75rem 2rem;
    background: #fff;
    border: 1px solid #E8E8E8;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}

#contact .login-form header {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--PRIMARY);
}

#contact .login-form header h1 {
    color: var(--SECONDARY);
    margin-bottom: 0.35rem;
}

#contact .login-form header p {
    margin: 0;
    color: #7a7a7a;
    font-size: 0.9375rem;
}

/* Stack fields vertically with consistent spacing */
#contact .login-form .form-fields {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

#contact .login-form .form-fields > label {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
}

#contact .login-form .form-fields > label > span {
    margin-bottom: 0.4rem;
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--SECONDARY);
}

/* Unified control styling */
#contact .login-form select,
#contact .login-form input[type="email"],
#contact .login-form input[type="file"],
#contact .login-form textarea {
    width: 100%;
    padding: 0.65rem 0.85rem;
    font-size: 0.9375rem;
    color: #373737;
    background-color: #fff;
    border: 1px solid #d6d6d6;
    border-radius: 6px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#contact .login-form textarea {
    min-height: 130px;
    resize: vertical;
}

#contact .login-form input[type="file"] {
    padding: 0.5rem 0.85rem;
    background-color: #fafafa;
    cursor: pointer;
}

/* Focus state using the theme accent */
#contact .login-form select:focus,
#contact .login-form input[type="email"]:focus,
#contact .login-form input[type="file"]:focus,
#contact .login-form textarea:focus {
    outline: none;
    border-color: var(--SECONDARY);
    box-shadow: 0 0 0 3px rgba(49, 76, 61, 0.15);
}

/* Footer + submit button (live template renders a class-less <button>,
   which is why it falls back to the ugly browser-default gray) */
#contact .login-form .form-footer {
    margin-top: 1.5rem;
    display: flex;
    justify-content: flex-end;
}

#contact .login-form .form-footer button[type="submit"] {
    min-width: 160px;
    padding: 0.7rem 2rem;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--PRIMARY);
    background-color: var(--SECONDARY);
    border: 1px solid var(--SECONDARY);
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

#contact .login-form .form-footer button[type="submit"]:hover,
#contact .login-form .form-footer button[type="submit"]:focus {
    color: #fff;
    background-color: var(--SECONDARY_DARKER);
    border-color: var(--SECONDARY_DARKER);
    outline: none;
}

/* Notification (success / error) messages */
#contact .login-form .notification {
    padding: 0.85rem 1rem;
    margin-bottom: 1.25rem;
    border-radius: 6px;
    font-size: 0.9375rem;
}

#contact .login-form .notification ul {
    margin: 0;
    padding-left: 1.1rem;
}

#contact .login-form .notification-success {
    color: var(--SECONDARY_DARKER);
    background-color: #eaf3ee;
    border: 1px solid var(--SECONDARY_LIGHTER);
}

#contact .login-form .notification-error {
    color: #8a1f1f;
    background-color: #fdecec;
    border: 1px solid #e2b4b4;
}

@media (max-width: 575px) {
    #contact .login-form {
        padding: 1.25rem 1rem;
    }

    #contact .login-form .form-footer button[type="submit"] {
        width: 100%;
    }
}

#contact .contact-rich .icon {
    margin-bottom: 15px;

    i {

        font-size: 2rem;
        color: var(--SECONDARY);
    }
}

.carousel .carousel-item .caption h2,
.carousel .carousel-item .caption .caption-description {
    text-shadow: 2px 2px 5px rgba(0,0,0,0.7);
}

@media (max-width: 991px) {
    .carousel {
        padding-bottom: 0;
    }

    .carousel .carousel-item figure {
        position: relative;
        display: block;
    }

    .carousel .carousel-item figure::after {
        content: "";
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        height: 60%;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 100%);
        pointer-events: none;
    }

    .carousel .carousel-item .caption {
        position: absolute;
        right: 1.5rem;
        bottom: 1.5rem;
        left: 1.5rem;
        z-index: 1;
        max-width: none;
        margin: 0;
        text-align: left;
        color: #fff;
    }

    .carousel .carousel-item .caption .display-1 {
        font-size: 1.75rem;
        font-weight: 700;
        color: #fff;
    }

    .carousel .carousel-item .caption .caption-description,
    .carousel .carousel-item .caption .caption-description ul {
        color: #fff;
    }

    .carousel .carousel-item .caption .caption-description h3 {
        font-size: 1rem;
        font-weight: 600;
    }
}

@media (max-width: 767px) {
    .carousel .carousel-item .caption {
        right: 3rem;
        bottom: 3rem;
        left: 3rem;

        * {
            color: white !important;
        }
    }


    .carousel .carousel-item figure {
        background: black;
    }

    .carousel .carousel-item img {
        opacity: 0.5;
    }

    .carousel .carousel-item .caption .display-1 {
        font-size: 1.3rem;
    }

    .carousel .carousel-item .caption .caption-description h3 {
        font-size: 0.9rem;
    }

    .carousel .carousel-item .caption .caption-description p,
    .carousel .carousel-item .caption .caption-description ul {
        font-size: 0.8rem;
    }
}

/* Make ps_socialfollow social icons look the same on mobile as on desktop */
@media (max-width: 991px) {
    .block-social {
        text-align: right;
    }
}

@media (max-width: 767px) {
    .block-social ul {
        display: flex;
        -ms-flex-flow: nowrap;
        flex-flow: nowrap;
    }

    .block-social ul li {
        width: 2.5rem;
        height: 2.5rem;
        margin: .125rem;
        background-size: auto;
    }
}

.footer-container .block-social {
    padding: 0;
    margin: 15px 0;

    ul {
        padding: 0;
        margin-bottom: 0;

        li {
            padding: 0;
            margin-bottom: 0;
        }
    }
}


/*------------ AUTHENTICATION PAGE — 2 COLUMN LAYOUT -----------*/
.page-authentication #content, .page-registration #content {
    max-width: 100%;
    padding: 0;
    margin: 0;
}

.auth-columns {
    align-items: stretch;
}

.auth-col-register {
    display: flex;
}

.register-teaser {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    padding: 2rem;
    background: #fafafa;
    border: 1px solid #E8E8E8;
    border-radius: 8px;
}

.register-teaser-title {
    color: var(--SECONDARY);
    margin-bottom: 1rem;
}

.register-teaser-text {
    color: #7a7a7a;
    font-size: 0.9375rem;
    margin-bottom: 1.5rem;
}

/* Below lg: stack in source order (login on top, register below) */
@media (max-width: 991.98px) {
    .auth-col-register {
        margin-top: 1.5rem;
    }
}
