
h2 { 
	padding: 20px;
	text-align: center;
	font-size: 25px;
	text-transform: uppercase;
		
}

.portafolio {
	background-color: #2c2f32;
	width: 100%;
	padding: 20px;
	margin: 20px 0;
	text-align: center;
}

.portafolio h2 {
	color: white;
}

.portafolio img {
	width: 300px;
	padding: 20px;	
}

.nosotros {	
	padding: 0;
	margin: 0;	
	text-align: center;	
}


.nosotros img {	
	height: 70px;
			
}

.nosotros p{
	font-size: 13px;
	padding: 20px;	
}

/* inicio equipo */

.team {	
	padding: 20px;
	width: 100%;
	text-align: center;
	margin: 20px 0;

	
}

.equipouno, .equipodos {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;	
	margin: 10px;	

}


.equipos {
    margin: 5px 30px;
    -webkit-perspective: 800;
    perspective: 800;
    
}

.card {
    width: 220px;
    height: 280px;       
    text-align: center; 
    position: relative;
    transform-style: preserve-3d; 
    transition: .7s ease;
  
}

.card img {
	height: 100%;
			
}



.font, .back {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}


.font {
   padding: 5px; 
    
}


.back {
    background-color:  #2c2f32;
    transform: rotateY(180deg);
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	color: white;
	text-transform: uppercase;
	font-size: 12px;
		
}

.back span {
	color: #ff842a;
	font-size: 15px;
	
}

.equipos:hover .card {
    transform: rotateY(180deg);
   
}

/* termino equipo*/

.servicio {
	padding: 20px;
	background-color: #2c2f32;
	text-align: center;		
}


.servicio h2 {
	color: white;
}


.services {
	padding: 20px 0;
	
}

.services img {
	height: 200px;
	padding-bottom: 20px;
}


.services li{
	padding: 10px;
	margin: 12px 20px;
	font-size: 10px;
	color: white;	
	text-transform: uppercase;	
	font-weight: 700;
	border-style: ridge;
	border-color: gray;	
	
}

.know {
	margin: 10px auto;
}


.know a {
	color: white;	
	text-transform: uppercase;
	border-style: ridge;
	border-color: gray;
	background-color: #444543;
	padding: 4px 10px;
}





.clientes {
	padding: 20px;
	text-align: center;
	justify-content: space-around;	
}


.clientes img {
	width: 120px;
	padding: 10px;
}


.instagram {
	margin-bottom: 10px;
}

/* inicio slider */


.slider {
    width: 95%;
    margin: 20px auto;
    overflow: hidden;

}

.slider ul {
    display: flex;
    padding: 0;
    width: 600%;
	animation: change 24s infinite alternate;	
    animation-timing-function: ease-in;   
}

.slider li {
    width: 100%;
    list-style-type: none;
}

.slider img {
    width: 100%;
    height: 100%;
}


@keyframes change {
    0% { margin-left: 0%;}
    15% { margin-left: 0%;}

    17% { margin-left: -100%;}
    32% { margin-left: -100%;}

    34% { margin-left: -200%;}
    49% { margin-left: -200%;}

    51% { margin-left: -300%;}
    66% { margin-left: -300%;}
    
    68% { margin-left: -400%;}
    83% { margin-left: -400%;}
    
    85% { margin-left: -500%;}
    100% { margin-left: -500%;}
}

/* fin slider*/


@media only screen and (min-width:760px) {	


	.slider {
		margin: 40px auto;
	}


	.portacero {	
		display: flex;	
		justify-content: space-around;
	}


	.portafolio img {
		width: 400px;
		
	}

	

	.nosotro {
		padding: 20px ;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}

	.nosotro img {
		height: 100px;
	}

	.nosotro p{
		text-align: left;
		padding: 0 30px;
		font-size: 15px;		
		width: 460px;		
	}	
	
	
	.services {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap; 

	}


	.services img {
		height: 300px;
	
	}

	.services ul {
	text-align: justify;

	}

	.services li {
		font-size: 15px;
	}

	.clientes img {
		width: 180px;
		padding: 20px;
		
	}

	.know {
		margin: 30px auto;
	}
}