@import url('https://fonts.googleapis.com/css?family=Prata&display=swap');

html{height:100%}
body{font-size:16px;background:#fff;color:#456991;overflow-x:hidden;font-family: 'Prata', serif;font-weight:400;position:relative;}
img{max-width:100%}
p{margin-bottom:.5rem}
a{text-decoration:none;color:#0c3054}
a:hover,a:focus,.btn:hover,.btn:focus,button:focus{text-decoration:none;outline:none;color:#a70e13;box-shadow:none}
ul,li{padding:0;margin:0}
li{list-style:none}
.text-underline{text-decoration:underline}
.form-control:focus{outline:none;box-shadow:none}
.primary-col{color: #aa882c !important}
.secondary-col{color: #303272 !important}
.secondary-btn{background: #e7b01b !important;	color: #1c3257 !important;	border-radius: 10px !important;border-bottom: none !important;padding: 10px 15px}
.secondary-btn:hover{opacity: .7;color: #fff;cursor: pointer;}
.primary-btn{        background: #a67b16;
    color: #ffffff;
    border-bottom: none !important;
    padding: 10px 10px;
    /* font-weight: 600; */
    display: inline-block;
    font-size: 15px;
    cursor: pointer;
    border-radius: 7px;
    margin-right: 5px;
    width: 47%;

  }

  .reset{ 
    background: #ffdd8d;
    color: #000000;
  }


.primary-btn:hover{opacity: .7;color: #1c3257;}
#pageloader{display:none;position: fixed ;   top: 0;    z-index: 100;    background: rgba(255, 255, 255, .8);    width: 100%;    height: 100%;}
#pageloader img{position: absolute;left: 0; right: 0; margin: 0 auto; top: 40%;width: 50px;}
.white-col{color: #fff !important}

.page-left{width: 100%;}
.page-right{width: 100%;position: fixed;right: 0;bottom: 0;}
.header-contact{text-align: right;    padding-top: 25px;}
.header-contact a{font-weight: 600;color: #ffc743;font-size: 13px;}
.bonito-nav{-webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);}
.header-contact img{
    vertical-align: baseline;
}
.banner{
   background-image: url("../images/banner.jpg"); /* The image used */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
      height: 780px;
}

.headline{    margin-top: -25px;}
.headline h2{
    font-size: 24px;
    color: #ffc743;
    }
.headline p{
    font-size: 19px;
  }
 .headline h3{
      display: block;
    width: 400px;
    margin: auto;
    position: relative;
 }

 .headline h3::before{
          /*width: 100px;*/
    height: 73px;
    content: url(../images/left-flower.png);
    /*background: url(../images/left-flower.png) no-repeat left center;*/
    display: block;
    /* position: absolute; */
    float: left;
   /* margin-right: -80px;*/
       position: absolute;
    left: 0;
    top: 0;
 } 

.headline h3::after{
 /**width: 100px; */
    height: 73px;
    content: url(../images/right-flower.png);
    /* background: url(../images/left-flower.png) no-repeat left center; */
    display: block;
    /* position: absolute; */
    float: right;
    /* margin-right: -80px; */
    position: absolute;
    right: 0;
    top: 0;
 } 
 


/* form */
.sidebar-contact{position:fixed; bottom:0; right:0px;width:100%;   transition:0.5s; 
background-image: url("../images/form-bg.jpg"); /* The image used */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
      }
.form-wrapper{padding: 10px 0 25px;}
.sidebar-contact.active{right: 0; }
.innerpage .toggle{display: block}
.toggle{position: absolute; height: 210px; width: 48px; text-align: center; cursor: pointer; background: #5e5439; top: 0; left: -48px; line-height: 48px; color: #fff; display: none;}
.toggle span{transform: rotate(-90deg); display: block;font-size: 20px; width: 205px; position: absolute;left: -79px; top: 80px; text-transform: uppercase}
.slide-form{position: fixed; top: 69px; right: 0;z-index: 11;max-width: 350px;height: 100vh;transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);}
.slide-form-wrapper{ position: relative;height: 100%}
.slide-form .collapse.show .floating-contact{right: 0;transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);}
.slide-form .collapsing{display: none}
.form-inner{display: flex;justify-content: space-between; align-items: center;max-width: 1200px;    margin: 0 auto;flex-wrap: wrap;}
.form-inner .form-group{width: 100%;margin-bottom: 0px}
.form-inner .form-control{border-radius: 0;    border: 0;width: 100%;background: transparent;	color: #fff;	border-bottom: 1px solid #000000;padding: 10px 5px;font-size: 13px;}
.form-inner .form-control:focus{opacity: 1; }
.sidebar-contact ::placeholder:focus{color:#000000}
.sidebar-contact ::placeholder {color: #000000;opacity: 1;}
.sidebar-contact :-ms-input-placeholder {color: #000000;}
.sidebar-contact ::-ms-input-placeholder {color: #000000;}
.form-header{position: relative;
    padding: 15px 0;
    font-size: 18px;
    font-weight: 500;
    color: #1d1d1d;
    text-transform: uppercase;}
.form-header:after{position: absolute;content: '';width: 50px;height: 1px;background:#000000;bottom: 0;	left: 0;right: 0;margin: 0 auto;}
/* .form-header:before{position: absolute;content: '';width: 50px;height: 1px;background:rgba(255, 255, 255, .7);top: 0;	left: 0;right: 0;margin: 0 auto;} */
.mob-form-btn{display: none;}
.form-btns{    display: block;	width: 100%;	text-align: center;margin-top: 0px}
.err-msg {font-size: 12px;color: #f32323;display: none;}
.form-contact p{color: #fff;opacity: .7;position: relative;padding: 0 10px}
.form-contact p::before{position: absolute;	content: '';	width: 50px;	height: 1px;	background: #fff;	opacity: .3;	left: 15px;	top: 13px;}
.form-contact p::after{position: absolute;	content: '';	width: 50px;	height: 1px;	background: #fff;	opacity: .3;	right: 15px;	top: 13px;}
.form-contact{margin: 25px 0;text-align: center;width: 100%;}
.form-contact span{font-size: 25px}
.form-number{text-align: center;background: #f4f4f4;height: 84px;display: flex;  justify-content: center;  align-items: center;}
.form-number a{color: #182f7c !important;    font-weight: 700;}
.mob-num{display: none}
.thankyou-popup{display:none;background: rgba(0, 0, 0, .5);}
select option {margin: 40px;background: #0c3054;color: #fff;}
 
.section{padding: 35px 0;background:#fff}
.bg-gray{background: #e7e7e7}
.img-box{position: relative;}
.img-box img{width: 100%}
.img-box::after{border: 3px solid #000;position: absolute;content: '';width: 100%;height: 100%;top: 20px;  left: -10px;}

.img-floating {animation-name: floating;animation-duration: 3s; animation-iteration-count: infinite; animation-timing-function: ease-in-out;}

@keyframes floating {
  from { transform: translate(0,  0px); }
  65%  { transform: translate(0, 15px); }
  to   { transform: translate(0, -0px); }    
}

.section-title{margin-bottom: 15px}
.section-title h2{position: relative;color: #0c3054;font-weight: 600;font-size: 30px;display: inline-block;padding-bottom: 15px}
.section-title h2 span{font-weight: 500}
.section-title h2::after{position: absolute;content: '';width: 30%;height: 3px;background: #0c3054;bottom: 0;left: 0;  right: 0;  margin: 0 auto;}
.c-projects{margin: 50px 0}
#comp-proj, #video-carousel{padding: 0 60px;max-width: 768px;  margin: 0 auto;z-index: 0;}
#comp-proj .item p {font-size: 24px;font-weight: 600;color: #0c3054;margin-top: 30px;text-align: center}
.owl-next{position: absolute;top: 40%;right: 0;}
.owl-prev{position: absolute;top: 40%;left: 0;}
.owl-nav button img{width: 25px}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{padding: 15px !important}
.owl-nav button:hover{background: #fff !important}
#video-carousel .item svg{position: absolute;width: 60px;top: 45%;height: 60px; left: 0; right: 0; margin: 0 auto;}
#video-carousel .item:hover svg .ytp-large-play-button-bg{fill: #f00;  fill-opacity: 1;}
#test-carousel .card{border-radius: 0;-webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.75); box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.75);}
#test-carousel .item{padding: 15px;min-height: 300px;}
#test-carousel .item img{border-radius: 50%}
.c-name{font-weight: 600}      
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {background: #0c3054;}     
.cus-details {position: absolute;bottom: 40px;}     
.bg-light-gray{background: #f7f7f7}
.morecontent span {display: none;}
.morelink { display: inline-block;font-weight: 600; text-transform: uppercase;  text-decoration: underline;margin-top: 30px}
.morelink:hover, .morelink:focus{text-decoration: underline;}
.morelink.less{display: block}
.moreellipses{display: none}
.reco ul{display: flex;flex-wrap: wrap;}
.reco ul li{flex: 1;padding:  0 35px;position: relative;}
.reco ul li::after{position: absolute;content: '';height: 100%;width: 1px;background: #c0c0c0;top: 0;right: 0;}
.reco ul li:last-child::after{display: none}
.sec-8{padding: 35px 0 0 0  }
.map-sec iframe{width: 100%;height: 400px;}
footer{text-align: center;color: #fff;background: #0c3054; padding: 10px 0;  font-size: 12px;}
.owl-carousel{z-index: 0;}


@media (max-width: 575.98px) {
  .sec-1 .col-md-8{margin-top: 35px}
  .owl-next, .owl-prev{top: 25%}
  #test-carousel .item { min-height: 315px !important;}
  .reco ul li{width: 100% !important;padding-bottom:30px;}
  .reco ul li::after {position: absolute; content: ''; height: 1px; width: 100%; background: #c0c0c0; bottom: 0; right: 0;top: auto}
  .reco ul li:nth-child(2n+2):after{display: block !important}
  #comp-proj .item p{font-size: 20px}
  #comp-proj, #video-carousel{padding: 0 35px;z-index: 0;}
  .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev { padding: 5px !important;}
  .owl-nav button img {width: 15px;}
  .section-title h2{font-size: 26px;}
}
 
 

@media screen and (min-width:990px) and (max-width:1024px){}
@media (max-width: 767.98px) {} 
@media (max-width: 991.98px) {
  body{margin-top: 52px;}
  .page-left{width: 100%}
  .form-inner{display: none;transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);}
  .form-header{margin-bottom: 0!important;display: none}
  .form-inner.collapse.show{margin-top: 20px;}
  .floating-contact{top: 0; width: 100%;z-index: 10;bottom: auto}
  .mob-form-btn{display: block;color: #fff;text-align: center;font-weight: 600;}
  .mob-form-btn:focus{color: #fff}
  .sidebar-contact.active, .sidebar-contact{top: 0;bottom:auto; right: 0;left: 0; width: 100%; padding: 15px; transform: translateY(0); height: auto; z-index: 10;}
  .form-wrapper { padding: 0;}
  .page-right{width: auto;z-index: 1044;}
  #test-carousel .item { min-height: 360px;}
  .reco ul li { flex: auto; width: 50%; margin-top: 30px;}
  .reco ul li:nth-child(2n+2):after{display: none}
  .bonito-nav {width: 100%;top: 54px}
  .form-inner .form-group{
        margin-bottom: 20px;
  }
  .form-btns{ margin-bottom: 10px;}
}


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

@media (max-width: 480px) {
.headline h3 {
    display: block;
    width: auto;
  }
  .header-contact {
    padding-top: 25px;
    padding-bottom: 45px;
}
.banner {
      background-position: 10%;
}
}

@media (max-width: 375px){
.headline h3 {
    font-size: 22px;
  }
}
