@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');

html { overflow-x: hidden;}
body {margin: 0;padding: 0;font-family: "Work Sans", sans-serif;overflow-x: hidden;color: #2c2c2c;}
p, .main-table li {color: #2c2c2c;font-size: 15px;line-height: 25px;margin: 0 0 15px 0;font-family: "Work Sans", sans-serif;}
.main-table li {color: #2c2c2c; font-size: 15px;line-height: 25px;margin: 0 0 10px 0; font-family: "Work Sans", sans-serif;}
a { text-decoration: none !important; font-family: "Work Sans", sans-serif;}
h1, h2, h3, h4, h5, h6 { font-family: "Work Sans", sans-serif;}

img { filter: brightness(96%);}

.main-table {text-align: left;padding: 4% 0;}
#RadDockZone2 .container-fluid { padding: 0 6% !important;}

#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: #012951 !important;height: 100%;}

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

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

@media (min-width: 320px) and (max-width: 768px ){ 
  .navbar-toggler { position: absolute; right: 15px; top: -60px; background: #fff}
  #HeaderControl, #HeaderControl_C {background: #f2ede7;}
  .navbar .container-fluid {background: #012951;margin-top: -8px !important;}
  #MenuControl, #MenuControl_C { height: 0 !important}
}

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

.heading { color: #2c2c2c; font-size: 30px; font-weight: 600; margin: 0 0 20px 0;}
.main-heading{font-weight:bold; Font-size:22px; color:#222; line-height:36px; border-bottom:1px #ccc dashed; text-transform:uppercase; text-align:left;    margin-bottom: 20px;}
.sub-heading{font-weight:bold;Font-size:20px; color:#222;line-height:30px;text-transform:uppercase;text-align:left;}

.top-bar {background: #333333; padding: 7px 0;}
.top-bar p { margin: 0; color: #fff; font-size: 15px;}
.top-bar p a { color: #fff; font-size: 15px; display: inline-block}
.top-bar p i { color: #ef801e; font-size: 14px}
.top-bar .social-icon a {display: inline-block; background: #fff; width: 25px; height: 25px; border-radius:50%; margin: 0 2px; text-align: center; line-height: 1.7;}
.top-bar .social-icon a i { font-size: 13px;}

header { background: #012951;}

.banner-section { background-image: linear-gradient(90deg, #fff 50%, #03172c -50%); position: relative;} 
.banner-section::after {content: '';position: absolute;width: 50%;height: 220px;background: #ef801e;left: 0;bottom: 10%;}
.banner-section .carousel { position: relative; z-index: 1;}
.banner-section .carousel-caption {top: 15%;background: #00000082;bottom: auto;backdrop-filter: blur(1px); text-align: start; padding: 25px}
.banner-section .carousel-caption h1 { color: #fff; font-size: 21px; text-transform: uppercase; line-height: 1.5}
.banner-section .carousel-caption p { color: #fff; margin: 0}
.banner-section .right-content {position: relative;z-index: 3;}
.banner-section .right-content h2 { color: #fff; font-size: 26px; margin: 0 0 15px 0;}
.banner-section .right-content p {color: #e4e4e4;margin: 0;}

.about-section { padding: 5% 0;}

.ql-story{ padding:20px 0px;}
.ql-icon{text-align: center;background: #012951;border: 1px dashed #ffffff;margin: 40px 0 0 0;padding: 20px;transition:0.5s;min-height: 250px;}
.ql-icon h3{ text-align: center; transition:0.5s; margin-bottom: 0; color: #fff; font-size: 21px; margin: 8px 0;}
.ql-icon p{text-align: center;margin: 0;color: #f5f5f5;line-height: 22px;}
.ql-icon img{  transition:0.5s; border: 0; margin-top:0; margin-bottom: 10px;}
.ql-icon:hover{background:#222;}
.ql-icon:hover h3{color:#fff;}
.ql-icon:hover p{color:#fff;}
.ql-icon:hover img{filter: brightness(0) invert(1); -webkit-filter: brightness(0) invert(1); -moz-filter: brightness(0) invert(1); transform:rotate(5deg) scale(0.95);}

.Eco-env{ background-attachment:fixed; padding:30px 0px;}
.Eco-env img:hover{transform:rotate(5deg) scale(0.95); transition:0.5s;}

.Cl-logo img{ margin:20px 0px;}
.Cl-logo img:hover{transform:rotate(5deg) scale(0.95); transition:0.5s;}
.col-bdr{ border:1px #555 dashed; text-align:center; background:rgba(0,0,0,0.8);}

/*footer*/
footer{background:#222; padding-top:50px;}
.copyrht{background: #012951;font-size: 15px;padding: 10px 0;position: relative;margin: 40px 0 0 0}
.copyrht p{ margin-bottom: 0; color: #fff; font-size: 14px;}
.cprht-rht a{ color:#fff;}
.cprht-rht a .fa{ background: #ef801e; border-radius: 50%; width: 30px; text-align: center; height: 30px; line-height: 29px; transition:0.5s;}
.cprht-lft strong{color: #fff;font-weight: 600;}
.same-fts{padding:5px; position: relative; margin-top:10px; transition:0.5s;}
.same-ft{border: 1px dashed #666;padding: 20px;position: relative;margin-top:15px;transition:0.5s;}
.same-ft i { color: #ef801e; font-size: 30px}
.same-ft h3{color: #fff; font-size: 18px;}
.same-ft p {color: #999;font-size: 0.9em;margin: 0;}
.same-ft p span{ display:block; color:#777;}
.same-ft p a{color:#999;}

.same-ft:hover{ background: rgba(98, 72,124, 0.7); color:#fff;}
.same-ft:hover p, .same-ft:hover p span, .same-ft:hover p a{color:#fff;}
.same-ft:hover:after{color:#fff;}

@media (min-width: 320px) and ( max-width: 768px) {
  .banner-section { background-image: linear-gradient(90deg, #03172c 50%, #03172c -50%);margin: 0 0 5% 0} 
  .banner-section::after {content: '';position: absolute;width: 50%;height: 0px;background: #ef801e;left: 0;bottom: 10%;}
  .banner-section .right-content {padding: 20px 0; position: relative;z-index: 3;}
  .banner-section .right-content h2 { color: #fff; font-size: 21px;}
}