* {
    margin: 0;
    padding: 0;
    text-decoration: none;
    outline: 0;
    box-sizing: border-box;
    border: 0;
    text-indent: 0;
    list-style-type: none;
}

@font-face {
    font-family: 'Evogria';
    src: url('../fonts/Evogria.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: 'GeneralSans';
    src: url('../fonts/GeneralSans/GeneralSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
    font-style: normal;
}
@font-face {
    font-family: 'GeneralSans';
    src: url('../fonts/GeneralSans/GeneralSans-Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
    font-style: normal;
}
@font-face {
    font-family: 'GeneralSans';
    src: url('../fonts/GeneralSans/GeneralSans-Semibold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
    font-style: normal;
}

html {
    font-size: 0.0625vw;
}

@media screen and (min-width: 1600px) {
    html {
        font-size: 1px;
    }
    html.large {
        font-size: 0.0625vw;
    }
}

body,
input,
textarea {
    font: 400 16rem/22rem "GeneralSans";
    color: #000;
}
input,
button {
    background: transparent;
}

body {
    overflow-x: hidden;
    width: 100%;
}

/* Modifier */
.flex {
    display: flex;
}
.flex_ai-c {
    display: flex;
    align-items: center;
}
.flex_ai-fs {
    display: flex;
    align-items: flex-start;
}
.flex_ai-fe_jc-c {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.flex_ai-c_jc-sb {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.flex_jc-c{
    display: flex;
    justify-content: center;
}
.flex_ai-c_jc-c {
    display: flex;
    align-items: center;
    justify-content: center;
}
.flex_fd-col_fw-w {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}
.flex_fd-col {
    display: flex;
    flex-direction: column;
}
.upper {
    text-transform: uppercase;
}
.ta-c {
    text-align: center;
}
.ta-r {
    text-align: right;
}
.hide {
    display: none!important;
}

/* Base */
.container {
    width: 1500rem;
    margin: 0 auto;
}
.base_title-64 {
    font: 400 64rem/80rem 'Evogria', sans-serif;
}
.base_title-48 {
    font: 400 48rem/60rem 'Evogria', sans-serif;
}
.base_subtitle-32 {
    font: 600 32rem/43rem 'GeneralSans';
}
.base_subtitle-24 {
    font: 400 24rem/32rem 'GeneralSans';
}


/* Base btn */
.base_btn {
    background: #000;
    border-radius: 8rem;
    color: #fff;
    padding: 12rem 24rem;
    font: 500 24rem/32rem 'GeneralSans';
    cursor: pointer;
    transition: all .3s ease-in-out;
}
.base_btn.light {
    color: #000000;
    background: #EFEFEF;
}
.base_btn:hover,
.base_btn.light:hover {
    background: #93F031;
    color: #000000;
    transition: all .3s ease-in-out;
}

/* Base scroll */
.base_scroll {
    overflow-y: auto;
    &::-webkit-scrollbar-track {
        background-color: transparent;
        border-radius: 2rem;
    }
    &::-webkit-scrollbar-track-piece {
        background-color: transparent;
        border-radius: 2rem;
    }
    &::-webkit-scrollbar-thumb {
        height: 40rem;
        background: #9e9da0;
        border-radius: 40rem;
        width: 8rem;
    }
    &::-webkit-scrollbar-corner {
        background-color: transparent;
    }
    &::-webkit-scrollbar {
        width: 4rem;
        height: 10rem;
        background: transparent;
        border-radius: 2rem;
    }
}

/* Breadcrumbs */
.breadcrumb {
    display: flex;
    align-items: center;
    margin: 0 0 64rem;
}
.breadcrumb-item {
    font: 400 24rem/32rem 'GeneralSans';
}
.breadcrumb-item:not(:last-child):after {
    content: '>';
    margin: 0 16rem;
    color: #919095;
    font: 400 24rem/32rem 'GeneralSans';
}
.breadcrumb-item a {
    color: #919095;
}
.breadcrumb-item.active {
    color: #93F031;
}

/* Loader */
.base_loader {
    width: 28rem;
    height: 28rem;
    border: medium solid #000;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
    display: none;
    margin: auto;
}
.base_loader.active {
    display: block;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/*Base style for form field*/
.base_form-group {
    display: block;
    margin: 0 0 32rem;
}
.base_form-input {
    width: 100%;
    font-size: 18rem;
    padding: 16rem 8rem;
    border-bottom: thin solid #E1E0E5;
}
.base_form-msg {
    min-height: 128rem;
    max-height: 128rem;
    font-size: 18rem;
    padding: 16rem 8rem;
    border-bottom: thin solid #E1E0E5;
    max-width: 100%;
    min-width: 100%;
}


/* Header */
header {
    background: #fff;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
}
header.sticky {
    position: fixed;
}
.header {
    height: 112rem;
}
.header_logo {
    width: 132rem;
    height: 32rem;
}
.header_menu-item {
    margin: 0 32rem;
}
.header_menu-item a {
    color: #000000;
    transition: all .2s linear;
}
.header_menu-item:hover a  {
    color: #93F031;
}
.header_side {
    width: 132rem;
}
.header_lang {
    position: relative;
    margin: 0 12rem 0 0;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
}
.header_lang-arrow {
    margin: 0 0 0 6rem;
    width: 24rem;
    height: 24rem;
}
.header_lang-dropdown {
    position: absolute;
    top: 100%;
    background: #fff;
    border: thin solid #EFEFEF;
    border-radius: 8rem;
    overflow: hidden;
    height: 0;
    font-size: 0;
    opacity: 0;
    transition: opacitty .1s linear, font-size 0.2s linear, height 0.2s linear;
}
.header_lang.active .header_lang-dropdown {
    height: 140rem;
    font-size: 16rem;
    opacity: 1;
    transition: opacitty .1s linear, font-size 0.2s linear, height 0.2s linear;
}
.header_lang-item {
    display: block;
    padding: 6rem 16rem;
    transition: .3s linear;
    color: #000;
}
.header_lang-item:hover,
.header_lang-item.active {
    background: #93F031;
}
.header_cart {
    position: relative;
    height: 32rem;
}
.header_cart-icon {
    width: 32rem;
    height: 32rem;
}
.header_cart-counter {
    display: block;
    background: #93F031;
    border-radius: 50%;
    min-width: 20rem;
    min-height: 20rem;
    font-weight: 600;
    line-height: 20rem;
    position: absolute;
    right: -10rem;
    top: -7rem;
}
.header_cart-counter.hidden {
    display: none;
}

/* Footer */
footer {
    background: #F7F7F7;
    padding: 64rem 0 0;
}
.footer_top {
    padding: 0 0 64rem;
    margin: 0 auto 32rem;
    border-bottom: thin solid #E1E0E5;
    gap: 32rem;
}

.footer_logo {
    width: 160rem;
    height: 65rem;
    margin: 0 0 32rem
}
.footer_slogan {
    color: #79787D;
    font-size: 22rem;
    line-height: 30rem;
}
.footer_col {
    width: 223rem;
    margin: 0 32rem 0 0;
}
.footer_col-title {
    margin: 0 0 24rem;
}
.footer_col-link {
    display: block;
    margin: 0 0 16rem;
    color: #919095;
    transition: all .3s linear;
}
.footer_col-link:hover {
    color: #93F031;
}
.footer_form {
    margin: 0 0 16rem;
}
.footer_form-label {
    display: block;
    width: 100%;
    margin: 0 8rem 0 0;
}
.footer_form-input {
    width: 100%;
    height: 46rem;
    border: thin solid #E1E0E5;
    border-radius: 8rem;
    padding: 0 20rem;
}
.footer_form-input::-moz-placeholder {
    color: #919095;
}
.footer_form-input::placeholder {
    color: #919095;
}
.footer_form-btn {
    padding: 12rem 20rem;
    font: 500 16rem/22rem 'GeneralSans';
}
.footer_policy {
    color: #79787D;
    font-size: 14rem;
    line-height: 18rem;
}
.footer_policy-link {
    color: #79787D;
    border-bottom: thin solid #79787D;
    transition: all .3s linear;
}
.footer_policy-link:hover {
    color: #93F031;
}
.footer_bottom {
    padding: 0 0 32rem;
    color: #919095;
    font-size: 16rem;
    line-height: 19rem;
}
.footer_bottom-link {
    text-decoration: underline;
    color: #919095;
    display: block;
    margin: 0 32rem 0 0;
    transition: all .3s linear;
}
.footer_bottom-link:hover  {
    color: #93F031;
}
.footer_bottom-logo {
    margin: 0 30rem 0 0;
    width: 149rem;
    height: 25rem;
}
.footer_bottom-address {
    color: #919095;
    transition: all .3s linear;
}
.footer_bottom-address:hover {
    color: #000;
}


/*Modal window*/
.modal{
    position: fixed;
    z-index: 1000;
    visibility: hidden;
    width: 0;
    height: 0;
    overflow: hidden;
}
.modal-is-open {
    overflow: hidden;
    height: 100%;
}
.modal.is-visible{
    visibility: visible;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
.modal_overlay {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.32);
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s linear 0.3s, opacity 0.3s;
}
.modal.is-visible .modal_overlay{
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}
.modal_wrapper {
    margin: auto;
    z-index: 10;
    position: relative;
    transform: scale(0.7);
    opacity: 0;
    transition: all 0.3s;
    width: 734rem;
    background: #fff;
    border-radius: 24rem;
    padding: 32rem;
}

.modal.is-visible .modal_wrapper{
    transform: scale(1);
    opacity: 1;
}
.modal_close {
    position: absolute;
    top: 28rem;
    right: 28rem;
    cursor: pointer;
    width: 20rem;
    height: 20rem;
    z-index: 10;
}
.modal_close:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 27rem;
    height: 1rem;
    background-color: #E1E0E5;
    transform: rotate(43deg);
    transform-origin: left bottom;
    transition: background-color 0.3s linear;
}
.modal_close:after {
    content: "";
    position: absolute;
    width: 27rem;
    top: 0;
    right: 0;
    height: 1rem;
    background-color: #E1E0E5;
    transform: rotate(-45deg);
    transform-origin: right bottom;
    transition: background-color 0.3s linear;
}
.modal_close:hover:before,
.modal_close:hover:after {
    background: #93F031;
}
.modal_title {
    font: 600 36rem/48rem 'GeneralSans';
    margin: 0 0 16rem;
}

/* Modal Individual order */
.modal-individual_half {
    width: 311rem;
}
.modal-individual_btn {
    width: 100%;
}

/* Modal Address */
.modal-address_half {
    width: 311rem;
}
.modal-address_btn {
    width: 100%;
}


/* Modal Gift */
.modal-gift .modal_wrapper {
    padding: 0 0 32rem;
    overflow: hidden;
}
.modal-gift_img {
    width: 734rem;
    height: 450rem;
    margin: 0 auto 32rem;
}
.modal-gift .modal_title {
    font-size: 32rem;
    line-height: 43rem;
    padding: 0 32rem;
}
.modal-gift_text {
    padding: 0 32rem 32rem;
    font-size: 20rem;
    line-height: 31rem;;
}
.modal-gift_btn {
    font-size: 20rem;
    line-height: 27rem;
    padding: 16rem 32rem;
}

.content {
    padding: 80rem 0 0;
}
