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

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

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

#MenuControl .nav-item { margin: 0}
#MenuControl .nav-item .nav-link {color: #ffffff;font-size: 15px;font-weight: 500;}
#MenuControl .nav-fill{ width:100%;}
#MenuControl .bg-light {background: #fff!important;height: 100%;}

#HomepagecontentControl_C { margin-top: -21px}

#HeaderControl, #HeaderControl_C { height: auto !important}

#HeaderControl.RadDock_Default .rdMiddle .rdCenter,
#HeaderControl.RadDock_Default .rdBottom .rdCenter { background-color: transparent !important;}
#MenuControl_C .bg-light { --bs-bg-opacity: 1; background-color: transparent !important; height: 100%;}
#MenuControl.RadDock_Default .rdMiddle .rdCenter, #MenuControl.RadDock_Default .rdBottom .rdCenter { background-color: transparent !important;}

#HeaderControl, #MenuControl, #MenuControl_C {height: 85px !important;}

@media (min-width: 320px) and (max-width: 768px ){ 
  .navbar-toggler { position: absolute; right: 15px; top: -65px; background: #fff}
  #MenuControl, #MenuControl_C { height: 0 !important;}
  #HeaderControl, #HeaderControl_C {height: 90px !important;background: #202020;}
  .navbar-collapse { background: #1c5791; margin-top: -10px}
}

@media (min-width: 769px)  {
  #HeaderControl {position: absolute;left: 10%;top: 8px;z-index: 99;width: 20%;text-align: center;}
  #MenuControl {position: absolute;right: 10%;top: 20px;z-index: 99 !important;width: 60%;}
}

#HomepagecontentControl { min-height: 400px !important}


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

.heading {font-size: 40px;color: #1e1e1e;font-weight: 700;text-transform: uppercase;letter-spacing: .6px;margin: 0 0 35px 0;position: relative;}
.heading::after {content: '';position: absolute;width: 100px;height: 2px;left: 0;bottom: -8px;border-radius: 5px;background: #eb6424;}
.sub-heading {font-size: 24px;color: #eb6424;font-weight: 700;margin: 30px 0 15px 0;border-bottom: 1px dashed #a5a5a5;padding: 5px 0;}

header img { width: 100px}

.banner-section .carousel-caption p {background: #000000;display: inline-block;padding: 10px 25px;border-radius: 8px;color: #fff;font-size: 18px;letter-spacing: .8px;}

.about-section {padding: 6% 0;background: #fdf9e5;overflow: hidden;}
.about-section .left-pic { position: relative;}
.about-section .left-pic img{ border-radius: 8px;}
.about-section .left-pic p {background: #eb6424;color: #fff;font-size: 17px;font-weight: 500;text-align: center;padding: 10px 20px;border-radius: 5px;position: absolute;left: -20px;letter-spacing: .4px;bottom: -30px;}

.project-section { padding: 5% 0; background-image: url('image/project-bg.jpg'); background-size: cover;}
.project-section .heading { color: #fff;}
.project-section .heading::after { left: 0; right: 0; margin: 0 auto;}
.project-section .poroject-card { margin: 20px 0 0 0;}
.project-section .poroject-card .pic { overflow: hidden; border-radius: 10px; }
.project-section .poroject-card .pic img { transition: all .4s ease-in-out;}
.project-section .poroject-card:hover .pic img { transform: scale(1.1);}
.project-section .poroject-card h4 { color: #fff; padding: 15px 15px 0 15px; font-size: 22px; line-height: 1.4; letter-spacing: .5px;}

.service-section { padding: 5% 0;}
.service-section .heading::after { left: 0; right: 0; margin: 0 auto;}
.service-section .ser-card  { padding: 15px;box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;border-radius: 10px;margin: 18px 0 0 0;min-height: 340px;transition: all .3s ease-in-out;}
.service-section .ser-card:hover { transform: translate(0, -12px)}
.service-section .ser-card .pic img { border-radius: 5px;}
.service-section .ser-card h5 { margin: 20px 10px 10px 10px;text-align: center;color: #eb6424;font-size: 17px;font-weight: 500;line-height: 1.3;letter-spacing: .3px;} 

footer {background: linear-gradient(135deg, #111, #1c1c1c);padding: 4% 0 0 0;}
footer h4 {color: #fff; font-size: 19px;font-weight: 600;margin: 0 0 12px 0;letter-spacing: .5px;}
footer p, footer p a {color: #bbbbbb;font-size: 14px;margin: 0 0 10px 0;line-height: 24px;}
footer p a:hover { color: #eb6424;  padding-left: 5px; transition: 0.3s;}
footer .footer-bottom {margin: 3% 0 0 0;border-top: 1px solid rgba(204, 204, 204, .4);padding: 15px 0;}
footer .footer-bottom p { margin: 0;}
footer p i { color: #ffffff; margin: 0 5px 0 0}
footer .social-icon a {position: relative;color: #fff;background: rgba(255, 255, 255, .1);font-size: 13px;width: 35px;height: 35px;margin: 0 5px 0 0;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: #6cc046; 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);}
  
.heading-innerpage {padding: 14% 0 8% 0;background-image: url('image/inner-banner.jpg');background-size: cover;background-position: center;}
.heading-innerpage h2 { color: #fff; font-size: 40px; font-weight: 600; margin: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; position: relative;}
.heading-innerpage h2::after { position: absolute; content: ''; background: #ffff; width: 140px; height: 2px; top: 60px; left: 0; right: 0; margin: 0 auto;} 

.contact-info {background: #fdf9e5;padding: 25px;margin: 0 0 10px 0;}
.contact-info i {color: #1b1b1b;font-size: 21px;}
.contact-info h5 {color: #eb6424;text-transform: uppercase;font-size: 16px;font-weight: 700;letter-spacing: .5px;}
.contact-info p, .contact-info p a {color: #1b1b1b;margin: 0;font-size: 15px;}

@media (min-width: 320px) and (max-width: 768px) {
  p { font-size: 15px}
  
  .heading {font-size: 32px;}
  .sub-heading {font-size: 20px;}
  
  header img { width: 80px; padding: 5px 0}
  
  .banner-section .carousel-caption p {background: #000000;display: inline-block;padding: 10px 25px;border-radius: 8px;color: #fff;font-size: 18px;letter-spacing: .8px;}
  
  .about-section .left-pic { margin: 0 0 40px 0}
  .about-section .left-pic p {font-size: 16px; left: -10px;}
    
  .heading-innerpage h2 { font-size: 30px;}
}