@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
body { margin: 0; padding: 0; font-family: "Roboto", sans-serif; overflow-x: hidden;}
p, li {color: #2e2e2e;font-size: 16px;line-height: 30px;margin: 0 0 15px 0;font-family: "Roboto", sans-serif;letter-spacing: .6px;}
.main-table li {color: #2e2e2e;font-size: 16px; line-height: 25px;margin: 0 0 10px 0; font-family: "Roboto", sans-serif;}
a { text-decoration: none !important; font-family: "Roboto", sans-serif;}
h1, h2, h3, h4, h5, h6 {font-family: "Roboto", sans-serif; color: #101010;}

.main-table { text-align: left; padding: 5% 0;}

#widgetsControl_C, #widgetsControl{ height: auto !important;}
#Div_body .container-fluid { margin: 0; padding: 0;}

/* innr-pg-c Start */
.otherpagecss #RadDockZone1.container { max-width: 100%;}
.otherpagecss #RadDockZone1.container #HomepagecontentControl_C table { margin-top: 0 !important;}

.heading { color: #131313; font-size: 46px; letter-spacing: 3px; margin: 0 0 20px 0; text-transform: uppercase;}
.sub-heading { font-size: 27px; color: #131313; letter-spacing: .6px; font-weight: 600; margin: 0 0 10px 0;}
.main-heading { text-transform: uppercase; color: #202020; font-size: 30px; letter-spacing: 2px; font-weight: 500;}
.text-blue { color: #0a2454; font-size: 17px; line-height: 1.6;}
.rounded-5 { border-radius: 12px;}

.banner-section { border-radius: 0 0 40px 40px; overflow: hidden;}
.banner-section .carousel-item .pic { width: 60%;}
.banner-section .carousel-item.slide-1 {background-image: linear-gradient(30deg, #012437 50%, #427b8c);}
.banner-section .carousel-item.slide-3 {background-image: linear-gradient(30deg, #040e33 50%, #0e9489);}
.banner-section .carousel-item.slide-2 {background-image: linear-gradient(30deg, #04273c 50%, #01456b)}
.banner-section .carousel-item.slide-4 {background-image: linear-gradient(30deg, #301d30 50%, #542633)}
.banner-section .carousel-item.slide-5 {background-image: linear-gradient(30deg, #25103e 50%, #0a2454);}
.banner-section .carousel-item .content { width: 40%; height: 100%; padding: 30px 100px; border-radius: 0 0 60px 60px;}
.banner-section .carousel-item .content h1 { color: #fff; font-size: 46px; font-weight: 600; line-height: 1.2; margin: 0; letter-spacing: .5px; text-shadow: 2px 2px 2px #101010; margin: 0 0 30px 0;} 
.banner-section .carousel-item .content p { padding: 0 0 0 8%; color: #fff; font-size: 18px; letter-spacing: .8px; line-height: 1.8; margin: 0;}
.banner-section .outline { position: absolute; width: 22px; height: 42px; border: 1px solid #ffffffce; left: 0; right: 0; margin: 0 auto; bottom: 15px; border-radius: 30px; padding: 8px; overflow: hidden;}
.banner-section .outline .dot { width: 5px; height: 5px; background: #fff; border-radius: 50%; animation: slide 3.9s infinite;}

@keyframes slide{ 
  0% { margin-top: 0px; transform: scale(.2);}
  25% { margin-top: 0px; transform: scale(1);}
  75% { margin-top: 20px; transform: scale(1);}
  100% { margin-top: 20px; transform: scale(.2);}
}

.about-section { padding: 5% 0;}
.about-section .about-bx { background: #eeeeee;border-radius: 30px;overflow: hidden;margin: 5% 0 0 0;}
.about-section .about-card {border: 1px solid #293964;padding: 20px;border-radius: 50px;margin: 20px 0 0 0;min-height: 90px;}
.about-section .about-card p { margin: 0; font-size: 17px; text-align: center; line-height: 1.4; color: #293964; font-weight: 500;}
.about-section .counter-bx { padding: 70px 40px; background-image: linear-gradient(30deg, #00db81, #001d8b); margin: 5% 0 0 0; border-radius: 120px;}
.about-section .counter-bx .count-bx h2 { color: #fff; font-size: 54px; font-weight: 600;}
.about-section .counter-bx .count-bx p { color: #fff; margin: 0; font-size: 19px;}

.service-section .ser-card { border-top: 3px solid #293964; padding: 30px; margin: 10px 0;}
.service-section .ser-card h4 { color: #01456b; font-size: 29px; margin: 0 0 15px 0; line-height: 1.3;}
.service-section .ser-card a { color: #646464; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; border-bottom: 1px solid #313131; font-size: 14px;}

.team-section { padding: 5% 0;}
.team-section .team-card { background: #eee; border-radius: 20px; transition: all .2s ease-in-out; margin: 10px 0; min-height: 495px;}
.team-section .team-card .pic img { border-radius: 20px;}
.team-section .team-card .text { padding: 30px;}
.team-section .team-card .text h4 { color: #012437; font-size: 22px; font-weight: 600; transition: all .2s ease-in-out;}
.team-section .team-card .text p { line-height: 1.7; margin: 14px 0; transition: all .2s ease-in-out;}
.team-section .team-card:hover { background: #293964;}
.team-section .team-card:hover h4, .team-section .team-card:hover p { color: #fff;}

footer { background-image: url('image/footer-bg.jpg'); background-size: cover; padding: 5% 0 0 0; position: relative;}
footer::after {content: '';position: absolute;width: 100%;height: 100%;background-image: linear-gradient(60deg, #040e33, #0e9489);top: 0;left: 0;opacity: .9;}
footer .links { position: relative; z-index: 3;}
footer .footer-bottom { position: relative; z-index: 3; margin: 4% 0 0 0; background: #040e332c; padding: 15px 0;}
footer h4 {color: #fff;font-size: 24px;margin: 0 0 18px 0;font-weight: 600;}
footer p, footer p a { color: #ebebeb; font-size: 15px; margin: 0 0 8px 0;}
footer p a:hover { color: #fff;}
footer p i { color: #fff; margin: 0 5px 0 0;}

.inner-banner { padding: 26% 0 2% 0; background-image: url(image/about-banner.jpg); background-size: cover; border-radius: 0 0 60px 60px;}
.inner-banner h2 { color: #fff; font-size: 52px; font-weight: 700; letter-spacing: 1px; text-shadow: 2px 2px 2px #101010;}
.inner-banner p { color: #fff; font-size: 21px; letter-spacing: .8px; line-height: 1.5; text-shadow: 2px 2px 2px #101010de; margin: 0 0 20px 0;}
.contact-banner { background-image: url('image/contact-banner.jpg');}
.service-banner { background-image: url('image/services-banner.jpg');}
.team-banner { background-image: url('image/team-banner.jpg');}

.contact-page .contact-form { padding: 60px 70px; border: 1px solid #0a2454; border-radius: 30px; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;}
.contact-page .contact-form .form-control { margin: 0 0 20px 0; padding: 15px; font-size: 15px;}
.contact-page .contact-form input[type='button'] { background: #0a2454; color: #fff; padding: 12px 100px; border: 0; border-radius: 30px; font-size: 16px; text-transform: uppercase; letter-spacing: 2px; font-weight: 500;}   
.contact-page .contact-form input[type='button']:hover { background: #001d8b;}
.contact-page .head-office { border-top: 1px solid #999999; border-bottom: 1px solid #999999; padding: 20px 0; margin: 20px ;}
.contact-page .head-office .line { border-left: 1px solid #999999;}
.contact-page .head-office h5 { color: #0a2454; font-weight: 600; font-size: 22px;}
.contact-page .head-office p i { width: 26px; height: 26px; display: inline-block; background: #575757; border-radius: 50%; color: #fff; text-align: center; font-size: 13px; line-height:2; margin: 0 7px 0 0;}
.contact-page .head-office p a { color: #101010;}

.industry-card img { border-radius: 15px; margin: 20px 0 8px 0;}
.industry-card p {color: #0a2454;font-size: 19px;font-weight: 600;line-height: 1.4;}


@media (min-width: 320px) and (max-width: 768px) { 
  p, li { font-size: 15px; line-height: 27px;}
  .main-table li { font-size: 15px; line-height: 25px;}

  .heading { font-size: 30px; margin: 0 0 15px 0;}
  .sub-heading { font-size: 21px;}
  .main-heading { font-size: 24px;}

  .banner-section { border-radius: 0 0 40px 40px; overflow: hidden;}
  .banner-section .carousel-item .pic { width: 100%;}
  .banner-section .carousel-item .pic img { height: 320px; object-fit: cover;}
  .banner-section .carousel-item .content { width: 100%; height: 100%; padding: 30px 30px 60px 30px;}
  .banner-section .carousel-item .content h1 { font-size: 27px; line-height: 1.3; margin: 0 0 20px 0;} 
  .banner-section .carousel-item .content p { padding: 0; font-size: 16px;}

  .about-section { padding: 7% 0;}
  .about-section .about-card { padding: 20px 10px; margin: 15px 0 0 0;min-height: 90px;}
  .about-section .about-card p { font-size: 14px; line-height: 1.3; font-weight: 400;}
  .about-section .counter-bx { padding:40px 20px 20px 20px; border-radius: 20px;}
  .about-section .counter-bx .count-bx h2 { font-size: 30px; margin: 0 0 5px 0;}
  .about-section .counter-bx .count-bx p { color: #fff; margin: 0 0 20px 0; font-size: 15px;}

  .service-section .ser-card { padding: 20px;}
  .service-section .ser-card h4 { font-size: 24px; margin: 0 0 12px 0;}

  footer .footer-bottom { padding: 10px 0;}
  footer h4 {font-size: 19px; margin: 20px 0 8px 0;}
  footer p, footer p a { font-size: 14px; margin: 0 0 6px 0; line-height: 1.6;}

  .inner-banner { padding: 30% 0 5% 0; border-radius: 0 0 40px 40px;}
  .inner-banner h2 { font-size: 30px;}
  .inner-banner p { font-size: 18px;}

  .contact-page .contact-form { padding:30px;}
  .contact-page .contact-form .form-control { margin: 0 0 15px 0; padding: 12px; font-size: 14px;}
  .contact-page .contact-form input[type='button'] { padding: 12px 60px; font-size: 14px;}
  .contact-page .head-office .line { border-left: 0;}
}

@media (min-width: 1200px) and (max-width: 1420px) { 
  .heading { font-size: 40px; margin: 0 0 20px 0; text-transform: uppercase;}
  
  .banner-section .carousel-item .content { padding: 30px 70px;}
  .banner-section .carousel-item .content h1 { font-size: 34px; margin: 0 0 25px 0;} 
  .banner-section .carousel-item .content p { font-size: 18px;}

  .service-section .ser-card h4 { font-size: 26px;}
}