/* CSS Document */

*{
    padding:0;
	margin: 0;	
	font-family: 'Montserrat', sans-serif;
}

body{

	width: auto;
}


nav{
	margin: 0px !important;
	height: 200px;
	position: fixed !important;
	width: 100% !important;
	display: flex;
	justify-content: space-around !important;
	transition: 0.7s;
	z-index: 10 !important;
	top: 0;
	left: 0;
	backface-visibility: hidden;
	background-color: hsla(0,0%,0%,0.40);
	
}



.navbar-brand{
	
	background-color:transparent!important;
	padding-left: 10px;
}

.nav-link{
	
	color: aliceblue !important;
	margin: 0px 5px!important;
}

.collapse{
	margin: 0px 70px 0px 0px !important;
}

.navbar-nav{
	margin-right: 5px!important;
	
}

banner{
	position:relative !important;
	width: 100% !important;
	height: 100vh !important;
	
	
}

#work-with{
	display: flex;
	justify-content: center;
	padding-top: 70px;
}

#sec1{
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: #FFFFFF;
}

#partners{
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	align-content: center;
	justify-content: center;
	height: 200px;
	margin-bottom: 50px;
}

#servicios{
	background-image: url( "../img/fondo2.png");
	width: 100%;
	height: 1400px;
	background-repeat:no-repeat;
	display:flex;
	flex-direction: column;
	justify-content:center!important;
	align-content: center;
	align-items: center;
	background-size: 100% cover;
	background-position: center center;
	margin-bottom: 0px;
	object-position: center !important;
	
} 

#Brochure{
	width: 100%;
	height: 50px;
	display: flex;
	justify-content: center;
}

.brochure{
	width: 240px;
	height: 50px;
	background-color: transparent !important;
	border: solid !important;
}

.brochure:hover{
	box-shadow: 0   4px 10px #022A35;
}

.brochure a{
	color: #FFFCFC;
	text-decoration: none;
	font-family:'Montserrat medium', sans-serif;
	font-size: 25px;
}

#h1{
	font-family:'Montserrat semibold', sans-serif;
	color: aliceblue;
	display: flex;
	justify-content: center;
	padding: 10% 0% 10%;
	width: 100%;
	font-size: 13px;
}
.cardsrow{
	height: 400px;
	display: flex !important;
	flex-direction: row !important;
	justify-content: center !important;
	align-items: center;
	width: 100%;
	align-content: center;
	padding-top: 80px;
	margin-bottom: 30px;
 
	
}

.cardsrow2{
	height: 400px;
	display: flex !important;
	flex-direction: row !important;
	justify-content: center;
	align-items: center;
	width: 100%;
	align-content: center;
	padding-top: 80px;
	
	
}

.s1{
	width: 290px;
	height: 350px;
	transform: translate(-50%,-50%);
	margin: 0px 40px;
	
}


.face{
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
	backface-visibility: hidden;
	border-radius: 15px;
	transition: 2s;
	
}


.face img{
	width: 100%;
	height: 100%;
	
}

.front{
	transform: perspective(600px) rotateY(0deg);
	box-shadow: 0 8px 10px #000;
	background-color: none !important;
}

.back{
	position: absolute;
	transform: perspective(600px) rotateY(180deg);
	padding: 15px;
	display: flex;
	flex-direction: column; 
	justify-content: center;
	text-align: center;
	box-shadow: 0 8px 10px #000;
	color: aliceblue;
}

.s1:hover .front{
	transform: perspective(600px) rotateY(180deg);
}

.s1:hover .back{
	transform: perspective(600px) rotateY(360deg);
}

#S1{
	width: 100%;
	display: flex;
	flex-direction:column;
	align-items: center !important;
	justify-content: center;
	align-content: center !important;
	float: right;
	padding-left:250px ;
	 
}

.Info{
	width: auto;
	height: 500px;
	background-color: #000785;
	color: aliceblue;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	
	
}


#Pregunta{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

#Pregunta p{
	
	width: 53%;
	margin-bottom: 40px;
}

#Pregunta h3{
	
	
	margin-bottom: 30px;
}

.enlace a{
	text-decoration: none;
}

.Info2{
	width: auto;
	height: 700px;
	color:#000785;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	margin-bottom:50px; 
	background-image: url( "../img/decoration2-03.png");
	background-position: top right;
	background-repeat: no-repeat;
	background-size: 80px;
	
}


.Info2 img{
	
	padding-bottom: 10px;
	
}

.Info2 h2{
	
	margin-bottom: 50px;
	font-family: 'Montserrat extrabold', sans-serif; 
}

#CLIENTES{
	width: auto;
	height: 370px;
	display:flex;
	flex-direction: column;
	align-items: center;
	padding-top: 60px;
	background-color: #28D3C6;
	color: #F8FBFD;
	
}


.clientes{
	display: flex;
	flex-direction: row;
	padding-top: 40px;
	
}

.cliente-img{
	width: 220px;
	height: 110px;
	background-color: #FFFFFF;
	align-items: center;
	align-content: center;
	justify-content: center;
	display: flex; 
	margin: 10px;
	box-shadow: 0 5px 15px #000;
	border-radius: 5px;
}

.cliente-img img {
	
}

#card{
	background: url("../img/fondo.png");
	background-size: cover;
	width: 60%;
	height:75%;
	box-shadow: 0 8px 10px #000;
	display: flex;
	flex-direction: row;
	background-repeat: no-repeat;
	align-items: center;
	align-content: center;
	justify-content: space-between;
	border-radius: 50px;
}

#CONTACTANOS{
	width: 100%;
	height: 800px;
	display: flex;
	align-items: center;
	justify-content: center;
	align-content: center;
	background-image: url("../img/decoration-03.png");
	background-position: bottom left;
	background-repeat: no-repeat;
	background-size: 90px;
	 

}

#contenedorI{
	width: 50%;
	padding: 30px 50px;
	color: #FFFCFC;
}


#contenedorI h2{
	width: 90%;
	height: 200px;
	font-family: 'Montserrat extrabold', sans-serif;
	font-size: 50px;
    
	
}

#formulario{
	width:50%;
	padding: 40px 70px 40px 40px;
	display: flex;
	flex-direction: column;
	float: right;
	height: 90%;
}

.col-md-2{
	margin: 5px 5px;
	
}

.form-control{
	
	height: 70px;
}

textarea{
	height: 130px !important;
}

.col-md-4{
	margin: 5px 5px;
	
}

.col-12{
	
	margin-top: 10px;
}

.fil{
	
	display: flex;
	flex-direction: row;
	align-items: center;
	align-content: center;
    width: 100%;
	
}


#correo{
	display: flex;
	flex-direction: row;
	
	
}

#button input{
	display: flex;
	float: right;
	
}


#footer{
	display: flex;
	flex-direction: row;
	height: 70%;
	margin-bottom: 120px;
	width: 100%;
}

#fila1{
	display: flex;
	flex-direction: column;
	margin-right: 300px;
	
}

#fila2{
	display: flex;
	flex-direction: column;
	width: 200px;
	margin: 0px 50px;
}

#fila3{
	
	display: flex;
	flex-direction: column;
	width: 200px;
	margin: 0px 50px; 
}

#fila3 h3{
	padding:60px 0px 30px 0px;
	color:#FFFCFC;
	font-size: 22px;
}

#fila3 a{
	text-decoration: none;
	color:#FFFCFC;
	margin: 10px 0px;
}




#correo2{
	
	display: flex;
	flex-direction: row;
	color: #FFF7F7;
	width: 70%;
	padding-left: 50px;
}



#telefono{
	
	display: flex;
	flex-direction: row;
	color: #FFF7F7;
	width: 60%;
	padding-left: 50px;
}

#numeros{
	display: flex;
	flex-direction: column;
	color: #FFF7F7;
	
}

#ubicacion{
	
	display: flex;
	flex-direction: row;
	color: #FFF7F7;
	width: 85%;
	padding-left: 50px;
}

#fila2 h3{
	padding:60px 0px 30px 0px;
	color: #FFF7F7;
	width: 200px;
	font-size: 22px;
}


#fila2 a {
	
	text-decoration: none;
	color: #FFF7F7;
	margin: 10px 0px;
	
}

#fila4{
	display: flex;
	flex-direction: column;
	width: 200px;
	margin: 0px 30px;
}

#fila4 h3{
	
	padding:60px 0px 30px 0px;
	color: #FFF7F7;
	width: 200px;
	font-size: 22px;
}

#fila4 a{
	
	text-decoration: none;
	color: #FFF7F7;
	margin: 10px 0px;
}

#fila5{
	
	display: flex;
	flex-direction: column;
	width: 200px;
	margin: 0px 30px;
}

#fila5 h3{
	
	padding:60px 0px 30px 0px;
	color: #FFF7F7;
	width: 200px;
	font-size: 22px;
}

#fila5 a{
	
	text-decoration: none;
	color: #FFF7F7;
	margin: 10px 0px;
}

#redesS{
	
	display: flex;
	flex-direction: row;
	height: 49px;
	padding-top: 165px;
}

#derechos{
	
	color: #FFF7F7;
	display: flex;
	justify-content: center;
	align-content: center;
	padding-top: 20px;
	
}





footer{
	background-color: #000785;
	width: 100% !important;
	height: 600px;
	display: flex;
	flex-direction: column;
	
}