@font-face {
    font-family: Overpass;
    src: url(fonts/OVERPASS-BLACK.TTF);
    src: url(fonts/OVERPASS-BLACKITALIC.TTF);
    src: url(fonts/OVERPASS-BOLD.TTF);
    src: url(fonts/OVERPASS-BOLDITALIC.TTF);
    src: url(fonts/OVERPASS-EXTRABOLD.TTF);
    src: url(fonts/OVERPASS-EXTRABOLDITALIC.TTF);
    src: url(fonts/OVERPASS-EXTRALIGHT.TTF);
    src: url(fonts/OVERPASS-EXTRALIGHTITALIC.TTF);
    src: url(fonts/OVERPASS-ITALIC.TTF);
    src: url(fonts/OVERPASS-LIGHT.TTF);
    src: url(fonts/OVERPASS-LIGHTITALIC.TTF);
    src: url(fonts/OVERPASS-REGULAR.TTF);
    src: url(fonts/OVERPASS-SEMIBOLD.TTF);
    src: url(fonts/OVERPASS-SEMIBOLDITALIC.TTF);
    src: url(fonts/OVERPASS-THIN.TTF);
    src: url(fonts/OVERPASS-THINITALIC.TTF);
}
/* latin-ext */
@font-face {
  font-family: 'Overpass';
  font-style: normal;
  font-weight: 400;
  src: local('Overpass Regular'), local('Overpass-Regular'), url(https://fonts.gstatic.com/s/overpass/v2/qFdH35WCmI96Ajtm81GrU9vyww.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Overpass';
  font-style: normal;
  font-weight: 400;
  src: local('Overpass Regular'), local('Overpass-Regular'), url(https://fonts.gstatic.com/s/overpass/v2/qFdH35WCmI96Ajtm81GlU9s.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


body {
    font-family: 'Overpass';
}


/********************************/
/*       Fade Bs-carousel       */
/********************************/
.fade-carousel {
    position: relative;
    height: 480px;
}
.fade-carousel .carousel-inner .item {
    height: 480px;
}
.fade-carousel .carousel-indicators > li {
    margin: 0 2px;
    background-color: #f39c12;
    border-color: #f39c12;
    opacity: .7;
}
.fade-carousel .carousel-indicators > li.active {
  width: 10px;
  height: 10px;
  opacity: 1;
}

/********************************/
/*          Hero Headers        */
/********************************/
.hero {
    position: absolute;
    top: 40%;
    left: 44%;
    z-index: 3;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 1px 1px 0 rgba(0,0,0,.75);
      -webkit-transform: translate3d(-50%,-50%,0);
         -moz-transform: translate3d(-50%,-50%,0);
          -ms-transform: translate3d(-50%,-50%,0);
           -o-transform: translate3d(-50%,-50%,0);
              transform: translate3d(-50%,-50%,0);
}
.hero h1 {
    font-size: 49px;    
    font-weight: bold;
    margin: 0;
    padding: 0;color: #000000;
    text-align: left;
}
.hero h3{color: #636363;font-size: 18px;text-align: left;}
.fade-carousel .carousel-inner .item .hero {
    opacity: 0;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s; 
}
.fade-carousel .carousel-inner .item.active .hero {
    opacity: 1;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s;    
}

/********************************/
/*            Overlay           */
/********************************/
.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: #080d15;
    opacity: 0;
}

/********************************/
/*          Custom Buttons      */
/********************************/
.btn.btn-lg {padding: 14px 40px 10px 40px;}
.btn.btn-hero,
.btn.btn-hero:hover,
.btn.btn-hero:focus {
    color: #f5f5f5;
    background-color: #1abc9c;
    border-color: #1abc9c;
    outline: none;
    margin: 20px auto;
}

/********************************/
/*       Slides backgrounds     */
/********************************/
.fade-carousel .slides .slide-1, 
.fade-carousel .slides .slide-2,
.fade-carousel .slides .slide-3 {
  /*height: 100vh;*/
  height: 480px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.fade-carousel .slides .slide-1 {
  background-image: url(../images/banner.jpg); background-size: 100% 100%;
}
.fade-carousel .slides .slide-2 {
  background-image: url(../images/banner.jpg);background-size: 100% 100%;
}
.fade-carousel .slides .slide-3 {
  background-image: url(../images/banner.jpg);background-size: 100% 100%;
}

/********************************/
/*          Media Queries       */
/********************************/
@media screen and (min-width: 980px){
    .hero { width: 980px;}    
}
@media screen and  (min-width: 980px) and (max-width: 1024px){
  .hero { left: 50%;}
  .left,.middle,.right{padding: 45px 30px !important;}
}
@media screen and (max-width: 640px){
    .hero h1 { font-size: 1em; }    
}

.top-header-panel{background: #f4fafb; padding-top: 12px;}
.top-header-panel p{color: #636363;    font-size: 14px;}
.top-header-panel i{padding-right: 10px;}
.header-panel{padding-top: 20px;    padding-bottom: 20px;box-shadow: 0 8px 6px -6px #c4cbcd;
    margin-bottom: 2px;}
.header-btn .head-btn{background-color: #93cddc !important;border-color: #93cddc !important;}
.header-btn{padding-top: 10px;}
.header-btn .btn-lg{padding: 9px 20px 4px 20px;    border-radius: 0;}
.topnav {
  overflow: hidden;
  /*background-color: #333;*/
}

.topnav a {
  float: left;
  display: block;
  color: #494949;
  text-align: center;
  padding: 14px 21px;
  text-decoration: none;
  font-size: 20px;
}
@media(max-width:450px){
.topnav a { font-size: 18px !important;}    
}

.topnav a:hover {
  /*background-color: #ddd;*/
  color: #494949;
  text-decoration: none;
}
.topnav a:hover:after {
    content: "";
    color: #93cddc;
    display: block;
    width: 25px;
    margin: 7px 0px;
    border-bottom: 3px solid #eb8635;
    position: absolute;
}
.topnav a:after {
    content: "";
    color: #93cddc;
    display: block;
    width: 25px;
    margin: 7px 0px;
    border-bottom: 3px solid #93cddc;
    position: absolute;
}
.topnav .active1:after{
  border-bottom: 3px solid #eb8635;
}
/*.topnav .active1:hover:after{*/
/*  border-bottom: 3px solid #93cddc;*/
/*}*/
.topnav a:hover.active1:after{border-bottom: 3px solid #93cddc !important;}
.active {
  background-color: #4CAF50;
  color: white;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}

.slider{height: 480px;}
.slider .col-sm-12{padding: 0px;}
.about-us h3,.about-us h2{text-align: center;}
.about-us h3{color: #989eb3;font-size: 20px;padding-top: 15px;}
.about-us h2{font-size: 40px;color: #000000;}
.about-us p{color: #7d7d7d;font-size: 18px;padding: 10px 30px;    line-height: 1.8;}

.one{text-align: center;text-transform: uppercase;}
.one h3{font-size: 20px;font-weight: bold;color: #000000;}
.one h2{font-size: 40px;font-weight: bold;color: #000000;}
.one h4{font-size: 20px;color: #000000;line-height: 2;}

.two{text-align: center;text-transform: uppercase;}
.two h3{font-size: 20px;font-weight: bold;color: #000000;}
.two h2{font-size: 40px;font-weight: bold;color: #000000;}
.two h4{font-size: 20px;color: #000000;line-height: 2;}

.three{text-align: center;text-transform: uppercase;}
.three h3{font-size: 20px;font-weight: bold;color: #000000;}
.three h2{font-size: 40px;font-weight: bold;color: #000000;}
.three h4{font-size: 20px;color: #000000;line-height: 2;}

.four{text-align: center;text-transform: uppercase;  }
.four h3{font-size: 20px;font-weight: bold;color: #000000;}
.four h2{font-size: 40px;font-weight: bold;color: #000000;}
.four h4{font-size: 20px;color: #000000;line-height: 2;}

.second-panel{padding: 25px 0px;}
.second-panel .main-one,.second-panel .main-two,.second-panel .main-three{border-right: 1px dotted #7d7d7d;}
.third-panel h3,.third-panel h2{text-align: center;}
.third-panel h2{font-size: 30px;color: #002161;}
.third-panel{padding-bottom: 35px;}
.btn-warning{border-radius: 0px !important;background-color: #eb8635 !important;    border-color: #eb8635 !important;}

.technology{background-size: cover; background-image: url(../images/mountains_bg.jpg);  background-repeat: no-repeat;height: 800px;width: 100%;}
.technology h3{color: #002161;font-size: 20px;text-transform: uppercase;text-align: center;padding: 20px 0px;}
.technology h2{color: #000000;font-size: 40px;text-align: center;padding: 0px 0px 15px 0px;}
.first-one h4{color: #646464;font-size: 20px;text-align: center;padding: 0px 0px 25px 0px;}
.left h4{font-size: 25px;text-align: center;color: #000000;padding: 20px 0px;}
.left p{color: #636363; font-size: 16px;text-align: left;line-height: 1.7;}
.left{background: #fff;    padding: 45px 40px;    box-shadow: 0px 0px 1px 1px #ccc;height: 460px;}

.middle h4{font-size: 25px;text-align: center;color: #000000;padding: 20px 0px;}
.middle p{color: #636363; font-size: 16px;text-align: left;line-height: 1.7;}
.middle{background: #fff;    padding: 45px 40px;    box-shadow: 0px 0px 1px 1px #ccc;height: 460px;}

.right h4{font-size: 25px;text-align: center;color: #000000;padding: 20px 0px;}
.right p{color: #636363; font-size: 16px;text-align: left;line-height: 1.7;}
.right{background: #fff;    padding: 45px 40px;    box-shadow: 0px 0px 1px 1px #ccc;height: 460px;}

.last-row{padding-top: 3%;}

.get-in-touch{background-image: url(../images/mobile-bg.jpg);  background-repeat: no-repeat;    height: 346px;    width: 100%;    background-size: cover;    background-position: bottom;}
.get-in-touch .title{text-align: center;    color: #fff;    padding-top: 10%;}
.get-in-touch h2{font-size: 30px;padding-bottom: 20px;}
.get-in-touch .title h1{font-size: 40px;}
.get-in-touch .title .btn-warning{padding: 14px 50px 10px 50px;font-size: 18px;}
footer{background: #93cddc;padding: 40px;}
.cont-det,.cont-det p,.cont-det a{font-size: 18px;color: #fff;text-decoration: none;margin-bottom: 0px;}
.subscribe h1{font-size: 40px;color: #fff;text-align: center;}
.subscribe p{font-size: 13px;color: #fff;margin-bottom: 0px;}
.social ul li{list-style: none;float: left;padding-right: 15px;}
.social ul li i{color: #fff;font-size: 20px;}
.subscribe .form-control{height: 42px;}
.subscribe .btn-warning{height: 40px;}
.subscribe{padding: 30px 0px 0px 0px;}

.title-panel h3{color: #002161;font-size: 20px;text-transform: uppercase;text-align: center;padding: 20px 0px;}
.title-panel h2{color: #000000;font-size: 40px;text-align: center; padding: 0px 0px 15px 0px;}
.portfolio .head-btn{background-color: #93cddc !important;border-color: #93cddc !important;}
.clients-logo2{padding-bottom: 60px;}
.clients-logo1{margin-bottom: 6px;}
/*.clients-logo1 .col-sm-2,.clients-logo2 .col-sm-2{padding-right: 3px;padding-left: 3px;}*/
.clients-logo1 .col-sm-2 img,.clients-logo2 .col-sm-2 img{width: 100%;height:auto;}
 /*.clients-logo1 .col-sm-2 img,.clients-logo2 .col-sm-2 img{height: 120px;}*/
.service-btn{float: left; width: 57%; text-align: right;}
.service-btn .btn-lg{padding: 14px 25px 10px 25px;}
.portfolio .btn-lg{padding: 14px 30px 10px 30px;}
.portfolio{float: right;    width: 40%;}
.social{padding:0px;}
.project-btn{padding-left: 0px;}
.goal_first,.goal_third{border: 1px solid #fff;
    background: #002161;
    padding: 18px 15px;
    height: 155px;
    width: 83%;
    margin-left: 14%;}
.goal_second,.goal_four {border: 1px solid #fff;background: #002161;
    padding: 18px 15px;
    height: 155px;
    width: 83%;}
.our_goal .who_we p{padding: 20px 0px 20px 0px;font-size: 18px;}
/*.about_us,.who_we,.first-panel p{padding: 20px 0px 20px 0px;}*/
.service_banner{background-image: url(../images/service.jpg) !important;}
.portfolio_banner{background-image: url(../images/portfolio.png) !important;}
.contactus_banner{background-image: url(../images/contact.jpg) !important;}
.client_banner{background-image: url(../images/clients.jpg) !important;}
.transparent_layer{background-color: #0000009e; width: 100%; height: 326px;}

.serv1,.serv2,.serv3{margin-bottom: 10%;}

@media screen and (max-width: 480px){

.service-btn .btn-lg{padding: 6px;    font-size: 15px;}
.portfolio .btn-lg{font-size: 15px;    padding: 6px 16px;}
.affix{width: auto;box-shadow: none;position: static;}
  .top-header-panel p{text-align: center;margin-bottom: 1px;}
  .topnav{background-color: #f4fafb;}
  .header-btn{text-align: center;}
  .topnav .icon:hover:after,.topnav .icon:after{border-bottom: 0px solid #fff;}
  .one,.two,.three,.four{border-bottom: 1px dotted #7d7d7d;}
  .technology {height: 1560px;}
  .left,.middle,.right{    margin-bottom: 5px;}
  .clients-logo1 .col-xs-6,.clients-logo2 .col-xs-6{margin-bottom: 5px;}
  .foot-logo{text-align: center;}
  .foot-logo img{margin-bottom: 20px;}
  .hero{    top: 55%;    left: 36%;}
  .hero h3{font-size: 12px;}
  .hero .btn-warning{padding: 6px 12px;   font-size: 14px;}
  .fade-carousel .slides .slide-1, .fade-carousel .slides .slide-2, .fade-carousel .slides .slide-3,
  .fade-carousel .carousel-inner .item,.fade-carousel,.slider{height: 160px;}
  .title-panel h2{font-size: 20px;}
  .subscribe h1 { font-size: 20px;text-align: center;}
  .get-in-touch{height: 270px;}
  .get-in-touch .title{padding-top: 0px;}
  .get-in-touch h2{padding-bottom: 0px;}
  .clients-logo1 .col-sm-2 img, .clients-logo2 .col-sm-2 img{height: auto;}
  .header-panel {  padding-top: 15px; padding-bottom: 15px;}
  .project-btn{padding-bottom: 10px;}
  .header-btn {padding-top: 0px;}
  .clients-logo1 { margin-bottom: 0px;}

  .about-us p { font-size: 16px; padding: 10px 20px; line-height: 1.6;}
  .second-panel { padding: 0px 0px;}
  .one h3,.two h3,.three h3,.four h3{font-size: 18px;}
  .one h2,.two h2,.three h2,.four h2{font-size: 35px;}
  .one h4,.two h4,.three h4,.four h4{font-size: 18px;}
  .third-panel h2 { font-size: 25px;}
  .technology h2{margin-top: 0px; margin-bottom: 0px;font-size: 32px;padding: 0px;}
  .first-one h4{font-size: 17px;}
  .left,.middle,.right{padding: 20px 40px;height: 410px;}
  .left p,.middle p,.right p{font-size: 15px;}
  .fld{margin: 0px 0px 10px !important;width: 276px !important;}
  .modal-dialog{width: 96% !important;}
  .team{height: 100% !important;}
  .serv1,.serv2{margin-bottom: 10%;}
  .goal_layer{position: static !important;}
  .our_goal{height: 100% !important;}
  .goal_layer .col-md-5{padding-top: 0px !important;padding-bottom: 10%;}
  .goal_second,.goal_four{margin-left: 9%;margin-top: 10%;}
  .goal_first,.goal_third{margin-left: 9% !important;}
  .about_us,.clients_testimonial {    padding: 30px 20px !important;}
  .member-list {  padding: 20px 0px 0px 40px !important;}
  .cont-info-det .fld{width: 255px !important;}
  .social-icons .fa{margin-right: 4px !important; margin-bottom: 5%;}
  .box .title { font-size: 14px !important;}
  .clients-logo-div1, .clients-logo-div2, .clients-logo-div3 { padding-top: 0px;}
  .banner{height: 150px !important;background-size: 100% 100% !important;}
  .about-title {padding-top: 0% !important;}
  .cont-info-banner .service-title {padding-top: 6% !important;}
  .cont-info-banner .service-title h1 { font-size: 35px !important;}
  .our_goal{background-size: 100% 20% !important;background-repeat: round !important;}
  #myModal .img-responsive{width: 100% !important;margin-bottom: 5%;}
  .transparent_layer{height: 150px;}
  .get-in-touch .title h1{font-size: 38px;}
  .get-in-touch .title h2{font-size: 28px;}
  .box .inner-content{top: 55% !important;}
  .box .post{font-size: 13px !important;margin-bottom: 5px !important;}
  .box .icon li a{width: 23px !important;font-size: 15px !important;
    height: 23px !important;}
  .filter-button{font-size: 15px !important;margin-top: 5px !important;}
  .social-icons,.cont-info-det .modal-body .form-check-inline .labeltext{padding-left: 0px !important;}
  .our_goal,.goal_layer{height: 1440px !important;}
  .goal_layer .who_we {  padding: 10px 10px 20px 20px !important;}
}



@media screen and (min-width: 768px) and (max-width: 1024px){
.topnav a{padding: 12px 20px;font-size: 14px;}
.header-btn {  padding-top: 3px;}
.header-btn .btn-lg { padding: 5px 0px;}
.project-btn{padding-left: 0px;}
.fade-carousel .slides .slide-1, .fade-carousel .slides .slide-2, .fade-carousel .slides .slide-3,
.fade-carousel .carousel-inner .item,.fade-carousel,.slider{height: 410px;}

}

@media screen and (min-width: 481px) and (max-width: 768px){
.topnav a{padding: 12px 8px;font-size: 14px;}
.one h4,.two h4 {font-size: 17px;}
.main-two{padding: 0px;}
.left,.middle,.right {padding: 45px 10px;height: 523px;}
.technology{height: 850px;}
.cont-det{padding-left: 75px;}
.social ul li{padding-right: 9px;}
.subscribe h1 {    font-size: 30px;}
.service-btn .btn-lg{padding: 10px;    font-size: 17px;}
.portfolio .btn-lg{padding: 10px;    font-size: 17px;}
.portfolio {width: 37%;}

.fade-carousel .slides .slide-1, .fade-carousel .slides .slide-2, .fade-carousel .slides .slide-3,
.fade-carousel .carousel-inner .item,.fade-carousel,.slider{height: 300px;}
.hero{left: 37%; top: 52%;}
.hero h1 { font-size: 35px;}
.hero h3{font-size: 16px;}
.clients-logo1 .col-sm-2 img, .clients-logo2 .col-sm-2 img{height: 85px;}
.title-panel h2{font-size: 30px;}
/*.modal-dialog {    width: 65% !important;}*/
.our_goal{height: 890px !important;}
.goal_layer .col-md-5{padding-top: 0px !important;}
.member-list { padding: 20px 0px 0px 0px !important;}
.who_we_banner img{width: 100%;}
.social-icons .fa{ margin-bottom: 5%;}
.cont-info-det .fld{width: 93% !important;}
.about_us { padding: 30px 20px !important;}
.banner{height: 250px !important;}
.about-title {padding-top: 8% !important;}
.fld {background: none !important;}
.our_goal{background-size: 100% 60% !important;background-repeat: round !important;}
#myModal .img-responsive{width: 100% !important;margin-bottom: 5%;}
.transparent_layer{height: 250px;}
.goal_layer{height: 890px !important;}
.cont-info-banner .service-title{padding-top: 9% !important;}
}

.back-to-top {
    cursor: pointer;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display:none;
}



/*animated css*/
  a[data-toggle="modal"] {
  margin: 5px;
}
.title {
  color: #757575;
  font-weight: bold;
}
.modal {
  text-align: left;
}
.modal-content {
  border: none;
  border-radius: 2px;
  box-shadow: 0 16px 28px 0 rgba(0,0,0,0.22),0 25px 55px 0 rgba(0,0,0,0.21);
}
.modal-header{
  border-bottom: 0;
  padding-top: 15px;
  padding-right: 26px;
  padding-left: 26px;
  padding-bottom: 0px;
}
/*.modal-dialog {width: 37%;}*/
.modal-title {
  font-size: 34px;
}
.modal-body{
  border-bottom: 0;
  padding-top: 5px;
  padding-right: 26px;
  padding-left: 26px;
  padding-bottom: 10px;
  font-size: 15px;
}
.modal-footer {
  border-top:0;
  padding-top: 0px;
  padding-right:26px;
  padding-bottom:26px;
  padding-left:26px;
}
.btn-default,.btn-primary {
    border: none;
    border-radius: 2px;
    display: inline-block;
    color: #424242;
    background-color: #FFF;
    text-align: center;
    height: 36px;
    line-height: 36px;
    outline: 0;
    padding: 0 2rem; 
    vertical-align: middle;
    -webkit-tap-highlight-color: transparent;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    letter-spacing: .5px;
    transition: .2s ease-out;
}
.btn-default:hover{
  background-color: #FFF;
  box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15);
}
.btn-primary {
  color: #FFF;
  background-color: #2980B9;
}
.btn-primary:hover{
  background-color: #2980B9;
  box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18),0 4px 15px 0 rgba(0,0,0,0.15);
}

/*form field css*/


.fld::-webkit-input-placeholder,
.fld::-webkit-input-placeholder {
  font: inherit;
  transition: font-size 0.3s ease-in-out, visibility 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, font-size 0.3s ease-in-out, visibility 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, font-size 0.3s ease-in-out, visibility 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.fld{
  font: inherit;
  font-size: 0.8em;
  margin: 0px 25px 10px;
  width: 496px;
  display: block;
  border: none;
  padding: 20px 0 10px;
  border-bottom: solid 1px #eb8635;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, #eb8635 4%);
  background-position: -400px 0;
  background-size: 400px 100%;
  background-repeat: no-repeat;
  transition: background 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
  resize: none;
  overflow: hidden;
}
.fld:focus::-webkit-input-placeholder,
.fld:focus::-webkit-input-placeholder {
  color: #03A9F4;
}
.fld:focus, .fld:valid,
.fld:focus,
.fld:valid {
  box-shadow: none;
  outline: none;
  background-position: 0 0;
}
.fld:focus::-webkit-input-placeholder, .fld:valid::-webkit-input-placeholder,
.fld:focus::-webkit-input-placeholder,
.fld:valid::-webkit-input-placeholder {
  font-size: 0.8em;
  -webkit-transform: translateY(-20px);
          transform: translateY(-20px);
  visibility: visible !important;
  opacity: 1;
}

.fld{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, #eb8635 4%);
  background-position: -496px 0;
  background-repeat: no-repeat;
  transition: border-bottom 0.3s ease, background 0.3s ease;
}

.modal-header-warning{background: #eb8635;    color: #fff;}
.modal-header-warning .close{color: #fff;    opacity: 1;}
.flex {
  display: flex;
  align-items: stretch;
}
.flex textarea {
  line-height: 120%;
}



/* Custom Radio Button Start*/

.radiotextsty {
  color: #555;
  font-size: 13px;
  font-weight: normal;
}

.customradio {
  display: block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 0px;
  cursor: pointer;
  font-size: 18px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.customradio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 22px;
  width: 22px;
  background-color: white;
  border-radius: 50%;
  border:1px solid #eb8635;
}

/* On mouse-over, add a grey background color */
.customradio:hover input ~ .checkmark {
  background-color: transparent;
}

/* When the radio button is checked, add a blue background */
.customradio input:checked ~ .checkmark {
  background-color: white;
  border:1px solid #eb8635;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.customradio input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.customradio .checkmark:after {
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #eb8635;
}

/* Custom Radio Button End*/
.cont-us-btn{background-color: #eb8635;    border-color: #eb8635;padding: 3px 30px 1px 30px;}




.affix {
    top:0;
    width: 100%;
    z-index: 9 !important;
    background-color: #fff;
    padding: 3px 0px 7px 0px;
    box-shadow: 0 8px 6px -6px #c4cbcd;
  }
.banner{background-image: url('../images/bann.jpg');
    background-repeat: no-repeat;
    height: 326px;
    width: 100%;
    background-size: 100% 100%;
    background-position: bottom;}
.breadcrumb-item+.breadcrumb-item::before{content: "";
    border-color: transparent #93cddc;
    border-style: solid;
    border-width: 0.35em 0 0.35em 0.55em;
    display: block;
    height: 0;
    width: 0;
    left: 0.3em;
    top: .3em;
    float: left;
    position: relative;}



    .panel-group .panel {
        border-radius: 0;
        box-shadow: none;
        border-color: #EEEEEE;
    }

    .panel-default > .panel-heading {
        padding: 0;
        border-radius: 0;
        color: #212121;
        background-color: #FAFAFA;
        border-color: #EEEEEE;
    }

    .panel-title {
        font-size: 14px;
    }

    .panel-title > a {
        display: block;
        padding: 15px;
        text-decoration: none;
    }

    .more-less {
        float: right;
        color: #212121;
    }

    .panel-default > .panel-heading + .panel-collapse > .panel-body {
        border-top-color: #EEEEEE;
    }



/*testimonials*/
#testimonial-slider,#accordion{padding-top: 20px;padding-right: 20px;}
.testimonials h1{padding-bottom: 20px;}
.testimonial{ margin: 0 20px 50px; }
.testimonial .pic{
    display: inline-block;
    width: 16%;
    height: 90px;
    border-radius: 50%;
    margin: 0 15px 15px 0;
}
@media(max-width:1012px){
.testimonial .pic{width: 40%;}    
}
@media (max-width: 500px){
.testimonial .pic {
    width: 37%;
    height: 54px;}
}
@media (max-width: 450px){
.testimonial .pic {
    width: 49%;height: 39px;}
}
.testimonial .pic img{
    width: 100%;
    height: auto;
    border-radius: 50%;
}
.testimonial .testimonial-profile{
    display: inline-block;
    position: relative;
    /*top: 15px;*/
}
.testimonial .title{
    display: block;
    font-size: 20px;
    font-weight: 600;
    color: #2f2f2f;
    text-transform: capitalize;
    margin: 0 0 7px 0;
}
.testimonial .post{
    display: block;
    font-size: 14px;
    color: #5d7aa7;
}
.testimonial .description{
    padding: 20px 22px;
    background: #002161;
    font-size: 15px;
    color: #fff;
    line-height: 25px;
    margin: 0;
    position: relative;
}
.testimonial .description:before,
.testimonial .description:after{
    content: "";
    border-width: 18px 0 0 18px;
    border-style: solid;
    border-color: #002161 transparent transparent;
    position: absolute;
    bottom: -18px;
    left: 0;
}
.testimonial .description:after{
    border-width: 18px 18px 0 0;
    left: auto;
    right: 0;
}
.owl-theme .owl-controls{
    margin-top: 10px;
    margin-left: 30px;
}
.owl-theme .owl-controls .owl-buttons div{
    opacity: 0.8;
    background: #fff;
}
.owl-prev:before,
.owl-next:before{
    content: "\f053";
    /*font-family: "Font Awesome 5 Free";*/
   font-family: FontAwesome;
    font-weight: 900;
    font-size: 20px;
    color: #1f487e;
}
.testimonials .owl-theme .owl-controls .owl-buttons div{background: #002161 !important; opacity: 1 !important;}
.testimonials .owl-prev:before, .owl-next:before{color: #93cddc;}
/*.clients_testimonial{padding: 40px 55px;}*/
.clients_testimonial{padding:30px 68px 30px 91px;}

.owl-next:before{ content: "\f054"; }
.team{background-image: url('../images/img3.jpg');height: 463px;background-size: cover;padding: 0px 55px;color: #fff;}
.team h1,.team .desig{margin-top: 0px;}
.team .details{padding-top: 10%;}
.member-list{padding: 20px 0px 0px 80px;}
.team-memb2{padding-top: 30%;}
/*.layer{background-color: #00000080;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 73%;}*/
.title-team{padding: 30px 0px 0;}
.ask-ques h1{padding-bottom: 20px;}


.about-title{padding-top: 22%;color: #fff;}
.about-title h1{font-size: 50px;}
.breadcrumb {
    padding: 0px;
    margin-bottom: 0px;
    list-style: none;
    background-color: transparent;
    text-align: center;
}
.breadcrumb-item a,.breadcrumb-item{font-size: 20px;
    color: #fff;
    text-decoration: none;}
/*.about_us{padding: 30px 55px;}*/
.about_us{padding:30px 68px 30px 91px;}
.first-panel h1 span,.testimonials h1 span,.ask-ques h1 span{color: #93cddc;}
.testimonials h1,.ask-ques h1,.first-panel h1{color: #002161 !important}
.first-panel h1:after,.team h1:after,.testimonials h1:after,.ask-ques h1:after {content: "";
    color: #93cddc;
    display: block;
    width: 25px;
    margin: 7px 6px;
    border-bottom: 3px solid #eb8635;
    position: absolute;}
.first-panel p,#mission p, #vision p{    font-size: 18px;
    padding: 20px 20px 0px 0px;
    color: #636363;}
.second-panel ul li:nth-child(1) a{font-size: 25px;
    background-color: transparent !important;
    color: #002161 !important;
    padding: 0;}
.second-panel ul li:nth-child(2) a{font-size: 25px;
    background-color: transparent !important;
    color: #002161 !important;padding: 0px 35px;}
.second-panel .active{background-color: transparent !important;}
.second-panel li:nth-child(1).active:after{content: "";
    color: #93cddc;
    display: block;
    width: 25px;
    margin: 7px 28px;
    border-bottom: 3px solid #eb8635;
    position: absolute;}
.second-panel li:nth-child(2).active:after{content: "";
    color: #93cddc;
    display: block;
    width: 25px;
    margin: 7px 55px;
    border-bottom: 3px solid #eb8635;
    position: absolute;}
.who_we_banner{padding-top: 15%;}


.ask-ques .more-less {
    float: left;
    color: #ffffff;
    background: #002161;
    padding: 8px;
    border-radius: 5px;
    top: -7px;
    right: 8px;
}
.ask-ques .panel-group .panel-default{border-color: #fff;    border-left: 2px dotted #002161;}
.ask-ques .panel-group .panel-default .panel-heading{background-color: #f4f2f2;
    border-radius: 10px;
    border-color: #fff;
    border: 1px solid #ccc;}
.ask-ques .panel-group .panel-default .panel-heading .panel-title{font-size: 18px;}


.social-icons .fa{padding: 18px;
    font-size: 18px;
    height: 50px;
    width: 50px;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;margin-right: 10px;}
/* Facebook */
.social-icons .fa-facebook,.social-icons .fa-twitter,.social-icons .fa-google-plus,.social-icons .fa-linkedin,.social-icons .fa-youtube {
    background: #002161;
    color: white;
}
.cont-info i{font-size: 20px;}
.cont-info span{font-size: 17px;  padding-left: 3%;}
.cont-info p{    margin-bottom: 25px; padding-left: 20px;}
.social-icons{padding-left: 20px;}
.cont-info h1{color: #002161;padding-bottom: 10px;}
/*.cont-info-banner .about-title{padding-top: 25%;}*/
.cont-info-det{padding-top: 35px;padding-bottom: 35px;}
.cont-info-det .modal-body{border: 2px solid #002161;padding-bottom: 40px;}
.cont-info-det .modal-body h1{margin-left: 20px;color: #002161;}
.cont-info-det .modal-body .form-check-inline{padding: 4% 0 0 2%;}
.cont-info-det .modal-body .form-check-inline .labeltext{padding-top: 1%;color: #555;font-size: 12px;}
.map-frame-code iframe{border: 4px solid #002161;margin-bottom: 30px;}
.cont-info-sent-btn{margin-left: 25px;}
.cont-info-banner .service-title {padding-top: 15%;color: #fff;}
.cont-info-banner .service-title h1{font-size: 50px;}
.serv-content{padding: 15px 25px;}
.serv1,.serv2,.serv3{box-shadow: 0px -2px 9px 10px #0000006b;height: 540px;}
.our_goal{background-image: url('../images/s_ban.jpg');height: 550px;background-size: cover;margin-bottom: 5%;color: #fff;}
.goal_layer{background-color: #002161c7;
    position: absolute;
   /* top: 0;
    left: 0;*/
    width: 100%;
    height: 550px;}
.goal_layer .who_we{padding: 40px 0px 40px 55px;}
.goal_layer .who_we h1,.goal_layer .who_we p{color: #fff;}



/*portfolio*/

.gallery-title
{
    font-size: 36px;
    color: #42B32F;
    text-align: center;
    font-weight: 500;
    margin-bottom: 70px;
}
.gallery-title:after {
    content: "";
    position: absolute;
    width: 7.5%;
    left: 46.5%;
    height: 45px;
    border-bottom: 1px solid #5e5e5e;
}
.filter-button
{
    font-size: 18px;
    border: 1px solid #93cddc;
    border-radius: 3px;
    text-align: center;
    color: #002161;
    margin-top: 30px;

}
.filter-button:hover
{
    font-size: 18px;
    border: 1px solid #93cddc;
    border-radius: 5px;
    text-align: center;
    color: #ffffff;
    background-color: #002161;

}
/*.btn-default:active .filter-button:active
{
    background-color: #42B32F;
    color: white;
}*/
.filter-button:active,.filter-button:visited,.filter-button:focus{color: #fff !important;
    background-color: #002161 !important;
    border-color: #002161 !important;}
.port-image
{
    width: 100%;
}

.gallery_product
{
    margin-bottom: 30px;
}

.box{
    overflow: hidden;
    position: relative;
}
.box img{
    width: 100%;
    height: auto;
}
.box .box-content{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.3s ease 0.5s;
}
.box:before,
.box:after,
.box .box-content:before,
.box .box-content:after,
.box .box-overlay{
    content: "";
    width: 20%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transform: scale(1.2);
    transition: all 0.3s ease 0.1s;
}
.box:after{
    left: 20%;
    transition-delay: 0.2s;
}
.box .box-content:before{
    left: 40%;
    transition-delay: 0.3s;
}
.box .box-content:after{
    left: 60%;
    transition-delay: 0.4s;
}
.box .box-overlay{
    left: 80%;
    transition-delay: 0.5s;
}
.box:hover:before,
.box:hover:after,
.box:hover .box-content:before,
.box:hover .box-content:after,
.box:hover .box-overlay{
    opacity: 1;
    transform: scale(1);
}
.box .inner-content{
    width: 100%;
    color: #fff;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    opacity: 0;
    z-index: 1;
    transform: translate(-50%, -50%) scale(1.5);
    transition: all 0.3s ease 0.5s;
}
.box:hover .inner-content{
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}
.box .title{
    font-size: 25px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
}
.box .post{
    display: inline-block;
    font-size: 16px;
    font-style: italic;
    letter-spacing: 1px;
    text-transform: capitalize;
    margin: 5px 0 20px 0;
}
.box .icon{
    padding: 0;
    margin: 0;
    list-style: none;
}
.box .icon li{
    display: inline-block;
    margin: 0 5px;
}
.box .icon li a{
    display: block;
    width: 30px;
    height: 30px;
    line-height:30px;
    border-radius: 50% 0;
    background: #002161;
    font-size: 18px;
    color: #fff;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.5), 0 0 0 4px rgb(147, 205, 220);
    transition: all 0.3s ease 0s;
}
.box .icon li a:hover{
    background: #93cddc;
    color: #002161;
    box-shadow: 0 0 15px rgba(0,0,0,0.5) inset, 0 0 10px #002161;
}
@media only screen and (max-width:990px){
    /*.box{ margin-bottom: 30px; }*/
}
.box .title{color: #fff;}