@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&family=Lora:ital,wght@0,400..700;1,400..700&display=swap');

html {scroll-behavior: smooth;}
body{font-size: 16px; color: #333;
  font-family: "Lora", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

h1,h2,h3,h4,h5,h6{
  font-family: "Fjalla One", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.headWrap {background-color: #f1f1f1; padding: 12px 0; text-align: center; }
.header{padding: 10px 16px; background: #555; color: #f1f1f1; z-index:3; box-shadow: 0 2px 5px #333 }
.content {padding: 16px; }
.sticky {position: fixed; top: 0; width: 100%; }
.sticky + .content {padding-top: 102px; }


/* Commons Style
==========================================================================*/
img{ max-width:100%; }
a{ text-decoration:none; cursor:pointer; }
.container{ max-width: 1240px;}


.entryTitle{ color: #FFF; text-align: center; padding-bottom: 30px}
.btmBar{position: relative;display: inline-block;}
.btmBar::after {
  content: '';
  display: block;
  margin:0 auto;
  width: 100%;
  height: 1px;
  border-radius: 125px/12px;
  box-shadow: 0 0 8px #000;
}
.boxs{box-shadow: 0 0 15px #333}
.box7{border-radius: 7px; overflow: hidden;}

.modal-header{background: #e4c203 !important }



/* COLOR Style
==========================================================================*/




/* Main Menu Style
==========================================================================*/
#stickyHeader{ border-bottom:2px #03b7f2 solid; }
#stickyHeader.sticky{padding-top: 0; padding-bottom: 0; z-index: 9}
#stickyHeader .navbar-nav{font-weight: 600; text-transform: uppercase;}
#stickyHeader a{cursor: pointer;}
.navbar .navbar-brand{width: 100px; position: relative; }
.navbar .navbar-brand span{ display: block; width: 100px; opacity: 1; position: absolute; left: 0; top: -20px; background: rgba(255, 255, 255, 0.3); border-radius: 0 0 25px 25px; z-index: 1}
.navbar.sticky .navbar-brand{width: 70px; }
.navbar.sticky .navbar-brand span{ width: 70px;}
.me-auto{ display: block; width: 100%; text-align: center;}
.me-auto li{display: inline-block;}
.navbar-brand .tags{position: absolute; left: 100%; top: 20px; font-size: 12px;}
.navbar-brand:hover .tags{font-size: 34px}

/* Header Section Style
==========================================================================*/
.logo{ max-width: 80px; }




/* Slider Style
==========================================================================*/
.bottomCircle{display: block; margin-top: -60px; z-index: 3}
#MainSlider{ position:relative; }
.slideBtm{position: absolute; bottom: 0; left: 0; height: 60px !important}

#MainSlider:after{position: absolute; width: 100%; height: 100%; content: ""; left: 0; top: 0; z-index: 1}

.carousel-control-next,
.carousel-control-prev{width: 40px; height: 40px; background: #038ebc; position: absolute; left: auto; top: auto; bottom: 50px; z-index:3 }

.carousel-control-prev{ right: 65px; }
.carousel-control-next{ right: 20px; }


#btmCurb{position: absolute; transform: rotate(180deg); height: 60px !important; }

/* Commons Style
==========================================================================*/
.modal-body{background-size: 100%; background-position:center; background-repeat: no-repeat; background-attachment: fixed; padding: 0;}
.mdlTitle{ display: inline-block; margin: 0; color: #fff; padding: 0 0 0 12px; font-size: 18px; font-weight: 700; text-align: center;}
.overlay{ position: relative; padding: 30px; z-index: 3}
.overlay:after{ content: ""; position:absolute; width: 100%; height: 100%; top: 0; left: 0; padding: 30px; background: rgba(169,196,251,0.9); z-index:-1; }
/*.overlay:after{ content: ""; position:absolute; width: 100%; height: 100%; top: 0; left: 0; padding: 30px; background: rgba(169,196,251,0.5); z-index:-1; }*/
.modal-body .overlay{ text-align: justify; }

.maps{ padding-top: 60px }
.contBx{ padding: 80px 60px; border: 1px #777 dashed; background: #aaa; border-radius: 12px; box-shadow: 0 0 20px #fff }
.contBx label{ padding-left: 13px }
.contBx textarea,
.contBx input{ border: 1px #555 dashed; background:#ddd }

.contBx .contBtn{ margin-left: 12px }



/* welcomContWrap Content Style
==========================================================================*/
.welcomContWrap{padding: 60px 0}
.partners{position: relative;}
.partners:after{position: absolute; width: 100%; height: 100%; content: ""; left: 0; top: 0; z-index: 1}





/* Commons Style
==========================================================================*/
.welcomContWrap{padding: 60px 0 30px; background: #f2f2f2}

.titleRow .title{padding: 0px 0; text-align: center; color: #038ebc; font-size: 24px; font-weight: 600; margin: 0}
.titleRow .title span{color: #dda12a}
.titleRow .subTitle{padding: 0 0 30px; text-align: center; color: #038ebc; font-size: 14px; font-weight: 100;}





/* authorContWrap Style
==========================================================================*/
.authorContWrap{padding: 30px 0 60px; background: #f2f2f2;}
.authBox{ position:relative; border-radius:10px; overflow:hidden; }
.authBox:before{ content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 153, 215, 0.5); opacity: 0; z-index: 1;}
.authBox:hover:before{ opacity:1; }
.authBox .authInfo{ position:absolute; left:0; bottom:0; width: 100%; z-index:2; text-align: center; padding: 20px 25px 20px; opacity:0; text-shadow: 0 0 3px #0099d7; color: #ddd; background:rgba(10%,10%,10%,0.3); }
.authBox .authInfo .title{font-size: 18px; }
.authBox:hover .authInfo{ opacity:1; }
.authBox .authInfo span{ text-shadow:none; color:#111 }

.linkRow{ padding-top: 30px; text-align:center; }
.linkRow .more{ display:inline-block; padding: 8px 40px; border: 1px #0099d7 solid; text-transform:uppercase; border-radius: 10px; position:relative; overflow:hidden; }
.linkRow .more:before{ content: ""; position:absolute; left:0; top:0; background:#0099d7; width:100%; height:100%; opacity: 0; z-index: 1;}
.linkRow .more:hover:before{opacity: 1}
.linkRow .more span{ position:relative; z-index:2 }
.linkRow .more:hover span{color: #fff}






/* servContWrap Style
==========================================================================*/
.servContWrap{padding: 60px 0}





.conunters{display: block; padding: 0px 0 0}
.conunters span{display: inline-block;}


.teamPhBx{position: relative;}
.teamPhBx .inner{overflow: hidden;}
.authos{position: absolute; width: 100%; color: #fff; left: 0; bottom: -0; padding: 12px 15px; background: rgba(10, 10, 10, 0.6); opacity: 0;}
.authos .title{font-size: 18px; margin: 0}
.authos .desig{ margin-bottom: 3px }
.teamPhBx:hover .authos{opacity: 1; bottom: 0;}




/* Sub Page Banner  Style
==========================================================================*/
.subPageBanner{ padding: 140px 0 40px; position:relative; background-size:cover; background-repeat:no-repeat; background-position:center; background-attachment:fixed; }
.subPageBanner:after{content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.6); text-align: center;}
.subPageBanner .container{position: relative; z-index: 1}





.slideToTop {
  animation-duration: 3s;
  animation-name: to-top;
}
@keyframes to-top {
  from { translate: 0 80vw; scale: 200% 1; }
  to { translate: 0 0; scale: 100% 1; }
} /* slideToTop___end */


.slideToTop-2 {
  animation-duration: 5s;
  animation-name: to-top2;
}
@keyframes to-top2 {
  from { translate: 0 80vw; scale: 200% 1; }
  to { translate: 0 0; scale: 100% 1; }
} /* slideToTop___end */


.slideToTop-3 {
  animation-duration: 7s;
  animation-name: to-top3;
}
@keyframes to-top3 {
  from { translate: 0 80vw; scale: 200% 1; }
  to { translate: 0 0; scale: 100% 1; }
} /* slideToTop___end */









/* Commons Style
==========================================================================*/
.featuredWrap{ background: url(../images/featuredBg.jpeg) no-repeat center fixed; background-size: cover; padding: 90px 0; text-align:center; position:relative; }
.featuredWrap:after{content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(10,10,10,0.8);}
.featuredWrap .container{position: relative; z-index: 1; color: #ddd}
.featuredWrap .featTitle{ padding-bottom: 50px }
.featuredWrap .inner{ background:#aaa; padding: 70px 20px 30px; border-radius: 10px; box-shadow: 0 0 7px #098ebc; position:relative; }
.featuredWrap .inner:hover{ box-shadow: 0 0 20px #e4c203; }
.featuredWrap .ico{position: absolute; left: 50%; top: 0px; font-size: 40px; line-height: 90px; transform: translate(-50%, -50%); width: 100px; height: 100px; background: #098ebc; border-radius: 50%;}
.featuredWrap:hover a,
.featuredWrap a{ color: #ddd !important; text-decoration:none; }
.featuredWrap a:hover .ico{background: #e4c203}
.featuredWrap {}



/* Commons Style
==========================================================================*/
.galleryWrap{ padding: 20px 0; text-align:center; }
.galleryWrap li{ display:inline-block; padding: 5px 3px; max-width: 90px }
.galleryWrap li img{ border: 2px solid #999; padding: 5px; border-radius:10px; box-shadow:0 0 10px #999;}

.gallActs{ color:red }



/* Commons Style
==========================================================================*/
.msgTl{padding: 15px 0 5px}
.degs{
  display: block;
  font-size: 15px;
  padding: 3px 0;
  letter-spacing: 1px;
}
.desig span,
.degs span{font-size: 12px}
.phne {
  display: block;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 1px;
}
.dropdown-item .nv{font-size: 11px}







/* Commons Style
==========================================================================*/
.clientsWrap{ padding: 50px 0; background:#efe8e8; text-align:center; }
.clientsWrap h3{ padding-bottom:12px }
.clientsWrap li{ display:inline-block; padding: 12px; max-width:150px; }
.clientsWrap li img{ border-radius:10px; box-shadow:0 0 10px #999 }




/* Footer Style
==========================================================================*/
.footerWrap{padding: 30px 0 30px; color: #ddd; box-shadow: 0 -2px 12px #999;}
.footerWrap h5{text-transform: uppercase;}
.footerWrap ul{margin: 0; padding: 0; list-style: none;}
.footerWrap span{display: block;}
.footAbout .txt{ padding-bottom:12px; line-height:16px }
.footAbout span{ display:inline-block; }
.footSocial a{ display:inline-block; line-height:22px; font-size:18px; text-align:center; }
.footSocial ul{ margin:0; padding:0 }
.footSocial ul li{ display:inline-block; padding:5px 7px }
.footSocial ul li a{ display: block; padding: 0; margin:0; }
.footerWrap a{cursor: pointer;}
.footRecent a{ text-decoration:none; }
.footRecent li{width: 100%; float: left; clear: both; padding: 4px 0 10px}
.footRecent .photo{ width:60px; float:left; padding-right:12px; }
.footRecent h6{padding: 0; margin: 0; font-size: 14px}
.footRecent span{font-size: 11px; font-style: italic;}


.footLogo{ max-width:100px; padding-bottom: 20px }
.ftrTtle{color: #e4c203}
.footConts{ text-align:right; }
.footConts li{ width: 100%;; padding-bottom:7px }
.footConts .left{ float: right; padding-top: 15px; height: 30px; padding-left:12px; }
.footConts .left .fa{color: #038ebc}
.cname{color: #0e743b; text-transform: uppercase; font-weight: 600}
.cname span{display: inline-block; color: #ed1b4b;}

.socImg{ max-width:22px; display:block; }







/* Copyrights Style
==========================================================================*/
.copyrightWrap{padding: 12px 0; color: #aaa; font-size: 12px; border-top: 1px transparent solid; }