
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900");
/* 
---------------------------------------------
reset
--------------------------------------------- 
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
figure, header, nav, section, article, aside, footer, figcaption {
  margin: 0;  padding: 0;  border: 0;  outline: 0;}
section, footer, header { margin: 0 auto; position: relative; max-width: 1920px; overflow: hidden;}
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}

.clearfix { display: inline-block;}

html[xmlns] .clearfix { display: block;}

* html .clearfix { height: 1%;}

ul, li { padding: 0; margin: 0; list-style: none;}

header, nav, section, article, aside, footer, hgroup { display: block;}

* {
  box-sizing: border-box;
}

html, body {
  font-family: 'Poppins', sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { text-decoration: none !important;}

h1, h2, h3, h4, h5, h6 { color: #1e1e1e; margin-top: 0px; margin-bottom: 0px; font-weight: 700;}

ul {  margin-bottom: 0px;}

p { font-size: 14px; line-height: 1.65; color: #4a4a4a;}

img { max-width: 100%; height: auto;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

/* 
---------------------------------------------
Global Styles
--------------------------------------------- 
*/
html,
body {  font-family: 'Poppins', sans-serif;}

::selection { background: #3896aa; color: #fff;}

::-moz-selection {background: #3896aa; color: #fff;}

.section-heading h2 { font-size: 36px;color: #3896aa; font-weight: 600; text-transform: capitalize; margin: 0 0 20px 0;  line-height: 44px;}


/* 
---------------------------------------------
Pre-loader Style
--------------------------------------------- 
*/

.js-preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.99);
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  opacity: 1;
  visibility: visible;
  z-index: 9999;
  -webkit-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.js-preloader.loaded {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@-webkit-keyframes dot {
  50% {
      -webkit-transform: translateX(96px);
      transform: translateX(96px);
  }
}

@keyframes dot {
  50% {
      -webkit-transform: translateX(96px);
      transform: translateX(96px);
  }
}

@-webkit-keyframes dots {
  50% {
      -webkit-transform: translateX(-31px);
      transform: translateX(-31px);
  }
}

@keyframes dots {
  50% {
      -webkit-transform: translateX(-31px);
      transform: translateX(-31px);
  }
}

.preloader-inner {
  position: relative;
  width: 142px;
  height: 40px;
  background: transparent;
}

.preloader-inner .dot {
  position: absolute;
  width: 16px;
  height: 16px;
  top: 12px;
  left: 15px;
  background: #065f78;
  border-radius: 50%;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-animation: dot 2.8s infinite;
  animation: dot 2.8s infinite;
}

.preloader-inner .dots {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  margin-top: 12px;
  margin-left: 31px;
  -webkit-animation: dots 2.8s infinite;
  animation: dots 2.8s infinite;
}

.preloader-inner .dots span {
  display: block;
  float: left;
  width: 16px;
  height: 16px;
  margin-left: 16px;
  background: #065f78;
  border-radius: 50%;
}



/* 
---------------------------------------------
Header Style
--------------------------------------------- 
*/

.header-area { position: absolute; background-color: #fbfaf7; left: 0; right: 0; z-index: 100;}

.header-area img { width:280px}

/* 
---------------------------------------------
Banner Style
--------------------------------------------- 
*/

.main-banner {padding: 102px 0px 70px 0px;}
.main-banner .item-1 { background-image: url(../images/banner-01.jpg);}
.main-banner .item-2 { background-image: url(../images/banner-02.jpg);}
.main-banner .item-3 { background-image: url(../images/banner-03.jpg);}
.main-banner .item { background-repeat: no-repeat; background-position: center center; background-size: cover;padding: 80px ;height: 410px;}
.main-banner .item h2 { font-size: 48px; font-weight: 700; color: #fff; line-height: 70px; width: 80%; margin-bottom: 40px;}
.main-banner .item p { color: #fff; margin-bottom: 40px; font-size: 16px; font-weight: 600;	text-transform: uppercase;	letter-spacing: 1px;} 
.main-banner .owl-dots { text-align: center; margin: 0 auto; position: absolute; bottom: 10px; left: 50%; transform: translate(-50%);  right: auto;}
.main-banner .owl-dots .owl-dot span { width: 10px; height: 10px; margin: 2px 7px; border: 1px solid #fff; background: transparent; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; border-radius: 30px;}
.main-banner .owl-dots .owl-dot.active span {background: #fff;}

@media (min-width:768px){	 
	.main-banner .owl-nav {	position: absolute;	top: 50%;	transform: translateY(-15px);	width: 100%;}	
	.main-banner .owl-nav .owl-prev i,
	.main-banner .owl-nav .owl-next i {	width: 50px; height: 50px; line-height: 50px;	font-size: 24px;	display: inline-block;
		color: #fff;	background-color: rgba(255, 255, 255, 0.2);	border-radius: 50%;	opacity: 1;	transition: all .3s;}	
	.main-banner .owl-nav .owl-prev, .main-banner .owl-nav .owl-next {position: absolute;}
	.main-banner .owl-nav .owl-prev {	left:15px}
	.main-banner .owl-nav .owl-next {	right: 15px;}	
	.main-banner .owl-nav .owl-prev i:hover,
	.main-banner .owl-nav .owl-next i:hover {	opacity: 1;	background-color: rgba(255, 255, 255, 0.5);	}
	 
}

@media only screen and (max-width: 767.99px){
	.main-banner .owl-nav { display:none}

} 
/* 
---------------------------------------------
About Style
--------------------------------------------- 
*/

.about-us { position: relative; padding: 0px; margin-top: 30px;}
.mutual-titlecol {  margin: 55px auto 5px auto;}
.mutual-title { font-size: 2.5rem; font-weight: 800; color: #065f78;	margin-bottom: 2rem;	text-align: center;	position: relative;	display: inline-block;	margin-left: auto;	margin-right: auto;	width: 100%;}
.mutual-title::after {content: '';	position: absolute;	bottom: -10px;	left: 50%;	transform: translateX(-50%);	width: 100px;	height: 5px;	background: linear-gradient(90deg, #75c4c6, #629f96);	border-radius: 5px;}
.about-us:before { position: absolute; top: 0; bottom: 0; right: 0; z-index: -1; width: 84%; height: calc(100% - 40px);  background-color: #cfe9f0; content: ''; border-top-left-radius: 500px; border-bottom-left-radius: 500px;}

.valores { margin-top: 30px; margin-bottom:0; background-color: #065f78; border-radius: 40px; padding: 10px 50px 50px 50px;}
.valores h3 { color:#FFF; font-weight:600; margin:30px 0 35px 0 }
.section-heading h3 {color: #3896aa;font-weight: 600;  margin: 0 0 20px 0;}
.valores-item { background-color: #fff; border-radius: 25px; position: relative; padding: 15px; margin-bottom: 25px;}
.valores .bullet { position: absolute; left: 0; top: 50%; transform: translateY(-15px); background-color: #75c4d2; width: 30px; height: 30px; display: inline-block; text-align: center; line-height: 30px; font-size: 18px; z-index: 1; color: #fff;  border-radius: 0 60px 60px 0px;}

.accordion-body { padding: 0 0 0 25px; font-size: 14px; line-height: 1.4;  color: #4a4a4a;}
.accordion-body strong {color: #065f78;}
.about-us .section-heading { margin-left: 30px; margin-bottom: 0px;}


/* 
---------------------------------------------
Services Style
--------------------------------------------- 
*/

.services { margin-top:100px}

.services .service-item:hover .icon img { margin-top: -10px;}

.services .service-item { position: relative; margin-top: 125px;}

.services .service-item .icon { width: 160px; height: 160px; display: inline-block; text-align: center; line-height: 160px;
  background-color: #389aae; border-radius: 50%; position: absolute; right: 0; top: -90px;z-index: 15;}

.services .service-item .icon img { max-width: 86px; transition: all .2s;}

.services .service-item .main-content { border-radius: 25px; padding: 80px 25px 50px 25px; background-color: #cfe9f0;  margin-bottom: 30px; margin-right: 60px; transition: all .4s; height: 295px;box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);}
.services .service-item .main-content:hover {  transform: translateY(-10px); box-shadow: 0 5px 25px rgba(0, 0, 0, 0.3);}
.services .service-item h4 {font-size: 22px;color: #065f78; font-weight: 600; margin-bottom: 15px; line-height: 30px;  transition: all .4s;}

.services .service-item p { color: #4a4a4a; margin-bottom: 25px;}

/* 
---------------------------------------------
Footer Style
--------------------------------------------- 
*/

footer { margin-top: 100px; position: relative; background-color: #065f78; height: 115px; padding-bottom: 25px;}

footer .content { color: #fff; font-weight: 400; width: fit-content; font-size: 14px;}
footer .topline {padding-top: 1.5rem}
.developed a {font-size: 12px;color: inherit;}

.developed a:hover {  opacity: 0.75;}
@media (min-width:768px){	 
	footer {border-radius: 150px 150px 0px 0px;}
	footer::before {  background: url(../images/contact-dec-01.png); position: absolute; left: 30px; transform: rotate(180deg);
  opacity: 1; bottom: 0; width: 318px; height: 119px; content: ''; z-index: 2;}
	footer .topline {padding-top: 3rem} 
}

/* 
---------------------------------------------
Responsive Style
--------------------------------------------- 
*/

body { overflow-x: hidden;}

@media (max-width: 767.99px) {
  .header-area { top: 0px; }
  .main-banner .item {  padding: 50px 30px !important; }
	.mutual-title {	font-size: 2rem;}
	.valores {padding: 10px 30px 30px 30px;}
	.services .service-item .main-content {	margin: 0 25px 30px 25px;}
	.services .service-item {	position: relative;	margin-top: 105px;	}
 	.services .service-item .icon { width: 130px; height: 130px; line-height: 130px; top: -65px; text-align: center; margin: 0 auto; position: absolute; left: 50%; transform: translate(-50%); right: auto;}
}
@media (max-width: 480.99px) {
	.services .service-item .main-content {	height:315px;}
}

@media (max-width: 992px) {
  
  .main-banner {padding: 100px 0px 40px 0px; }
  
  .main-banner .item h2, .main-banner .item p { width: 100%;}
  .main-banner .item h2 { font-size: 32px; line-height: 1.35;}
	.services {	margin-top: 70px;} 
  .about-us .section-heading { margin-left: 0px; margin-top: 40px;}
/*  .about-us::before{
    display: none;
  }*/

}

