@media (min-width:1199px) {
    .navbar-nav>li:hover>.dropdown-menu {
        position: absolute;
        left: 0px;
        top: 100%;
        display: block;
    } 

    .navbar-expand-lg .navbar-collapse{ flex-basis: inherit; flex-grow: inherit;} 

    .navbar-nav > li > .dropdown-menu{ background: none; padding-top: 26px;} 
    .navbar-nav > li > .dropdown-menu li{ background: #5cbefb;}

}

@media (min-width:1400px) {
    /*========================================= 27=9=2024 ====================================*/
    .slide_1 .thmnl::before{ left: 70px;}
    .slide_1 .thmnl::after{ left: -150px; width: 250px;}
    .car-ind-c{ margin-right: 200px;}

    
}


@media (min-width:1200px) and (max-width:1399px) { 
    .navbar-nav > li > a, 
    .navbar-nav > li > .dropdown-menu li a{ font-size: 14px;}  
    .navbar-nav > li{ margin-right: 25px;}
    .font-24{ font-size: 21px;}
    

    .slide-caption h2{ font-size: 54px;} 
   

}

@media (max-width:1199px) {
    .navbar-toggler {
        padding: 0px; display: inline-flex; align-items: center; justify-content: center;
        border: none; width: auto; height: auto;
        border-radius: 50px;
        outline: none;
        color: #090D4D;
        box-shadow: none;
        position: absolute;
        right: 0px;
        top: 8px;
        background: none;
    }

    .navbar-toggler:hover {
        color: #5cbefb;
        background: none;
    }

    .navbar-toggler:focus {
        border: none;
        outline: none;
        box-shadow: none;
    }

    #navbarCollapse {
        position: fixed;
        background: #fff;
        width: 100%;
        z-index: 999;
        transition: all 0.4s ease;
        -webkit-transition: all 0.4s ease;
        height: 100% !important;
        display: block !important;
        left: -100%;
        top: 0px;
        overflow: auto;
    }

    #navbarCollapse.show {
        left: 0px;
    }

    .navbar-nav>li {
        margin: 0px 0px 15px;
        text-align: center;
    }

    .navbar-nav {
        margin-left: 0px !important;
    }

    /*================================12=07=2023======================================*/
    .navbar-collapse .navbar-toggler {
        position: absolute;
        right: 15px;
        top: 18px;
        background: none;
        color: #090D4D;
        width: auto;
        height: auto;
        padding: 0px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 2px;
    }

    .navbar-collapse .logo_menu {
        padding: 15px 20px !important;
        border-bottom: rgba(0, 0, 0, .3) 1px solid;
    }

   .logo_menu img{ width: 168px;}

    .navbar-nav>li>a {
        display: flex;
        align-items: center; font-size: 16px;
      
        border-radius: 0px !important;
        padding: 15px 25px !important;
        font-weight: 400;
        border-bottom: rgba(0, 0, 0, .3) 1px solid;
        text-align: left;
        justify-content: inherit;
    }

   

    .navbar-nav>li {
        width: 100%;
        margin: 0px 0px 1px;
        padding: 0px;
    }

    .navbar-nav>li>.dropdown-toggle::after {
        content: "\f078";
        display: inline-block !important;
        font-weight: normal;
        font-family: 'FontAwesome';
        bottom: 0px;
        margin-left: auto;
        border: none !important;
    }

    .navbar-nav>li>.dropdown-menu {
        background: #13131b;
        padding: 0px;
        border-radius: 0px;
        margin: 0px !important;
        transition: all 0.4s ease;
        -webkit-transition: all 0.4s ease;
    }

    .navbar-nav>li>.dropdown-menu li a {
        padding: 14px 25px !important;
        color: #fff; font-size: 14px;
        font-weight: 400;
        border-bottom: rgba(255, 255, 255, .3) 1px solid;
        text-align: left;
    }

    .navbar-nav>li>.dropdown-menu li a:hover,
    .navbar-nav>li>.dropdown-menu li a:focus {
        background: #5cbefb !important;
        color: #fff;
    }

   .navbar-collapse .navbar-toggler img {
        height: 12px;
        filter: brightness(0) invert(1);
    }

    .navbar-collapse .navbar-toggler:hover {
        background: none;
        color: #5cbefb;
    }  

   .top_right .link_1{ display: block; margin-bottom: 15px; padding: 15px 25px; border-bottom: rgba(0, 0, 0, .3) 1px solid;} 

   .top_right{ padding-left: 25px;} 
   .link-t-1{ font-size: 16px; font-weight: 400;} 
   .top_right .btn{ font-size: 16px;}
    

}

@media (min-width:992px) and (max-width:1199px) {
    .navbar-nav > li > a, .top_right a{ font-size: 14px;} 
    .navbar-nav > li{ margin-right: 15px;} 
    .font-60{ font-size: 54px;} 
    .s-banner-left figure{ bottom: -159px !important;} 

    .s-banner-left{ padding-right: 126px;} 

    .product-h-banner .form_contact{ padding-top: 40px !important; padding-bottom: 40px !important;} 

    /*========================================= 27=9=2024 ====================================*/
    .slide-caption h3{ font-size: 30px;}
    .slide-caption h2{ font-size: 40px;} 
    .slide-caption p{ font-size: 16px; line-height: 24px;} 
    .slide-caption .btn{ font-size: 18px; height: 45px;} 
    .slide_1 .thmnl::after{ width: 150px; left: -100px;}
    .slide_1 .thmnl::before{  left: 34px;} 
    .slide-caption .btn-group .b-cl-2 .btn{ padding-left: 60px;} 
    .slide-caption .btn-group .b-cl-2 .btn i{ width: 60px; height: 60px;} 
    .slide-caption .btn-group .b-cl-2 .btn i img{ width: 36px;}
 
}



@media (min-width:768px) and (max-width:991px) {  
    .font-60{ font-size: 42px;} .font-20{ font-size: 18px;} 
    .multiple_service .nav-tabs .nav-item .nav-link{ padding: 13px 15px; font-size: 15px;} 
    .multiple_service .nav-tabs .nav-item .nav-link .arrow_right img{ width: 20px;} 
    .multiple_service .nav-tabs .nav-item .nav-link i img{ width: 25px;} 
    .font-18{ font-size: 15px;} .font-32{ font-size: 25px;} 
    .download_usetopay_center{ padding: 20px;} 
    .link_du ul li a{ font-size: 14px;} 
    .home_slide{ height: auto; } 
    .product-bx figure img{ max-height: inherit;} 

    .s-banner-left figure{ bottom: -49px !important;} 

    .product-h-banner .form_contact::before{ display: none;} 
    .product-h-banner .form_contact{ background: rgba(255, 255, 255, .1) !important; margin-bottom: 25px; padding:40px 30px !important;} 


    /*========================================= 27=9=2024 ====================================*/
    .slide-caption h3{ font-size: 30px;}
    .slide-caption h2{ font-size: 40px; } 
    .slide-caption p{ font-size: 16px; line-height: 24px;} 
    .slide-caption .btn{ font-size: 16px; height: 38px; min-width: inherit;} 
    .slide_1 .thmnl::after{ width: 100px; left: -50px;}
    .slide_1 .thmnl::before{  left: 50px;} 
    .slide_1 .thmnl figure img{ width: 100%; max-width: 260px;} 

    .slide-caption .btn-group .b-cl-2 .btn{ padding-left: 50px;} 
    .slide-caption .btn-group .b-cl-2 .btn i{ width:45px; height: 45px; top: -6px;} 
    .slide-caption .btn-group .b-cl-2 .btn i img{ width: 25px;}

    
}



@media (max-width:767px) {  
    body{ font-size: 14px;}
    .font-18{ font-size: 15px;}
    .font-60{ font-size: 26px;} .font-20{ font-size: 15px;} 
    .font-24{ font-size: 18px;}
    .font-40{ font-size: 26px;} 
    .btn{ font-size: 14px;}
    .multiple_service .nav-tabs{ display: flex !important; flex-wrap: wrap; justify-content: space-between;}
    .multiple_service .nav-tabs .nav-item{ width: 49%; margin-bottom: 10px;}
    .multiple_service .nav-tabs .nav-item .nav-link{ padding: 8px 10px; font-size: 14px;} 
    .multiple_service .nav-tabs .nav-item .nav-link i img{ width: 22px;} 
    .multiple_service .nav-tabs .nav-item .nav-link .arrow_right img{ width: 22px;} 
    .multiple_service .nav-tabs .nav-item:last-child{ margin: 0 auto;} 
    .m_service_detail{ padding-top: 25px;} 
    .s_mid_2 ul{ flex-wrap: wrap;} 
    .s_mid_2 ul li{ width: 50%; margin-bottom: 40px;} 
    .s_mid_2 ul li:nth-child(3), .s_mid_2 ul li:nth-child(4){ margin-bottom: 0px;} 
    .s_mid_2 ul li .number { font-size: 25px; padding-bottom: 10px !important;} 
    .s_mid_2 ul li img{ width: 40px;} 
    .s_mid_2 ul li p{ line-height: 20px;} 
    .download_usetopay_center{ padding: 30px 18px;} 
    .link_du ul{ flex-wrap: wrap;} 
    .link_du ul li:nth-child(2){ margin-top: 15px; margin-bottom: 10px;} 
    .ul_2 li{ margin-bottom: 5px;} .social_f ul li{ margin-left: 0px; margin-right: 10px;} 
    .footer_center{ padding-top: 120px;} 
    .home_slide{ height: auto; }
    .product-bx figure img{ max-height: inherit;} 
    .font-32{ font-size: 24px;} 
    .comment-form{ padding: 20px;} 

    .step-join .col:nth-child(2):after{ display: none;} 
    .h-j-r .number, .w-join i{ width: 85px; height: 85px;} 
    .lh-30{ line-height: 24px;} 
    .w-join i img{ height: 35px;} 

    .s-banner-left{ padding-right: 0px;} 
    .s-banner-left figure{ position: relative !important; margin-top: 30px !important; right: 0px !important; bottom: 0px !important;} 
    .font-50{ font-size: 45px;} 

    .product-h-banner .form_contact::before{ display: none;} 
    .product-h-banner .form_contact{ background: rgba(255, 255, 255, .1) !important; margin-bottom: 25px; padding:30px 20px !important;} 

    .circle_list ul {
        -moz-column-count: 2;
        column-count: 2;
      
      } 

      .contact-info-b .col:nth-child(2){ border-right: none;} 
      .contact-info-b .col:last-child{ width: 100%;} 
      .slide_minner { justify-content: center; }
       /*========================================= 27=9=2024 ====================================*/
       .slide-caption{ text-align: center; padding: 25px 0px 30px;}
    .slide-caption h3{ font-size: 20px;}
    .slide-caption h2{ font-size: 30px; } 
    .slide-caption p{ font-size: 14px; line-height: 24px;} 
    .slide-caption .btn{ font-size: 16px; height: 38px; min-width: inherit;} 
    .slide_1 .thmnl{ overflow: hidden; padding-bottom: 40px;}
    .slide_1 .thmnl::after{  display: none;}
    .slide_1 .thmnl::before{  left: -768px;} 
    .slide_1 .thmnl figure img{ width: 100%; max-width: 260px;} 
    .slide_1 .row{ height: auto;} 
    .home_slide .carousel-indicators{ bottom: 20px; margin-bottom: 0px;} 
    .home_slide .carousel-indicators button.active{ background: #6bc5f9;}  

    .gif-pic{ width: auto !important; max-width: 100%;} 

    .slide-caption .btn-group .b-cl-2 .btn{ padding-left: 50px;} 
    .slide-caption .btn-group .b-cl-2 .btn i{ width:45px; height: 45px; top: -6px;} 
    .slide-caption .btn-group .b-cl-2 .btn i img{ width: 25px;} 

    .c-info-cl i{ width: 80px; height: 80px;} 
    .c-right p br{ display: none;}
    .form_contact form{ padding: 40px 20px 20px;}
        
}