@media all and (min-width: 1201px) {
    .content_about_us {
        right: 40px;
    }
    .box_img_about_us .img_about_us {
        width: 700px;
        height: 350px;
    }
    .box_img_about_us .img_about_us {
        left: -150px;
    }
    .box_contact_footer {
        width: 55%;
    }
}

@media all and (min-width: 1400px) {
    .content_about_us {
        right: 100px;
    }
    .box_img_about_us .img_about_us {
        width: 800px;
        height: 400px;
    }
    .box_img_about_us .img_about_us {
        left: -220px;
    }
    .box_contact_footer {
        width: 52%;
    }
}

@media all and (min-width: 1500px) {
    .contact_footer {
        margin-right: 100px;
    }
    .menu_header .nav_menu ul li a {
        font-size: 16px;
    }
    .menu_header .nav_menu ul li {
        padding: 15px 20px;
    }
    .content_about_us {
        right: 130px;
    }
    .box_content_about_us {
        width: 65%;
    }
    .box_img_about_us {
        width: 35%;
    }
}

@media all and (min-width: 1921px) {
    .section_about_us {
        height: 840px;
    }
}

@media all and (max-width: 1200px) {
    .container {
        max-width: 1001px !important;
    }
    .slider_service {
        padding-bottom: 60px;
    }
    .logo {
        left: -15px;
    }
    .box_content_about_us {
        width: 55%;
    }
    .menu_header .nav_menu ul li a {
        font-size: 14px;
    }
    .menu_header .nav_menu ul li {
        padding: 15px 12px;
    }
    .content_about_us {
        width: 500px;
        left: 15px;
        right: 0;
    }
    .title_about_us h1,
    .title_about_us h2 {
        font-size: 30px;
        line-height: 40px;
    }
    .des_about_us {
        width: 380px;
        margin: 15px 0 30px;
    }
    .box_play_video a,
    .box_view_more a {
        font-size: 14px;
        line-height: 40px;
    }
    .box_view_more {
        width: 180px;
        height: 40px;
    }
    .box_view_more::before {
        width: 180px;
        height: 40px;
    }
    .box_play_video {
        width: 180px;
        height: 40px;
    }
    .list_contact p a,
    .list_contact p,
    .box_product .product .name_product strong,
    .des_about_us p {
        font-size: 14px;
        line-height: 22px;
    }
    .box_img_about_us {
        width: 45%;
    }
    .box_img_about_us .img_about_us {
        left: -150px;
        width: 600px;
        height: 300px;
    }
    .box_contact_footer::after,
    .section_product::after,
    .section_service::after,
    .section_about_us::before {
        font-size: 90px;
        line-height: 64px;
    }
    .scroll {
        right: 0;
    }
    .scroll .text_scroll {
        font-size: 12px;
    }
    .scroll .mouse {
        right: 39px;
    }
    .title_products h2,
    .title_services h2 {
        font-size: 24px;
        line-height: 32px;
    }
    .title_services::before {
        right: 215px;
        top: 0;
    }
    .title_products.center::after {
        right: 360px;
        top: 0px;
    }
    .title_products::before {
        left: 360px;
        top: 0px;
    }
    .coppyright strong,
    .box_service .service .name_service strong {
        font-size: 16px;
        line-height: 24px;
    }
    .box_product {
        width: 33.33%;
    }
    .box_contact_footer {
        width: 550px;
        background: #2C2B31;
    }
    .contact_footer {
        width: 500px;
    }
    .box_mapfooter {
        width: calc(100% - 550px);
    }
    .box_mapfooter iframe {
        width: 100%;
        left: 0;
    }
    .form_contact_mail form input {
        width: 355px;
    }
    .section_about_us {
        height: 600px;
    }
    .close_blog,
    .popup img.close_video {
        top: 15px;
    }
    .close_blog img,
    .popup img.close_video {
        width: 20px;
    }
    .box_content_detail_blog {
        width: 100%;
    }
    .title_content_blog h1 {
        font-size: 25px;
        line-height: 35px;
    }
    .content_blog h2 {
        font-size: 22px;
        line-height: 30px;
    }
    .content_blog p strong {
        font-size: 16px;
        line-height: 24px;
    }
    .content_blog p {
        font-size: 14px;
        line-height: 22px;
    }
}

@media all and (max-width: 1000px) {
    .container {
        max-width: 801px !important;
    }
    .logo img {
        height: 40px;
    }
    .logo {
        left: -30px;
    }
    .menu_header .nav_menu ul li a {
        font-size: 12px;
    }
    .menu_header {
        left: 140px;
        top: 5px;
    }
    .box_hotline_header a {
        font-size: 14px;
        line-height: 38px;
    }
    .title_about_us h2,
    .title_about_us h1 {
        font-size: 28px;
        line-height: 38px;
    }
    .box_hotline_header::before,
    .box_hotline_header {
        width: 180px;
        height: 38px;
    }
    .box_content_about_us {
        width: 62%;
    }
    .box_img_about_us {
        width: 38%;
    }
    .box_img_about_us .img_about_us {
        left: -100px;
        width: 400px;
        height: 200px;
    }
    .box_contact_footer::after,
    .section_product::after,
    .section_service::after,
    .section_about_us::before {
        font-size: 80px;
        line-height: 56px;
    }
    .section_service {
        background-position: -118% top;
    }
    .scroll {
        bottom: -25px;
    }
    .box_product {
        width: 50%;
    }
    .box_contact_footer {
        width: 430px;
    }
    .contact_footer {
        padding: 60px 0;
        width: 400px;
    }
    .logo_footer {
        width: 200px;
        margin-bottom: 15px;
    }
    .coppyright {
        width: 100%;
        border: 0;
        padding: 0;
    }
    .coppyright strong {
        font-size: 14px;
        line-height: 22px;
    }
    .box_mapfooter {
        width: calc(100% - 430px);
    }
    .form_contact_mail {
        margin: 20px 0 0;
    }
    .form_contact_mail form input {
        margin: 0;
        font-size: 14px;
        line-height: 22px;
        clear: both;
        float: none;
        width: 100%;
        margin-bottom: 15px;
    }
    .form_contact_mail form button {
        float: right;
        font-size: 14px;
        line-height: 14px;
    }
    .list_contact {
        padding: 20px 0;
    }
    .title_content_blog h1 {
        font-size: 22px;
        line-height: 32px;
    }
    .content_blog h2 {
        font-size: 20px;
        line-height: 30px;
    }
    .content_blog p strong {
        font-size: 14px;
        line-height: 22px;
    }
    .content_blog .hotline_order {
        font-size: 12px;
    }
    #player {
        width: 760px;
        height: 430px;
    }
    .messenger_fixed {
        bottom: 10px;
        right: 15px;
    }
    .zalo {
        bottom: 75px;
        right: 15px;
    }
    .ring {
        bottom: 140px;
        right: 15px;
    }
}

@media all and (max-width: 800px) {
    .container {
        max-width: 601px !important;
    }
    .banner_home {
        display: none;
    }
    .section_about_us {
        display: block;
    }
    .content_blog .img_desktop {
        display: none;
    }
    .content_blog .img_mobile {
        display: block;
    }
    header {
        position: relative;
        height: 120px;
        background: #0C0C0C;
    }
    .logo {
        width: max-content;
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .menu_header {
        top: 60px;
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .scroll,
    .box_hotline_header {
        display: none;
    }
    .box_contact_footer::after,
    .section_product::after,
    .section_service::after,
    .section_about_us::before {
        font-size: 76px;
        line-height: 52px;
    }
    .box_content_about_us {
        z-index: 99;
        height: max-content;
        width: 100%;
    }
    .box_content_about_us::before {
        display: none;
    }
    .section_about_us::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 39.76%, rgba(0, 0, 0, 0.5) 100%);
    }
    .section_about_us {
        height: 600px;
    }
    .content_about_us {
        width: 440px;
        top: 30px;
        margin: 0 auto;
        z-index: 10;
        left: 0;
        right: 0;
    }
    .box_img_about_us {
        width: 100%;
        z-index: 10;
        margin: 0 auto;
    }
    .box_img_about_us .img_about_us {
        width: 440px;
        height: 220px;
        left: 0;
        right: 0;
        top: auto;
        bottom: 60px;
        margin: 0 auto;
    }
    .section_service {
        background: #2C2B31;
    }
    .title_products h2,
    .title_services h2 {
        font-size: 22px;
    }
    .title_services::before {
        right: 195px;
    }
    .slider_service {
        padding-bottom: 40px;
    }
    .coppyright strong,
    .box_service .service .name_service strong {
        font-size: 14px;
        line-height: 22px;
    }
    .logo_products {
        width: 100px;
    }
    .title_products.center::after,
    .title_products::before {
        display: none;
    }
    .box_contact_footer {
        width: 100%;
    }
    .contact_footer {
        width: 100%;
        padding: 50px 15px 80px;
    }
    .form_contact_mail form input {
        width: calc(100% - 140px);
        float: left;
        clear: none;
    }
    .logo_footer {
        float: none;
        width: 200px;
        margin: 0 auto 25px;
    }
    .box_mapfooter {
        width: 100%;
        height: 400px;
        position: relative;
    }
    .box_mapfooter iframe {
        position: relative;
    }
    .des_about_us {
        width: 100%;
    }
    .title_content_blog h1 {
        font-size: 20px;
        line-height: 30px;
    }
    #player {
        width: 600px;
        height: 340px;
    }
    .messenger_fixed {
        right: 10px;
    }
    .zalo {
        right: 10px;
    }
    .ring {
        right: 10px;
    }
}

@media all and (max-width: 600px) {
    .container {
        max-width: 415px !important;
    }
    .section_about_us {
        height: 560px;
    }
    .content_about_us {
        width: 100%;
        padding: 0 15px;
    }
    .title_about_us h1,
    .title_about_us h2 {
        font-size: 24px;
        line-height: 34px;
    }
    .box_view_more a {
        font-size: 12px;
    }
    .box_play_video a {
        font-size: 12px;
    }
    .box_img_about_us .img_about_us {
        width: 100%;
        padding: 0 15px;
        height: auto;
    }
    .box_contact_footer::after,
    .section_product::after,
    .section_service::after {
        font-size: 88px;
        line-height: 62px;
        text-align: center;
        width: 100%;
    }
    .section_about_us::before {
        font-size: 52px;
        line-height: 38px;
        text-align: center;
        width: 100%;
    }
    .slider_service {
        padding-bottom: 70px;
    }
    .box_play_video,
    .box_view_more::before,
    .box_view_more {
        width: 160px;
        height: 36px;
    }
    .box_play_video a,
    .box_view_more a {
        line-height: 36px;
    }
    .title_products,
    .title_services,
    .title_products h2,
    .title_services h2 {
        width: 100%;
        text-align: center;
    }
    .title_products::before,
    .title_services::before {
        display: none;
    }
    .box_product {
        width: 100%;
    }
    .box_product .product .name_product {
        height: auto;
        margin: 15px 0 25px;
    }
    .form_contact_mail form input {
        height: 33px;
        width: calc(100% - 125px);
    }
    .form_contact_mail form button {
        font-size: 12px;
        line-height: 12px;
        width: 115px;
        height: 34px;
    }
    .list_product {
        padding: 0 15px;
    }
    #player {
        width: 400px;
        height: 226px;
    }
    .box_content_detail_blog {
        padding: 50px 20px 50px 15px
    }
}

@media all and (max-width: 424px) {
    .container {
        max-width: 100% !important;
    }
    .menu_header,
    .menu_header .nav_menu,
    .menu_header .nav_menu ul {
        max-width: 100%;
    }
    .menu_header .nav_menu ul li {
        padding-bottom: 5px;
    }
    .menu_header .nav_menu ul li:last-child {
        padding-top: 0;
        float: none;
        clear: both;
        margin: 0 auto;
    }
    .title_about_us h1,
    .title_about_us h2 {
        font-size: 21px;
    }
    .section_about_us::before {
        font-size: 46px;
        line-height: 34px;
    }
    .form_contact_mail form input {
        width: 100%;
    }
    .box_contact_footer::after,
    .section_product::after,
    .section_service::after {
        font-size: 76px;
        line-height: 54px;
    }
    .section_about_us {
        height: 500px;
    }
    .box_img_about_us .img_about_us {
        bottom: 45px;
    }
    .title_products h2,
    .title_services h2 {
        font-size: 20px;
    }
    #player {
        width: 360px;
        height: 204px;
    }
}