body {}

    .news_product_section {
        font-family: 'HelveticaNueRoman';
    }

    .list_production {
        display: flex;
        flex-wrap: wrap;
        margin: -6px -15px -15px;
    }

    .produc_box {
        width: 25%;
    }

    .produc_item {
        background-color: rgb(241, 241, 241);
        border-radius: 20px;
        padding: 0 20px;
        margin: 15px;
    }

    .name__product, .price {
        font-family: 'HelveticaNueBold';
    }

    /* Модальный (фон) */

    /* Модальное содержание */

    .modal-content {
        background-color: #fefefe;
        margin: auto auto;
        max-width: 950px;
        max-height: 500px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 0.4s;
        animation-name: animatetop;
        animation-duration: 0.4s;
        border-radius: 20px;
        display: flex;
        justify-content: space-between;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        transition: 0.3s;
    }

    /* Добавить анимацию */

    @-webkit-keyframes animatetop {
        from {
            top: -300px;
            opacity: 0
        }
        to {
            top: 0;
            opacity: 1
        }
    }

    @keyframes animatetop {
        from {
            top: -300px;
            opacity: 0
        }
        to {
            top: 0;
            opacity: 1
        }
    }

    /* Кнопка закрытия */

    .popup-close {
        color: white;
        float: right;
        font-size: 20px;
        font-weight: bold;
        background-color: black;
        padding: 4px 10px;
        border-radius: 100%;
    }

    .close:hover, .close:focus {
        color: white;
        text-decoration: none;
        cursor: pointer;
    }

    .left__part {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #right__modal::-webkit-scrollbar-thumb {
        background-color: #afafaf;
        border-radius: 20px;
    }

    .right__part {
        padding: 0 10px 0 40px;
        width: 45%;
        background-color: rgb(240, 240, 240);
        border-radius: 0 20px 20px 0;
    }

    .modal-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: black;
        padding: 25px 0 0 0;
    }

    .modal__compound p {
        font-size: 10px;
        color: rgb(151, 150, 150);
        font-family: 'HelveticaNueRoman';
        margin-bottom: 10px;
        text-align: justify;
    }

    .modal-body {
        overflow: auto;
    }

    ::-webkit-scrollbar {
        width: 10px;
    }

    ::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: #adadad;
    }

    ::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
        border-radius: 10px;
        background-color: #f9f9fd;
    }

    .modal-footer {
        color: black;
    }

    .icons_buy {
        border: none;
    }

    button, button:active {
        outline: none !important;
        border: none !important;
        background-color: transparent !important;
    }

    .modal__name__product {
        font-size: 25px;
        font-family: 'HelveticaNueBold';
        text-transform: uppercase;
    }

    .img__modal_product {
        position: relative;
        max-width: 420px;
        display: flex;
        justify-content: center;
    }

    .img__modal_product img {
        width: 100%;
    }

    .title__footer {
        font-family: 'HelveticaNueBold';
        font-size: 12px;
        text-transform: uppercase;
    }

    .modal-footer {
        margin-top: 20px;
    }

    .button_example {
        width: 90px;
        height: 90px;
        background-size: cover;
    }

    .button_example:active {
        border: 1px solid #ea5325 !important;
        box-sizing: border-box;
    }

    .title__choice {
        margin: 20px 0 0 0;
        font-size: 13px;
        text-transform: uppercase;
        font-family: 'HelveticaNueBold';
    }

    .choice__product {
        height: 90px;
        width: 90px;
        background-size: 80px 90px;
        background-repeat: no-repeat;
    }

    .choice__box {
        display: flex;
        flex-wrap: wrap;
        margin: 25px 0 0 0;
    }

    .description_item {
        font-family: 'HelveticaNueBold';
        font-size: 12px;
    }

    .item__choice {
        margin: 15px;
        background-color: white !important;
        padding: 10px;
        border-radius: 15px;
    }

    .auto__modal {
        display: none;
        position: fixed;
        z-index: 2;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgb(251, 150, 72);
        background: linear-gradient(180deg, rgba(251, 150, 72, 1) 50%, rgba(255, 163, 72, 1) 100%);
        padding: 50px;
        overflow: auto;
    }

    .close__automodal {
        color: white;
        float: right;
        font-size: 20px;
        font-weight: bold;
        background-color: black;
        padding: 4px 10px;
        border-radius: 100%;
    }

    .close__automodal:hover, .close__automodal:focus {
        color: white;
        text-decoration: none;
        cursor: pointer;
    }

    .modal-content-auto {
        display: block;
        width: 800px;
        max-width: 100%;
        height: 500px;
        max-height: 100%;
        position: fixed;
        z-index: 999999;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        background: white;
        border-radius: 20px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        font-family: 'HelveticaNueRoman';
        overflow: hidden;
    }

    .container-reg {
        position: relative;
    }

    .scroll-reg {
        position: absolute;
        overflow: auto;
        height: 500px;
        margin: 0 10px 0 0;
    }

    .modal-header-auto {
        padding: 35px 10px;
    }

    .modal-header-auto h1 {
        font-family: 'HelveticaNueBold';
        text-transform: uppercase;
        text-align: center;
        font-size: 25px;
    }

    .buttons__auto__modal {
        display: flex;
        justify-content: center;
        font-family: 'HelveticaNueRoman';
    }

    .common__container__button {
        background-color: rgb(239, 239, 239);
        border-radius: 20px;
        display: flex;
    }

    .buttons__auto__modal button {
        color: black;
        border: none;
        padding: 7px 40px;
        border-radius: 20px;
        font-family: 'HelveticaNueRoman';
        cursor: pointer;
        font-size: 12px;
        transition: 0.6s;
    }

    .item__authorization {
        width: 350px;
        margin: 10px;
    }

    .buttons__auto__modal button:hover {
        background-color: #ea5325 !important;
        color: white;
    }

    .container__authorization {
        margin: 0 auto;
    }

    .user__authorization__modal {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }

    .user__authorization__modal input {
        border: 1px solid rgb(216, 216, 216) !important;
        font-family: 'HelveticaNueRoman';
        font-size: 15px;
        border-radius: 25px;
        padding: 15px 10px;
        margin: 20px 0 0 0;
    }

    .date__birth__input input, .confirmation__input input, .telephone__input input, .password__input input, .name__input input {
        width: 300px;
    }

    .gender__choice .form_radio {
        margin: 0 60px 0 0;
    }

    .gender__choice {
        display: flex;
        align-items: center;
        margin: 0 0 0 50px;
    }

    .form_radio {
        font-family: 'HelveticaNueRoman';
        font-size: 14px;
        display: inline-block;
        vertical-align: middle;
    }

    .gender__input[type='radio'] {
        margin: 0 20px 0 0;
    }

    .gender__input[type='radio']:after {
        width: 12px;
        height: 12px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: #d1d3d1;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid white;
        transition: 0.3s;
    }

    .gender__input[type='radio']:checked:after {
        width: 12px;
        height: 12px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: #ea5325;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid white;
        transition: 0.3s;
    }

    .registration__button {
        display: flex;
        justify-content: center;
        margin: 20px 0 0 0;
    }

    .registration {
        cursor: pointer;
        padding: 15px 60px;
        background-color: #ea5325 !important;
        font-family: 'HelveticaNueRoman';
        border-radius: 30px;
        color: white;
        text-transform: uppercase;
        margin: 20px 0;
    }

    .modal-header-auto {
        display: flex;
        justify-content: center;
    }

    .modal-header-auto {
        position: relative;
    }

    .popup-close-reg {
        position: absolute;
        right: 25px;
        color: white;
        float: right;
        font-size: 20px;
        font-weight: bold;
        background-color: black;
        padding: 4px 10px;
        border-radius: 100%;
    }

    /*-----------------POPUP MODAL---------------*/

    .popup-fade {
        display: none;
    }

    .popup-fade:before {
        content: '';
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, rgba(251, 150, 72, 1) 50%, rgba(255, 163, 72, 1) 100%);
        z-index: 9999;
    }

    .popup {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0 auto;
        border-radius: 25px;
        z-index: 99999;
        opacity: 1;
        transition: 0.3s;
    }

    .popup__content {
        display: flex;
    }

    .popup__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .popup__header h1 {
        font-family: 'HelveticaNueBold';
        text-transform: uppercase;
        text-align: center;
        font-size: 25px;
        padding: 10px 0;
    }

    .popup__header a {
        color: white;
        float: right;
        font-size: 20px;
        font-weight: bold;
        background-color: black;
        padding: 4px 10px;
        border-radius: 100%;
    }

    .composition__block p {
        font-size: 12px;
        color: rgb(151, 150, 150);
        font-family: 'HelveticaNueRoman';
        margin-bottom: 10px;
        text-align: justify;
    }

    .modal__menu__buttons {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        margin: 20px 0;
    }

    .number {
        display: flex;
        align-items: center;
    }

    .number input {
    border: none !important;
    text-align: center;
    font-family: 'HelveticaNueBold';
    margin: 0 5px;
    background-color: transparent;
}

    

    .number .minus, .plus {
        font-size: 25px;
        background-color: #ea5325 !important;
        border-radius: 100%;
        cursor: pointer;
        padding: 2px 10px;
        color: white;
        font-family: 'HelveticaNueRoman';
    }

    .buttons__size {
        display: flex;
        background-color: rgb(255, 255, 255);
        border-radius: 20px;
    }

    .buttons__size button {
        color: black;
        border: none;
        padding: 7px 40px;
        border-radius: 20px;
        font-family: 'HelveticaNueRoman';
        cursor: pointer;
        background-color: white;
        font-size: 12px;
        transition: 0.6s;
    }

    .buttons__size button:hover {
        background-color: #ea5325 !important;
        color: white;
    }

    .modal-header-order {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .modal-header-order h1 {
    font-size: 20px;
    text-transform: uppercase;
    font-family: 'HelveticaNueBold';
}
    .modal-content-order {
        
            display: block;
            width: 800px;
            max-width: 100%;
            height: 600px;
            max-height: 100%;
            position: fixed;
            z-index: 999999;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            background: white;
            border-radius: 20px;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
            font-family: 'HelveticaNueRoman';
            padding: 15px 25px;
            overflow: hidden;

        
    }

    .content__order__block {
        overflow: hidden;
        position: absolute;
        width: 95%;
        height: 100%;
        overflow: auto;
        /* margin-bottom: 25px; */
        padding-bottom: 80px;
        padding-right: 15px;
    }

    .modal-content-order::-webkit-scrollbar {
        width: 10px;
        margin: 0 0 0 15px;
    }

    .modal-content-order::-webkit-scrollbar-track {
        -webkit-border-radius: 1px;
        border-radius: 1px;
    }

    .modal-content-order::-webkit-scrollbar-thumb {
        -webkit-border-radius: 1px;
        border-radius: 1px;
        background: #dcdcdc;
        border-radius: 20px !important;
    }

    .modal-content-order::-webkit-scrollbar-thumb:window-inactive {
        background: bebebe;
    }

    .line1 {
        margin-top: 20px;
        border-top: 1px solid rgb(207, 207, 207);
    }

    .order__box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .info__order {
        margin: 0 150px 0 40px;
    }

    .list__order ul {
        list-style-type: disc;
        color: rgb(156, 156, 156);
    }

    .order__item {
        font-family: 'HelveticaNueRoman';
        font-size: 12px;
        margin: 0 0 0 10px;
    }

    .name__order {
        font-family: 'HelveticaNueBold';
        margin: 0 0 10px 0;
    }

    .additionally p {}

    .price {
        font-size: 16px;
        margin-top: 8px;
    }

    .text__order {
    font-family: 'HelveticaNueBold';
    color: black;
    font-size: 20px;
}

    .common__cell {
        display: flex;
        justify-content: space-between;
        padding: 5px 0;
        align-items: center;
        border-bottom: 1px solid rgb(207, 207, 207);
        color: rgb(100, 100, 100);
    }

    .common__block__order {
    font-family: 'HelveticaNueRoman';
    font-size: 20px;
}

    .switch {
        position: relative;
        display: inline-block;
        width: 60px;
        height: 34px;
    }

    .switch input {
        display: none;
    }

    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        -webkit-transition: .4s;
        transition: .4s;
    }

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

    input:checked+.slider {
        background-color: #2196F3;
    }

    input:focus+.slider {
        box-shadow: 0 0 1px #2196F3;
    }

    input:checked+.slider:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(26px);
    }

    /* Rounded sliders */

    .slider.round {
        border-radius: 34px;
    }

    .slider.round:before {
        border-radius: 50%;
    }

    .block__sum {
    display: flex;
    justify-content: space-between;
    margin: 13px 0 20px 0;
    padding: 0 0 10px 0;
}

    .block__sum {
    font-family: 'HelveticaNueBold';
    font-size: 20px;
    border-bottom: 1px solid orangered;
}

    .basket__button {
        height: 35px;
        width: 35px;
        background-size: 35px;
        background-repeat: no-repeat;
        cursor: pointer;
    }

    .promo__info {
    margin: 30px 0;
}
.icon-present{
	
}
.desc-present{
	    display: block;
    
    text-align: center;
}
.desc-present span {
    font-size: 9px;
    font-family: 'HelveticaNueRoman';
}


    .promo__text {
    border: 1px solid rgba(0, 0, 0, 0.493) !important;
    padding: 10px 10px;
    width: 200px;
    border-radius: 50px;
    font-family: 'HelveticaNueRoman';
    font-size: 12px;
    margin: 0 5px 0 0;
}
.promo__text:focus{
	border: 1px solid black !important;
}

   .button__promo {
    padding: 10px 10px;
    width: 200px;
    border-radius: 50px;
    font-family: 'HelveticaNueBold';
    font-size: 12px;
    /* background: #ea5325 !important; */
    color: #ea5325;
    text-transform: uppercase;
    margin: 0 0 0 5px;
    border: 2px solid #ea5325 !important;
}
.button__promo:focus{
	/*border: 1px solid black !important;*/
}
	.present__info{

   
	}
    .promo__info {
        display: flex;
        justify-content: space-between;
    }

    .btn__order {}

    .btn-form-buy {
        text-transform: uppercase;
        color: white;
        background: #ea5325 !important;
        font-family: 'HelveticaNueRoman';
        padding: 15px 70px;
        border-radius: 50px;
        float: right;
    }

    /*------------------MODAL DETAIL--------------------*/

    .modal {
        display: block;
        width: 800px;
        max-width: 100%;
        height: 500px;
        max-height: 100%;
        position: fixed;
        z-index: 999999;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        background: white;
        border-radius: 20px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        font-family: 'HelveticaNueRoman';
    }

    .popup-fade-detail:before {
        content: '';
        background: #000;
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        /*background: linear-gradient(180deg, rgba(251, 150, 72, 1) 50%, rgba(255, 163, 72, 1) 100%);*/
        background: #F2E3DA;
        z-index: 9999;
    }

    .closed {
        display: none;
    }

    .modal-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 50;
    }

    .modal-guts {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
    }

    .left-mod {
        width: 56%;
        position: relative;
    }
    .icon-detail__product{
       /* position: relative;*/
    }

    .right-mod {
        position: relative;
        padding: 0 0 0 25px;
        overflow: hidden;
        width: 50%;
        background-color: rgb(228, 228, 228);
        border-radius: 0 20px 20px 0;
    }
    .icon__left {
        height: 100%;
        display: flex;
        align-items: center;
    }

    .text_before {
        position: absolute;
        top: 20px;
        left: 7%;
        width: 92%;
        height: 80%;
        margin: 40px 0;
        overflow: auto;
        padding: 0 10px 0 0;
    }
    #text_before::-webkit-scrollbar {
        width: 7px;
        margin: 0 15px;
    }

    #text_before::-webkit-scrollbar-thumb {
        background-color: #babfc2;
        border-radius: 15px;
    }

    * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    .modal .close-button {
        position: absolute;
        /* don't need to go crazy with z-index here, just sits over .modal-guts */
        z-index: 1;
        top: 10px;
        /* needs to look OK with or without scrollbar */
        right: 20px;
        border: 0;
        background: black;
        color: white;
        padding: 5px 10px;
        font-size: 1.3rem;
    }

    .open-button {
        border: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: lightgreen;
        color: white;
        padding: 10px 20px;
        border-radius: 10px;
        font-size: 21px;
    }

    .button__block {
        position: absolute;
        height: 20%;
        width: 100%;
        right: 0;
        left: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .footer-button {
        text-transform: uppercase;
        color: white;
        font-family: HelveticaNueRoman;
        border-radius: 50px;
        background-color: orangered !important;
        padding: 15px 135px;
        cursor: pointer;
        transition: all 0.6s ease 0s;
        border: none !important;
    }

    .icon__left img {
         /*position: absolute; 
         top: 0; 
        bottom: 0; 
        right: 0; 
         left: 0; */
        margin: auto auto;
        width: 85%;
        display: flex;
        align-items: center;
    }

    .header-modal {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding:10px 0 0 0;
    }

    .popup-close {
        margin-right: 25px;
        color: white;
        float: right;
        font-size: 20px;
        font-weight: bold;
        background-color: black;
        padding: 2px 8px;
        border-radius: 100%;
    }

    .detail-name h1 {
        font-family: 'HelveticaNueBold';
        text-transform: uppercase;
        font-size: 20px;
    }

    .detail-name {
        margin: 12px 12px 8px 0;
    }

    .compound-text p {
        font-size: 10px;
        color: rgb(131, 131, 131);
    }

    .text-weight p {
        font-size: 10px;
        color: rgb(161, 161, 161);
    }

    .text-weight {
        margin: 10px 0 0 0;
    }

    .buttons-modal {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        
    }

    .choice__box {
        display: flex;
        flex-wrap: wrap;
    }

    .item__choice {
        background-color: white;
        padding: 10px;
        border-radius: 10px;
        margin: 10px 20px 0 0;
        border: none !important;
        cursor: pointer;
    }

    .choice__product {
        width: 80px;
        height: 90px;
        background-size: 80px 90px;
        background-repeat: no-repeat;
    }

    .title__choice {
        font-family: 'HelveticaNueBold';
        text-transform: uppercase;
        font-size: 13px;
        margin: 20px 0 10px 0;
    }

    .modal__choice-two {
        margin: 0 0 50px 0;
    }

    .description_item {
    font-family: 'HelveticaNueBold';
    font-size: 12px;
    text-align: center;
    margin: 15px 0;
}

    /*------------------BUTTONS SIZE----------------*/
    .pizza__size_box{
        margin: 15px 0 15px 0;
    }
    .pizza__size label {
        border-radius: 50px;
        display: block;
        left: 0px;
        top: 0;
        position: relative;
        width: 200px;
        height: 25px;
        z-index: 10;
        text-align: center;
        font-size: 10px;
        color: black;
        font-family: 'HelveticaNueBold';
        background: #ffffff;
        -webkit-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -moz-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -ms-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -o-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        cursor: pointer;
    }

    .pizza__size label:before {
        color: black !important;
    }

    .pizza__size label:after {
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        border-radius: 50px;
        content: "30 см.";
        width: 100px;
        height: 25px;
        position: absolute;
        left: 0px;
        top: 0px;
        bottom: 0;
        right: 0;
        background: rgb(255, 73, 7);
        -webkit-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -moz-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -ms-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        -o-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
        cursor: pointer;
    }

    .check-size {
        display: none;
    }

    .check-size:checked+label {
        left: 0px;
        color: black;
    }

    .check-size:checked+label:after {
        left: 100px;
        background: rgb(255, 73, 7);
        content: "35 см.";
        color: white;
    }

    .pizza__size {
        margin: 15px 0 15px 0;
    }

    /*-------------AMOUNT----------------*/

    .amount {
        
    }

    .amount span {
        padding: 4px 10px;
        font-size: 20px;
        width: 20px;
        height: 20px;
        background: rgb(255, 73, 7);
        cursor: pointer;
        text-align: center;
        color: white;
        border-radius: 100%;
    }

    .amount span:hover {
        background: rgb(255, 73, 7);
    }

    .amount input {
        width: 30px;
        text-align: center;
        border: none !important;
        outline: none !important;
        background-color: rgb(228, 228, 228);
        font-family: 'HelveticaNueBold';
    }

    /*LOADER*/

    #preloader {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #ffffff;
        z-index: 999999;
    }

    #preloader.hide-preloader {
        animation: hidePreloader 1s;
    }

    #preloader.preloader-hidden {
        display: none;
    }

    @keyframes hidePreloader {
        0% {
            opacity: 1;
        }
        100% {
            opacity: 0;
        }
    }