@media (max-width: 479px){
    /*---------------
        Main styles
    ---------------*/
    body{
        font-size: 16px;
        line-height: 26px;
    }


    .text_block h3{
        font-size: 18px;
        line-height: 28px;

        margin-bottom: 10px;
    }

    .text_block h4 {
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 10px;
    }

    .text_block p,
    .text_block ul {
        margin-bottom: 10px;
    }


    .main_title{
        font-size: 24px;
    }


    .form .input{
        padding: 0 20px;
    }

    .form textarea{
        padding: 15px 20px;
    }

    .form .submit_btn{
        display: block;
        width: 100%;
    }
    /*---------------
        Header
    ---------------*/
    header .logo img{
        max-width: 190px;
    }
    /*---------------
        Main section
    ---------------*/
    .main_banner .slide{
        padding: 15px 15px 230px;
    }
    .main_banner .slide .title{
        font-size: 30px;
        line-height: 35px;
    }
    .main_banner .slide .bg.mob_position{
        object-position: center;
    }


    .about_section{
        margin-top: 50px;
    }
    .about_section .text_block h3{
        line-height: 28px;
    }
    .about_section.composition{
        margin-top: 50px;
    }


    .phases .text .text_block{
        font-size: 16px;
    }
    .phases .box .item .number{
        width: 40px;
        height: 55px;

        flex-shrink: 0;
    }
    .phases .box .item .title{
        font-size: 12px;
    }
    .phases .box .item .desc .top{
        font-size: 18px;
    }
    .phases .box .item .desc .bot{
        font-size: 12px;
    }
    .phases .slide .text_block{
        font-size: 16px;
    }
    .phases .slide .text_block h3{
        font-size: 17px;
    }


    .formula .main_title{
        font-size: 18px;
    }
    .formula .line{
        margin-top: 30px;
        margin-left: -5px;
    }

.formula .line .item {
    margin-left: 5px;
}

    .formula .line .sum{
        width: 20px;
    }
    .formula .line .sep{
        font-size: 30px;

        margin-top: 3px;
    }


.formula .line .num span {
    font-size: 60px;
    line-height: 36px;
    height: 42px;
}
    .formula .line .num .note{
        font-size: 10px;
        line-height: 14px;
        height: 28px;
        letter-spacing: -0.9px;
    }


    .history{
        margin-top: 50px;
    }


    .components{
        margin-top: 50px;
    }
    .article + .components{
        margin-top: 50px;
    }


    .article .box{
        padding: 15px;
    }

    /*---------------
        Footer
    ---------------*/
    footer .logo{
        margin: 0 auto;
    }
    footer .columns .col{
        width: 100%;

        text-align: center;
    }
    footer .menu .item{
        width: 100%;

        text-align: center;
    }
    footer .socials{
        justify-content: center;
    }

    /*---------------
       PopUp
    ---------------*/
    .modal{
        padding: 50px 15px 25px;
    }

    .modal_title{
        font-size: 23px;
        line-height: 26px;
    }

    .product_info .image .thumb{
        height: auto;
        padding-bottom: 100%;
    }

    .component_modal .data{
        padding: 30px 20px 50px;
        min-height: 495px;
    }

    .component_modal .hidden{
        display: none;
    }

    .component_modal .read_more{
        display: block;
    }

    .modal .nav button{
        top: auto;
        bottom: 10px;
        margin-top: 0;
    }
}
