@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');
body{ margin: 0; padding: 0; font-family: "Nunito", sans-serif !important;}
a { text-decoration: none !important;}
p, .main-table ul li {color: #3d3d3d;font-size: 17px;letter-spacing: .3px;margin: 0 0 10px 0;line-height: 1.6;/* font-weight: 600; */}
.custom-btn { background: #e69d2f; color: #fff; display: inline-block; padding: 14px 50px; font-size: 18px; font-weight: 600; letter-spacing: .5px; border-radius: 5px; border-top-left-radius: 50px; border-bottom-right-radius: 50px; box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.1);}
.custom-btn:hover { color: #fff; animation: zoom-in-zoom-out .5s ease-in-out; transform: scale(1.1, 1.1);}

.custom-btn1 { background: #219ebc; color: #fff; display: inline-block; padding: 12px 40px; font-size: 15px; font-weight: 600; letter-spacing: .5px; border-radius: 5px; border-top-left-radius: 50px; border-bottom-right-radius: 50px; box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.1);}
.custom-btn1:hover { color: #fff; animation: zoom-in-zoom-out .5s ease-in-out; transform: scale(1.1, 1.1);}

@keyframes zoom-in-zoom-out {
    0% {
        transform: scale(1, 1);
    }

    40% {
        transform: scale(1.1, 1.1);
    }

    75% {
        transform: scale(1, 1);
    }

    100% {
        transform: scale(1.1, 1.1);
    }
}

.heading { font-size: 42px; font-weight: 800; margin: 0 0 25px 0; color: #219ebc; position: relative} 
.heading span { position: relative; z-index: 3;}
.heading::after {position: absolute;content: '';width: 70px;height: 5px;background: #e69d2f;left: 0;right: 0;top: 45px;border-radius: 3px;}
.sub-heading {font-size: 24px;font-weight: 700;margin: 0 0 15px 0;border-bottom: 1px dashed #a5a5a5;padding: 5px 0;text-align: left;color: #222;}
.team-title { font-size: 21px; color: #219ebc; font-size: 24px; font-weight: 700; margin: 0 0 15px 0;}

.toggler-btn { width: 40px; cursor: pointer; padding: 30px 0}
.toggler-btn .top-bar, .toggler-btn .middle-bar, .toggler-btn .bottom-bar { width: 30px; height: 3px; background: #fff; border-radius: 3px;}
.toggler-btn .top-bar { animation: toggler 1.7s infinite;}
.toggler-btn .middle-bar { animation: toggler 1.3s infinite;}
.toggler-btn .bottom-bar { animation: toggler 2.2s infinite;}

/*======================== Top header ====================*/
.top-header { background: #219ebc; padding: 10px 0;}
.top-header p { margin: 0; color: #fff;}
.top-header p a { color: #f4f4f4; font-size: 15px; margin:0 5px;}
.top-header p a i { font-size: 13px; margin: 0 7px 0 0;}
.top-header .login-icon i{ padding: 6px; background: #fff; border-radius: 50%; color: #e69d2f; font-size: 11px; margin: 0 4px 0 0;}


.navbar .nav-item .nav-link {color: #ffffff;font-size: 13px;text-transform: uppercase;/* font-weight: 700; */margin: 0 10px;position: relative;}
.navbar .nav-item .nav-link:hover { color: #e69d2f;}
.navbar .nav-item .custom-btn { margin-top: -7px;}

.right-nav { position: absolute; z-index: 9; background: #fff; right: 0; top: 0; height: 100vh; width: 450px; overflow: hidden; padding: 50px; display: none; text-align: center;} 
.right-nav img { margin: 10px 0 30px 0;}
.right-nav .social-icon a{ color: #212121; margin: 7px;}
.right-nav .social-icon a:hover{ color: #219ebc;}

.banner-section { position: relative;}
.banner-section video{ width: 100%; height: 100vh; object-fit: cover;}
.banner-section .banner-content {width: 100%;height: 99.5%;position: absolute;background: linear-gradient(90deg, rgb(33 158 188 / 80%), rgba(18, 18, 18, .7));top: 0;left: 0;}
.banner-section .banner-content .text {position: absolute;left: 90px;top: 32%;width: 40%;}
.banner-section .banner-content .text h2 { color: #fff; font-size: 60px; font-weight: 700; margin: 0 0 30px 0;}

.about-section { padding: 7% 0;}
.about-section .pic { position: relative;}
.about-section .pic .text { position: relative; z-index: 3; padding: 40px 20px;}
.about-section .pic .text h2{ font-size: 46px; font-weight: 800; color: #fff; margin: 0;}
.about-section .pic .text p { font-size: 26px; font-weight: 600; letter-spacing: .5px; color: #f6f6f6;}
.about-section .pic::after { content: ''; position: absolute; width: 40%; height: 95%; top: 2%; background: #219ebc; z-index: 1; left: -3%;}
.about-section .img1 img{ position: absolute; width: 60%; right: 0; top: 0; border-radius: 10px; height: 220px; object-fit: cover; z-index: 2;}
.about-section .img2 img { width: 90%; margin-top: 10px; margin-left: 7%; border-radius: 10px; height: 320px; filter: brightness(92%); position: relative; z-index: 3;}
.about-section p { font-size: 16px;}
.about-section .about-card { margin: 20px 0; box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px; border-radius: 10px; padding: 20px;}
.about-section .about-card p { color: #141414; margin: 0; font-size: 18px; font-weight: 600;}

.counts {padding: 7% 0;background-image: url('image/count-bg.jpg');background-size: cover;background-attachment: fixed;}
.counts .count-bx {border: 3px solid #ffffff85;padding: 35px 10px;}
.counts .count-bx h2 {color: #fff;text-align: center;font-size: 60px;font-weight: 700;}
.counts .count-bx p {color: #fff;margin: 0;font-size: 22px;font-weight: 500;text-align: center;} 

.section-3 { padding: 7% 0; background: #ddd;}
.section-3 .cliente_box {padding: 25px 15px;background: #219ebc;border-radius: 10px;text-align: center;margin: 0 0 20px 0;}
.section-3 .cliente_box .cliente_box_icon i { display: inline-block; color: #fff; background: #e69d2f; width: 60px; height: 60px; font-size: 27px; line-height: 2.1; margin: 0 0 10px 0; text-align: center; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 15px;}
.section-3 .cliente_box h2 {font-size: 23px;color: #ffffff;font-weight: 800;margin: 0 0 10px 0;}
.section-3 .cliente_box p {font-size: 16px;color: #e0e0e0;margin: 0 0 5px 0;}
.section-3 .cliente_box a {color: #ffffff;font-weight: 800;transition: all .2s ease-in-out;}
.section-3 .cliente_box a:hover { letter-spacing: 1.5px;}
.section-3 .left-img { position: relative;}
.section-3 .left-img::before { content: ''; position: absolute; width: 100%; height: 100%; background: #e69d2f; top: 5%; left: -5%;}
.section-3 .left-img img { position: relative; z-index: 2;}

.service-section { padding: 7% 0;}
.service-section .heading { margin: 0 0 40px 0;}
.service-section .heading::after { margin: 0 auto;}
.service-section .nav-pills .nav-link { text-align: left; background: #fff !important; margin: 0 0 30px 0; padding: 12px; border-radius: 50px; box-shadow:0px 10px 30px 0px rgba(0,68,167,0.5);}
.service-section .nav-link .icon { background: #e69d2f; padding: 12px; border-radius: 50%; width: 70px; height: 70px;}
.service-section .nav-pills .nav-link h4 {font-size: 21px;color: #219ebc;fon;font-weight: 600;margin: 0;}
.service-section .nav-pills .nav-link.active { background: #219ebc !important;}
.service-section .nav-pills .nav-link.active h4 { color: #fff;}
.service-section .ser-text .ser-img { position: relative; margin: 0 0 20px 0;}
.service-section .ser-text .ser-img img { border-radius: 12px;}
.service-section .ser-text .ser-img .title { position: absolute; bottom: 0; left: 0; background: linear-gradient(rgba(255, 255, 255, .0)0%, #219ebc 100%); width: 100%; padding: 50px 25px 15px 20px; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px;}
.service-section .ser-text .ser-img .title h4 { margin: 0; color: #fff; font-size: 26px; font-weight: 800;}
.service-section .ser-text p  {margin: 0 0 30px 0;}

.team-section { padding: 6% 0; background: #219ebc;}
.team-section .heading { color: #fff;}
.team-section .heading::after { margin: 0 auto;}
.team-section .left-img, .team-section .right-img { position: relative;}
.team-section .left-img img, .team-section .right-img img { position: relative; z-index: 3; border-radius: 10px;}
.team-section .left-img::after { content: ''; position: absolute; width: 100%; height: 109%; background: #e69d2f; top: -15px; left: -15px; border-radius: 10px;}
.team-section .right-img::after { content: ''; position: absolute; width: 100%; height: 109%; background: #e69d2f; top: -15px; right: -15px; border-radius: 10px;}
.team-section .profile-details h4 {color: #ffffff;font-size: 30px;margin: 0 0 15px 0;font-weight: 800;}
.team-section .profile-details p { color: #e2e2e2; letter-spacing: .3px;}
.team-section .profile-details .custom-btn1 { background: #fff; color: #219ebc; font-weight: 700; margin: 10px 0 0 0;}

.contact-section { padding: 7% 0; background: linear-gradient(90deg, #e69d2f 33%, #fff 33%);}
.contact-section .contact-bx {background: #fff;padding: 30px;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;border-radius: 12px;}
.contact-section .contact-bx .contact-form { padding: 20px;}
.contact-section .contact-bx .form-control { padding: 14px; margin: 0 0 20px 0;}
.contact-section .contact-bx input[type="button"] { background: #e69d2f; color: #fff; display: inline-block; padding: 14px 50px; font-size: 18px; font-weight: 600; letter-spacing: .5px; border-radius: 5px; border-top-left-radius: 50px; border-bottom-right-radius: 50px; box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.1); border: none;}
.contact-section .contact-bx input[type="button"]:hover { color: #fff; animation: zoom-in-zoom-out .5s ease-in-out; transform: scale(1.1, 1.1);}
.contact-section .contact-img { position: relative;}
.contact-section .contact-img img { height: 480px; object-fit: cover;}
.contact-section .contact-img::after { position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(rgba(255, 255, 255, .2), #219ebc); opacity: .8; left: 0; top: 0;}
.contact-section .contact-img .call { position: absolute; bottom: 0; padding: 20px;}
.contact-section .contact-img .call p { color: #fff; font-size: 20px; font-weight: 800; position: relative; z-index: 9; margin: 0;}
.contact-section .contact-img .call p i { background: #fff; padding: 10px; font-size: 16px; border-radius: 50%; color: #219ebc; margin: 0 5px 0 0;}

footer {background: #101010; padding: 7% 0 0 0;}
footer h4 { color: #fff; font-size: 20px; font-weight: 700; margin: 0 0 12px 0;}
footer p, footer p a { color: #c9c9c9; font-size: 15px; margin: 0 0 10px 0;}
footer p a:hover { color: #e69d2f;}
footer .footer-bottom {margin: 4% 0 0 0;border-top: 1px solid rgba(204, 204, 204, .4);padding: 15px 0;}
footer .footer-bottom p { margin: 0;}
footer .contact-details .icon i{ color: #fff; font-size: 20px; margin: 0 12px 0 0; display: inline-block;}
footer .contact-details .text h5{ color: #fff; font-size: 19px; margin: 0 0 6px 0; font-weight: 700;} 
footer .contact-details .text p { color: #c9c9c9; margin: 0; font-size: 14px;}
footer .social-icon a { position: relative; color: #fff; background: rgba(255, 255, 255, .1); font-size: 19px; width: 50px; height: 50px; margin: 0 5px; display: inline-block; border-radius: 50%; text-align: center; line-height: 2.8; transition: all .2s ease-in-out;}
footer .social-icon a i { position: relative; z-index: 3;}
footer .social-icon a::before{ content: ''; position: absolute; width:100%; height: 100%; border-radius: 50%; background: #e69d2f; left: 0; transform: scale(0); transition: all .4s ease-in-out;}
footer .social-icon a:hover { color: #212121;}
footer .social-icon a:hover::before { transform: scale(1);}

.inner-banner { background-image: linear-gradient(25deg, #219ebc 40%, #e69d2f) ; padding: 4% 0;}
.inner-banner h1 {color: #fff;margin: 0;font-size: 42px;font-weight: 700;text-align: left;}

.contact-info {background: #219ebc;padding: 25px;margin: 0 0 10px 0;}
.contact-info i {color: #ffffff;font-size: 27px;text-align: left;}
.contact-info h5 {color: #ffffff;text-transform: uppercase;font-size: 19px;font-weight: 700;text-align: left;letter-spacing: .5px;}
.contact-info p, .contact-info p a {color: #ffffff;margin: 0;font-size: 16px;font-weight: 500;}

.service-page ul li, .service-page ul{ list-style: none; padding: 0; margin: 0;}
.service-page ul li { display: flex; margin: 0 0 10px 0;}
.service-page ul li i { color: #e69d2f; font-size: 19px; margin: 4px 10px 0 0;}


@keyframes toggler {
    0% { width: 30px;}
    50% { width: 18px;}
    100% { width: 30px;}
}

@keyframes zoom {
    from { transform: scale(1,1);}
    to { transform: scale(1.3, 1.3);}
}   

@media (min-width: 320px) and (max-width: 768px){
    p { font-size: 15px;}
    .custom-btn { padding: 12px 38px; font-size: 16px;}
    .custom-btn1 { padding: 10px 30px; font-size: 14px;}
    .heading { font-size: 32px; margin: 0 0 20px 0;}
    .heading::after { width: 50px;height: 3px; top: 35px;}
    
    /*======================== Top header ====================*/
    .top-header { background: #219ebc; padding: 8px 0;}
    .top-header p a { font-size: 14px;}
    .top-header p a i { font-size: 12px;}
    .top-header .login-icon i{ padding: 5px;}
    
    header {margin-top: -1px;}
  
    .banner-section { position: relative;}
    .banner-section video{ height: 300px;}
    .banner-section .banner-content .text { left: 15px; top: 47%; width: 65%;}
    .banner-section .banner-content .text h2 {font-size: 28px;}
    
    .about-section .pic { margin: 0 0 20px 0;}
    .about-section .pic .text { position: relative; z-index: 3;}
    .about-section .pic .text h2 {font-size: 32px;}
    .about-section .pic .text p {font-size: 21px;}
    .about-section .img1 img{height: 165px; object-fit: cover;}
    .about-section .img2 img {width: 90%;margin-top: -15px; height: 250px;object-fit: cover;}
    .about-section p { font-size: 15px;}
    
    .counts {padding: 10% 0;}
    .counts .count-bx {border: 2px solid #e69d2f; padding: 20px 0; margin: 0 0 10px 0;}
    .counts .count-bx h2 { font-size: 32px;}
    .counts .count-bx p { font-size: 16px; margin: 0;} 
  
    .service-section .nav-pills .nav-link { padding: 12px; margin: 0 0 20px 0;}
    .service-section .nav-link .icon { padding: 10px; width: 55px; height: 55px;}
    .service-section .nav-pills .nav-link h4 { font-size: 19px;}
    
    .team-section .profile-details h4 { font-size: 24px; margin: 20px 0 0 0;}
    
    .contact-section .contact-bx { padding:0;}
    .contact-section .contact-bx .form-control { padding: 12px; margin: 0 0 15px 0;}

    footer {background: #101010; padding: 7% 0 0 0;}
    footer h4 { margin: 15px 0 10px 0;}
    footer p, footer p a { font-size: 14px; margin: 0 0 5px 0;}
    footer .contact-details .icon i{ font-size: 17px;}
    footer .social-icon a { font-size: 15px; width: 40px; height: 40px;}

    .inner-banner { padding: 7% 0;}
    .inner-banner h1{ font-size: 27px;}
}


.bg-light {
    background: transparent !important;
}

#HeaderControl {
    position: absolute;
    left: 0;
    top: 47px;
    z-index: 9;
    width: 27%;
    text-align: center;
    background: rgb(200 200 200 / 20%);
    backdrop-filter: blur(3px);
}

#HeaderControl_C {
    display: flex;
    align-items: center;
}

#HeaderControl.RadDock_Default .rdMiddle .rdCenter,
#HeaderControl.RadDock_Default .rdBottom .rdCenter {
    background-color: transparent !important;
}

#WidgetControl5 {
    position: absolute;
    right: 0%;
    top: 47px;
    z-index: 9;
    width: 5%;
    backdrop-filter: blur(3px);
}

#WidgetControl5.RadDock_Default .rdMiddle .rdCenter {
    background: rgb(200 200 200 / 20%);
    height: 100%;
}

#WidgetControl4.RadDock_Default .rdMiddle .rdCenter,
#WidgetControl4.RadDock_Default .rdBottom .rdCenter {
    background-color: transparent !important;
}

#MenuControl.RadDock_Default .rdMiddle .rdCenter,
#MenuControl.RadDock_Default .rdBottom .rdCenter {
    background-color: transparent !important;
}

#MenuControl {
    position: absolute;
    right: 5%;
    top: 47px;
    z-index: 8 !important;
    background: rgb(200 200 200 / 20%) !important;
    width: 68%;
    /* display: flex; */
    backdrop-filter: blur(3px);
    /* align-items: center; */
}

@media (min-width: 320px) and (max-width:768px) {
    #HeaderControl {
        width: 80%;
        text-align: center;
        top: 89px;
    }

    #MenuControl {
        right: 0% !important;
        width: 20%;
        background: rgb(200 200 200 / 20%) !important;
        top: 89PX;
    }

#WidgetControl5 { display: NONE;}

    .navbar {
        padding: 12.5px 5px;
    }

    #navbarNavDropdown {
        height: auto;
        position: absolute;
        right: -9%;
        background: #219ebc;
        width: 544%;
        margin-top: 12px;
    }

    .navbar-expand-md .navbar-nav .nav-link {
        color: #212121 !important;
    }
}

/* #HeaderControl, #HeaderControl_C, #MenuControl #MenuControl_C} */
center #form1 #MenuControl .nav-link {
    color: #ffffff !important;
}

center #form1 .nav-btn .nav-bar {
    background: #212121 !important;
}

center #form1 .nav-right .user-icon {
    color: #121212;
    border-color: #121212
}

center #form1 #HeaderControl {
    position: relative;
    top: 0;
    background: #393d46;
}

center #form1 #MenuControl,
center #form1 #WidgetControl5.RadDock_Default .rdMiddle .rdCenter {
    background: #393d46 !important;
  
}


/*nav-bar*/
.dropdown-toggle {
    position: relative;
}

.nav-item ul li .dropdown-toggle::after {
    position: absolute;
    right: 5px;
    top: 10px;
}

#MenuControl_C .bg-light {
    --bs-bg-opacity: 1;
    background-color: transparent !important;
    height: 100%;
}

.nav-item {
    margin: 5px;
}

.nav-link {
    font-weight: 600;
    font-size: 17px;
    padding: 0px;
    margin: 0 5px;
}

.nav-fill {
    font-size: 15px;
}

.navbar-brand {
    margin: 0;
}

/*nav-bar*/
@media (max-width: 1170px) {
    .navbar-expand-md .navbar-nav .nav-link {
        padding-right: 1px;
        padding-left: 1px;
    }
}

@media (max-width: 991px) {

    #MenuControl,
    #MenuControl_C,
    #HeaderControl,
    #HeaderControl_C,
    #widgetsControl_C,
    #widgetsControl {
        height: initial !important;
    }

    .navbar-expand-md .navbar-nav .nav-link {
        font-size: 12px;
    }
}

@media (max-width: 769px) {}

a {
    text-decoration: none;
}

@media (max-width: 767px) {
    .navbar.navbar-expand-md {
        text-align: center;
        /* width: 84%; */
    }
    #MenuControl_C .bg-light{
        width: 94%;
    }

    .navbar.navbar-expand-md .container-fluid {
        display: block;
    }

    .nav-fill .nav-item,
    .nav-fill>.nav-link {
        text-align: left;
    }

    .navbar-nav>li {
        display: block;
        text-align: left;
        padding: 4px 0;
        border-bottom: 1px solid #999;
        border-right: 0;
    }

    .nav-item ul li .dropdown-toggle::after {
        transform: rotate(90deg);
    }

    .nav-item .nav-link.dropdown-toggle::after {
        position: absolute;
        right: 5px;
        top: 15px;
    }

    .navbar-expand-md .navbar-nav .nav-link {
        font-size: 14px;
        padding-right: 5px;
        padding-left: 5px;
    }
}

.table-responsive {
    min-height: .01%;
    overflow: hidden !important;
    border: 0;
    padding: 0;
}

#widgetsControl_C,
#widgetsControl {
    height: auto !important;
}

#HomepagecontentControl p,
#HomepagecontentControl li {
    text-align: left;
    margin: 0 0 10px 0;
}

.dropdown-menu {
    border-radius: 0 !important;
    padding: 0;
    min-width: 240px;
}

.dropdown-menu .dropdown-item {
    font-size: 16px;
    padding: 10px !important;
}

/* .dropdown-menu .dropdown-item:hover {background: #c6c6c6;} */

@media (min-width:1023px) {

    .navbar-nav li:hover>ul.dropdown-menu {
        display: block;
    }

    .dropdown-submenu {
        position: relative;
    }

    .dropdown-submenu>.dropdown-menu {
        top: 0;
        right: 100%;
        left: auto;
        margin-top: -6px;
    }

    /* rotate caret on hover */
    .dropdown-menu>li>a:hover:after {
        transform: rotate(180deg);
    }

    .dropend .dropdown-menu {
        right: 100% !important;
        top: 0;
        left: auto !important;
    }
}


#widgetsControl {
    height: auto;
}

#WidgetControl5, #WidgetControl5_C, #MenuControl, #MenuControl_C, #HeaderControl, #HeaderControl_C {height: 90px !important;top: 48px;}

.industry-card {padding: 20px 10px;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;border-radius: 5px;text-align: center;margin: 12px 0;min-height: 155px;}
.industry-card img {width: 64px;margin: 0 0 15px 0;}
.industry-card h4 {font-size: 16px;margin: 0;color: #121212;letter-spacing: .3px;}