@media (max-width: 1023px){
    /*---------------
        Main styles
    ---------------*/
    .text_block h3{
        font-size: 26px;

        margin-bottom: 25px;
    }


    .main_title{
        font-size: 38px;
    }
    /*---------------
        Header
    ---------------*/
    header .menu{
        padding: 0 15px;
    }
    /*---------------
        Main section
    ---------------*/
    .main_banner{
        padding: 0;
    }


    .products{
        margin-top: 70px;
    }
    /*.products .item .thumb .detail{
        display: none;
    }
    .products .item .name br{
        display: none;
    }*/


    .about_section .img{
        width: 100%;
    }
    .about_section .text_block{
        width: 100%;
        margin-top: 30px;
    }
    .about_section .text_block h3{
        line-height: 34px;
    }
    .about_section.composition .columns{
        margin-top: 25px;
    }
    .about_section.composition .img{
        width: 100%;
    }
    .about_section.composition .text_block{
        width: 100%;
    }


    .phases{
        margin-top: 70px;
    }
    .phases .box .item .number{
        width: 95px;
    }
    .phases .box .item .title{
        font-size: 22px;
        line-height: normal;
    }
    .phases .box .item .desc .bot{
        font-size: 22px;
        line-height: normal;
    }
    .phases .box .item .desc .top{
        font-size: 30px;
        line-height: normal;
    }
    .phases .slide .text_block{
        font-size: 18px;
        line-height: normal;
    }
    .phases .slider.owl-carousel .owl-nav button{
        top: 8px;
    }


    .formula{
        margin-top: 50px;
        padding: 30px;
    }
    .formula .line .sum{
        width: 60px;
    }
    .formula .line .sep{
        font-size: 80px;

        margin-top: 12px;
    }
    .formula .line .num span{
        font-size: 160px;
        line-height: 105px;
        height: 125px;
    }
    .formula .line .num .note{
        font-size: 14px;
        line-height: 24px;

        height: 44px;
        margin-top: 15px;
    }


    .history{
        margin-top: 70px;
    }
    .history .box_img{
        width: 100%;
    }
    .history .text_block{
        width: 100%;
        margin-top: 30px;
        padding: 0;
    }
    .history .line{
        padding: 0;
    }
    .history .line + .line{
        margin-top: 50px;
    }

    .history .line:nth-child(2n) .text_block{
        padding: 0;
    }


    .components{
        margin-top: 78px;
    }
    .components .main_title{
        margin-bottom: 30px;
    }
    .components .grid{
        margin: 0;
    }
    .components .grid .item{
        width: 100%;
        margin: 0;
    }
    .components .item button:hover .title {
        transform: translateY(0);
    }


    .article .box{
        padding: 30px;
    }

    /*---------------
        Footer
    ---------------*/
    footer{
        padding: 50px 0 40px;
    }
    footer .menu{
        display: block;
    }

    footer .columns{
    }
    footer .columns .col:nth-child(3){
        width: 20%;
    }


    /*---------------
       PopUp
    ---------------*/
    .fancybox-slide--html .fancybox-close-small{
        top: 6px;
        right: 18px;
    }

    .modal{
        padding: 50px 30px 30px;
    }

    .product_info .links{
        margin-left: -20px;
    }
    .product_info .links .link{
        margin-left: 20px;
    }


    .component_modal .bg{
        opacity: .2;
    }
    .component_modal .data{
        min-height: 1px;
    }
    .component_modal .content{
        max-width: 100%;
    }
    .component_modal .text_block.small{
        max-width: 100%;
    }
}