/* Подключаем шрифты */

@font-face {
    font-family: 'Lato Hairline';
    src: url('../fonts/Lato-Hairline.eot');
    src: local('Lato Hairline'), local('Lato-Hairline'),
        url('../fonts/Lato-Hairline.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Hairline.woff') format('woff'),
        url('../fonts/Lato-Hairline.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Heavy.eot');
    src: local('Lato Heavy'), local('Lato-Heavy'),
        url('../fonts/Lato-Heavy.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Heavy.woff') format('woff'),
        url('../fonts/Lato-Heavy.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-HeavyItalic.eot');
    src: local('Lato Heavy Italic'), local('Lato-HeavyItalic'),
        url('../fonts/Lato-HeavyItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-HeavyItalic.woff') format('woff'),
        url('../fonts/Lato-HeavyItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Regular.eot');
    src: local('Lato Regular'), local('Lato-Regular'),
        url('../fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Regular.woff') format('woff'),
        url('../fonts/Lato-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Black.eot');
    src: local('Lato Black'), local('Lato-Black'),
        url('../fonts/Lato-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Black.woff') format('woff'),
        url('../fonts/Lato-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-SemiboldItalic.eot');
    src: local('Lato Semibold Italic'), local('Lato-SemiboldItalic'),
        url('../fonts/Lato-SemiboldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-SemiboldItalic.woff') format('woff'),
        url('../fonts/Lato-SemiboldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-BlackItalic.eot');
    src: local('Lato Black Italic'), local('Lato-BlackItalic'),
        url('../fonts/Lato-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-BlackItalic.woff') format('woff'),
        url('../fonts/Lato-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Lato Hairline';
    src: url('../fonts/Lato-HairlineItalic.eot');
    src: local('Lato Hairline Italic'), local('Lato-HairlineItalic'),
        url('../fonts/Lato-HairlineItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-HairlineItalic.woff') format('woff'),
        url('../fonts/Lato-HairlineItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-MediumItalic.eot');
    src: local('Lato Medium Italic'), local('Lato-MediumItalic'),
        url('../fonts/Lato-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-MediumItalic.woff') format('woff'),
        url('../fonts/Lato-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-ThinItalic.eot');
    src: local('Lato Thin Italic'), local('Lato-ThinItalic'),
        url('../fonts/Lato-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-ThinItalic.woff') format('woff'),
        url('../fonts/Lato-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Thin.eot');
    src: local('Lato Thin'), local('Lato-Thin'),
        url('../fonts/Lato-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Thin.woff') format('woff'),
        url('../fonts/Lato-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Medium.eot');
    src: local('Lato Medium'), local('Lato-Medium'),
        url('../fonts/Lato-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Medium.woff') format('woff'),
        url('../fonts/Lato-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Italic.eot');
    src: local('Lato Italic'), local('Lato-Italic'),
        url('../fonts/Lato-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Italic.woff') format('woff'),
        url('../fonts/Lato-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Semibold.eot');
    src: local('Lato Semibold'), local('Lato-Semibold'),
        url('../fonts/Lato-Semibold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Semibold.woff') format('woff'),
        url('../fonts/Lato-Semibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Bold.eot');
    src: local('Lato Bold'), local('Lato-Bold'),
        url('../fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Bold.woff') format('woff'),
        url('../fonts/Lato-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-BoldItalic.eot');
    src: local('Lato Bold Italic'), local('Lato-BoldItalic'),
        url('../fonts/Lato-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-BoldItalic.woff') format('woff'),
        url('../fonts/Lato-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-LightItalic.eot');
    src: local('Lato Light Italic'), local('Lato-LightItalic'),
        url('../fonts/Lato-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-LightItalic.woff') format('woff'),
        url('../fonts/Lato-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Light.eot');
    src: local('Lato Light'), local('Lato-Light'),
        url('../fonts/Lato-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Light.woff') format('woff'),
        url('../fonts/Lato-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

/* Дополнительные шрифты Google */

.chango-regular {
  font-family: "Chango", sans-serif;
  font-weight: 400;
  font-style: normal;
}


/* Основные правила */

body {
    background-color: rgb(239, 239, 239);
    font-family: "Noto Sans Georgian", "Noto Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
}

.w_main_content {
    margin: 0 auto;
    max-width: 1600px !important;
    min-height: 100vh;
}

.w_sticky-column {
    position: sticky;
    top: 1.5rem;
    height: auto;
    max-height: calc(100vh - 3rem);
    overflow-y: auto;
    margin: -10px;
    padding: 10px;
}

.w_scroll-column {
    overflow-y: auto;
    max-height: 100%;
}

.hidden-scrollbar::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Edge */
}
        
.hidden-scrollbar {
    -ms-overflow-style: none; /* IE и Edge */
    scrollbar-width: none; /* Firefox */
}

.owl-carousel .item {
    /* Сбрасываем максимальную ширину, чтобы брать width из CSS */
    max-width: none;
}

.w_btn-black {
    background: black;
    color: white;
    border-radius: 50px;
}

.w_btn-black:hover {
    border: 2px solid black;
}

.w_btn-black-outline {
    background-color: rgba(0, 0, 0, 0);
    color: black;
    border-radius: 50px;
    border: 2px solid black;
}

.w_btn-black-outline:hover {
    background: black;
    color: white;
}


/* первый слайд — 20vw */

#qc_section_1 > section {
    overflow-y: scroll;
}

.qc_section_1 {
    align-self: stretch;
}

@media (max-width: 1399.98px) {
    .qc_section_1 {
        display: none;
    }
}

/* .w_menu {
    position: sticky;
    height: fit-content;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}*/

.w_brand {
    margin-right: 0;
}

.w_btn_custom {
    border-radius: 25px;
    background-color: white;
    font-weight: 300;
    text-align: start;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.w_btn_custom:hover {
    background-color: #E9E9E9;
}

.btn.active.w_btn_custom {
    background-color: #E9E9E9;
    border: none !important;
}

.btn.w_btn_custom:focus {
    border: none !important;
}

.btn.w_btn_custom {
    border: none !important;
}

.w_phone {
    font-weight: 700;
}

.w_phone a {
    text-decoration: none;
}

/* второй слайд — 80vw */

#qc_section_2 > section {
    overflow-y: scroll;
}

.qc_section_2 {
    height: auto;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.qc_section_inner {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: visible !important;
}

.w_nav_wrapper {
    border-radius: 30px;
    box-shadow: 0 5px 10px rgba(0,0,0,0.3);
    overflow: visible;
}

.w_cardscol {
    position: relative;
}

.qc_navbar {
    border-radius: 30px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 1) 20%);
    overflow: hidden;
}

@media (max-width: 1199.98px) {
    .header {
        width: 100%;
        padding: 0;
    }

    .qc_navbar {
        border-radius: 0;
    }
}

.navbar-brand img {
    width: auto !important;
}

.w_header_soc {
    flex-wrap: wrap;
}

.w_header_soc img {
    width: 18px;
}

.w_header_flags {
    height: 30px;
    max-width: 50%;
    flex-wrap: wrap;
}

.w_header_flags .flag-icon {
    border:#E9E9E9 solid 2px;
    border-radius: 50px;
    width: 30px;
    height: 100%;
    background-size: cover;
}

.w_header_logo {
    border-radius: 50px;
    border:#fafafa solid 2px;
}

.w_header_information {
    display: none;
    transition: all 1s ease-out 0.5s;
    color: #fafafa;
}

.w_hi_toggler {
    border: none !important;
}

.w_hi_workinghours {
    font-weight: 700;
    font-size: 25px;
}

.w_hi_adress {
    font-weight: 400;
}

.w_hi_contacts {
    font-weight: 500;
}

.w_hi_contacts a {
    text-decoration: none;
    color: #fafafa;
}

.w_hi_name {
    font-weight: 700;
    text-transform: uppercase;
}

.qc_shop_name {
    font-size: 25px;
    font-weight: 700;
}

.qc_shop_name span {
    font-size: 15px;
}

.w_topbar_mobile {
    display: none;
}

.w_topbar_mobile .w_btn_custom {
    white-space: nowrap; 
}

@media (max-width: 1399.98px) {
    .w_topbar_mobile {
        display: block;
        position: sticky;
        top: 0;
        background-color: rgb(239, 239, 239);
    }
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .w_topbar_mobile {
        margin-left: -10px;
        margin-right: -10px;
    }
}

.w_topname {
    padding: 25px 10% 2px 10%;
    text-align: center;
    font-weight: 700;
}

.w_menu_mobile {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.w_block_before {
    width: 20px;
    height: 100%;
    position: absolute;
    background: rgb(239, 239, 239);
    background: linear-gradient(90deg, rgba(239, 239, 239, 1) 57%, rgba(239, 239, 239, 0) 100%);
    left: 0;
    top: 0;
    z-index: 1;
}

.w_block_after {
    width: 20px;
    height: 100%;
    position: absolute;
    background: rgb(239, 239, 239);
    background: linear-gradient(90deg, rgba(239, 239, 239, 0) 0%, rgba(239, 239, 239, 1) 57%);
    right: 0;
    top: 0;
    z-index: 1;
}

.w_warning {
    background-color: white;
    border-radius: 24px;
    font-size: 15px;
}

.w_prodcard {
    background-color: white;
    border: white 3px solid;
    border-radius: 22px;
    color: #000;
    height: 100%;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    position: relative !important;
}

.qc_prodcard_descr_over
{
    position: absolute;
    z-index: 999 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(255, 255, 255, .9) !important;
    white-space: wrap !important;
    display: none;
    padding: 0.8rem;
    transform: translateY(150%);
    animation: ani 1s forwards;
    overflow: scroll;
}

@keyframes ani {
  0% {transform: translateY(150%);}
  100% {transform: translateY(0);}
}

.qc_prodcard_descr_over.active
{
    display: block;
}

.w_infotoggler {
    position: absolute;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 45px;
    left: -1px;
    bottom: -1px;
    border-top-right-radius: 40px;
    z-index: 1;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.w_infotoggler img {
    margin: 10px 10px 0 0;
    width: 21px;
    height: auto;
    opacity: .3;
}

.qc_pulse_once {
    animation: qcPulseOnce 320ms ease-out 1;
    transform-origin: center;
    will-change: transform;
}

@keyframes qcPulseOnce {
    0%   { transform: scale(1); }
    40%  { transform: scale(1.03); }
    100% { transform: scale(1); }
}

.w_image_container {
    width: 100%;
    max-height: 200px;
    aspect-ratio: 500 / 500;
    position: relative;
    overflow: hidden;
    justify-content: center;
}

.qc_prodrow_img {
    height: 100%;
    height: 100%;
    object-fit: cover;
}

.qc_wcart_minh {
    padding: 0 10px 15px 10px;
}

.qc_header_cat {
    color: #000;
    font-size: 32px;
}

.w_cat_header {
    margin-bottom: 1.3rem;
}

.qc_prodrow_price {
    font-family: "Alan Sans", sans-serif;
    font-weight: 700;
    font-size: 20px;
    align-items: flex-end;
}

.qc_prodrow_price span {
    font-size: 14px;
    font-weight: 500;
}

.qc_prodrow_title {
    overflow: hidden;
}

.qc_prodrow_descr {
    display: none;
}

.w_closedesc {
    width: 15px;
    height: 15px;
    position: sticky;
    top: 1px;
}

.w_descwrapper {
    width: 90%;
    margin: 0 2px 40px 2px;
    line-height: normal;
}

.w_descname {
    font-size: 18px;
    margin-bottom: 5px;
    font-weight: 700;
}

.w_quant {
    background-color: rgba(230, 230, 230, .5);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    position: absolute;
    display: flex;
    justify-content: left;
    align-items: center;
    width: 83px;
    height: 40px;
    border-radius: 20px;
    left: 10px;
    top: -12px;
    font-size: 13px;
    z-index: 1000;
    padding-left: 25px;
    color: black;
}

.w_cartdel {
    position: absolute;
    width: 40px;
    height: 40px;
    background: black;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 50%;
    z-index: 1000;
    top: -12px;
    left: 60px;
    display: flex;
    transition: all 0.2s ease-in-out;
}

.w_cartdel img {
    width: 10px;
    height: auto;
}

.w_mapblock {
    padding: 1px;
}

.w_card_mobile {
    display: none;
}

@media (max-width: 1199.98px) {
    .w_card_mobile {
        display: flex;
        width: 100%;
        background: black;
        border-radius: 24px 24px 0 0;
        text-align: center;
        color: white;
        padding: 25px 0;
        cursor: pointer;
    }
}

.qc_noshow_cartrow {
    display: none !important;
}

.w_btn_cartblock {
    border-radius: 25px;
}

.w_btn_cartblock a {
    text-decoration: none;
    color: white;
}

.w_btn_cartblock a:hover {
    color: black;
}

.w_cartbrickh {
    min-height: 50px;
    display: none;
}

@media (max-width: 1199.98px) {
    .w_cartbrickh {
        display: block;
    }  
}

/* третий слайд — 20vw */

.qc_section_3 {
    align-self: stretch; 
}

@media (max-width: 1199.98px) {
    .qc_section_3 {
        display: none;
    }
}

.w_cart {
    background-color: white;
    border-radius: 30px;
    padding: 25px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.w_cart_posqty {
    display: flex;
    padding: 10px 5px;
    background-color: #F5F4F2;
    border-radius: 20px;
    width: calc(40% - 10px);
    max-width: 115px;
}

.w_position_name {
    width: calc(69% - 15px);
    padding-right: 15px;
    float: left;
    line-height: 1.3em;
    font-size: 14px;
}

.w_position_cost {
    font-size: 16px;
}

.w_position_cost span,
.qc_packcost_row span,
.qc_deliverycost_row span,
.qc_cart_alltotal_cost span,
.qc_cart_sbr_cost span {
    font-size: 12px;
}

.w_qty_minus,
.w_qty_plus {
    padding: 0 10px;
    cursor: pointer;
}

.w_cart_posline {
    width: 100%;
    height: 1px;
    border-bottom: .1px dashed #818181;
}

.qc_clear_cart {
    cursor: pointer;
}

.w_payment_selector {
    position: relative;
    display: block;
}

.w_payment_selector select {
    display: block;
    min-width: 100%;
    max-width: 100%;
    font-family: 'lato';
    color: #4d4d4d;
    font-size: 16px;
    line-height: 1.4285714285714;
    text-decoration: none;
    text-align: left;
    min-height: 40px;
    cursor: pointer;
    border-radius: 3px;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    -moz-appearance: none;
    border: 0px solid #818181;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    background-color: white;
}

.w_payment_selector:after {
    content: '';
    display: inline-block;
    vertical-align: top;
    width: 9px;
    height: 6px;
    position: absolute;
    right: 0px;
    top: 51%;
    margin: -3px 0 0;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgOSA2IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA5IDY7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7fTwvc3R5bGU+PHRpdGxlPlBhZ2UgMTwvdGl0bGU+PGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+PGcgaWQ9ImNhcnQiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04NTguMDAwMDAwLCAtNzUyLjAwMDAwMCkiPjxnIGlkPSJjaGVja291dC1lbXB0eSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTYyLjAwMDAwMCwgMTUzLjAwMDAwMCkiPjxnIGlkPSJwYXltZW50IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMy4wMDAwMDAsIDU1OC4wMDAwMDApIj48cG9seWdvbiBpZD0iUGFnZS0xIiBjbGFzcz0ic3QwIiBwb2ludHM9IjI3Miw0MSAyNjcuNSw0NyAyNjMsNDEgIi8+PC9nPjwvZz48L2c+PC9nPjwvc3ZnPg==);
    pointer-events: none;
}

.w_countrypicker {
    padding-top: 1.2rem;
    padding-left: 0;
    background: transparent;
}

.bootstrap-select .w_countrypicker.dropdown-toggle:focus:focus {
    outline: none !important;
    background: transparent;
}

.w_offcanvas_cart {
    width: 100% !important;
    overflow-y: scroll;
}

.form-control:focus {
    box-shadow: none !important;
}

.w_field {
    position: relative;
    height: 45px;
    width: 100%;
    border-bottom: solid 1px black;
}

.w_field.is-invalid {
    border-bottom: solid 1px red;
}

.w_finp {
  border: none;
  background: transparent !important;
  height: 32px;
  width: 100%;
  position: absolute;
  top: 13px;
  outline: none;
  font-size: 1em;
  & + label
  {
    position: absolute;
    top: 20px;
    left: 0px;
    transition: .3s;
    -webkit-transition: .3s;
  }
  &:focus + label, &.qc_force_label + label
  {
    font-weight: 500;
    font-size: 9px;
    top: 5px;
    transition: .3s;
    -webkit-transition: .3s;
  }
}

.is-invalid .w_finp {
    & + label
  {
    color: red;
  }
}


/* модалка */

.w_modal_icon {
    font-size: 4rem;
    color: darkred;
}

.w_modal_heading {
    color: darkred;
}

.w_modal_text {
    color: darkred;
}

#qc_iampic
{
    width: 100%;
    aspect-ratio: 400 / 710;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    max-width: 400px;
    max-height: 710px;
    border-radius: 30px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    border: white 3px solid;
}