@font-face {
  font-family: 'dinpro-regular';
  src: url(../fonts/dinpro-regular.ttf);
}

@font-face {
  font-family: 'dinpro-medium';
  src: url(../fonts/dinpro-medium.otf);
}

@font-face {
  font-family: 'dinpro-bold';
  src: url(../fonts/dinpro-bold.ttf);
}

@font-face {
  font-family: 'dinpro-black';
  src: url(../fonts/dinpro-black.otf);
}

.no-padding {
	padding: 0;
}

.padding-100 {
	padding-top: 100px;
	padding-bottom: 100px;
}

.padding-80 {
	padding-top: 80px;
	padding-bottom: 80px;
}

.full-width {
	width: 100%;
	height: auto;
}

.imagen-fondo {
	background-position: center center;
	background-size: cover;
}

.logo img {
	max-height: 70px;
	width: auto;
}

.logo img + img {
	margin-left: 20px;
}

.redes-sociales a {
	background-color: #102864;
	color: #fff;
	border-radius: 50%;
	width: 27px;
	height: 27px;
	text-align: center;
	line-height: 1.7;
	margin-left: 12px;
}

.menu {
	background-color: #fff;
	-webkit-box-shadow: 0px 3px 16px 0px rgb(0 0 0 / 8%);
  box-shadow: 0px 3px 16px 0px rgb(0 0 0 / 8%);
}

.navbar {
	padding: 0 15px;
}

.navbar-expand-lg .navbar-collapse {
  align-self: stretch;
}

.navbar-expand-lg .navbar-nav {
	height: 100%;
  align-items: center;
}

.navbar-light .navbar-nav .nav-link {
	color: #102864;
	font-family: 'dinpro-bold';
	text-transform: uppercase;
	font-size: 18px;
}

.navbar-light .navbar-nav .nav-item {
	height: 100%;
	display: flex;
  align-items: center;
}

.navbar-light .navbar-nav .nav-item a {
	height: 100%;
	display: flex;
  align-items: center;
  padding: 0 22px;
}

.navbar-light .navbar-nav .nav-item a:hover {
	background-color: #C1381D;
	color: #fff;
}

.navbar-light .navbar-nav .nav-item a.active {
	background-color: #C1381D;
	color: #fff;
}

.slider-principal {
	position: relative;
	background-size: 100%;
	background-position: center center;
	animation: portada 1s;
}

@keyframes portada {
  from { background-position: center -200px; }
  to { background-position: center center; }
}

.slider-principal:after {
  position: absolute;
  content:"";
  height:100%;
  width:100%;
  top:0;
  left:0;
  background: linear-gradient(to right, 
  	rgba(255,255,255,1) 0%, 
  	rgba(255,255,255,0.9) 20%, 
  	rgba(255,255,255,0.6) 30%, 
  	rgba(37,50,100,0.3) 50%, 
  	rgba(37,50,100,0.1) 100%
  );
}

.slider-principal .texto {
	color: #102864;
	text-align: center;
	position: absolute;
	z-index: 4;
	left: 40px;
	top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
	max-width: 700px;
}

.slider-principal .texto h2 {
	font-family: 'dinpro-black';
	font-size: 38px;
}

.slider-principal .texto h3 {
	font-family: 'dinpro-bold';
	font-size: 38px;
}

.slider-principal .texto h4 {
	font-family: 'dinpro-medium';
	font-size: 38px;
}

.div-servicios {
	background-color: #848484;
}

.div-servicios .col {
	padding-right: 0;
	padding-left: 0;
}

.div-servicios .servicio {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	text-transform: uppercase;
	color: #fff;
	font-family: 'dinpro-black';
	font-size: 22px;
	filter: grayscale(100%);
	background-size: 100%;
	background-position: center center;
	transition-duration: 0.5s;
}

.div-servicios .servicio img {
	transition-duration: 0.5s;
}

.div-servicios .servicio:hover {
	filter: grayscale(0%);
	background-size: 110%;
}

.div-servicios .servicio:hover img {
	opacity: 0;
}

.div-servicios .servicio span {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.div-servicios-texto {
	color: #848484;
}

.div-servicios-texto h2 {
	font-family: 'dinpro-black';
	font-size: 34px;
	margin-bottom: 50px;
}

.div-servicios-texto p {
	font-family: 'dinpro-regular';
	font-size: 26px;
}

.carousel-item {
	background-size: 80%;
	background-repeat: no-repeat;
}

.div-clientes {
	text-align: center;
	color: #fff;
}

.div-clientes h2 {
	font-family: 'dinpro-black';
	font-size: 38px;
	margin-bottom: 60px;
}

.div-clientes h2 span {
	font-family: 'dinpro-medium';
	font-size: 38px;
}

.div-clientes-grupo.fondo-gris {
	background-color: #848484;
	color: #fff;
}

#clientesPeru {
	margin-bottom: 100px;
}

#clientesPeru a {
	color: #848484;
	font-size: 36px;
}

#clientesColombia a {
	color: #fff;
	font-size: 36px;
}

.carousel-control-prev {
  left: -70px;
}

.carousel-control-next {
	right: -90px;
}

.mapa {
	border-top: 3px solid #102864;
	border-bottom: 3px solid #102864;
}

.contacto {
	color: #848484;
}

.contacto h2 {
	margin-bottom: 80px;
}

.form-control {
	border-radius: 20px;
	border-width: 3px;
}

.btn.btn-primary {
	background-color: #102864;
	border-radius: 20px;
	padding-left: 30px;
	padding-right: 30px;
}

textarea.form-control {
  height: 94px;
}

.footer {
	background-color: #848484;
}

.footer p {
	color: #fff;
	font-family: 'dinpro-medium';
	font-size: 24px;
}

.footer img {
	margin-bottom: 20px;
	max-width: 120px;
	width: 100%;
}

.footer .links ul {
	list-style: none;
}

.footer .links ul li {
	margin-bottom: 30px;
	background: url('../img/bullet.png') no-repeat top left;
	background-position: 0 5px;
	line-height: 1.3;
	padding: 0 0 4px 30px;
	margin-left: 1em;
}

.footer .links a {
	font-family: 'dinpro-medium';
	font-size: 24px;
	color: #102864;
}

.contacto-texto {

}

.contacto-texto p {
	font-family: 'dinpro-medium';
	font-size: 28px;
	color: #102864;
}

.portada-interior {
	position: relative;
}


.portada-interior img {
	/*filter: grayscale(100%);*/
}

.portada-interior:after {
  position: absolute;
  content:"";
  height:100%;
  width:100%;
  top:0;
  left:0;
  background-color: rgba(37, 50, 100, 0.4);
}

.portada-interior .texto-centrado {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 4;
}

.portada-interior .texto-centrado h2 {
	color: #fff;
	font-family: 'dinpro-black';
	font-size: 50px;
	text-transform: uppercase;
}

.div-interior {
	display: flex;
}

.div-interior .fondo-gris {
	background-color: #848484;
	color: #fff !important;
}

.half {
	width: 50%;
}

.justify {
	text-align: justify !important;
	align-items: flex-start !important; 
}

.justify h2 {
	width: 100%;
	text-align: center;
}

.half.texto {
	text-align: center;
	color: #848484;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.half.texto h2 {
	text-transform: uppercase;
	font-family: 'dinpro-black';
	font-size: 34px;
}

.half.texto p {
	font-family: 'dinpro-regular';
	font-size: 22px;
}

.half.texto ul li {
	font-family: 'dinpro-regular';
	font-size: 22px;
}

.about .half.texto {
	align-items: flex-start;
	justify-content: flex-start;
	text-align: left;
	padding: 40px 20px;
}

.div-borde-rojo .half.texto {
	align-items: center;
}

.about .half.texto hr {
	border-top: 4px solid #BE381D;
	width: 100%;
	margin-bottom: 30px;
}

.about .half.texto h2 {
	margin-bottom: 30px;
}

.div-fondo-gris {
	padding-top: 40px;
	padding-bottom: 40px;
	background-color: #848484;
  max-width: 1110px;
	padding-right: 0;
	padding-left: 0;
}

.div-borde-rojo {
	padding-top: 20px;
	padding-bottom: 20px;
}

.borde-rojo {
	border-right: 4px solid #BE381D;
}

.pdfs {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 100%;
	position: relative;
  flex-flow: row wrap;
}

.pdf {
	color: #BE381D;
	font-family: 'dinpro-regular';
	font-size: 12px;
	flex-basis: 30%;
  margin-bottom: 30px;
}

.pdf i {
	font-size: 24px;
}

.mail {
	color: #fff;
}

.mail:hover {
	color: #fff;
}

.mail-blue {
	color: #102864;
}

.mail-blue:hover {
	color: #102864;
}

.titulo-gris {
	color: #848484;
}

/* ********************************************************************************** */
/* media */
@media only screen and (max-width: 1200px) {
	.div-servicios .servicio {
		font-size: 18px;
	}
}

@media only screen and (max-width: 1020px) {
  .logo img {
		max-height: 50px;
		width: auto;
	}
}

@media only screen and (max-width: 991px) {
  .logo img {
		max-height: 70px;
		width: auto;
	}

	.redes-sociales {
		justify-content: center;
	}

	.navbar-expand-lg .navbar-collapse {
		align-self: auto;
	}

	.navbar-light .navbar-nav .nav-item {
    margin-bottom: 20px;
	}

	.redes-sociales a {
		margin-right: 12px;
		margin-bottom: 10px;
	}

	.div-servicios .servicio {
		font-size: 24px;
	}

	.slider-principal {
		height: 400px;
		overflow: hidden;
	}

	.slider-principal img {
		height: 100%;
		width: auto;
	}

	.slider-principal .texto h2,
	.slider-principal .texto h3,
	.slider-principal .texto h4 {
		font-size: 30px;
	}
}

@media only screen and (max-width: 767px) {
	.div-servicios .servicio {
		filter: grayscale(0%);
	}

	.div-interior {
		flex-direction: column;
	}

	.div-interior.reverse {
		flex-direction: column-reverse;
	}

	.div-interior .half {
		width: 100%;
	}

	.div-interior .half.texto {
		padding-top: 30px;
		padding-bottom: 30px;
	}

	.borde-rojo {
		border: none;
	}
}

@media only screen and (max-width: 991px) {
	.footer .links a {
		font-size: 20px;
	}

	.footer p {
    font-size: 18px;
	}

	.carousel-control-prev {
	  left: -30px;
	}

	.carousel-control-next {
		right: -30px;
	}
}

@media only screen and (max-width: 768px) {
	.carousel-control-prev {
	  left: 0;
	}

	.carousel-control-next {
		right: 0;
	}
}

@media only screen and (max-width: 575px) {
	.div-servicios .row {
		flex-direction: column;
	}
}

/* ********************************************************************************** */
/* slider */
@media (min-width: 768px) and (max-width: 991px) {
  /* Show 3rd slide on md  if col-md-4*/
  .carousel-inner .active.col-md-4.carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -33.3333%;  /*change this with javascript in the future*/
    z-index: 1;
    display: block;
    visibility: visible;
  }
}

@media (min-width: 576px) and (max-width: 768px) {
  /* Show 2 slide on md  if col-md-4*/
  .carousel-inner .active.col-sm-6.carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -50%;  /*change this with javascript in the future*/
    z-index: 1;
    display: block;
    visibility: visible;
  }
}

@media (min-width: 576px) {
  .carousel-item {
  	margin-right: 0;
	}

  /* show 2 items */
  .carousel-inner .active + .carousel-item {
    display: block;
  }
  
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item {
    transition: none;
  }

  .carousel-inner .carousel-item-next {
    position: relative;
    transform: translate3d(0, 0, 0);
  }
  
  /* left or forward direction */
  .active.carousel-item-left + .carousel-item-next.carousel-item-left,
  .carousel-item-next.carousel-item-left + .carousel-item,
  .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  } 
  
  /* farthest right hidden item must be abso position for animations */
  .carousel-inner .carousel-item-prev.carousel-item-right {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    visibility: visible;
  }
  
  /* right or prev direction */
  .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
  .carousel-item-prev.carousel-item-right + .carousel-item,
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
    display: block;
    visibility: visible;
  }
}

/*MD*/
@media (min-width: 768px) {

  /* show 3rd of 3 item slide */
  .carousel-inner .active + .carousel-item + .carousel-item {
    display: block;
  }
 
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
    transition: none;
  }
  
  .carousel-inner .carousel-item-next {
    position: relative;
    transform: translate3d(0, 0, 0);
  }
  
  /* left or forward direction */
  .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  
  /* right or prev direction */
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
    display: block;
    visibility: visible;
  }
}


/*LG 6th*/
@media (min-width: 991px) {

  /* show 4th item */
  .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item {
    display: block;
  }
  
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
    transition: none;
  }
    
  /* right or prev direction //t - previous slide direction last item animation fix */
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
    display: block;
    visibility: visible;
  }
}

/*LG 6th*/
@media (min-width: 991px) {

  /* show 5th and 6th item */
  .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item + .carousel-item,
  .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    display: block;
  }

  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item + .carousel-item,
  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    transition: none;
  }

  /*show 7th slide for animation when its a 6 slides carousel */
   .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item  + .carousel-item {
    position: absolute;
    top: 0;
    right: -16.666666666%;
    z-index: 1;
    display: block;
    visibility: visible;
  }
  
  /* forward direction > */
  .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item,
  .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  
  /* prev direction < last item animation fix */
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item,
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
    display: block;
    visibility: visible;
  }
}