@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

:root {
    --color-gray-0: #181818;
    --color-gray-1: #222222;
    --color-gray-2: #2b2b2b;

    --color-whity: #F5F5F5;
    --color-whity-dark: #e9e9e9;

    --color-warn: #ff1a68;
}

.product-list-title {
    font-size: 140%;
    margin-bottom: 0;
}

.brands-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.brands-filters a {
    margin-top: 10px;
    display: inline-flex;
    border: 1px solid #565656;
    padding: 5px;
    align-items: center;
    margin-right: 10px;
}

.brands-filters a.selected {
    border-color: #e63360!important;
    border-width: 3px;
}

.brands-filters a img {
    height: 40px;
}

@media  (max-width: 576px) {
    .product-list-title {
        font-size: 120%;
        padding-left: 15px;
    }

    .product-list-no-result {
        padding-left: 15px;
    }

}

/*

xx 1599 - 1500
xl 1199 - 1140
lg 991  - 960
md 767  - 720
sm 575  - 540
xs 575  > 0

@media screen and (max-width: 1599px) {}
@media screen and (max-width: 1199px) {}
@media screen and (max-width: 991px) {}
@media screen and (max-width: 767px) {}
@media screen and (max-width: 575px) {}

*/

.render-crisp {
    image-rendering: -moz-crisp-edges;          /* Firefox */
    image-rendering: -o-crisp-edges;            /* Opera */
    image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;   /* IE (non-standard property) */
}
.render-pixelated {
    image-rendering: pixelated;
}
.render-transform {
    -webkit-backface-visibility: hidden;
    -ms-transform: translateZ(0);               /* IE 9 */
    -webkit-transform: translateZ(0);           /* Chrome, Safari, Opera */
    transform: translateZ(0);
}

.text-uppercase     { text-transform: uppercase }
.text-lowercase     { text-transform: lowercase }
.text-capitalize    { text-transform: capitalize}

.margin-center { margin: 0px auto }
.blank { cursor: pointer; }

.text-justify { text-align: justify; }
.text-bold { font-weight: 600; }

.hidden-input {
    margin: 0px;
    padding: 0px;
    width: 10px;
    height: 10px;
    pointer-events: none;
    visibility: hidden;
    position: fixed;
    top: -10px;
    left: -10px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  SPACEING   ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.space-bot-xs { margin-bottom: 20px; }
.space-bot-sm { margin-bottom: 40px; }
.space-bot-md { margin-bottom: 60px; }
.space-bot-lg { margin-bottom: 80px; }
.space-bot-xl { margin-bottom: 100px;}
.space-bot-xx { margin-bottom: 140px;}

.space-inner-bot-xs { padding-bottom: 20px; }
.space-inner-bot-sm { padding-bottom: 40px; }
.space-inner-bot-md { padding-bottom: 60px; }
.space-inner-bot-lg { padding-bottom: 80px; }
.space-inner-bot-xl { padding-bottom: 100px;}
.space-inner-bot-xx { padding-bottom: 140px;}

.space-top-xs { margin-top: 20px; }
.space-top-sm { margin-top: 40px; }
.space-top-md { margin-top: 60px; }
.space-top-lg { margin-top: 80px; }
.space-top-xl { margin-top: 100px;}
.space-top-xx { margin-top: 140px;}

.space-inner-top-xs { padding-top: 20px; }
.space-inner-top-sm { padding-top: 40px; }
.space-inner-top-md { padding-top: 60px; }
.space-inner-top-lg { padding-top: 80px; }
.space-inner-top-xl { padding-top: 100px;}
.space-inner-top-xx { padding-top: 140px;}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # [  BOOTSTRAP-CONTAINER  ] # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.container {
    padding-left: 0px;
    padding-right: 0px;
    /* width: 1500px !important; */
}

.container-padding {padding-left: 15px; padding-right: 15px}

.container-full { margin: 0px; width: 100%; }
.container-max { margin: 0px auto; max-width: 1980px; }
.container-max-fill { min-width: calc((100% - 1980px) / 2) }

@media screen and (max-width: 1920px) {
    .container-max-fill { width: 0px; }
}

/*
@media screen and (min-width: 1600px) { .container {max-width: 1500px;} }
*/
@media screen and (min-width: 1600px) { .container { max-width: 1500px !important;} }


/*
.container-margin-left, .container-margin-right {
    margin-left: calc((100% - 1500px) / 2);
}
*/

.container-fill {
    min-width: calc((100% - 1500px) / 2);
}

@media screen and (max-width: 1599px) {
    .container-fill {min-width: calc((100% - 1140px) / 2)}
}
@media screen and (max-width: 1199px) {
    .container-fill {min-width: calc((100% - 960px) / 2)}
}
@media screen and (max-width: 991px) {
    .container-fill {min-width: calc((100% - 720px) / 2)}
}
@media screen and (max-width: 767px) {
    .container-fill {min-width: calc((100% - 540px) / 2)}
}
@media screen and (max-width: 575px) {
    .container-fill {min-width: 0px}
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # [  FLEX - FRAME   ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.flex-frame-row-start   { display: flex; flex-direction: row; justify-content: flex-start; align-items: unset; }
.flex-frame-row-center  { display: flex; flex-direction: row; justify-content: center;     align-items: unset; }
.flex-frame-row-end     { display: flex; flex-direction: row; justify-content: flex-end;   align-items: unset; }

.flex-frame-column-start    { display: flex; flex-direction: column; justify-content: unset; align-items: flex-start; }
.flex-frame-column-center   { display: flex; flex-direction: column; justify-content: unset; align-items: center;     }
.flex-frame-column-end      { display: flex; flex-direction: column; justify-content: unset; align-items: flex-end;   }

.flex-frame-row-start>*     { margin: 0px; margin-right: 10px; }
.flex-frame-row-center>*    { margin: 0px; margin-left: 5px; margin-right: 5px; }
.flex-frame-row-end>*       { margin: 0px; margin-left: 10px; }

.flex-frame-column-start>*,
.flex-frame-column-center>*,
.flex-frame-column-end>*
{ margin: 0px; margin-bottom: 10px; }

.flex-clear-margin>* { margin: 0px; }
.flex-grow { flex-grow: 1; }

@media screen and (max-width: 1199px) {
    .flex-frame-row-start-xl   { display: flex; flex-direction: row; justify-content: flex-start; align-items: unset; }
    .flex-frame-row-center-xl  { display: flex; flex-direction: row; justify-content: center;     align-items: unset; }
    .flex-frame-row-end-xl     { display: flex; flex-direction: row; justify-content: flex-end;   align-items: unset; }

    .flex-frame-column-start-xl    { display: flex; flex-direction: column; justify-content: unset; align-items: flex-start; }
    .flex-frame-column-center-xl   { display: flex; flex-direction: column; justify-content: unset; align-items: center;     }
    .flex-frame-column-end-xl      { display: flex; flex-direction: column; justify-content: unset; align-items: flex-end;   }

    .flex-frame-row-start-xl>*     { margin: 0px; margin-right: 10px; }
    .flex-frame-row-center-xl>*    { margin: 0px; margin-left: 5px; margin-right: 5px; }
    .flex-frame-row-end-xl>*       { margin: 0px; margin-left: 10px; }

    .flex-frame-column-start-xl>*,
    .flex-frame-column-center-xl>*,
    .flex-frame-column-end-xl>*
    { margin: 0px; margin-bottom: 10px; }
}
@media screen and (max-width: 991px) {
    .flex-frame-row-start-lg   { display: flex; flex-direction: row; justify-content: flex-start; align-items: unset; }
    .flex-frame-row-center-lg  { display: flex; flex-direction: row; justify-content: center;     align-items: unset; }
    .flex-frame-row-end-lg     { display: flex; flex-direction: row; justify-content: flex-end;   align-items: unset; }

    .flex-frame-column-start-lg    { display: flex; flex-direction: column; justify-content: unset; align-items: flex-start; }
    .flex-frame-column-center-lg   { display: flex; flex-direction: column; justify-content: unset; align-items: center;     }
    .flex-frame-column-end-lg      { display: flex; flex-direction: column; justify-content: unset; align-items: flex-end;   }

    .flex-frame-row-start-lg>*     { margin: 0px; margin-right: 10px; }
    .flex-frame-row-center-lg>*    { margin: 0px; margin-left: 5px; margin-right: 5px; }
    .flex-frame-row-end-lg>*       { margin: 0px; margin-left: 10px; }

    .flex-frame-column-start-lg>*,
    .flex-frame-column-center-lg>*,
    .flex-frame-column-end-lg>*
    { margin: 0px; margin-bottom: 10px; }
}
@media screen and (max-width: 767px) {
    .flex-frame-row-start-md   { display: flex; flex-direction: row; justify-content: flex-start; align-items: unset; }
    .flex-frame-row-center-md  { display: flex; flex-direction: row; justify-content: center;     align-items: unset; }
    .flex-frame-row-end-md     { display: flex; flex-direction: row; justify-content: flex-end;   align-items: unset; }

    .flex-frame-column-start-md    { display: flex; flex-direction: column; justify-content: unset; align-items: flex-start; }
    .flex-frame-column-center-md   { display: flex; flex-direction: column; justify-content: unset; align-items: center;     }
    .flex-frame-column-end-md      { display: flex; flex-direction: column; justify-content: unset; align-items: flex-end;   }

    .flex-frame-row-start-md>*     { margin: 0px; margin-right: 10px; }
    .flex-frame-row-center-md>*    { margin: 0px; margin-left: 5px; margin-right: 5px; }
    .flex-frame-row-end-md>*       { margin: 0px; margin-left: 10px; }

    .flex-frame-column-start-md>*,
    .flex-frame-column-center-md>*,
    .flex-frame-column-end-md>*
    { margin: 0px; margin-bottom: 10px; }
}
@media screen and (max-width: 575px) {
    .flex-frame-row-start-sm   { display: flex; flex-direction: row; justify-content: flex-start; align-items: unset; }
    .flex-frame-row-center-sm  { display: flex; flex-direction: row; justify-content: center;     align-items: unset; }
    .flex-frame-row-end-sm     { display: flex; flex-direction: row; justify-content: flex-end;   align-items: unset; }

    .flex-frame-column-start-sm    { display: flex; flex-direction: column; justify-content: unset; align-items: flex-start; }
    .flex-frame-column-center-sm   { display: flex; flex-direction: column; justify-content: unset; align-items: center;     }
    .flex-frame-column-end-sm      { display: flex; flex-direction: column; justify-content: unset; align-items: flex-end;   }

    .flex-frame-row-start-sm>*     { margin: 0px; margin-right: 10px; }
    .flex-frame-row-center-sm>*    { margin: 0px; margin-left: 5px; margin-right: 5px; }
    .flex-frame-row-end-sm>*       { margin: 0px; margin-left: 10px; }

    .flex-frame-column-start-sm>*,
    .flex-frame-column-center-sm>*,
    .flex-frame-column-end-sm>*
    { margin: 0px; margin-bottom: 10px; }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  IMAGE-FRAME  ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.image-frame {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    height: 0px;
    padding-bottom: 100%;
}
.image-frame img {
    pointer-events: none;
    object-fit: cover;
    position: absolute;
    width: 100%;
    height: 100%;
}

.image-frame.image-frame-contain img {
    object-fit: contain;
}

.image-frame.image-frame-4x1    { padding-bottom: 25%;    }
.image-frame.image-frame-2x1    { padding-bottom: 50%;    }
.image-frame.image-frame-16x9   { padding-bottom: 56.25%; }
.image-frame.image-frame-4x3    { padding-bottom: 75%;    }
.image-frame.image-frame-3x2    { padding-bottom: 66.66%; }
.image-frame.image-frame-8x5    { padding-bottom: 62.5%;  }

.image-frame.image-frame-4x1-t    { padding-bottom: 400%;    }
.image-frame.image-frame-2x1-t    { padding-bottom: 200%;    }
.image-frame.image-frame-16x9-t   { padding-bottom: 177.77%; }
.image-frame.image-frame-4x3-t    { padding-bottom: 133.33%; }
.image-frame.image-frame-3x2-t    { padding-bottom: 150%;    }
.image-frame.image-frame-8x5-t    { padding-bottom: 160%;    }

.image-frame.image-frame-hover img {
    transition: 0.75s transform;
}
.image-frame.image-frame-hover:hover img {
    transform: scale(1.1);
}


:root {
    --frontend-color-white-0:       #FFFEFC;
    --frontend-color-white-1:       #FAF8F5;
    --frontend-color-white-2:       #F2EFEB;

    --frontend-color-gray-0:        #DEDAD6;
    --frontend-color-gray-1:        #CECBC7;

    --frontend-color-black:         #0F0E0D;

    --frontend-color-blacky:        #171614;
    --frontend-color-blacky-light:  #2d2d2a;
    --frontend-color-blacky-white: #494743;
}

*:not(i) {
    font-family: 'Poppins', sans-serif;
}

/* :: Brand Fashion :: */

.image-frame.image-frame-2x1-t {
    padding-bottom: 180%;
}

/* :: MOBILE :: */

body .header .header-body .m-menu .close-bar {
    display: none;
}
@media screen and (max-width: 1199px) {
    body.mobile-menu-open {
        overflow: hidden;
    }
    body.mobile-menu-open .header .header-body .m-menu .bar {
        display: none;
    }
    body.mobile-menu-open .header .header-body .m-menu .close-bar {
        display: unset;
    }
}


/* :: Header :: */

.header {
    z-index: 2200;

    position: sticky;
    top: 0px; left: 0px;
    width: 100%;
    height: 100px;
    background-color: #fff;
    transition: 0.2s height;

    border-bottom: 1px solid var(--color-gray-0);
}
.header.down {
    height: 50px;
}
.header .header-body .brand img {
    transition:
            0.2s width,
            0.2s height,
            0.2s max-width,
            0.2s max-height;
}
.header.down .header-body .brand img {
    max-width: 80px;
}

.header .header-body {
    display: flex;
    align-items: center;
    height: 100%;

    padding-left: 30px;
    padding-right: 30px;
}

.header .header-body .brand {
    display: flex;
}
.header .header-body .options {
    display: flex;
    margin-left: 30px;
}
.header .header-body .empty {
    flex-grow: 1;
}
.header .header-body .icons {
    display: flex;
    margin-right: 30px;
}
.header .header-body .user {
    display: flex;
}
.header .header-body .user .bttn-link-bold:first-child {
    border-right: 1px solid var(--color-whity);
}

/* cart BLOB */

.header .header-body .icons .cart-blob-holder {
    position: relative;
}
.header .header-body .icons .cart-blob-holder > .cart-blob {

    position: absolute;

    background-color: var(--color-warn);
    color: white;

    font-size: 0.6em;
    width: 20px;
    height: 20px;
    border-radius: 50%;

    text-align: center;
    line-height: 20px;

    font-weight: 600;

    top: 29px;
    right: 6px;
}

.header .header-body .icons .cart-blob-holder > .cart-blob.active {
    display: block;
}

/* */
.header .header-body .m-menu {
    display: none;
}
.header .header-body .user.m-user {
    display: flex;
}
.bttn-icon.m-user-icon {
    display: none;
}

@media screen and (max-width: 1199px) {
    .header {
        height: 50px;
    }
    .header .header-body .icons {
        margin-right: 0px;
    }
    .bttn-icon.m-user-icon {
        display: flex;
    }
    .header .header-body .user.m-user {
        display: none;
    }
}

@media screen and (max-width: 1199px) { /* 991px */
    .header .header-body .m-menu {
        display: block;
    }
    .header .header-body .options {
        display: none;
    }
    .header .header-body .empty {
        display: none;
    }
    .header .header-body .brand {
        flex-grow: 1;
        justify-content: flex-start;
        margin: 0px 30px;
    }
}

/* BRAND LOGO */
.header .header-body .brand {
    cursor: pointer;
}
.header .header-body .brand img {
    max-width: 120px;
    object-fit: contain;
}
@media screen and (max-width: 1199px) { /* 991px */
    .header .header-body .brand img {
        max-width: 80px;
    }
}

/* HEADER INFO */

.header .header-info {
    cursor: default;

    background-color: var(--color-gray-0);
    opacity: 1;
    transition: 0.2s opacity;
}
.header .header-info .header-info-body {
    padding: 0px 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    position: relative;
    background-color: #e63360;
}
.header .header-info .header-info-body p {
    padding: 0px;
    margin: 0px;
    font-weight: 500;
    line-height: 40px;
}
.header .header-info .header-info-body i {
    line-height: 40px;
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 0px 10px;
    margin-right: 30px;
    cursor: pointer;
}
@media screen and (max-width: 1199px) { /* 991px */
    .header .header-info .header-info-body {
        justify-content: flex-start;
    }
    body.mobile-menu-open .header .header-info {
        pointer-events: none;
        opacity: 0;
    }
}
.header .header-info.close-info {
    pointer-events: none;
    opacity: 0;
}

/* MOBILE MENU */
.mobile-menu {
    z-index: 2000;

    background-color: white;

    display: flex;
    position: fixed;
    top: 0px; left: -100%;
    width: 100%;
    height: 100vh;

    transition:
            0.2s left;
}
@media screen and (max-width: 1199px) { /* 991px */
    body.mobile-menu-open .mobile-menu {
        left: 0px;
    }
}


/* HEADER OPTION HOVER */

.header .header-body .options .bttn-link {
    position: relative;
}

/* // FOR CSS EDITION // */
.header .header-body .options .bttn-link:hover .option-hover {
    z-index: 2300;
    opacity: 1;
    pointer-events: unset;
}
/* // FOR JS EDITION // */
.option-hover.show {
    pointer-events: unset;
    opacity: 1;
}

.option-hover {
    cursor: default;

    pointer-events: none;
    opacity: 0;

    position: absolute;

    display: flex;

    top: 100%;
    left: 0px;

    background-color: #fff;
    transition: 0.2s opacity;

    border: 1px solid var(--color-gray-0);
    transform: translateY(-1px);
}
.option-hover .sub {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 0px;
}
.option-hover .sub a {
    cursor: pointer;

    color: #000;
    padding: 10px 30px;
}
.option-hover .sub a:hover {
    color: #000;
}
.option-hover .photo {
    width: 200px;
    height: auto;
}
.option-hover .photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  MOBILE-M   ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.mobile-menu {
    justify-content: flex-start;
    align-items: start;
    flex-direction: column;

    /*
    padding: 50px;
    padding-top: 100px;
    */

    background-color: var(--color-whity-dark);

    padding-top: 50px;

    overflow-y: auto;
}

.mobile-menu .cats {
    display: flex;
    flex-wrap: wrap;

    width: 100%;

    padding: 50px;
    padding-top: 50px;

    /*
    border-bottom: 1px solid var(--color-gray-0);
    */
    background-color: white;
}

.mobile-menu .cats.cats-footer {
    background-color: unset;
}

.mobile-menu .cats .cat-block {
    display: flex;
    flex-direction: column;
    width: 33.33%;
}

@media screen and (max-width: 991px) {
    .mobile-menu .cats .cat-block {
        width: 50%;
    }
}
@media screen and (max-width: 575px) {
    .mobile-menu .cats .cat-block {
        width: 100%;
    }
}

.mobile-menu .main,
.mobile-menu .sub {
    cursor: pointer;
}

.mobile-menu .main {
    color: var(--color-gray-0);
    font-weight: 600;
    font-size: 1.2em;

    padding-bottom: 20px;
    padding-top: 10px;
}
.mobile-menu .sub {
    color: var(--color-gray-0);
    font-weight: 300;
    font-size: 1em;

    padding-bottom: 20px;
    padding-left: 20px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  FOOTER   ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.footer {
    background-color: var(--color-whity);
    width: 100%;
}

.footer .bottom {
    width: 100%;
    background-color: var(--color-gray-0);
    padding: 10px 0px;
}

.footer .bottom .container {
    display: flex;
    justify-content: space-between;
    align-items: center;

    color: white;
}
.footer .bottom .container p {
    margin: 0px;
    padding: 0px;
    font-size: 0.8em;
}
.footer .bottom .container > div {
    cursor: pointer;
    display: flex;
    align-items: center;
}
.footer .bottom .container > div > img {
    margin-left: 10px;
}

@media screen and (max-width: 575px) {
    .footer .bottom .container { flex-direction: column }
}


.footer .top {
    width: 100%;
    padding-bottom: 30px;
    padding-top: 40px;
}
.footer .top .container {
    display: flex;
    flex-wrap: wrap;
}
.footer .top .container .footer-block > p {
    font-weight: 500;
    font-size: 1.1em;
    margin: 0px;
    padding: 0px;
    margin-bottom: 20px;
}
.footer .top .container .footer-block > a {
    display: block;
    padding: 4px 0px;
    color: black;
    font-weight: 300;
}


.footer .top .container .footer-block {
    padding-top: 60px;
    width: 25%;
}
.footer .top .container .footer-block .logo {
    width: 100%;
}

.footer .top .container .footer-block .logo.brand {
    padding: 0px 30px;
    padding-right: 60px;
}

.footer .top .container .footer-block .logo.l0 {
    margin: 20px 0px;
    padding: 0px 20px;
}

@media screen and (max-width: 991px) {
    .footer .top .container .footer-block {
        text-align: center;
    }

    .footer .top .container .footer-block {
        width: 50%;
    }

    .footer .top .container .footer-block.o0 {order: 2}
    .footer .top .container .footer-block.o1 {order: 0}
    .footer .top .container .footer-block.o2 {order: 1}
    .footer .top .container .footer-block.o3 {order: 3}

    .footer .top .container .footer-block .logo.brand {
        padding: 0px 30px;
    }

    .footer .top .container .footer-block .logo.l0 {
        padding: 0px 30px;
        padding-right: 60px;
    }
}

@media screen and (max-width: 767px) {
    .footer .top .container .footer-block {
        width: 100%;
    }
    .footer .top .container .footer-block.o0 {order: 3}
    .footer .top .container .footer-block.o1 {order: 0}
    .footer .top .container .footer-block.o2 {order: 1}
    .footer .top .container .footer-block.o3 {order: 2}

    .footer .top .container .footer-block .logo.l0 {
        margin-top: 60px;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  SUBSCRIBE  ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.subscribe {
    width: 100%;
    background-color: var(--color-whity-dark);
}
.subscribe .container {
    width: 100%;
    display: flex;
    flex-wrap: wrap;

    padding: 40px 0px;

}
.subscribe .container .text p,h3 {
    margin: 0px; padding: 0px;
}
.subscribe .container .text p {
    margin-bottom: 36px;
}
.subscribe .container .text h3 {
    font-weight: 600;
    font-size: 2.6em;
}
.subscribe .container .text {
    width: 25%;
}

.subscribe .content {
    width: 75%;
    display: flex;
    flex-wrap: wrap;

    margin-top: 60px;
}
.subscribe .content .input-filed {
    width: 700px;
    margin-right: 10px;
}
.subscribe .content .input-check {
    margin-top: 10px;
    width: 75%;
}

@media screen and (max-width: 1599px) {
    .subscribe .container .text h3 {
        font-weight: 600;
        font-size: 2.2em;
    }
}

@media screen and (max-width: 1199px) {
    .subscribe .container .text h3 {
        font-weight: 600;
        font-size: 1.8em;
    }
    .subscribe .content .input-filed {
        width: 500px;
    }
}

@media screen and (max-width: 991px) {
    .subscribe .content .input-filed {
        flex-grow: 1;
        width: auto;
        margin-right: 0px;
    }
    .subscribe .content .input-check {
        width: 100%;
    }
    .subscribe .content {
        margin-top: 10px;
        width: 100%;
    }
    .subscribe .container .text {
        width: 100%;
    }
    .subscribe .container .text p {
        margin-bottom: 10px;
    }

    .subscribe .container {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  TITLE  ] # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.title {}
.title > p {
    padding: 0px;
    margin: 0px;
}
.title > p:first-child {
    font-size: 1.4em;
    font-weight: 600;
}

.title > p:last-child {
    margin-bottom: 10px;
}

.title.center > p {
    width: 100%;
    text-align: center;
}

.title.small > p:first-child { font-size: 1.1em; }

@media screen and (max-width: 575px) {
    .title {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # [  product-recommender  ] # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.product-recommender {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.product-recommender > div {
    cursor: pointer;
}
.product-recommender > div img {
    transform: scale(1);
    transition: 1s transform;
}
.product-recommender > div:hover img {
    transform: scale(1.05);
}

@media screen and (max-width: 991px) {
    .product-recommender {
        grid-template-columns: repeat(2, 1fr);
    }
}

.product-recommender > div > .image-frame {
    margin-bottom: 10px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  product-scope  ] # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.product-scope {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

/*
@media screen and (max-width: 991px) {
    .product-scope {
        grid-template-columns: repeat(2, 1fr);
    }
}
*/

.product-scope > div > .image-frame {
    margin-bottom: 10px;
}

.product-scope .product-tile {
    padding: 5px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  product-list ] # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.product-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}
.product-list > .product-tile {
    width: calc(25% - 5px);
}

@media screen and (max-width: 991px) {
    .product-list > .product-tile {
        width: calc(50% - 5px);
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  product-tile   ] # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.product-tile {
    position: relative;
}

.product-tile img {
    transform: scale(1);
    transition: 1s transform;
}

/*
.product-tile:hover img {
    transform: scale(1.05);
}
*/
.product-tile .hover_a { display: unset; }
.product-tile .hover_b { display: none; }
.product-tile:hover .hover_a { display: none; }
.product-tile:hover .hover_b { display: unset; }



.product-tile .product-text > p,
.product-tile .product-text .name > p {
    margin: 0px; padding: 0px;
    word-break: break-word;
}
.product-tile .product-text {
    display: flex;
    flex-wrap: wrap;

    margin-top: 5px;
}
.product-tile .product-text .price-a {
    font-weight: 500;
    margin-right: 10px;
}
.product-tile .product-text .price-b {
    margin-right: 10px;
    text-decoration: line-through;
}
.product-tile .product-text .discount {
    padding-left: 14px;
    padding-right: 14px;
    background-color: var(--color-warn);
    color: white;
}
.product-tile .product-text .name {
    width: 100%;
    display: flex;
}
.product-tile .product-text .name p:first-child {
    font-weight: 600;
    margin-right: 5px;

    padding-right: 5px;
    border-right: 1px solid var(--color-gray-2);
}
.product-tile .product-text .name p:last-child {

    border-right: unset;
}

.product-tile .open-handler {
    cursor: pointer;
    position: absolute;
    width: 100%;
    height: calc(100% - 50px);
    top: 50px; left: 0px;
}
.product-tile .like-handler {
    cursor: pointer;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0px; right: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.product-tile .like-handler:hover i {
    color: var(--color-warn);
}
.product-tile .like-handler i {
    font-size: 1.4em;
}

@media screen and (max-width: 767px) {

    .product-tile .product-text .price-a {font-size: 1em;}
    .product-tile .product-text .price-b {font-size: 0.8em;}
    .product-tile .product-text .discount {font-size: 1em;}

    .product-tile .product-text .name p:first-child {font-size: 0.8em;}
    .product-tile .product-text .name p:last-child {font-size: 0.8em;}
}

@media screen and (max-width: 575px) {
    .product-tile .product-text {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  INFO-BLOCK   ] # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.info-block {
    background-color: #2b2b2b;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;

    width: 100%;

    padding: 30px;
}
.info-block > p {
    color: white;
}
.info-block .top {
    font-size: 0.9em;
    font-weight: 300;
    width: 100%;
}
.info-block .gap {
    flex-grow: 1;
}
.info-block .content {
    font-size: 2.4em;
    font-weight: 600;
    padding: 9px;
}
.info-block .bttn-holder {
    padding-bottom: 20px;
}

@media screen and (max-width: 1599px) {
    .info-block .content {
        font-size: 2em;
    }
}

@media screen and (max-width: 1199px) {
    .info-block .content {
        font-size: 1.8em;
        padding: 9px;
    }
}

@media screen and (max-width: 575px) {
    .info-block .top {
        text-align: center;
    }
    .info-block {
        padding-left: 0px;
        padding-right: 0px;
    }
}


/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  INFO-KEP   ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.info-kep {
    display: flex;
    flex-wrap: wrap;
}
.info-kep > div:first-child {
    width: 25%;
}
.info-kep > div:last-child {
    width: 75%;
}

@media screen and (max-width: 991px) {
    .info-kep > div:first-child {
        width: 50%;
    }
    .info-kep > div:last-child {
        width: 50%;
    }
}
@media screen and (max-width: 767px) {
    .info-kep > div:first-child {
        width: 100%;
    }
    .info-kep > div:last-child {
        width: 100%;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  SWITCH-BOX   ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.switch-box .container {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 0px;
}

@media screen and (max-width: 991px) {
    .switch-box .container {
        grid-template-columns: repeat(2, 1fr);
    }
    .switch-box .container .product-tile .image-frame {
        padding-bottom: 200%;
    }

    .switch-box .container > div:nth-child(1) {order: 1;}
    .switch-box .container > div:nth-child(2) {order: 2;}
    .switch-box .container > div:nth-child(3) {order: 4;}
    .switch-box .container > div:nth-child(4) {order: 3;}

    .switch-box.no-swap .container > div:nth-child(3),
    .switch-box.no-swap .container > div:nth-child(4) {
        display: none;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  BLOG-BOX   ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.blog-box .container {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 0px;
}

@media screen and (max-width: 991px) {
    .blog-box .container {
        grid-template-columns: repeat(2, 1fr);
    }
    .blog-box .container .product-tile .image-frame {
        padding-bottom: 200%;
    }

    .blog-box .container > div:nth-child(1) {order: 1;}
    .blog-box .container > div:nth-child(2) {order: 2;}
    .blog-box .container > div:nth-child(3) {order: 4;}
    .blog-box .container > div:nth-child(4) {order: 3;}

    .blog-box .container > div:nth-child(3),
    .blog-box .container > div:nth-child(4) {
        display: none;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  BLOG-TILE   ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.blog-tile {
    cursor: pointer;
}
.blog-tile .title {
    padding: 20px;
    padding-bottom: 0px;
    font-weight: 600;
}
.blog-tile .lead {
    padding: 20px;
    padding-top: 10px;
    font-size: 0.8em;
    line-height: 1.8em;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  BREAD - C  ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.bread-crumb {
    display: flex;
    justify-content: flex-start;
    align-items: center;

    color: #8c8c8c;
    font-weight: 300;
}
.bread-crumb > i {
    line-height: 30px;
    transform: translateY(-2px);
}
.bread-crumb > p:first-child {
    padding-left: 0px;
}
.bread-crumb > p {
    line-height: 30px;
    cursor: pointer;
    padding: 0px 10px ; margin: 0px;

    transition: 0.2s color;
}
.bread-crumb > p:hover {
    color: #2b2b2b;
}

@media screen and (max-width: 575px) {
    .bread-crumb {
        padding-right: 10px;
        padding-left: 10px;
    }
}

/* ~ BreadCrumb 2 ~ */

.bread-crumb-2 {
    width: 100%;
}
.bread-crumb-2 > a {
    line-height: 23px;
    font-weight: 300;
    color: gray;
}
.bread-crumb-2 > a > img {
    opacity: 1;
    display: inline-block;
    width: 20px; height: 20px;
    margin-right: 10px;
    object-fit: contain;
    transform: translateY(4px);
    cursor: pointer;
    transition:
            0.3s opacity;
}

.bread-crumb-2 > a:hover {
    color: #2b2b2b;;
    text-decoration: unset;
}
.bread-crumb-2 > a:hover > img {
    opacity: 0.65;
}

.bread-crumb-2 > i {
    color: gray;
    padding: 0px 10px;
}

.bread-crumb-2 .icon {
    display: inline-flex;
    white-space: nowrap;
    align-items: baseline;
}

@media screen and (max-width: 991px) {
    .bread-crumb-2 {
        font-size: 0.8em;
    }
    .bread-crumb-2 > a > img {
        width: 16px; height: 16px;
        margin-right: 6px;
        transform: translateY(2px);
    }
    .bread-crumb-2 > i {
        padding: 0px 6px;
    }
}
@media screen and (max-width: 575px) {
    .bread-crumb-2 {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  BRAND-SELECTOR   ] # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.brand-selector .brand-page {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.brand-button {
    background-color: var(--color-whity);
    border: unset;
    display: inline-block;
    width: 100%;
    margin: 0px 0px;
    padding: 40px 0px;
    font-weight: 600;
}

@media screen and (max-width: 991px) {
    .brand-selector .brand-page {
        grid-template-columns: repeat(2, 1fr);
    }
}

/*
slick-prev slick-arrow
slick-next slick-arrow
*/

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  PRODUCT  ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.product-layout {
    display: flex;
    flex-wrap: wrap;
}
.product-layout p {
    margin: 0px; padding: 0px;
}
.product-layout .block-photo,
.product-layout .block-content,
.product-layout .block-details {
    width: 33.33%;
}

/* block-content */

.product-layout .block-content {
    background-color: var(--color-whity);
    overflow: hidden;
    padding: 20px;
}

.product-layout .block-content h1 {
    font-size: 2em;
}
.product-layout .block-content .meta {
    display: flex;
    align-items: center;
}
.product-layout .block-content .meta .stock {
    background-color: var(--color-gray-0);
    color: white;
    padding: 2px 16px;
    margin: 0px;
    margin-right: 10px;
}
.product-layout .block-content .meta .stock.off {
    background-color: var(--color-warn);
}
.product-layout .block-content .option-attr {
    margin-top: 50px; /* ATTR */
    margin-bottom: 20px;
}
.product-layout .block-content .option-attr > p {
    font-weight: 600;
    font-size: 0.9em;
    margin-bottom: 10px;
}
.product-layout .block-content .option-attr .option-list {
    display: flex;
}
.product-layout .block-content .option-attr .option-list .option {
    cursor: pointer;
    width: auto;
    min-width: 40px;
    padding-left: 5px; padding-right: 5px;
    height: 40px;
    outline: 1px solid var(--color-gray-0);
    outline-offset: -1px;
    display: flex; justify-content: center; align-items: center;
    margin-right: 10px;

    transition: 0.2s opacity;
}
.product-layout .block-content .option-attr .option-list .option.unavailable {
    opacity: 0.3 !important;
    pointer-events: none !important;
    background-image: url("/web/photo/unavailable.svg");
}
.product-layout .block-content .option-attr .option-list .option.selected {
    background-color: var(--color-gray-0);;
    color: white;
}

.product-layout .block-content .option-attr .option-list .option:hover {
    background-color: var(--color-gray-0);;
    color: white;
}

.product-layout .block-content .quantity-and-price {
    display: flex;
    margin-top: 50px; /* ATTR */
}
.product-layout .block-content .quantity-and-price > div:first-child {
    width: 50%;
}
.product-layout .block-content .quantity-and-price > div:last-child {
    width: 50%;
}

.product-layout .block-content .quantity-and-price .quantity-attr > p:first-child {
    font-weight: 600;
    font-size: 0.9em;
    margin-bottom: 10px;

    width: 100%;
}

.product-layout .block-content .quantity-and-price .quantity-attr .product-amount-frame {
    display: flex;
    width: 100%;
    max-width: 120px;
    height: 40px;
    justify-content: center;
    align-items: center;
}
.product-layout .block-content .quantity-and-price .quantity-attr .product-amount-frame > p {
    width: 40px;
    height: 40px;
    border: 1px solid var(--color-gray-0);
    display: flex;
    justify-content: center;
    align-items: center;
}
.product-layout .block-content .quantity-and-price .quantity-attr .product-amount-frame .amount_display {
    border-left: unset;
    border-right: unset;
}
.product-layout .block-content .quantity-and-price .quantity-attr .product-amount-frame .amount_minus,
.product-layout .block-content .quantity-and-price .quantity-attr .product-amount-frame .amount_plus {
    cursor: pointer;
}

.product-layout .block-content .quantity-and-price > div:last-child {}
.product-layout .block-content .quantity-and-price > div:last-child .price-a {
    font-weight: 600;
    font-size: 2em;
}
.product-layout .block-content .quantity-and-price > div:last-child .price-b {
    font-weight: 400;
    font-size: 0.9em;
}
.product-layout .block-content .quantity-and-price > div:last-child .price-b b {
    text-decoration: line-through;
}
.product-layout .block-content .quantity-and-price > div:last-child .price-b span {
    text-decoration: unset;
    background-color: var(--color-warn);
    color: white;
    padding: 0px 10px;
    margin-left: 5px;
}
.product-layout .block-content .quantity-and-price > div:last-child .price-vat {
    font-weight: 300;
}

.product-layout .block-content .product-buttons {
    width: 100%; display: flex; justify-content: center;
    margin-top: 80px;
}
.product-layout .block-content .product-buttons .product-button {}
.product-layout .block-content .product-buttons .product-button .add-to-cart {
    padding: 0px 26px;
    background-color: var(--color-warn);
    color: white;
}
.product-layout .block-content .product-buttons .product-button .add-to-cart:hover {
    background-color: #ff3d7f;
    color: white;
}


/* block-details */

.product-layout .block-details {
    background-color: var(--color-whity-dark);
    overflow: auto;
    padding: 20px;
    padding-bottom: 40px;
}
.product-layout .block-details .brand {
    cursor: pointer;
    width: 140px;
    height: 60px;
    object-fit: contain;
}
.product-layout .block-details .detail-block {
    margin-top: 40px;
}
.product-layout .block-details .detail-block .title {
    font-weight: 800;
    margin-bottom: 10px;
}
.product-layout .block-details .detail-block .content {
    font-weight: 400;
    margin-bottom: 10px;
    line-height: 1.8em;
    font-size: 0.9em;
}
.product-layout .block-details .detail-block .button-holder {
    width: 100%;
    display: flex; justify-content: center;
}

/* block-photo */

.product-layout .block-photo {}
.product-layout .block-photo {}

/* product layout mobile */

.product-layout { max-height: 799.9px; }
.product-layout .block-photo { max-height: 799.9px; }
.product-layout .block-content { max-height: 799.9px; }
.product-layout .block-details { max-height: 799.9px; }

@media screen and (max-width: 1599px) {
    .product-layout { max-height: 759.9px; }
    .product-layout .block-photo { max-height: 759.9px; }
    .product-layout .block-content { max-height: 759.9px; }
    .product-layout .block-details { max-height: 759.9px; }
}

@media screen and (max-width: 1199px) {
    .product-layout { max-height: unset }
    .product-layout .block-photo { max-height: unset }
    .product-layout .block-content { max-height: unset }
    .product-layout .block-details { max-height: unset }

    .product-layout .block-photo { width: 50% }
    .product-layout .block-content { width: 50% }
    .product-layout .block-details { width: 100% }
}
@media screen and (max-width: 767px) {
    .product-layout .block-photo { width: 100% }
    .product-layout .block-content { width: 100% }
    .product-layout .block-details { width: 100% }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # [  product-photo-slider   ] # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.product-photo-slider {
    width: 100%;
}
.product-photo-slider .image-frame {
    padding: unset;
    height: 799.9px;
}
@media screen and (max-width: 1599px) {
    .product-photo-slider .image-frame { height: 759.9px }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  PRODUCTS   ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.products-header {
    display: flex; align-items: center;
    justify-content: space-between;

    /*
    padding: 10px;
    background-color: var(--color-whity-dark);
    */
}

.products-header.sticky {
    position: fixed;
    width: 100%;
    left: 0px;
    top: 100px;

    z-index: 10;

    flex-direction: column;
    align-items: flex-start;

}
.products-header.sticky > .bttn {
    margin-top: 10px;
    order: 1;
}
.products-header.sticky .filter-block {
    background-color: var(--filter-color-black);
    padding-left: 14px;

    order: 0;
}
.products-header.sticky .filter-block > p {
    color: white;
}

@media screen and (max-width: 575px) {
    .products-header {
        padding-right:10px; padding-left: 10px;
    }
}

.products-header .filter-block {
    display: flex;
    align-items: center;
}
.products-header .filter-block > p {
    margin: 0px;
    padding: 0px;
    margin-right: 10px;
}
.products-header .filter-block .input-select {
    width: 160px;
}

.products-layout {
    margin-top: 20px;

    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px 10px;
}

@media screen and (max-width: 1199px) { .products-layout { grid-template-columns: repeat(3, 1fr) } }
@media screen and (max-width: 767px) { .products-layout { grid-template-columns: repeat(2, 1fr) } }

.products-layout .not-found {
    width: 100%;
    text-align: center;
    font-weight: 600;
    font-size: 1.2em;

    color: var(--color-gray-0);

    margin-top: 80px;
    margin-bottom: 40px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # [  HEADER-SLIDER  ] # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.head-slid {
    height: 780px;
    width: 100%;
    position: relative;
    overflow: hidden;
    display: flex;

    justify-content: center;
    align-items: center;
    text-align: center;
}
.head-slid img {
    pointer-events: none;
    position: absolute;
    object-fit: contain;
}
.head-slid .content {
    z-index: 1000;

    display: flex;
    justify-content: center;

    height: 460px;
    width: 100%;
}
.head-slid .content .body {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
}

.head-slid .content .body p,
.head-slid .content .body h1,
.head-slid .content .body h2 {
    color: white;
}

.head-slid .content .body p {
    font-size: 1.2em;
}
.head-slid .content .body h1,
.head-slid .content .body h2 {
    font-size: 2.8em;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: start;

    text-shadow: 2px 2px 10px rgb(0 0 0 / 18%);
}

.head-slid > .slider-pag {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    display: flex;
    justify-content: center;
}
.head-slid > .slider-pag > p {
    margin: 0px;
    width: 18px; height: 18px;
    border-radius: 9px;
    border: 2px solid white;
    margin: 12px 4px;
    cursor: pointer;
}
.head-slid > .slider-pag > p.active {
    background-color: white;
}

@media screen and (max-width: 991px) {
    .head-slid .content .body h1,
    .head-slid .content .body h2 {
        text-align: center;
    }
    .head-slid .content .body {
        align-content: center;
        align-items: center;
    }
}


@media screen and (max-width: 575px) {
    .head-slid .content .body {
        padding-right: 10px;
        padding-left: 10px;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # [  BLOG   ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.blog-list-menu {
    display: flex;
}
.blog-list-menu .blog-categories {
    display: flex;
}
.blog-list-menu .blog-categories p {
    margin-left: 10px;
}

.blog-list-frame {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px 10px;
}

@media screen and (max-width: 1199px) {
    .blog-list-frame {
        grid-template-columns: repeat(2, 1fr);
    }
}


.related-blog-post {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px 10px;
}

@media screen and (max-width: 1199px) {
    .related-blog-post {
        grid-template-columns: repeat(2, 1fr);
    }
}

.blog-post-layout .blog-info i {
    margin-right: 10px;
}
.blog-post-layout .blog-info {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.blog-post-layout .blog-title {
    margin-bottom: 40px;
}

.blog-post-layout .blog-lead {
    margin: 30px 0px;
}

.blog-post-layout .without-image {
    display: flex;
    justify-content: space-between;
}
.blog-post-layout .without-image .blog-title {
    margin-bottom: 10px;
}

@media screen and (max-width: 1199px) {
    .blog-post-layout .without-image {
        flex-direction: column;
    }
    .blog-post-layout .blog-info {
        margin-bottom: 0px;
    }
}

@media screen and (max-width: 575px) {
    .blog-post-layout {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  PAGINATOR  ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.slick-track {
    width: 100%!important;;
}

.slick-track a {
    width: 100%!important;;
}

.paginator-container {
    width: 100%;
    display: flex;
    justify-content: center;
}
.paginator-container .paginator {
    display: flex;
    align-items: center;
}
.paginator-container .paginator  p {
    cursor: pointer;
    padding: 10px 16px;
    height: 40px;
}

.paginator-container .paginator p:hover {
    background-color: var(--color-gray-0);
    color: white;
}

.paginator-container .paginato  p.selected {
    background-color: var(--color-gray-0);
    color: white;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # [  BUTTON   ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.bttn-icon {
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size: 1.3em;
}

.bttn-link {
    padding: 12px;
    border: unset;
    background-color: unset;
    height: 50px;
    margin: 0px;

    transition:
            0.2s background-color,
            0.2s color;
}

.bttn-link:hover {
    background-color: var(--color-gray-0);
    color: white;
}

.bttn-link-bold {
    padding: 6px 12px;
    border: unset;
    background-color: unset;
    font-weight: 600;
}

.bttn {
    height: 40px;
    padding: 0px 16px;
    font-weight: 500;
    border: unset;
    outline: 1px solid #00000000;
    outline-offset: -1px;
    color: var(--color-gray-0);
    background-color: white;
    transition:
            0.2s color,
            0.2s background-color;
}
.bttn:hover {
    color: white;
    background-color: var(--color-gray-0);
}
.bttn.black {
    color: white;
    background-color: var(--color-gray-0);
}

.bttn.black:hover {
    color: var(--color-gray-0);
    background-color: white;
}

@media screen and (max-width: 767px) {
    .bttn {
        font-size: 0.9em;
    }
}

.bttn.outline {
    background-color: #00000000;
    outline: 1px solid black;
    outline-offset: -1px;
}
.bttn:hover.outline {
    /* color: var(--color-gray-1);
    outline-color: var(--color-gray-1); */
    color: black;
    background-color: #fff;
}

.bttn.small {
    height: 26px;
    padding: 0px 10px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  INPUT - FIELD  ] # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.input-filed {
    width: 100%;
    height: 40px;
}
.input-filed input {
    width: 100%;
    height: 100%;
    border: unset;

    padding-left: 10px;

    outline: 1px solid #00000000;
    outline-offset: -1px;

    transition: 0.2s outline-color;
}
.input-filed input:focus {
    outline-color: var(--color-gray-0);
}
.input-filed.icon { position: relative; }
.input-filed.icon input {
    padding-left: 40px;
}
.input-filed.icon > i {
    position: absolute;
    top: 0px;
    left: 15px;
    line-height: 40px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # [  INPUT - CHECK  ] # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.input-check {
    display: flex;
}
.input-check > input {
    cursor: pointer;
    margin: 0px 10px;
    margin-top: 5px;
}
.input-check > p {
    font-size: 0.8em;
}
.input-check > p > b {
    cursor: pointer;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # [  INPUT - SELECTOR   ] # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.input-select {
    position: relative;
    width: 100%;
    height: 40px;
}
.input-select select {
    cursor: pointer !important;

    width: 100%;
    height: 40px;

    padding: 0px 10px;

    border: unset;

    outline: 1px solid var(--color-gray-0);
    outline-offset: -1px;

    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';

    transition: 0.2s outline-color;
}
.input-select > i {
    position: absolute;
    line-height: 40px;
    top: 0px;
    right: 10px;
}

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # [  STATIC PAGE  ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # [  FIX   ] # # # # # # # # # # # # # # # # # */
/* # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # */

.bttn.add-to-cart {
    position: relative;
}
.bttn.add-to-cart p {
    display: inline-block;
    margin: 0px;
}
.bttn.add-to-cart .spinner-border {
    display: none;
    margin-bottom: 3px;
}

.bttn.add-to-cart.loading {
    pointer-events: none;
}
.bttn.add-to-cart.loading .spinner-border {
    position: absolute;
    display: inline-block;
    left: 50%;
    top: 31%;
}
.bttn.add-to-cart.loading > p {
    opacity: 0;
}




div.modal-window {visibility:hidden;position: fixed;left: 0;top: 0;width: 100%;height: 100%;overflow-y: auto;z-index: 50000000000;}
div.modal-window.shown {visibility: visible;}
div.modal-window div.modal-bg {opacity:0;background-color: rgb(11 45 65 / 59%);position: fixed;left: 0;top: 0;width: 100%;height: 100%;transition: 0.3s;}
div.modal-window.shown div.modal-bg {
    opacity: 1;
}
div.modal-window div.modal-window-content {display: flex;/* align-items: center; */justify-content: center;position: absolute;left: 0;top: 0;width: 100%;/* height: 100%; *//* overflow-y: auto; */transform: scale(0.9);opacity: 0;transition: 0.3s;}
div.modal-window.shown div.modal-window-content {opacity: 1; transform: scale(1);}
div.modal-window div.modal-window-content div.modal-box {background-color: #ECEFF3;width: 500px;position: relative;box-sizing: border-box;max-width: calc(100% - 30px);/* max-height: calc(100% - 30px); */margin-top: 90px;box-shadow: 1px 1px 26px #00000014;border-radius: 18px;}
div.modal-window div.modal-window-content.slim div.modal-box {width: 360px;}
div.modal-window div.modal-window-content.wider div.modal-box {width: 600px;}
div.modal-window div.modal-window-content.editor-wide div.modal-box {width: 850px;}
div.modal-window div.modal-window-content.phone-selector div.modal-box {width: 750px;}
div.modal-window div.modal-window-content.editor-wide div.modal-box .modal-box-content {
    padding: 0;
}
div.modal-window div.modal-window-content div.modal-box .modal-box-header {

    display: flex;

    align-items: center;

    padding: 21px 24px;

    /* border-bottom: 1px solid #000; */

    padding-bottom: 0;
}
div.modal-window div.modal-window-content div.modal-box .modal-box-header .modal-title {

    width: 100%;
}
div.modal-window div.modal-window-content div.modal-box .modal-box-header .modal-title .back {
    font-size: 70%;
    display: flex;
}
div.modal-window div.modal-window-content div.modal-box .modal-box-header .modal-title .back > span {
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #3E6DA1;
}
div.modal-window div.modal-window-content div.modal-box .modal-box-header .modal-title .back > span img {
    width: 8px;
    margin-right: 4px;
}
div.modal-window div.modal-window-content div.modal-box .modal-box-header .modal-close {

    flex-shrink: 0;

    display: flex;

    cursor: pointer;

    width: 37px;

    height: 37px;

    position: absolute;

    right: -11px;

    top: -13px;

    background-color: #fff;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 1px 1px 11px rgba(0, 0, 0, 0.25);
}
div.modal-window div.modal-window-content div.modal-box .modal-box-header .modal-close img {

    cursor: pointer;

    width: 14px;
}
div.modal-window div.modal-window-content div.modal-box .modal-box-content {padding: 24px;}
div.modal-window div.modal-window-content.phone-selector div.modal-box .modal-box-content {
    padding: 0;
}
div.modal-window div.modal-window-content div.modal-box div.close-modal {position: absolute;right: 0;top: -35px;opacity: 0.75;cursor: pointer;/* z-index: 500000000; */}
div.modal-window div.modal-window-content div.modal-box div.close-modal img {width: 20px;cursor: pointer;}
div.modal-window div.modal-window-content div.modal-box div.modal-title {font-family: 'DM Sans';color: #000;font-weight: 900;/* text-transform: uppercase; */justify-content: center;/* align-items: center; */font-size: 145%;text-align: center;}
div.modal-window div.modal-window-content div.modal-box div.modal-instructions {font-size: 90%;margin-bottom: 16px;}
div.modal-window div.modal-window-content.slim div.modal-box div.modal-instructions {text-align: center;}
div.modal-window div.modal-window-content div.modal-box div.modal-instructions .fake-link {
    color: #3e6da1;
    cursor: pointer;
    font-weight: 600;
}
div.modal-window div.modal-window-content div.modal-box form {  }
div.modal-window form .input-row.error {  }
div.modal-window form .input-row.error label {  }
div.modal-window form .input-row.error div.input-box {  }
div.modal-window form .input-row.error div.input-box input {border: 1px solid #e71c1a;}
div.modal-window form .input-row.error div.input-box textarea {border: 1px solid #e71c1a;}
div.modal-window form.checkout-form .input-row.error input {border: 1px solid #e71c1a!important;}
div.modal-window form.checkout-form .input-row.error textarea {border: 1px solid #e71c1a!important;}
div.modal-window form .input-row.error .error-message {display: block;width: 100%;}
div.modal-window form .input-row {margin-bottom: 24px;position: relative;}
div.modal-window form:not(.checkout-form) .input-row label {/* display: block; */width: 100%;font-size: 81%;margin-bottom: 9px;font-weight: 500;display: none;position: absolute;left: 14px;top: 7px;pointer-events: none;/* width: 100%; */}
div.modal-window form .input-row label.with-right-content {display: flex;align-items: center;}
div.modal-window form .input-row label.with-right-content .left {width: 50%;display: none;}
div.modal-window form .input-row label.with-right-content .right {width: 50%;display: flex;justify-content: right;font-weight: 600;color: #3e6da1;}
div.modal-window form .input-row label.with-right-content .right > a {  }
div.modal-window form .input-row div.input-box {  }
div.modal-window form .input-row div.input-box input[type="text"],
div.modal-window form .input-row div.input-box input[type="password"]{
    font-family: 'DM Sans';
    display: block;
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    border: none;
    outline: none;
    padding: 13px;
    color: #363636;
    border: 1px solid #00000000;
    border-radius: 8px;
}
div.modal-window form .input-row div.input-box input[type="text"]:focus,
div.modal-window form .input-row div.input-box input[type="password"]:focus {
    border: 1px solid #873CFF;
}
div.modal-window form .input-row.error div.input-box input[type="text"],
div.modal-window form .input-row.error div.input-box input[type="password"] {
    border: 1px solid #e71c1a;
}
div.modal-window form .input-row div.input-box textarea{font-family: 'DM Sans';display: block;width: 100%;box-sizing: border-box;background-color: transparent;border: none;outline: none;padding: 13px;color: #363636;border: 1px solid #000;}


div.modal-window form .input-row .error-message {color: #bf0e0d;font-weight: 500;font-size: 85%;margin-top: 8px;display: none;width: 100%;}
div.modal-window form .input-row.checkbox-row {display: flex;flex-wrap: wrap;align-items: center;}
div.modal-window form .input-row.checkbox-row .checkbox {width: 30px;/* display: flex; *//* align-items: flex-start; */}
div.modal-window form .input-row.checkbox-row .checkbox input {  }
div.modal-window form .input-row.checkbox-row .text {font-size: 81%;width: calc(100% - 30px);}
div.modal-window form .input-row.checkbox-row .text a {font-weight: 500; text-decoration: underline;}
div.modal-window form .input-row.checkbox-row .text a:hover { text-decoration: none;}
div.modal-window form div.modal-button-row {display: flex;justify-content: space-around;}
div.modal-window form div.modal-button-row button {padding: 13px 20px;color: #ffffff;font-size: 94%;font-weight: 600;border: none;border: 1px solid #873CFF;outline: none;cursor: pointer;width: calc(50% - 7.5px);transition: 0.25s;width: 100%;display: flex;align-items: center;justify-content: center;/* text-transform: uppercase; */background-color: #873CFF;/* letter-spacing: 2px; */border-radius: 8px;}
div.modal-window form div.modal-button-row button:hover {
    background-color: transparent;
    color: #873CFF;
}
div.modal-window form div.modal-button-row button.secondary {
    background-color: transparent;
    color: #196694;
    border: 1px solid #196694;
}
div.modal-window form div.modal-button-row.yes-no button:first-child {
    margin-right: 7.5px;
}

div.modal-window form div.modal-button-row.yes-no button:last-child {
    margin-left: 7.5px;
}
div.modal-window form div.button-row {display: flex;justify-content: flex-end;margin-top: 24px;}
div.modal-window form div.button-row button {display: inline-block;padding: 13px 20px;text-transform: uppercase;color: #ffffff;font-size: 80%;font-weight: 500;background-color: #000;border: none;outline: none;cursor: pointer;/* width: 100%; */box-sizing: border-box;letter-spacing: 2px;transition: 0.25s;}
div.modal-window div.modal-window-content div.modal-box div.modal-footer {margin-top: 21px;text-align: center;font-size: 92%;justify-content: center;}
div.modal-window div.modal-window-content div.modal-box div.modal-footer .fake-link {cursor:pointer;/* color: #3e6da1; */font-weight: 600;text-decoration: underline;}
div.modal-window form .forgot-pass-row {
    margin-bottom: 24px;
    text-align: right;
}
div.modal-window form .forgot-pass-row a {
    text-decoration: underline;
    font-weight: 600;
    font-size: 92%;
}
div.modal-window form .forgot-pass-row a:hover {
    text-decoration: none;
}
div.modal-window form .input-row select {
    font-family: 'DM Sans';display: block;width: 100%;box-sizing: border-box;background-color: #F1F1F1;border: none;outline: none;border-radius: 7px;padding: 13px;color: #363636;border: 1px solid #F1F1F1;
}

div.modal-window form .half-column {
    display: flex;
}

div.modal-window form .half-column .column-1 {
    width: 50%;
    margin-right: 10px;
}
div.modal-window form .half-column .column-2 {
    width: 50%;
    margin-left: 10px;
}


div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content {  }
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form {display: flex;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left {background-color: #ffffff;padding: 21px 27px;flex-shrink: 0;width: 181px;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand.selected {}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand.selected span.text {font-weight: 600;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand.selected span.checkmark {display: inline;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand.selected span.checkmark img {  }
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand {margin-bottom: 15px;cursor: pointer;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand span.text {text-transform: uppercase;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand span.checkmark {margin-left: 8px;display: none;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.left div.brand span.checkmark img {  }
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right {width: 100%;padding: 21px 27px;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models {display: flex;flex-wrap: wrap;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models div.model {width: 50%;padding-right: 11px;margin-bottom: 15px;cursor: pointer;display: none;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models div.model.shown {
    display: block;
}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models div.model span.text {text-transform: uppercase;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models div.model.selected span.text {font-weight: 600;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models div.model span.checkmark {margin-left: 8px;display: none;}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models div.model.selected span.checkmark {

    display: inline;
}
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.models div.model span.checkmark img {  }
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.button-row {  }
div.modal-window div.modal-window-content.phone-selector div.modal-box div.modal-box-content form div.right div.button-row button {  }


.profile-modal-items {

    margin-bottom: 20px;
}

.profile-modal-items.no-bottom {
    margin-bottom: 0;
}

.profile-modal-items.no-last-item-padding .item:last-child {
    padding-bottom: 0;
}

.profile-modal-items .item {
    display: flex;
    align-items: center;
    width: 100%;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    padding: 15px 0;
}

.profile-modal-items .item .key {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 60%;
}

.profile-modal-items .item .key .date {
    opacity: 0.5;
    font-size: 85%;
    width: 100%;
    margin-top: 5px;
    display: inline-flex;
}

.profile-modal-items .item .value {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.profile-modal-items .item .value .rang {
    display: inline-flex;
    background-color: #dcdcdc;
    color: #000;
    border-radius: 50px;
    padding: 4px 7px;
    margin-right: 5px;
    font-size: 80%;
}

.profile-modal-items .item .value .status {
    display: flex;
    background-color: #000;
    color: #fff;
    font-size: 80%;
    padding: 5px 8px;
    /* overflow: hidden; */
    /* text-overflow: ellipsis; */
}

.profile-modal-items .item .key .nr {
    width: 17px;
    height: 17px;
    background-color: #000;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
    border-radius: 50%;
    font-size: 60%;
}

.profile-modal-items .item:last-child {
    border-bottom: none;
}
.profile-modal-items .item:first-child {
    padding-top: 0;
}
.profile-modal-items .item.clickable {
    cursor: pointer;
}


div.modal-window form .input-row.fancy-placeholder {

}


div.modal-window form .input-row.fancy-placeholder.has-text label {

    display: block;
}

div.modal-window form .input-row.fancy-placeholder.has-text input {
    transition: 0.2s;
    padding-top: 22px!important;
}

div.modal-window form .input-row.fancy-placeholder.has-text {

}

/* CHECKOUT */

body.checkout-body > header {

}

body.checkout-body > header .checkout-header-content {
    display: flex;
}

body.checkout-body > header .checkout-header-content .logo {
    width: 50%;
    display: flex;
    align-items: center;
}

body.checkout-body > header .checkout-header-content .logo a {
    display: flex;
    align-items: center;
}

body.checkout-body > header .checkout-header-content .logo img {
    width: 175px;
}

body.checkout-body > header .checkout-header-content .back-to-shop {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

body.checkout-body > header .checkout-header-content .back-to-shop a {
    display: inline-flex;
    align-items: center;
    /* width: 100%; */
}

body.checkout-body > header .checkout-header-content .back-to-shop a .icon {
    display: flex;
    align-items: center;
    margin-right: 6px;
    flex-shrink: 0;
}
body.checkout-body > header .checkout-header-content .back-to-shop a .icon img {
    width: 17px;
}
body.checkout-body > header .checkout-header-content .back-to-shop a .text {
    /* text-transform: uppercase; */
    /* letter-spacing: 2px; */
    font-size: 90%;
    width: 100%;
    font-weight: 500;
}

.checkout-content .order-info-table {

}

.checkout-content .order-info-table .row:first-child {
    padding-top: 0;
}

.checkout-content .order-info-table .row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    padding: 10px 0;
    font-size: 90%;
}

.checkout-content .order-info-table .status {
    display: flex;
    background-color: #e9e9e9;
    /* color: #fff; */
    font-size: 80%;
    padding: 5px 8px;
    border-radius: 49px;

}

.checkout-content .checkout-success-btn {
    background-color: #873CFF;
    color: #fff;
    /* text-transform: uppercase; */
    font-size: 90%;
    letter-spaceing: 2px;
    padding: 6px 11px;
    /* display: flex; */
    display: inline-flex;
    border-radius: 50px;
    font-weight: 600;
}

.checkout-content .order-info-table .row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.checkout-content {
    background-color: #F9FAFB;
    overflow: hidden;
}

.checkout-summary-and-form {
    display: flex;
    position: relative;
}

.checkout-summary-and-form .extra-div {
    background-color: #eaeced;
    position: absolute;
    left: 100%;
    top: 0;
    width: 50000px;
    height: 100%;
}

.checkout-summary-and-form .products-summary {
    order: 2;
    width: 50%;
    padding-left: 30px;
    background-color: #eaeced;
    padding-right: 30px;
    padding-top: 50px;
    border-top-left-radius: 26px;
    border-bottom-left-radius: 26px;
}
.checkout-summary-and-form .checkout-form {
    width: 50%;
    order: 1;
    padding-right: 30px;
    padding-top: 50px;
}
.checkout-summary-and-form .checkout-form > form {
    width: 100%;
}

.checkout-summary-and-form input[type="text"],
.checkout-summary-and-form input[type="email"],
.checkout-summary-and-form input[type="tel"],
.checkout-summary-and-form input[type="number"],
.checkout-summary-and-form textarea,
.checkout-summary-and-form select{
    background-color: #fff!important;
    border: 1px solid #fff;
    border-radius: 0!important;
    border-radius: 5px!important;
}
.checkout-summary-and-form input[type="checkbox"] {
    border-radius: 0!important;
    border: 1px solid #00000042 !important;
    /*
    background-color: transparent;

     */
    border-radius: 4px!important;
}
.checkout-summary-and-form h2,
.checkout-summary-and-form fieldset legend {
    font-family: 'DM Sans';
    /* text-transform: uppercase; */
    font-weight: 900;
    font-size: 120%;
    color: #111827;
}

.checkout-summary-and-form .method-checkmark {
    position: absolute;
    right: 0;
    top: 0;
    background-color: #3E6DA1;
    width: 22px;
    height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
    display: none!important;
}
.checkout-summary-and-form .method-checkmark img {
    width: 11px;
}
.checkout-summary-and-form .border-3 {
    border-width: 3px;
}

.checkout-summary-and-form .border-gray-half {
    border-color: rgb(0 0 0 / 10%) !important;
}

.checkout-summary-and-form .input-row .error-message {
    color: #bf0e0d;
    font-weight: 500;
}
.checkout-summary-and-form .input-row.error .error-message {
    display: block;
}

.checkout-summary-and-form .input-row.error input[type="text"],
.checkout-summary-and-form .input-row.error input[type="email"],
.checkout-summary-and-form .input-row.error input[type="tel"],
.checkout-summary-and-form .input-row.error input[type="number"],
.checkout-summary-and-form .input-row.error textarea,
.checkout-summary-and-form .input-row.error select {
    border-color: #bf0e0d!important;
}

.checkout-summary-and-form .checkout-button {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    /* letter-spacing: 2px; */
    /* text-transform: uppercase; */
    background-color: #873CFF;
    border: 1px solid #873CFF;
    color: #fff;
    font-size: 101%;
    padding: 15px;
    border-radius: 8px;
}
.checkout-summary-and-form .checkout-button:hover {
    background-color: transparent;
    color: #873CFF;
}

.checkout-summary-and-form [data-add-coupon] {

    background-color: #873CFF;

    color: #fff;

    font-family: 'DM Sans';

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

    padding: 7px 13px;

    border-radius: 6px;

    font-size: 88%;

    font-weight: 500;

    cursor: pointer;
}

.checkout-summary-and-form [data-method] {
    border-radius: 8px;
    border-color: rgba(0, 0, 0, 0.3);
}

.checkout-summary-and-form [data-border] {
    border-radius: 8px;
    border-width: 2px;
    border-color: #873CFF;
}

.checkout-summary-and-form .input-row.error input[type="email"],
.checkout-summary-and-form .input-row.error input[type="text"],
.checkout-summary-and-form .input-row.error select {
    border-color: #bf0e0d !important;
    border: 1px solid #bf0e0d !important;
}

.checkout-summary-and-form .input-row {
    position: relative;
}

.checkout-summary-and-form .input-row.fancy-placeholder label {
    position: absolute;
    left: 13px;
    top: 5px;
    font-size: 83%;
    pointer-events: none;
    display: none;
    z-index: 1;
}


.checkout-summary-and-form .input-row.fancy-placeholder.has-text label {

    display: block;
}

.checkout-summary-and-form .input-row.fancy-placeholder.has-text input {
    transition: 0.2s;
    padding-top: 22px!important;
}

.checkout-summary-and-form .input-row.fancy-placeholder input:focus {
    border: 1px solid #1C5DB0!important;
}

.checkout-summary-and-form .input-row.fancy-placeholder.has-text {

}


#cart-sidebar {position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 50;visibility: hidden;z-index: 110000000;}
#cart-sidebar.shown {position: fixed;left: 0;top: 0;width: 100%;height: 100%;/* z-index: 110000000; */visibility: visible;}
#cart-sidebar div.bg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: rgb(17 24 39 / 43%);opacity: 0;transition: 0.3s;}
#cart-sidebar.shown div.bg {opacity: 1}
#cart-sidebar div.close-icon {position: absolute;right: 405px;top: 14px;cursor: pointer;opacity: 0;transition: 0.3s;z-index: 2;right: 11px;top: 27px;border: 1px solid #ACACAC;display: flex;width: 30px;height: 30px;border-radius: 50%;display: flex;align-items: center;justify-content: center;}
#cart-sidebar.shown div.close-icon {opacity: 1}
#cart-sidebar div.close-icon img {width: 12px;}
#cart-sidebar div.sidebar {transition: 0.3s;position: absolute;right: -450px;top: 0;height: 100%;/* background-color: #fff; */display: flex;flex-direction: column;width: 450px;/* box-shadow: 1px 1px 19px rgba(0, 0, 0, 0.15); */}
#cart-sidebar.shown div.sidebar {
    right:0;
}
#cart-sidebar div.sidebar div.sidebar-header {/* text-transform: uppercase; */color: #111827;font-weight: 900;padding: 25px;border-bottom: 1px solid #D9D9D9;font-family: 'DM Sans';display: flex;align-items: center;font-size: 146%;background-color: #fff;}
#cart-sidebar div.sidebar div.sidebar-header .badge {

    color: #fff;

    width: 18px;

    height: 18px;

    display: flex;

    align-items: center;

    justify-content: center;

    background-color: #873CFF;

    font-family: 'DM Sans';

    border-radius: 50%;

    font-size: 57%;

    margin-left: 5px;

    position: relative;

    top: -5px;
}
#cart-sidebar div.sidebar div.sidebar-content {height: 100%;overflow-y: auto;background-color: #fff;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products {padding: 17px 0;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product {transition: 0.45s;display: flex;margin-bottom: 22px;align-items: center;padding: 5px 20px;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.photo {width: 78px;background-color: #fff;flex-shrink: 0;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.photo div.photo-container {width: 100%;position: relative;padding-bottom: 100%;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.photo div.photo-container img {position: absolute;left: 0;top: 0;width: 100%;height: 100%;object-fit: contain;border-radius: 9px;/* padding: 5px; */}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.product-name-and-price {font-size: 83%;padding-left: 12px;width: 100%;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.product-name-and-price div.name-row {font-size: 112%;font-weight: 800;margin-bottom: 3px;/* text-transform: uppercase; */}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.product-name-and-price div.desc-row {

    margin-bottom: 5px;

    font-weight: 300;

    display: none;
}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.product-name-and-price div.price-row {display: flex;/* align-items: center; */flex-wrap: wrap;align-items: center;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.product-name-and-price div.price-row span.discount {background-color: #3e6da1;color: #fff;font-weight: 600;/* border-radius: 5px; */font-size: 83%;padding: 2px 3px;margin-right: 4px;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.product-name-and-price div.price-row span.current-price {/* color: #3e6da1; *//* font-weight: 600; */margin-right: 7px;font-weight: 500;/* font-family: 'DM Sans'; */}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product a.product-name-and-price div.price-row span.old-price {font-size: 80%;text-decoration: line-through;opacity: 0.65;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product div.amount {width: 54px;height: 36px;display: flex;/* justify-content: flex-end; */align-items: center;background-color: #F6F6F6;flex-shrink: 0;position: relative;border-radius: 7px;/* padding-right: 17px; */}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product .amount-and-delete {

}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product .amount-and-delete .delete-row {

    text-align: right;

    margin-top: 4px;
}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product .amount-and-delete .delete-row span {

    text-decoration: underline;
    cursor: pointer;
    font-weight: 500;
}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product .amount-and-delete .delete-row span:hover {
    text-decoration: none;
}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product div.amount span.minus {width: 19px;height: 19px;display: flex;justify-content: center;align-items: center;/* background-color: #000000; */color: #fff;/* border-radius: 50%; */cursor: pointer;position: absolute;right: 3px;bottom: 2px;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product div.amount span.nr {width: 26px;text-align: center;font-size: 80%;font-weight: 400;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product div.amount span.plus {width: 19px;height: 19px;display: flex;justify-content: center;align-items: center;/* background-color: #000000; */color: #fff;/* border-radius: 50%; */cursor: pointer;position: absolute;right: 3px;top: 2px;}
#cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product.active {
    background-color: rgb(62 109 161 / 16%);
}
#cart-sidebar div.sidebar div.sidebar-footer {padding: 21px;/* border-top: 1px solid #adadad; */padding-bottom: 20px;background-color: #FAF5F5;}
#cart-sidebar div.sidebar div.sidebar-footer div.total-row {display: flex;margin-bottom: 18px;align-items: center;}
#cart-sidebar div.sidebar div.sidebar-footer div.total-row div.caption {width: 50%;}
#cart-sidebar div.sidebar div.sidebar-footer div.total-row div.value {width: 50%;text-align: right;font-weight: 700;}
#cart-sidebar div.sidebar div.sidebar-footer .two-buttons-row {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}
#cart-sidebar div.sidebar div.sidebar-footer div.button-row {/* margin-bottom: 18px; *//* width: 50%; */width: calc(50% - 10px);}
#cart-sidebar div.sidebar div.sidebar-footer div.button-row a {pointer-events:none;opacity:0.5;display: inline-block;/* border-radius: 70px; */padding: 13px 20px;/* text-transform: uppercase; */color: #ffffff;font-size: 93%;font-weight: 500;background-color: #111827;border: none;outline: none;cursor: pointer;width: 100%;box-sizing: border-box;text-align: center;transition: 0.25s;border: 1px solid #111827;/* letter-spacing: 2px; *//* text-transform: uppercase; */display: flex;align-items: center;/* justify-content: center; */border-radius: 53px;width: 100%;display: block;justify-content: center;}
#cart-sidebar div.sidebar div.sidebar-footer div.button-row a:hover {
    background-color: transparent;
    background-color: #000;
    /* color: #fff; */
}
#cart-sidebar div.sidebar div.sidebar-footer div.button-row a img {

    width: 8px;

    margin-left: 6px;
}
#cart-sidebar div.sidebar div.sidebar-footer div.button-row.active a {pointer-events: initial;opacity: 1;}
#cart-sidebar div.sidebar div.sidebar-footer div.close-row {font-size: 92%;/* text-align: center; */font-weight: 400;width: calc(50% - 10px);}
#cart-sidebar div.sidebar div.sidebar-footer div.close-row span {color: #111827;display: inline-flex;align-items: center;cursor: pointer;/* text-transform: uppercase; *//* letter-spacing: 2px; */font-size: 84%;font-weight: 600;border: 1px solid #111827;border-radius: 34px;font-size: 93%;font-weight: 500;font-size: 93%;font-weight: 500;padding: 13px 20px;width: 100%;text-align: center;text-align: center;justify-content: center;}
#cart-sidebar div.sidebar div.sidebar-footer div.close-row img {margin-left: 3px;}
#cart-sidebar .empty-cart {padding-left: 15px;}


/* COOKIE CONSENT */


#cookie-consent {position: fixed;bottom: 0;width: 100%;left: 0;z-index: 175000000;padding: 5px 7px;opacity: 0;transition: 0.3s;background-color: #fff;/* color: #fff; */font-size: 85%;visibility: hidden;box-shadow: 0 -3px 20px rgba(0, 0, 0, 0.1);}

#cookie-consent.shown {
    opacity: 1;
    visibility: visible;
}

#cookie-consent .content {display: flex;padding: 10px;align-items: center;}
#cookie-consent .content .text {display: flex;align-items:center;width: calc(100% - 140px);font-size: 106%;padding-right: 15px;}
#cookie-consent .content .text img.cookie {
    width: 25px;
    margin-right: 10px;
}
#cookie-consent .content .text a {transition:0.3s;font-weight: 600;display: inline-block;font-weight: 600;/* color: #3E6DA1; */text-decoration: underline;}
#cookie-consent .content .text a:hover {

    text-decoration: none;
}
#cookie-consent .content .button {

}

#cookie-consent .content .button .btn {transition:0.3s;text-align: center;background-color: #fff;border: none;color: #fff;font-weight: 600;padding: 13px;border-radius: 0;font-size: 100%;width: 140px;cursor: pointer;border: 1px solid #873CFF;background-color: #873CFF;/* text-transform: uppercase; */border-radius: 60px;}
#cookie-consent .content .button .btn:hover {
    background-color: transparent;
    color: #873CFF;
}

.brand-selector-logos {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 110px;
}

.brand-selector-logos .brand {
    width: calc(33.33% - 30px);
    display: block;
    margin: 0 15px;
    margin-bottom: 30px;
}

.brand-selector-logos .image-container {
    width: 100%;
    padding-bottom: 50%;
    position: relative;
    background-color: #fff;
    border: 2px solid #ddd;
    transition: 0.3s;
}

.brand-selector-logos .image-container:hover {
    border-color: #e63360;
}

.brand-selector-logos .image-container img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}


#search-sidebar div.sidebar div.sidebar-footer div.my-profile div.icon {margin-right: 9px;}
#search-sidebar div.sidebar div.sidebar-footer div.my-profile div.icon img {width: 20px;}
#search-sidebar div.sidebar div.sidebar-footer div.my-profile div.text {  }




#search-sidebar.shown {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /* z-index: 110000000; */
    visibility: visible;
}
#search-sidebar.shown .bg  {
    opacity: 1;
}
#search-sidebar.shown div.sidebar {
    left: 0;
}
#search-sidebar.shown div.close-icon {
    opacity: 1;
}




#search-sidebar {  }
#search-sidebar div.bg {  }
#search-sidebar div.close-icon {  }
#search-sidebar div.close-icon img {}
#search-sidebar div.sidebar {  }
#search-sidebar div.sidebar div.sidebar-header {padding: 15px;font-size: 147%;font-weight: 800;font-family: 'DM Sans';flex-shrink: 0;padding-bottom: 0;}
#search-sidebar div.sidebar div.sidebar-header .title-row {

    display: flex;

    align-items: center;
    margin-bottom: 20px;
}
#search-sidebar div.sidebar div.sidebar-header .title-row .text {

    width: 100%;
}
#search-sidebar div.sidebar div.sidebar-header .title-row .close {flex-shrink: 0;display: flex;cursor: pointer;

    cursor: pointer;
    transition: 0.3s;
    z-index: 2;
    border: 1px solid #ACACAC;
    display: flex;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;

    opacity: 1;
}
#search-sidebar div.sidebar div.sidebar-header .title-row .close img {
    width: 10px;
}
#search-sidebar div.sidebar div.sidebar-header div.search {margin-top: 6px;}
#search-sidebar div.sidebar div.sidebar-header div.search div.search-box {position: relative;display: flex;}
#search-sidebar div.sidebar div.sidebar-header div.search div.search-box img {pointer-events: none;position: absolute;width: 17px;top: 16px;left: 10px;}
#search-sidebar div.sidebar div.sidebar-header div.search div.search-box input {width: 100%;border: 1px solid #000;padding: 8px;box-sizing: border-box;background-color: transparent;padding-left: 32px;outline: none;}
#search-sidebar div.sidebar div.sidebar-content {padding: 15px;height: 100%;overflow-y: auto;padding-bottom: 45px;}
#search-sidebar div.sidebar div.sidebar-content div.search-results {  }
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result {display: flex;align-items: center;margin-bottom: 15px;border-bottom: 1px solid rgba(0, 0, 0, 0.5);padding-bottom: 15px;}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result .category-parents {

    font-size: 90%;
    margin-bottom: 8px;
}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result:last-child {
    border-bottom: none;
    margin-bottom: 0;
}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result-category {display: block;align-items: center;margin-bottom: 15px;border-bottom: 1px solid rgba(0, 0, 0, 0.5);padding-bottom: 15px;}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result-category:last-child {
    border-bottom: none;
    margin-bottom: 0;
}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.photo {width: 110px;flex-shrink: 0;}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.photo img {width: 100%;object-fit: contain;aspect-ratio: 1 / 1;background-color: #fff;}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.details {width: 100%;padding-left: 17px;}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.details div.product-name {margin-bottom: 4px;font-size: 95%;font-weight: 400;text-transform: uppercase;/* font-family: 'DM Sans'; *//* font-weight: 800; */}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.details div.extra-info {
    margin-bottom: 4px;
    font-size: 80%;
}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.details div.price-row {  }
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.details div.price-row span.current-price {font-family: 'DM Sans';font-weight: 800;color: #3E6DA1;}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.details div.price-row span.old-price {
    margin-left: 5px;
    text-decoration: line-through;
    opacity: 0.6;
    font-size: 88%;
}
#search-sidebar div.sidebar div.sidebar-content div.search-results .search-result div.details div.price-row span.discount {background-color: #3E6DA1;color: #fff;padding: 2px 5px;font-size: 75%;margin-left: 4px;}
#search-sidebar div.sidebar div.sidebar-content div.more-results {display: none;justify-content: center;align-items: center;margin-top: 25px;}
#search-sidebar div.sidebar div.sidebar-content div.more-results a {font-size: 73%;font-weight: 600;text-transform: uppercase;background-color: #000;color: #fff;display: block;padding: 14px 24px;letter-spacing: 2px;}

#search-sidebar div.sidebar div.sidebar-content div.loading {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
    font-size: 400%;
    opacity: 0.3;
    display: none;
}

#search-sidebar div.sidebar div.sidebar-content div.no-results {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
    /* opacity: 0.3; */
    display: none;
}

#search-sidebar div.sidebar div.sidebar-content div.no-results .text {
    font-size: 160%;
    margin-bottom: 20px;
    opacity: 0.3;
}

#search-sidebar div.sidebar div.sidebar-content div.no-results .btn-row {
    display: flex;
    align-items:center;
    justify-content: center;
}
#search-sidebar div.sidebar div.sidebar-content div.no-results .btn-row .btn {
    font-size: 73%;
    font-weight: 600;
    text-transform: uppercase;
    background-color: #000;
    color: #fff;
    display: block;
    padding: 14px 24px;
    letter-spacing: 2px;
    cursor: pointer;
}

#search-sidebar {position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 50;visibility: hidden;z-index: 110000000;}
#search-sidebar div.bg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: rgb(11 45 65 / 58%);opacity: 0;transition: 0.3s;}
#search-sidebar div.close-icon {position: absolute;cursor: pointer;opacity: 0;transition: 0.3s;z-index: 2;left: 408px;top: 12px;}
#search-sidebar div.close-icon img {  }
#search-sidebar div.sidebar {transition: 0.3s;position: absolute;left: -450px;top: 0;height: 100%;background-color: #F5F5F6;display: flex;flex-direction: column;width: 450px;box-shadow: 1px 1px 19px rgba(0, 0, 0, 0.15);}

a {
    color: inherit;
    text-decoration: inherit;
}

@media (max-width: 512px) {
    #search-sidebar div.sidebar {
        width: 100%;
        left: -100%;
    }
    #search-sidebar div.close-icon {
        left: calc(100% - 40px);
    }
    #menu-sidebar div.close-icon {
        left: calc(100% - 44px);
    }
    #menu-sidebar div.sidebar div.sidebar-header div.logo img {
        width: 80px;
    }
    #search-sidebar div.sidebar div.sidebar-content div.search-results div.search-result div.photo {
        width: 80px;
    }

    #cart-sidebar div.sidebar div.sidebar-content div.sidebar-content-products div.sidebar-product {

        padding: 5px 16px;

    }
    #cart-sidebar div.sidebar div.sidebar-header {

        padding: 17px;
    }
    #cart-sidebar div.sidebar div.sidebar-footer {

        padding: 16px;
    }
    #cart-sidebar div.sidebar div.sidebar-footer div.button-row {

        width: calc(50% - 6px);
    }
    #cart-sidebar div.sidebar div.sidebar-footer div.total-row {
        margin-bottom: 8px;
    }
    #cart-sidebar div.sidebar div.sidebar-footer div.button-row a {
        font-size: 70%;
    }
    #cart-sidebar div.sidebar div.sidebar-footer div.close-row {

        width: calc(50% - 6px);

    }
    #cart-sidebar div.close-icon {

        right: 13px;

        top: 16px;

        width: 26px;

        height: 26px;
    }
    #cart-sidebar div.sidebar div.sidebar-footer div.close-row span {
        font-size: 70%;
    }
    #cart-sidebar div.close-icon img {

        width: 8px;
    }
}

@media (max-width: 400px) {
    #cart-sidebar div.sidebar {
        width: 100%;
    }
    #cart-sidebar div.sidebar div.sidebar-header {

        border-top-left-radius: 0;
    }
    #cart-sidebar div.sidebar div.sidebar-footer {
        border-bottom-left-radius: 0;
    }
}