html{
    font-size: 16px;
}
body {
    font-family: "Public Sans", sans-serif;
}
.sgap-1{
    gap: 0.5rem;
}
.sgap-2{
    gap: 1rem;
}
.sgap-3{
    gap: 1.5rem;
}
.sgap-4{
    gap: 2rem;
}
.sgap-5{
    gap: 2.5rem;
}
.sgap-6{
    gap: 3rem;
}
.sgap-7{
    gap: 3.5rem;
}
.sgap-8{
    gap: 4.5rem;
}
.site-header{
    border-bottom: 1px solid rgba(0, 44, 86, 0.40);
    position: sticky;
    top: 0;
    z-index: 99;
}
.admin-bar .site-header{
    top: 32px;
}
.navbar{
    background: #fff;
    padding: 22px 0;
}
.navbar_mb{
    width: 100%;
}
.navbar .navbar-nav{
    gap: 46px;
    margin-bottom: 0;
    margin-left: auto;
}
.navbar .navbar-nav .site-logo{
    width: 165px;
}
.navbar .container-fluid{
    max-width: 1152px;
    margin: 0 auto;
    padding: 0;
}
.navbar .navbar-nav .menu-item .nav-link{
    font-weight: 500;
    font-size: 20px;
    line-height: 22px;
    padding: 0;
}
.navbar-toggler:focus{
    outline: none;
    box-shadow: none;
}
.navbar-toggler.collapsed .icon_x{
    display: none;
}
.navbar-toggler{
    border: 0;
}
.navbar-toggler.collapsed{
    border: 1px solid rbga(0,0,0,0.15);
}
.navbar-toggler .icon_x{
    display: block;
}
.navbar-toggler .navbar-toggler-icon{
    display: none;
}
.navbar-toggler.collapsed .navbar-toggler-icon{
    display: block;
}
.mt_banner_section{
    background: url("./images/meegatel_web_banner.png") no-repeat;
    padding: 96px 216px;
}
.banner_left{
    max-width: 756px;
}
.banner_left .banner-title{
    color: #fff;
    font-size: 72px;
    font-weight: 700;
    line-height: 86px;
    letter-spacing: -1.44px;
    margin-bottom: 0;
}
.banner-text{
    color: #D7E2E4;
    font-size: 24px;
    line-height: 32px;
    font-weight: 400;
    letter-spacing: -0.12px;
    max-width: 606px;
    margin-bottom: 0;
}
.btn-orange{
    border-radius: 16px;
    background: linear-gradient(90deg, #EA592D 0%, #F4511E 100%);
    box-shadow: 0px 1px 5px 0px rgba(238, 122, 87, 0.10), 0px 2px 2px 0px rgba(238, 122, 87, 0.12), 0px 3px 1px -2px rgba(238, 122, 87, 0.20);
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    font-family: Inter, sans-serif;
    padding: 19px 16px;
}
.btn-orange:hover{
    color: #fff;
}
.btn-large{
    width: 354px;
}
.mt_about{
    padding: 96px 216px;
    position: relative;
    background: #FCFCFC;
}
.trust_partner .head_trust_partner{
    max-width: 760px;
    margin: 0 auto;
}
.img_partner{
    text-align: center;
    max-width: 1152px;
    margin: 0 auto;
}
.img_partner img{
    width: 100%;
    border-radius: 28px;
    border: 1.5px solid rgba(0, 0, 0, 0.00);
    box-shadow: 0px 16px 30px 0px rgba(179, 211, 240, 0.40), 0px 12px 24px -2px rgba(153, 201, 236, 0.40);
}
.efficiency{
    max-width: 984px;
    margin: 0 auto;
}
.text{
    font-size: 24px;
    line-height: 32px;
    color: #002C56;
    margin-bottom: 0;
}
.partner-with-megaTel-today{
    font-weight: 700;
}
.mt_about .box_stack{
    gap: 120px;
}
.box_brand{
    gap: 36px;
}
.list_brands{
    list-style: none;
    display: flex;
    gap: 64px;
    flex-wrap: wrap;
}
.section_title{
    font-family: "Roboto Serif" , sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 52px;
    letter-spacing: -0.96px;
    color: #00468C;
    margin-bottom: 0;
}
.why_choose .reasons {
    margin-top: 54px;
    row-gap: 54px;
    flex-wrap: wrap;
    column-gap: 96px;
}
.why_choose .reasons .reason{
    width: calc(33.333% - (192px / 3));
}
.reason_icon{
    width:76px;
}
.reason_title{
    font-family: 'Roboto Serif' , sans-serif;
    font-size: 28px;
    font-weight: 500;
    line-height: 32px;
    color: #35404A;
}
.reason_text{
    color: #475569;
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 0;
}
.products_services .products{
    column-gap: 36px;
    row-gap: 54px;
    flex-wrap: wrap;
}
.products_services .products .product{
    border-radius: 24px;
    width: calc(33.333% - (72px / 3));
    overflow: hidden;
}
.products_services .products .product .product_data{
    padding: 36px 36px 16px;
}
.products_services .products .product .product_image{
    width: 100%;
}
.product-name{
    color: #fff;
    font-family: 'Roboto Serif' , sans-serif;
    text-align: center;
    font-size: 28px;
    font-weight: 500;
    line-height: 32px;
    margin-bottom: 24px;
}
.product-description{
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 0;
}
.products_services .products .product.view_more{
    background: #fff;
    box-shadow: 0px 2px 4px 1px rgba(147, 156, 159, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn_more{
    color: #35404A;
    font-family: 'Roboto Serif' , sans-serif;
    font-size: 28px;
    font-weight: 500;
    line-height: 32px;
}
.we_work_with-text{
    max-width: 984px;
    margin: 0 auto;
}
.we_work_with .section_title{
    color:#002C56;
}
.blue_box{
    border-radius: 16px;
    border: 1px solid #D7E2E4;
    background: #00468C;
    padding: 42px;
    width: calc(33.333% - (48px / 3));
}
.blue_box .box-title{
    color: #FFF;
    font-size: 28px;
    font-weight: 500;
    line-height: 32px;
}
.box-content{
    color: #FFF;
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
}
.end_section h3{
    color: #002C56;
    text-align: center;
    font-family: "Roboto Serif" , sans-serif;
    font-size: 64px;
    font-style: normal;
    font-weight: 400;
    line-height: 68px;
    letter-spacing: -1.28px;
    max-width: 1260px;
    margin: 0 auto;
}
.end_section .user{
    display: flex;
    justify-content: center;
    gap: 16px;
    align-items: center;
}
.end_section .user img{
    width: 64px;
}
.end_section .user .user-data .fullname{
    color: #002C56;
    font-size: 17px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.085px;
}
.end_section .user .user-data .position{
    color: rgba(0, 44, 86, 0.62);
    font-size: 17px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: -0.085px;
}
.mt_partner_megatel_today{
    padding:96px 0;
    background: #FCFCFC;
}
.mt_partner_megatel_today .container-fluid{
    max-width: 1152px;
    padding: 0;
}
.box_partner_with_megatel h3{
    font-family: "Roboto Serif" , sans-serif;
    font-size: 72px;
    font-weight: 700;
    line-height: 86px;
    letter-spacing: -1.44px;
    color:  #002C56;
    margin-bottom: 0;
}
.container-partner{
    align-items: start;
    flex-wrap: wrap;
}
.box_connect{
    max-width: 562px;
}
.box_connect h3{
    font-family: "Roboto Serif" , sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 52px;
    letter-spacing: -0.96px;
    color:  #002C56;
    margin-bottom: 0;
}
.box_connect .box_stack{
    gap: 2.25rem;
    justify-content: center;
    align-items: center;
    border-radius: 28px;
    padding: 42px;
    background: #FFF;
    box-shadow: 0px 16px 30px 0px rgba(179, 211, 240, 0.40);
}
.box_connect .box_stack .text{
    font-size: 20px;
    line-height: 22px;
    letter-spacing: -0.1px;
    text-align: center;
}
.box_partner_with_megatel{
    max-width: 536px;
}
.head_connect{
    gap: 24px;
}
.box_connect .btn-orange{
    padding: 19px 16px;
    width: 170px;
}
.site-footer{
    background: #04182B;
    padding: 54px 0;
}
.site-footer .container-fluid{
    max-width: 1488px;
    padding: 0;
}
.site-footer .foot_row{
    align-items: start;
    gap: 54px;
    margin-bottom: 22px;
    flex-wrap: wrap;
}
.site-footer .footer-logo{
    max-width: 526px;
    width: 526px;
}
.site-footer .footer-logo .logo_image img{
    max-width: 151px;
}
.site-footer .menu_footer{
    max-width: 200px;
    width: 200px;
}
.site-footer .box_subscribe{
    max-width: 400px;
    width: 400px;
}
.list_socials{
    gap: 16px;
    padding-left: 0;
    margin-bottom: 0;
}
.list_socials li img{
    width: 24px;
}
.site-footer .menu_footer .menu_title{
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    line-height: 24px;
    margin-bottom: 12px;
}
.site-footer .menu_footer .menu_items{
    display: flex;
    list-style: none;
    flex-direction: column;
    gap: 12px;
    padding-left: 0;
    margin-bottom: 0;
}
.site-footer .menu_footer .menu_items li{
    list-style: none;
}
.site-footer .menu_footer .menu_items li a{
    color: #D7E2E4;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none;
    font-size: 15px;
}
.box_subscribe h6{
    font-size: 17px;
    font-weight: 800;
    line-height: 24px;
    color: #fff;
    margin-bottom: 4px;
}
.box_subscribe .form_text{
    font-size: 15px;
    line-height: 20px;
    color: #D7E2E4;
}
.box_subscribe .form-field{
    margin-top: 22px;
    gap: 12px;
}
.box_subscribe .email_subscribe{
    width: 272px;
    background: rgba(184, 209, 224, 0.50);
    border: 1.5px solid rgba(255, 255, 255, 0.00);
    border-radius: 16px;
    padding: 12px 16px;
    color: #fff;
    font-size: 15px;

}
.box_subscribe .email_subscribe::placeholder{
    color: #fff;
}
.btn_sub{
    border-radius: 16px;
    border: 1.5px solid rgba(145, 171, 182, 0.80);
    padding: 12px 22px;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
}
.btn_sub:hover{
    border: 1.5px solid rgba(145, 171, 182, 0.80);
    background: rgba(184, 209, 224, 0.50);
    color: #D7E2E4;
}
.copy_right{
    text-align: center;
    padding-top: 22px;
    border-top: 1.5px solid rgba(215, 226, 228, 0.20);
}
.white_text{
    font-size: 15px;
    color: #D7E2E4;
    line-height: 20px;
}
.product_service_banner_section{
    padding: 96px 0;
    background: #EDF9FF;
}
.product_service_banner_section .container-fluid{
    max-width: 1488px;
    height: 529px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}
.banner-right{
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 0;
}
.banner-right img{
    width: 870px;
}
.product_service_banner_section .banner_left{
    max-width: 656px;
    z-index: 1;
}
.banner_left .lead{
    color: #00468C;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 3px;
}
.product_service_banner_section .banner_left .banner-title{
    color : #35404A;
    font-family: "Roboto Serif" , sans-serif;
    font-size: 72px;
    font-weight: 700;
    line-height: 86px;
    letter-spacing: -1.44px;
}
.product_service_banner_section .banner_left .banner-text{
    font-size: 24px;
    color: #35404A;
    line-height: 32px;
    letter-spacing: -0.12px;
    width: 100%;
    max-width: 100%;
    padding-bottom: 48px;
}
.our_products{
    background: #FCFCFC;
    padding: 96px 0;
}
.our_products .container-fluid{
    max-width: 1488px;
}
.steps_product{
    gap: 72px;
}
.product_title{
    gap: 32px;
    align-items: center;
}
.product_title h3{
    color: #002C56;
    font-family: "Roboto Serif" , sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 52px;
    letter-spacing: -0.96px;
}
.step{
    align-items: start;
    gap: 54px;
}
.step .image-step{
    width: 732px;
}
.step .step_content{
    width: 702px;
}
.step .image-step img{
    width: 100%;
}
.step .step_stack{
    gap: 54px;
}
.step .step_content .step_title .step_heading{
    color: #002C56;
    font-family: "Roboto Serif", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 42px;
    letter-spacing: -0.64px;
    position: relative;
}
.step .step_content .step_title .step_heading p{
    margin-bottom: 0;
    z-index: 8;
    position: relative;
}
.step .step_content .step_title .step_heading >span{
    position: absolute;
    color: #EAF4FF;
    font-family: "Roboto Serif", sans-serif;
    font-size: 96px;
    font-weight: 700;
    line-height: 100px;
    letter-spacing: -1.92px;
    left: -43px;
    top: -35px;
    z-index: 1;
}

.step .step_content .step_text{
    color: #35404A;
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.12px;
}
.step .step_content .step_label{
    color: #35404A;
    font-family: "Roboto Serif", sans-serif;
    font-size: 28px;
    font-weight: 500;
    line-height: 32px;
}
.our_services{
    background: #FCFCFC;
    padding: 96px 0;
}
.our_services .container-fluid{
    max-width: 1488px;
}
.our_services .services{
    gap: 32px;
}
.service{
    width: calc(100% - (72px / 3));
    border-radius: 24px;
    background: #EDF9FF;
    display: flex;
    flex-direction: column;
}
.service-text{
    padding: 42px 36px 16px;
}
.service_image img{
    width: 100%;
    max-width: 100%;
}
.service3 .service_image img{
    padding: 75px 0 75px 53px;
}
.service .service-text .step_label{
    color: #35404A;
    font-family: "Roboto Serif", sans-serif;
    font-size: 28px;
    font-weight: 500;
    line-height: 32px;
}
.service .service-text .step_text{
    font-size: 20px;
    line-height: 24px;
}
.partner_services{
    background: #FCFCFC;
    padding: 96px 0;
}
.partner_services .container-fluid{
    max-width: 1152px;
}
.partner_contact h3{
    color: #002C56;
    font-family: "Roboto Serif" , sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 52px;
    letter-spacing: -0.96px;
    margin-bottom: 0;
}
.contact{
    padding: 96px 0;
}
.contact .container-fluid{
    max-width: 1488px;
    padding: 0;
}
.contact h1{
    color: #002C56;
    font-family: "Roboto Serif" , sans-serif;
    font-size: 72px;
    font-weight: 700;
    line-height: 86px;
    letter-spacing: -1.44px;
    margin-bottom: 0;
}
.contact .contact_stack{
    gap: 54px;
    flex-wrap: wrap;
}
.contact .contact_us{
    gap: 54px;
    max-width: 954px;
}
.contact .contact_us .text{
    max-width: 480px;
    letter-spacing: -0.12px;
}
.contact .contact_item .contact_label{
    color: #35404A;
    font-family: "Roboto Serif" , sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
}
.contact_items{
    gap: 36px;
}
.contact .contact_item .contact_text{
    color: #475569;
    font-size: 17px;
    line-height: 24px;
    letter-spacing: -0.085px;
}
.bold-text{
    font-weight: 600;
}
.get_in_touch{
    border-radius: 24px;
    background: #FCFCFC;
    padding: 54px 42px;
    box-shadow: 0px 7px 34px 6px rgba(208, 213, 221, 0.12), 0px 18px 28px 2px rgba(208, 213, 221, 0.14), 0px 9px 11px -5px rgba(208, 213, 221, 0.20);
    max-width: 480px;
}
.get_in_touch h3{
    color: #35404A;
    font-size: 40px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: -0.2px;
    margin-bottom: 0;
}
.get_in_touch .text_title_form{
    color: #475569;
    font-size: 20px;
    line-height: 24px;
}
.get_in_touch .form_touch_stack{
    gap: 42px;
}
.get_in_touch .form_touch_stack input ,.get_in_touch .form_touch_stack textarea {
    border-radius: 12px;
    border: 1px solid #C9CDCF;
    background: #FFF;
    padding: 12px 16px;
    font-size: 17px;
    color: #939C9F;
    line-height: 24px;
}
.get_in_touch .form_touch_stack textarea{
    padding: 6px 12px;
}
.get_in_touch .form_touch_stack input::placeholder ,.get_in_touch .form_touch_stack textarea::placeholder {
    font-size: 17px;
    color: #939C9F;
    line-height: 24px;
}
.get_in_touch .form_touch_stack input:focus ,.get_in_touch .form_touch_stack textarea:focus{
    outline: none;
}
.get_in_touch .form_touch_stack .field_touch .inp_fw{
    width: 100%;
}
.get_in_touch .form_touch_stack .btn-orange{
    font-weight: 600;
    font-size: 16px;
    padding: 16px;
}
.get_in_touch .form_touch_stack .form_stack .d-flex{
    gap: 16px;
}
.get_in_touch .form_touch_stack .form_stack .d-flex .field_touch{
    width: calc(50% - 8px);
}
.get_in_touch .form_touch_stack .form_stack .field_touch .error{
    color: #d32f2f;
    font-size: 14px;
    margin-bottom: 0;
    margin-top: 10px;
}
.get_in_touch .form_touch_stack .form_stack .d-flex .field_touch .inp_touch{
    width: 100%;
}
.privacy-policy{
    padding: 40px 0;
}
.privacy-policy ol > li + li{
    margin-top: 10px;
}
.privacy-policy ol > li .title{
    font-weight: 600;
    font-size: 28px;
}
.privacy-policy ol > li::marker{
    font-weight: 600;
    font-size: 28px;
}
.privacy-policy ol > li > p{
    font-size: 18px;
}
.privacy-policy ol ul{
    list-style: disc;
    padding-left: 20px;
    font-size: 18px;
}
.privacy-policy ol ul li + li{
    margin-top: 8px;
}
.privacy-policy ol li .item{
    margin-top: 12px;
    margin-bottom: 12px;
    font-size: 18px;
}
.privacy-policy ol li .item_first{
    margin-bottom: 12px;
    margin-top: 0;
}
@media (min-width: 992px) {
    .navbar_mb{
        display: none !important;
    }
}
@media (max-width: 1487px)  {
    .contact .container-fluid {
        padding: 36px;
    }
    .contact_items{
        width: 100%;
        max-width: 100%;
    }
    .get_in_touch{
        width: 100%;
        max-width: 100%;
    }
    .site-footer .footer-logo{
        width: auto;
    }
    .site-footer .menu_footer{
        width: auto;
    }
    .site-footer .box_subscribe{
        max-width: 400px;
        width: auto;
    }
}

@media (max-width: 991.98px)  {
    .navbar-collapse{
        position: relative;
    }
    .navbar .navbar-nav .menu-item .nav-link {
        font-size: 15px;
        line-height: 1.4;
        padding: 12px 0;
    }
    .navbar .navbar-nav{
        position: absolute;
        background: #fff;
        width: calc(100% + 192px);
        left: -96px;
        padding: 16px 16px 24px;
        gap: 0;
    }
    .mt_banner_section{
        background: url("./images/meegatel_tablet_banner.png") no-repeat;
        height: 840px;
        padding: 96px 54px;
        background-size: cover;
    }
    .mt_banner_section .container-fluid{
        padding: 0;
    }
    .mt_banner_section .banner_left .banner-title{
        font-size: 48px;
        line-height: 52px;
        letter-spacing: -0.24px;
        text-align: center;
    }
    .mt_banner_section .banner_left > .vstack{
        gap: 20px !important;
        align-items: center;
    }
    .mt_banner_section .banner_left .banner-text{
        text-align: center;
    }
    .mt_about{
        padding: 0;
    }
    .mt_about .container-fluid{
        padding: 0;
    }
    .section_title{
        font-size: 32px;
        line-height: 42px;
    }
    .text{
        font-size: 17px;
        line-height: 1.4;
    }
    .trust_partner .head_trust_partner{
        gap: 24px !important;
    }
    .box_brand{
        gap: 24px;
    }
    .mt_about .box_stack{
        gap: 0;
    }
    .trust_partner{
        padding: 54px 96px 36px;
    }
    .why_choose{
        padding: 54px 96px 36px;
    }
    .why_choose .reasons{
        margin-top: 48px;
        column-gap: 32px;
        row-gap: 32px;
    }
    .why_choose .reasons .reason{
        flex: 1 1 calc(50% - 16px);
    }
    .reason_icon{
        width: 48px;
    }
    .reason_title{
        font-size: 24px;
        font-weight: 500;
        line-height: 32px;
    }
    .reason_text{
        font-size: 15px;
        line-height: 1.4;
    }
    .why_choose .reasons .reason > .vstack{
        gap: 12px !important;
    }
    .products_services{
        padding: 54px 96px 36px;
    }
    .products_services > .vstack{
        gap: 48px !important;
    }
    .products_services .products{
        column-gap: 24px;
        row-gap: 16px;
    }
    .products_services .products .product {
        width: calc(50% - (24px / 2));
    }
    .we_work_with{
        padding: 54px 96px 36px;
    }
    .works{
        flex-wrap: wrap;
    }
    .blue_box{
        width: 100%;
        padding: 32px;
        text-align: center;
    }
    .blue_box .box-title{
        font-size: 24px;
        line-height: 32px;
    }
    .box-content{
        font-size: 15px;
        line-height: 1.4;
    }
    .end_section{
        padding: 12px 96px 36px;
    }
    .end_section h3{
        font-size: 40px;
        line-height: 140%;
        letter-spacing: -0.8px;
    }
    .end_section > .vstack{
        gap: 32px !important;
    }
    .end_section .user img{
        width: 54px;
    }
    .end_section .user .user-data .fullname{
        font-size: 15px;
        line-height: 20px;
    }
    .end_section .user .user-data .position{
        font-size: 15px;
        line-height: 20px;
    }
    .mt_partner_megatel_today{
        padding: 54px 96px;
    }
    .box_partner_with_megatel h3{
        font-size: 48px;
        line-height: 52px;
        letter-spacing: -0.24px;
        text-align: center;
    }
    .box_partner_with_megatel .text{
        text-align: center;
    }
    .container-partner{
        gap: 32px !important;
    }
    .box_connect .head_connect .mail{
        width: 28px;
    }
    .box_connect .head_connect h3{
        font-size: 28px;
        font-weight: 700;
        line-height: 32px;
    }
    .box_connect .box_stack{
        gap: 16px !important;
        padding: 32px;
    }
    .box_connect .box_stack .btn-orange{
        margin-top: 16px;
    }
    .box_connect .box_stack .text{
        font-size: 15px;
        line-height: 1.4;
    }
    .box_connect .btn-orange{
        padding: 16px;
        width: auto;
        font-size: 16px;
        line-height: 24px;
        font-weight: 600;
    }
    .site-footer{
        padding: 36px 96px;
    }
    .site-footer .foot_row{
        row-gap: 32px;
        column-gap: 24px;
        margin-bottom: 24px;
    }
    .site-footer .footer-logo{
        width: 100%;
        max-width: 100%;
    }
    .site-footer .footer-logo > .vstack{
        gap: 24px !important;
    }
    .site-footer .menu_footer{
        width: calc(50% - 12px);
        max-width:  calc(50% - 12px);
    }
    .site-footer .box_subscribe{
        width: 100%;
        max-width: 100%;
    }
    .box_subscribe .form-field{
        gap: 16px;
    }
    .box_subscribe .email_subscribe{
        width: 100%;
    }
    .copy_right{
        padding-top: 24px;
    }
    .navbar{
        padding: 16px 96px;
    }
    .navbar_mb{
        padding: 0;
    }
    .site-logo{
        width: 151px;
    }
    .navbar .navbar-nav{
        gap: 0;
    }
    .navbar .navbar-nav .site-logo{
        display: none;
    }
    .admin-bar .site-header{
        top: 0;
    }
    .navbar .navbar-nav .menu-item .nav-link{
        font-size: 17px;
        line-height: 1.4;
        padding: 12px 0;
    }
    .product_service_banner_section .container-fluid{
        background: none;
        height: auto;
        max-width: 100%;
    }
    .product_service_banner_section{
        padding: 36px 24px;
    }
    .banner_left .lead{
        font-size: 15px;
        letter-spacing: 1px;
        line-height: 1;
    }
    .image_center{
        width: 100%;
    }
    .image_bottom{
        width: 100%;
        margin-top: 16px;
    }
    .product_service_banner_section .banner_left .banner-title{
        font-size: 28px;
        line-height: 32px;
    }
    .product_service_banner_section .banner_left .banner-text{
        font-size: 15px;
        line-height: 1.4;
        padding-bottom: 0;
        text-align: center;
    }
    .product_service_banner_section .banner_left{
        max-width: 100%;
    }
    .product_service_banner_section .banner-text{
        max-width: none;
    }
    .our_products{
        padding: 36px 16px 24px;
    }
    .product_title h3{
        font-size: 32px;
        line-height: 42px;
    }
    .product_title{
        gap: 12px;
        justify-content: center;
    }
    .product_title svg{
        width:33px;
        height: 32px;
    }
    .steps_product{
        gap: 48px;
    }
    .step{
        flex-wrap: wrap;
    }
    .step.reverse_mb{
        flex-direction: column-reverse;
    }
    .step .image-step{
        width: 100%;
    }
    .step .step_content {
        width: 100%;
    }
    .step .step_content .step_title .step_heading{
        padding-left: 24px;
        font-size: 24px;
        line-height: 32px;
    }
    .step .step_content .step_title .step_heading >span{
        left: 0;
        font-size: 48px;
        line-height: 52px;
        top: -12px;
    }
    .step .step_content .step_text{
        font-size: 17px;
        line-height: 1.4;
    }
    .step .step_content .step_label{
        font-size: 17px;
        line-height: 24px;
    }
    .step .step_stack{
        gap: 32px;
    }
    .step .step_stack .vstack{
        gap: 16px;
    }
    .our_services{
        padding: 36px 16px 24px;
    }
    .service-text{
        padding: 24px 24px 12px;
        gap: 16px !important;
    }
    .service .service-text .step_label{
        font-size: 24px;
        line-height: 32px;
    }
    .service .service-text .step_text{
        font-size: 17px;
        line-height: 1.4;
    }
    .our_services .services{
        gap: 24px;
        flex-wrap: wrap;
        align-items: stretch;

    }
    .our_services .container-fluid{
        padding: 0;
    }
    .partner_services .container-fluid{
        padding: 0;
    }
    .service{
        width: calc(50% - 24px / 2 );
    }
    .service3 .service_image img{
        padding: 42px 0 41px 53px;
    }
    .partner_services{
        padding: 36px 16px;
    }
    .partner_contact h3{
        font-size: 24px;
        line-height: 32px;
    }
    .partner_contact{
        gap: 16px !important;
    }
    .contact{
        padding: 36px 24px;
    }
    .contact h1{
        font-size: 48px;
        line-height: 52px;
        text-align: center;
    }
    .contact .contact_us .text{
        max-width: 100%;
        text-align: center;
    }
    .contact_items{
        flex-wrap: wrap;
        gap: 24px;
    }
    .contact_item{
        width: calc(50% - 24px / 2);
    }
    .contact .contact_us{
        gap: 32px;
    }
    .contact .contact_item .contact_label{
        font-size: 20px;
        line-height: 1.4;
    }
    .contact .contact_item .contact_text{
        font-size: 17px;
        line-height: 1.4;
    }
    .get_in_touch{
        max-width: 100%;
        width: 100%;
        padding: 24px 16px;
    }
    .get_in_touch h3{
        font-size: 24px;
        line-height: 1.4;
    }
    .get_in_touch .text_title_form{
        font-size: 17px;
        line-height: 1.4;
    }
    .get_in_touch .form_touch_stack{
        gap: 24px;
    }
    .get_in_touch .form_touch_stack > .vstack{
        gap: 8px !important;
    }
    .get_in_touch .form_touch_stack .form_stack{
        gap: 16px !important;
    }
    .get_in_touch .form_touch_stack input, .get_in_touch .form_touch_stack textarea{
        padding: 9px 12px;
        font-size: 14px;
        line-height: 22px;
    }
    .get_in_touch .form_touch_stack input::placeholder , .get_in_touch .form_touch_stack textarea::placeholder{
        font-size: 14px;
        line-height: 22px;
    }
    .get_in_touch .form_touch_stack .form_stack .d-flex{
        gap: 8px;
    }
    .get_in_touch .form_touch_stack .form_stack .d-flex .field_touch{
        width: calc(50% - 4px);
    }
    .get_in_touch .form_touch_stack .form_stack .d-flex .field_touch .inp_touch{
        width: 100%;
    }
    .get_in_touch .form_touch_stack .btn-orange{
        padding: 12px 16px;
    }
    .contact .container-fluid{
        padding: 0;
    }
}

@media (max-width: 765px)  {
    .navbar .navbar-nav {
        position: absolute;
        background: #fff;
        width: calc(100% + 32px);
        left: -16px;
        padding: 16px 16px 24px;
        gap: 0;
    }
    .mt_banner_section{
        background: url("./images/meegatel_mobile_banner.png") no-repeat;
        height: 654px;
        padding: 36px 16px;
        background-size: cover;
    }
    .mt_banner_section .container-fluid{
        padding: 0;
    }
    .mt_banner_section .banner_left .banner-title{
        font-size: 28px;
        line-height: 32px;
        letter-spacing: -0.14px;
        text-align: center;
    }
    .mt_banner_section .banner_left > .vstack{
        gap: 16px !important;
        align-items: center;
    }
    .mt_banner_section .banner_left .banner-text{
        font-size: 15px;
        line-height: 20px;
    }
    .mt_banner_section .banner_left .btn-large{
        width: 222px;
        font-size: 16px;
        line-height: 24px;
    }
    .section_title{
        font-size: 24px;
        line-height: 32px;
    }
    .text {
        font-size: 15px;
    }
    .trust_partner .head_trust_partner{
        gap: 16px !important;
    }
    .box_brand{
        gap: 24px;
    }
    .mt_about .box_stack{
        gap: 0;
    }
    .trust_partner{
        padding: 36px 16px 0;
    }
    .trust_partner > .vstack{
        gap: 24px !important;
    }
    .trust_partner .efficiency{
        text-align: center;
    }
    .why_choose{
        padding: 36px 16px 24px;
    }
    .why_choose .reasons{
        margin-top: 32px;
        column-gap: 24px;
        row-gap: 24px;
    }
    .why_choose .reasons .reason {
        flex: 1 1 100%;
        text-align: center;
    }
    .reason_icon{
        width: 48px;
    }
    .reason_title{
        font-size: 24px;
        font-weight: 500;
        line-height: 32px;
    }
    .reason_text{
        font-size: 15px;
        line-height: 1.4;
    }
    .why_choose .reasons .reason > .vstack{
        gap: 8px !important;
        align-items: center;
    }
    .products_services{
        padding: 36px 16px 24px;
    }
    .products_services > .vstack{
        gap: 32px !important;
    }
    .products_services .products{
        column-gap: 24px;
        row-gap: 16px;
        padding: 16px 0 0;
    }
    .products_services .products .product {
        width: 100%;
    }
    .products_services .products .product .product_data{
        padding: 24px 24px 12px 24px;
    }
    .product-name{
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 16px;
    }
    .product-description{
        font-size: 14px;
        line-height: 1.4;
    }
    .btn_more{
        padding: 9px 16px;
        line-height: 22px;
        font-size: 14px;
        display: flex;
        gap: 8px;
        align-items: center;
    }
    .btn_more svg{
        width: 16px;
        height: 16px;
    }
    .we_work_with{
        padding: 36px 16px 24px;
    }
    .blue_box{
        padding: 24px;
    }
    .blue_box .box-title{
        font-size: 20px;
        line-height: 24px;
    }
    .box-content{
        font-size: 14px;
        line-height: 1.4;
    }
    .end_section{
        padding: 24px 16px;
    }
    .end_section h3{
        font-size: 32px;
        line-height: 1.4;
        letter-spacing: -0.64px;
    }
    .end_section > .vstack{
        gap: 24px !important;
    }
    .end_section .user img{
        width: 48px;
    }
    .end_section .user .user-data .fullname{
        font-size: 14px;
        line-height: 1.4;
    }
    .end_section .user .user-data .position{
        font-size: 14px;
        line-height: 1.4;
    }
    .mt_partner_megatel_today{
        padding: 36px 16px 24px;
    }
    .box_partner_with_megatel h3{
        font-size: 40px;
        line-height: 46px;
        letter-spacing: -0.2px;
        margin-bottom: 0;
    }
    .box_partner_with_megatel > .vstack{
        gap: 16px !important;
    }
    .box_partner_with_megatel .text{
        text-align: center;
    }
    .container-partner{
        gap: 32px !important;
    }
    .head_connect{
        gap: 12px !important;
    }
    .box_connect .head_connect h3{
        font-size: 24px;
        font-weight: 700;
        line-height: 32px;
    }
    .box_connect .box_stack{
        gap: 16px !important;
        padding: 32px;
    }
    .box_connect .box_stack .btn-orange{
        margin-top: 16px;
        padding: 12px 16px;
    }
    .box_connect .box_stack .text{
        font-size: 14px;
        line-height: 1.4;
    }
    .box_connect .btn-orange{
        padding: 16px;
        width: auto;
        font-size: 16px;
        line-height: 24px;
        font-weight: 600;
    }
    .site-footer{
        padding: 24px 16px;
    }
    .site-footer .foot_row{
        row-gap: 32px;
        column-gap: 16px;
        margin-bottom: 16px;
    }
    .site-footer .footer-logo > .vstack{
        gap: 16px !important;
        align-items: center;
    }
    .site-footer .menu_footer{
        width: calc(50% - 8px);
        max-width:  calc(50% - 8px);
    }
    .site-footer .menu_footer .menu_items li a{
        font-size: 14px;
        line-height: 1.4;
    }
    .box_subscribe .form_text{
        font-size: 14px;
    }
    .box_subscribe .form-field{
        flex-wrap: wrap;
    }
    .btn_sub{
        width: 100%;
    }
    .box_subscribe .email_subscribe{
        width: 100%;
    }
    .copy_right{
        padding-top: 16px;
    }
    .navbar{
        padding: 16px;
    }
    .site-logo{
        width: 115px;
    }
    .navbar .navbar-nav{
        gap: 0;
    }
    .service{
        width: 100%;
    }
    .contact_item{
        width: 100%;
        gap: 8px;
    }
    .product_service_banner_section{
        padding: 36px 16px;
    }
    .step .step_stack .vstack{
        gap: 8px;
    }
    .product_title h3{
        font-size: 24px;
        line-height: 32px;
    }
    .step .step_content .step_text{
        font-size: 15px;
    }
    .step .step_content .step_title .step_heading{
        font-size: 20px;
        line-height: 24px;
    }
    .step .step_content .step_title .step_heading >span{
        top: -15px;
    }
    .service .service-text .step_label {
        font-size: 20px;
        line-height: 24px;
    }
    .service .service-text .step_text {
        font-size: 14px;
        line-height: 1.4;
    }
    .contact h1 {
        font-size: 28px;
        line-height: 32px;
        text-align: center;
    }
    .contact .contact_item .contact_label {
        font-size: 17px;
        line-height: 24px;
    }
    .contact .contact_item .contact_text{
        font-size: 15px;
    }
    .contact {
        padding: 36px 16px;
    }
}