/*HEADER */



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

header{
	background-color: white;
	text-align: center;
	padding: 25px;
}
/* styles.css */
/* styles.css */
/*Nvbar*/
header img {
    height: 80px; /* Altura del navbar */
}


nav ul li a {
    text-decoration: none;
    color: #000; /* Color de texto (negro) */
    transition: color 0.3s ease; /* Transición suave */
}
nav ul li a:hover {
    color: #333; /* Color de texto al pasar el mouse */
}













/* styles.css */

/* Tarjetas */  
.contenedor-tarjeta{  
 width: 100%;  
 display: flex;  
 max-width: 1100px;  
 margin: auto;  
}  
.titulo-tarjeta{  
 width: 100%;  
 max-width: 1080px;  
 margin: auto;  
 padding: 20px;  
 margin-top: 20px;  
 text-align: center;  
 color: black;
}  
.tarjeta{  
 width: 100%;  
 margin: 20px;  
 border-radius: 7px;  
 overflow: hidden;  
 background:#fff;  
 box-shadow: 0px 2px 10px rgba(0,0,0,0.2);  
 transition: all 400ms ease-out;  
 cursor: default;  
 
}  
.tarjeta:hover{  
 box-shadow: 5px 5px 20px rgba(0,0,0,0.4);  
 transform: translateY(-4%);  
}  
.tarjeta img{  
 width: 100%;  
 height: 210px;  
}  
.tarjeta .contenido-tarjeta{  
 padding: 20px;  
 text-align: center;  
}  
.tarjeta .contenido-tarjeta h3{  
 margin-bottom: 15px;  
 color: black; 
}  
.tarjeta .contenido-tarjeta p{  
 line-height: 1.8;  
 color: black;
 font-size: 14px;  
 margin-bottom: 5px;  
}  
.tarjeta .contenido-tarjeta a{  
 display: inline-block;  
 padding: 10px;  
 margin-top: 10px;  
 text-decoration: none;  
 color: #2fb4cc;  
 border: 1px solid #2fb4cc;  
 border-radius: 4px;  
 transition: all 400ms ease;  
 margin-bottom: 6px;  
}  
.tarjeta .contenido-tarjeta a:hover{  
 background: #2fb4cc;  
 color: #fff;  
}  
 


h1{
    font-size: 40px;
    font-weight: 600;
    margin-top: 5%;
    margin-bottom: 5%;
   
}

.row{
    margin-top: 5%;
    display: flex;
    justify-content: space-between;
}

/*Ubicación*/

.ubicacion{
    width: 80%;
    margin: auto;
    text-align: center;
    padding: 50pxs;
}

.ubicacion-col{
    flex-basis: 30%;
    border-radius: 10px;
    margin-bottom: 5px; /* Margen inferior más pequeño */
    position: relative;
    overflow: hidden;
}


.ubicacion-col img{
    width: 500px; /* Ancho específico */
    height: 400px; /* Alto específico */
    border-radius: 10px;
}



.layer h3{
    width: 100%;
    font-weight: 500;
    color:#fff;
    font-size: 30px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.ubicacion-col img{
    width: 70%;
    border-radius: 60px; /* Adjust as needed */
}



/*Requerimientos*/

.usaremos{
    width: 80%;
    margin: auto;
    text-align: center;
    padding-top: 100px;
}


.usaremos-col{
    flex-basis: 30%;
    border-radius: 10px;
    margin-bottom: 5%;
    text-align: left;  
}

.usaremos-col img{
    width: 100%;
    border-radius: 10px;
    height: 300px;
}


.usaremos-col h3{
    margin-top:16px;
    margin-bottom:15px;
    text-align: left;
}



/*Testimonials*/

.testimonios{
    width: 80%;
    margin: auto;
    padding-top: 100px;
    text-align: center;
}

.testimonios-col{
    flex-basis:44%;
    border-radius:10px;
    margin-bottom: 5%;
    text-align: left;
    background: #2fb4cc;  
    padding: 25px;
    cursor: pointer;
    display: flex;
}

.testimonios-col img{
    height: 40px;
    margin-left: 5px;
    margin-right: 30px;
    border-radius: 50%;
}

.testimonios-col h3{
    margin-top: 15px;
    text-align:left;
}

/*PIE DE PÁGINA*/
footer {
    text-align: left;
    padding: 50px;
    background-color: black;
    color: white;
    font-size: xx-large;
}