/*Reset de estilos */
*{
    margin:0;
    box-sizing:border-box;
    font-family:"Lato", sans-serif;
    font-style:normal;
}

ul{
padding-inline-start:0;

}
/* Variables globales */
:root {
    --color-principal:#445c00;
    --color-secundario:#b8c8a0;
    --color-background-verde:#e3eada;
    --color-background-blanco:#f4f4f4;
    --color-background-botones-nav:#b8c8a0f4;
    --color-terciario:#e8cc47;
    --color-piel:#F9ECE1;
    --color-piek-2:#CDA582;
    --color-text-contacto-redes-top:white;
    --color-borde-form-footer:rgba(0, 0, 0, 0.2);
    --Gradiente-1:linear-gradient(269deg, rgba(68, 92, 0, 0.2) 30%, rgba(68, 92, 0, 1) 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)),
    --Gradiente-regalos:#D99A9A
}


 h1, h3{
    font-size:clamp(1rem, 4vw + 1rem, 2.8rem);
    font-weight:400;  
}

 p{
    font-weight:normal;
}

 body h2{
    font-size:40px;
    font-weight:400;
    font-size:clamp(2rem, 4vw + 1rem, 2.8rem);
}

.contenedor-sitio-web{
    display:flex;
    flex-direction:column;
    justify-content:center;
    margin:0 auto;
    overflow:hidden;
    
}

.contenedor-logo{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:200px;
} 
.img-logo{
    width:250px;
    margin:auto;
} 

/*-------cta-whatsapp-start-big----*/

.cta-whatsapp{
    width:70%;
    height:50px;
    background-color:var(--color-terciario);
    border-radius:30px 0 30px 0px;
    border:solid 1px var(--color-terciario);
    color:#445c00;
    cursor:pointer;
    justify-content:center;
}
.cta-whatsapp:hover{
    border:solid 1px #66753d;
    transition:.4s;
}
/*-------cta-whatsapp-end-big----*/

/*-------cta-wahtsapp-start-short-----*/
#short{
    width:30%;
    height:50px;
    background-color:var(--color-terciario);
    border-radius:30px 0 30px 0px;
    border:solid 1px var(--color-terciario);
    color:#445c00;
    cursor:pointer;
}
#short:hover{
    border:solid 1px #66753d;
    transition:.4s;
}

/*-------cta-whatsapp-end-short-----*/

/*--------call-to-acttion-cart-start-servicios---*/
.call-to-action {
    margin:0 50px 0 50px;
    background-color:var(--color-secundario);
    height:35px;
    border-radius:20px;
    border:solid 1px #445c00;
    cursor:pointer;
}
.call-to-action:hover {
    background-color:var(--color-terciario);
    cursor:pointer;
    transition:.4s;

}
/*--------call-to-acttion-cart-start-servicios-end--*/

/*---------------------------Página home----------------------------*/

/*Estilos contacto-redes top */

.redes-header{
    display:flex;
    justify-content:center;
    align-items:center;
    align-content:center;
    background-color:var(--color-principal);
    width:100%;
    padding:10px;
    gap:30px;
}

.contenedor-contacto-top-var{
    display:flex;
    align-items:center;
    align-content:center;
    gap:5px;
    color:var(--color-text-contacto-redes-top);   
}
.siguenos{
 color:white;
}

.icon-contacto{
    cursor:pointer;
}

.icon-contacto:hover{
   opacity:0.5;
   transition:.4s;

}

.contenedor-iconos-redes{
    display:flex;
    align-items:center;
    align-content:center;
    gap:5px;
   
}

.boton-redes{
    width:36px;
    cursor:pointer;
    
}

.boton-redes:hover{
    opacity:0.5;
    transition:.4s;
}

.icon-contacto{
    width:36px;
}

/* estilos menu de navegación - logo*/

.contenedor-logo-botones-nav{
    display:flex;
    justify-content:space-around;
    align-items:center;
    padding:20px 20px;
    --icono-menu:url("/images/0/mh.png");
    --ocultar-menu:translate(-100%);
    background-color:white;
    
}

.contenedor-logo-botones-nav:has(.icono-checkbox:checked){
    --icono-menu:url("/images/0/bc.png");
    --ocultar-menu:translate(0%)

}

.icono-checkbox {
    display:none;
}

.icono-menu{
   width:36px;
   height:36px;
   background-image:var(--icono-menu);
   background-size:cover;
   cursor:pointer;
   transition:background-image .4s;
   
}

/*-----buttonsearch-start----*/
.boton-buscar{
    border-radius:15px;
    width:200px;
    height:30px;
    border:solid 1px var(--color-principal);
    background-color:#e2e8d9;
    padding:5px;
}
.main-search-container{
    display:block;
    position:relative;
    color:var(--color-principal);
 
}
.search-container {
    position:relative;
    width:300px;
}

.search-box {
    width:100%;
    padding:10px;
    border:2px solid #6b8e23;
    border-radius:20px;
}

.search-button {
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    background:none;
    border:none;
    cursor:pointer;
}

.search-results {
    position:absolute;
    border:1px solid #6b8e23;
    max-height:200px;
    overflow-y:auto;
    margin-top:5px;
    display:none;
    background-color:var(--color-background-blanco);
}

.search-results a {
    display:block;
    padding:10px;
    text-decoration:none;
    color:black;
    border-bottom:1px solid #ddd;
}

.search-results a:hover {
    background-color:#f0f0f0;
}

/*-------buttonsearchedn----*/

a {
    text-decoration:none;
    color:var(--color-principal) !important;

}
a:hover{
    color:#e8cc47;
    transition:.4s;
}

.botones-nav {
    position:absolute;
    display:grid;
    place-content:center;
    text-align:center;
    list-style:none;
    transform:var(--ocultar-menu);
    transition:transform .5s;
    gap:20px;
    padding-inline-start:none;
    
}

.botones{
    display:inline-block;
    padding:.8rem .5rem;

}

.icono-menu, .logo-header, .contenedor-boton-buscar, .contenedor-redes-nav {
    z-index:100;
}
.botones-idiomas{
   cursor:pointer;
}

.botones-idiomas:hover{
   opacity:0.5;
   transition:.4s;
}


/*Sub menu servivios*/

.sub-menu-servicios li {
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    list-style:none;
    width:100%;
    padding:10px;

}


.sub-menu-servicios {
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding-inline-start:0;
    transform:translateY(-10px); /* Desplazado hacia arriba */
    transition:opacity 0.3s ease, transform 0.3s ease; /* Animación suave */
    position:absolute; /* Posicionamiento absoluto para que aparezca debajo del botón */
    top:70%; /* Asegura que el submenú esté justo debajo del botón de Servicios */
    
    background-color:rgba(255, 255, 255, 0.902); /* Fondo blanco */
    box-shadow:0 4px 8px rgba(0, 0, 0, 0.1); /* Sombra para el submenú */
    z-index:1; /* Asegura que el submenú esté por encima de otros elementos */
    visibility:hidden; /* Inicialmente oculto */
    pointer-events:none; /* Evita interacción cuando no está visible */
   
}

.sub-menu-servicios li a {
    color:var(--color-principal);
    text-decoration:none;
}

 .sub-menu-servicios li:hover{
    background-color:var(--color-terciario);

}

.botones-servicios:hover .sub-menu-servicios,
.botones-servicios:focus .sub-menu-servicios {
    transform:translateY(0); /* Sin desplazamiento, vuelve a la posición original */
    visibility:visible; /* Hacer visible */
    pointer-events:auto; /* Permitir interacción */
}

        ul {
    padding-inline-start:10px;
}

/*hero*/

.contenedor-hero{
    height:500px;
    margin-top:200px;
}


.hero{
    background-image:
    linear-gradient(269deg, rgba(68, 92, 0, 0.2) 30%, rgba(68, 92, 0, 1) 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), 
    url('../images/0/HB.png');
    width:100%;
    height:100%;
    display:flex;
    background-size:cover;
    background-position:center;
    color:white;
    margin:auto;
        
}

.container-text-hero{
    display:flex;
    width:100%;
    flex-direction:column;
    justify-content:center;
    
}

.container-copy-calltoaction{
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:30px;
    gap:20px;
    color:·#fff;
}




.item-hero-h1{
    font-size:clamp(2rem, 4vw + 1rem, 2.8rem);
    color:#fff;
    
}
.natural-spa-hero{
    color:#b8c8a0;
    font-weight:550;
}
.item-hero-p{
    color:#e8cc47;
    font-size:clamp(1rem, 1vw , 2rem);
}

/*stilos sección servicios*/

.titulo-servicios{
    width:100%;
    height:5rem;
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
    font-size:30px;
    padding-top:70px;
    color:var(--color-principal);
}

.main-container{
     /*Variables ima¡genes tarjetas*/
    --img-tratamientos-adelgazantes:linear-gradient(190deg, rgba(158, 196, 51, 0.2) 30%, rgb(236, 168, 169) 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)),  url("../images/1/T-A.jpg");

    --img-posoperatorio:linear-gradient(190deg, rgba(158, 196, 51, 0.2) 30%, #445c00 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)),  url("../images/1/S-PO.jpg");

    --img-posparto:linear-gradient(190deg, rgba(158, 196, 51, 0.2) 30%, #445c00 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)),  url("../images/1/T-PP.jpg");

    --img-faciales:linear-gradient(190deg, rgba(158, 196, 51, 0.2) 30%, #445c00 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)),  url("../images/1/T-F.jpg");

    --img-terapeuticos:linear-gradient(190deg, rgba(158, 196, 51, 0.2) 30%, #445c00 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)),  url("../images/1/T-RT.jpg");

}

.main-container {
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    background:url('../images/IMG/servicios/background-1800x1200.png') no-repeat center center;
    background-size:cover;
    background-position:center;
    padding-top:100px;
} 

.titulo-servicios{
    color:var(--color-principal);

}

.container-service{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    gap:1.5rem;
    width:60%;
    padding-bottom:100px;
    
}

.container-info {
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:center;
    background-color:var(--color-secundario);
    border-radius:25px 0px ;
    padding-bottom:20px;
    color:#445c00;
    font-style:normal; 
    gap:20px;
}

#img-adelgazantes{
    background-image:var(--img-tratamientos-adelgazantes);
}

#img-posoperatorio {
background-image:var(--img-posoperatorio);

}

#img-posparto{
    background-image:var(--img-posparto);
}

#img-faciales{
    background-image:var(--img-faciales);
}

#img-terapeuticos {
    background-image:var(--img-terapeuticos);
}


.tarjeta-destacados{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:30px;
    height:400px;
    background-color:#445c00;
    padding:20px;
    color:#b8c8a0;
    border-radius:20px 0 20px 0px;
}

.tarjeta-servicio{
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:20px;
    height:16rem;
    background-size:cover;
    background-position:center;
    border-radius:20px 0 20px 0px;
    
}

.text-tarjeta{
    font-weight:200;
    color:#e2e8d9;   
}


/* sección banner bioseguridad*/

.banner-bioseguridad{
    height:624px;    
}

.background-bioseguridad{
    display:flex;
    justify-content:space-around;
    align-items:center;
    width:100%;
    height:100%;
    background-image:linear-gradient(269deg, rgba(68, 92, 0, 0.2) 30%, rgba(68, 92, 0, 1) 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), 
    url('../images/1/1800x624.jpg');
    background-size:cover;
    background-position:center;
    margin:auto;

}

.container-items {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    gap:50px;
    width:90%;
   
}

.contenedor-h2{
    display:flex;
    align-items:center;
    padding-left:50px;
    color:#b8c8a0;
    color:#e8cc47;
 
}

.contenedor-logo-bioseguridad{
    display:flex;
    justify-content:center;
    align-items:center;
    
}

.logo-bioseguridad{
    display:flex;
    width:150px;
    height:150px;
    background-image:url('../images/0/SB.png');
    background-size:cover;
    background-position:center;
}

/*sección call to action banner-bioseguridad*/

.calltoaction-footer{
    width:100%;
    height:200px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:20px;
    color:var(--color-secundario);
    background-color:var(--color-principal);
}

.boton-calltoaction-footer{
    background-color:var(--color-terciario);
    width:150px;
    height:50px;
    border-radius:30px 0 30px 0px;
    border:solid 1px var(--color-principal);
    color:var(--color-principal);
    cursor:pointer;
}

.boton-calltoaction-footer:hover{
    background-color:#b8c8a0;
    transition:.4s;
}

.calltoaction-footer p{
    font-weight:200;
    font-size:30px;
}

/*sección footer*/

.contenedor-footer{
  display:flex;
  padding:30px;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  padding:50px;
  background-color:#d4e2af24;
  background-image:url("../images/0/1800X916.png");
  background-size:cover;
  background-position:center; 
}


.footer{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    gap:50px;
    margin-right:10px;  
}


.titulo-footer{
 font-size:clamp(2rem, 4vw + 1rem, 2.8rem);
}


.contenedor-datos-sello{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:20px;
    margin:auto;
    color:#445c00;
    margin:30px;
    flex-grow:1;
}

.datos-contacto{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:10px;   
}

.redes{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:10px;
}


/*formulario de contacto*/

.titulo-form-footer{
    font-size:30px;

}

.formulario{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:30px;
    border-radius:30px;
    border:solid 1px rgba(0, 0, 0, 0.2);
    gap:10px;
    margin:auto;
    color:#445c00;
    background-color:#b8c8a0a6;   
}

.formulario-items{
    display:grid;
    width:80%;
    grid-template-columns:1fr;
    gap:20px; 
}

.contenedor-imput{
    display:flex;
    flex-direction:column;
    width:100%;
    text-align:center;
}
.input-form{
    display:flex;
    width:100%;
    height:40px;
    border-radius:5px;
    border:solid 1px rgba(0, 0, 0, 0.2);
}

.submit-form{
    height:40px;
    background-color:var(--color-terciario);
    border-radius:5px;
    border:solid 1px rgba(0, 0, 0, 0.2);
    cursor:pointer;
}

.submit-form:hover{
    background-color:var(--color-secundario);
    transition:.4s;
}

.texto-formulario{
    width:100%;
    border-radius:5px;
    border:solid 1px rgba(0, 0, 0, 0.2);
}

/*copyrigth*/

.contenedor-copyrigth{
    display:flex;
    flex-direction:column;
    height:100%;
    background-color:var(--color-terciario);
    padding:30px;  
}

.items-copyrigth{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    width:100%;
    gap:20px;
}

.logo-sello-bioseguridad img{
    width:110px;
    height:100px;   
}

.naturalspa-footer{
    font-weight:600;
}
.derechos-reservados, .logo-sello-bioseguridad, .desarrollador{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#445c00;
}

.derechos-reservados {
  display:flex;
  justify-content:center;
  text-align:center;
}

/*------------------------Página nosotros--------------------------*/

.contenedor-pagina-nosotros{
    display:flex;
    flex-direction:column;
    width:100%;
    height:100%;  
}
.contenedor-acerca-de{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    background-color:var(--color-secundario);
    padding:50px;
    padding-left:20px;
    padding-right:30px;
    gap:30px;
    color:var(--color-principal);
}
.items-acerca-de{
    display:flex;
    flex-direction:column;
    width:70%;
    gap:20px;
    padding:50px;
    margin:auto;
}
.contenedor-mison-vision{
   display:flex;
   justify-content:flex-start;  
}
.items-vision-mision{
   display:grid;
   width:70%;
   margin:auto;
   grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
   color:var(--color-principal);
  
}
.item-vision, .item-mision{
    display:flex;
    flex-direction:column;
    justify-content:center;
    width:100%;
    gap:20px;
    padding:50px;  
}
.contenedor-background-valores{
    display:flex;
    width:100%;
    height:700px;
    flex-wrap:wrap;
    background-image:url('../images/2/BV-1800X1000.jpg');
    background-size:cover;
    background-position:center;
}

.separador-h{
    display:flex;
    width:100px;
    height:150px;
    justify-content:center;
    margin-right:50px;
    border-right:solid 2px var(--color-principal);
}

.contenedor-items-valores{
    display:flex;
    width:100%;
    flex-wrap:wrap;
    flex-direction:column;
    justify-content:center;
    color:var(--color-principal);
}

.items-valores{
   display:flex;
   width:80%;
   justify-content:space-evenly;
   align-items:center;
   padding:50px;
   margin:auto;
}

.copy-valores{
    font-weight:400;
    font-size:clamp(2rem, 4vw+1rem, 2,8rem);
}
.contenedor-jornadas-salud{
    display:flex;
    width:100%;
    height:450px;
    margin:auto;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    background-image:linear-gradient(-180deg, rgba(68, 92, 0, 0.2) 30%, #b8c8a0 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), url('../images/2/JS-1800X1000.jpg');
    background-size:cover;
    background-position:center;
}

.copy-jornadas{
    display:flex;
    justify-content:center;
    align-items:center;
    width:80%;
    width:80%;
    margin:auto;
    padding:30px;
    border-radius:0 0 50px 0;
}
.texto-copy{
    font-size:clamp(2rem, 4vw + 1rem, 2.8rem);
    text-align:center;
    color:rgb(255, 255, 255);
}
.contenedor-logos-instituciones{
    display:flex;
    justify-content:center;
    align-items:center ;
    flex-wrap:wrap;
    gap:30px;
    width:100%;
    height:100%;
    padding:50px;
    background-color:#b8c8a0;
}
.logo-institucion-1{
    display:flex;
    width:200px;
    height:200px;
    background-image:url('../images/2/Inst-1.png');
    background-size:cover;
}
.logo-institucion-2{
    display:flex;
    width:200px;
    height:200px;
    background-image:url('../images/2/Inst-2.png');
    background-size:cover;
}
.logo-institucion-3{
    display:flex;
    width:200px;
    height:200px;
    background-image:url('../images/2/Inst-3.png');
    background-size:cover;
}
.logo-institucion-4{
    display:flex;
    width:200px;
    height:200px;
    background-image:url('/images/2/Inst-4.png');
    background-size:cover; 
}

.contenedor-calltoaction-promociones{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    width:100%;
    height:100%;
    background-image:url('');
    background-size:cover;
    background-position:center;
    gap:30px;
    padding:50px;
    color:var(--color-principal);
}

.contenedor-copy-promociones{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    width:80%;
    height:100%;
    padding:50px;
    gap:30px;
    border-bottom:solid 1px var(--color-principal);
}

.copy-promociones{
    font-size:clamp(1rem, 4vw + 1rem, 2rem);
    color:var(--color-principal);
}

.boton-promociones{
    width:150px;
    height:50px;
    background-color:var(--color-terciario);
    border-radius:30px 0 30px 0px;
    border:solid 1px #66753d;
    color:#445c00;
    cursor:pointer;
}

.boton-promociones:hover{
    background-color:var(--color-secundario);
    transition:.4s;
}

/*------------------PÃfGINA SERVICIOS---------------------*/

/*secciÃf³n copy servicios*/

.contenedor-copy-servicios{
    display:flex;
    width:100%;
    height:100%;
    padding-top:50px;
    padding-bottom:50px;
    background-color:var(--color-piel);
    color:var(--color-principal);
}
.contenedor-copy-img{
    display:grid;
    width:70%;
    grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));
    align-items:center;
    margin:auto;
    gap:50px;
   
}
.copy-servicios span{
    color:var(--color-piek-2);
}

.copy-servicios{
    flex-basis:auto;
}

.img-servicios{
    width:500px;
    height:500px;
}
.img-servicios{
    width:100%;
    background-image:url('../images/3/i-cis500x500.jpg');
    background-size:cover;
    background-position:center;
}

/*secciÃf³n intro servicios*/

.contenedor-intro-servicios{
    display:flex;
    width:100%;
    height:100%;
    background-color:var(--color-background-verde);
    padding:30px;
    color:var(--color-principal);
}

.contenedor-intro{
    display:flex;
    width:100%;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    margin:auto;
    gap:30px;
}

/*secciÃf³n intro categoria*/

.contenedor-categoria-servicio{
    display:flex;
    flex-direction:column;
    
}
.contenedor-titulo-categoria-servicio{
    display:flex;
    justify-content:center;
    padding:50px;
    color:var(--color-piek-2);
    margin:auto;
    text-align:center;
}

.img-categoria-servicio{
    width:100%;
    height:100%;
    display:flex;
    background-size:cover;
    background-position:center;
    color:white;
    margin:auto;
        
}
.contenedor-info-categoria-servicio{
    display:flex;
    align-items:center;
    justify-content:center;
    width:80%;
    color:var(--color-principal);
    margin:auto;
}

.info-categoria-servicio{
    display:grid;
    width:80%;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    margin:auto;
    padding:50px 0 50px 0;
    gap:40px;
    
}

.info-1 {
flex-grow:1;
padding:10px;

}


.info-2{
  flex-grow:1;
  padding:10px;
 
}

.borde-top-info-categoria-servicio{
width:90%;
height:1px;
border-top:solid 1px var(--color-principal);
margin-top:50px;
   
   
   
}

/*secciÃf³n subcategoria*/

.contenedor-subcategoriaverde{
   display:flex;
   flex-direction:column;
   align-items:center;
   width:100%; 
   margin:auto;
   background-color:var(--color-background-verde);
   color:var(--color-principal);
}

.contenedor-subcategoriablanco{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%; 
    margin:auto;
    background-color:var(--color-background-blanco);
    color:var(--color-principal);
}

.items-subcategoriaverde{
    display:grid;
    justify-content:center;
    width:80%;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    margin:auto; 
    gap:30px; 
    padding-top:50px;
}

.img-subcategoriaverde{
    display:flex;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    border-radius:50px 0 50px 0;
    border-bottom:solid 15px  var(--color-principal);
}
.contenedor-img-subcategoriaverde{
    width:400px;
    height:500px;
    background-color:#445c00;
    border-radius:50px 0 50px 0;
    margin:auto; 
   
}

.main-contenedor-img-subcategoriaverde{
    display:flex;
    flex-direction:column;
    justify-content:center;
    width:600px; 
    height:500px;
    margin:auto;
}

.text-subcategoriaverde{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    margin:auto;
    gap:20px;
    width:80%;
}

.contenedor-calltoaction-sudcategoria{
    display:flex;
    width:80%;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding-top:50px;
    padding-bottom:50px;
    margin-top:50px;
    border-top:solid 1px var(--color-principal);
}

.cta-whatsapp{
    width:70%;
    height:50px;
    background-color:var(--color-terciario);
    border-radius:30px 0 30px 0px;
    border:solid 1px var(--color-terciario);
    color:#445c00;
    cursor:pointer;
}
.cta-whatsapp:hover{
    border:solid 1px #66753d;
    transition:.4s;
}

/*--------------------------------GALERIA--------------------------*/

/*stilos copy galeria servicios*/

.contenedor-copy-galeria{
    display:flex;
    width:100%;
    height:100%;  
    padding:50px;
    background-color:var(--color-piel);
    color:var(--color-principal);
}

.contenedor-copy-img-galeria{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    width:80%;
    margin:auto;
    gap:30px;
}
.copy-galeria{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
}

/*galeria*/

.contenedor-galeria-verde{
    display:flex;
    width:100%;
    height:100%;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    background-color:var(--color-secundario);
    padding-top:100px;
    padding-bottom:100px;
}

.contenedor-galeria-blanco{
    display:flex;
    width:100%;
    height:100%;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    background-color:var(--color-background-blanco);
    padding-top:100px;
    padding-bottom:100px;
}

.contenedor-items-galeria{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    width:50%;
    height:100%;
    gap:30px;
}
.contenedor-titulo-items-galeria{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    color:var(--color-principal);
    background-image:url('../IMG/background-titulo-galeria.png');
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.titulo-items-galeria{
    font-size:clamp(1rem, 3vw + 1rem, 2.8rem);
}
.items-1{
    display:flex;
    flex-direction:column;
    gap:30px;
}
.items-2{
    display:flex;
    flex-direction:column;
    gap:30px;
    width:100%;
}
.contenedor-img{
    display:flex;
    flex-direction:column;
   
   
}
.contenedor-img img{
    width:100%;
    height:100%;
}

/*-----------------------PROMOCIONES------------------------------*/
.banner-promociones{
    display:flex;
    justify-content:center;
    background-image:url('../images/promociones/background.jpg');
    background-size:cover;
    background-color:var(--color-principal);
    background-position:center;
    border-radius:0 0 100px 0;   
}
.-items-promociones{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(400px, 1fr));
    margin:auto;
    color:var(--color-background-blanco);
    padding-top:30px;
    background-image:url('../images/6/B-Pro.jpg');
    background-size:cover;
    background-position:center;
    border-radius:0 0 100px 0; 
}
.item-1-{
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:80%;
    padding-left:100px;
    gap:20px;
    margin-bottom:20px;
}

.item-2-{
    display:flex;
    justify-content:center;
    width:100%;
}

.item-promociones-1{
   display:flex;
   flex-direction:column;
   width:50%;
   margin:auto;
   text-align:center;
   color:var(--color-principal);
   padding-top:50px;
   padding-bottom:50px;
   gap:20px;
}
.item-2-regalos{
    display:flex;
    background-image:url('/images/6/img-Re.jpg');
    background-size:cover;
    justify-content:center;
    width:100%;
}
.item-1-regalos{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:20px 0 20px 0;
    gap:20px;

}
.item-2-regalos img{
    display:flex;
    width:100%;
    height:100%;
    border-radius:50px;

}
.contenedor-banner-regalos{
    width:100%;  
    background-size:cover;
    background-position:center; 
    background-color:#D99A9A;
    background-image:url('/images/6/BR.png');
    background-image:cover;
    background-position:center;
    color:var(--color-background-blanco);
}
.contenedor-items-regalos{
    display:flex;   
    gap:30px;
    width:80%;
    height:100%;
    margin:auto;
}
/*----------------------CONTACTO--------------------*/
.cotenedor-contacto{
    display:flex;
    justify-content:center;
    background-image:url('/images/contacto/background.png');
    background-size:cover;
    background-position:center; 
    background-color:var(--color-background-verde); 
    padding:50px;
}

.items-contacto{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(500px, 1fr));
    width:80%;
    gap:40px;
}
.info-contacto{
    display:flex;
    width:80%;
    flex-direction:column;
    justify-content:center;
    color:var(--color-principal);
}
.mapa{
    display:flex;
    width:100%;
    justify-content:center;
}



/*------------------------Media Query Home---------------------------*/

@media (width >= 1243px){
    .botones-nav{
    --ocultar-menu:translate(0);
}
    .icono-menu{
    display:none;
}

    .botones-nav {
        position:static;
        grid-auto-flow:column;
        background-color:white;
        align-items:center;
        
}
   
    .contenedor-botones-nav{
    display:flex;
    align-items:center;
    gap:10px;
    flex-direction:row;
    
}
.contenedor-redes-nav{
 position:fixed;
 width:100%;
}
}
@media (max-width:1243px) {

        .contenedor-botones-nav {
        display:flex;
        flex-direction:column;
        width:100%;
        gap:5px;
        margin-top:180%;
}

       .botones-nav{
        position:absolute;
        width:100%;
        padding-bottom:50px;
        display:grid;
        place-content:center;
        text-align:center;
        background-color:var(--color-background-botones-nav);
        list-style:none;
        transform:var(--ocultar-menu);
        transition:transform .5s;
 
}  

         .sub-menu-servicios{
         position:absolute;
         top:66%;
         right:0;
         width:100%;
         opacity:1;
         visibility:hidden;
         transform:none;
         background-color:#e3eada;
}

.contenedor-redes-nav{
 position:fixed;
 width:100%;
}
}
@media (width <=995px){
  .items-copyrigth{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
}

}
@media (width <= 940px){
.background-bioseguridad{
    background-image:linear-gradient(269deg, rgba(68, 92, 0, 0.2) 30%, rgba(68, 92, 0, 1) 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), 
    url('/images/920x624.jpg');
    background-size:cover;
    background-position:center;
    margin:auto;
}
.contenedor-footer{
  background-image:url('/images/940.jpg');
  background-size:cover;
  background-position:center; 
}
}
@media (width <=720px){
  .background-bioseguridad{
   background-image:linear-gradient(269deg, rgba(68, 92, 0, 0.2) 30%, rgba(68, 92, 0, 1) 100%), 
   linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), 
   url('/images/720x624.jpg');
   background-size:cover;
   background-position:center;
   margin:auto;
}

.contenedor-botones-nav {
   gap:10px;
}


.contenedor-footer{
  background-image:url('/images/720x600.jpg');
  background-size:cover;
  background-position:center; 
}
.mail-top, .telefono-header {
    display:none;
}

.mail-top, .telefono-header {
     display:none;
}

.contenedor-datos-sello{
        margin:30px;
}

}


@media (width <=480px){
    .background-bioseguridad{
    background-image:linear-gradient(269deg, rgba(68, 92, 0, 0.2) 30%, rgba(68, 92, 0, 1) 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), 
    url('/images/480x624.jpg');   
}
    .contenedor-footer{
    background-image:url('/images/480x600.jpg');
    background-position:center; 
}
    .siguenos{
    display:none;
}
    .container-service{
    padding-right:300px;
    gap:30px
}
   .calltoaction-footer{
   display:flex;
   text-align:center;
   flex-direction:column;
   justify-content:center;
   align-items:center;
}
   .contactanos {
   display:none;
}
 
}
@media (width <=470px) {
   .siguenos{
    display:none;
}    
    .container-service{
        padding-right:300px;
        gap:30px
}   
    .calltoaction-footer{
        display:flex;
        text-align:center;
        flex-direction:column;
        justify-content:center;
        align-items:center;      
}

}
@media (width <= 380px) {
    .container-copy-calltoaction {
     padding-left:20px;
}

}
@media (width <= 320px) {
    .container-copy-calltoaction {
        padding-left:20px;
}      
        .contenedor-footer{
        padding:0 0 30px 10px;
        background-image:url('/images/320x600.jpg');
        background-position:center;    
}
        .contactanos {
        display:none;
}   
        .derechos-reservados{
        text-align:center;
}
.contenedor-formulario-footer{
 
}
}

/*------------------------Media Query nosotros---------------------------*/

@media (width:940px){
.contenedor-background-valores{
    background-image:url('/images/BV-940x624.jpg');
    background-size:cover;
    background-position:center;
}
.contenedor-jornadas-salud{
    background-image:linear-gradient(-180deg, rgba(68, 92, 0, 0.2) 30%, #b8c8a0 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), url('/images/JS-940x624.jpg');
    background-size:cover;
    background-position:center;
}
}

@media (width:720px){
.contenedor-background-valores{
    background-image:url('/images/BV-720-624.jpg');
    background-size:cover;
    background-position:center;
}
.contenedor-jornadas-salud{
    background-image:linear-gradient(-180deg, rgba(68, 92, 0, 0.2) 30%, #b8c8a0 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), url('/images/JS-720x624.jpg');
    background-size:cover;
    background-position:center;
}
}

@media (width:480px){
.contenedor-background-valores{
    background-image:url('/images/BV-480x550.jpg');
    background-size:cover;
    background-position:center;
}

.contenedor-jornadas-salud{
    background-image:linear-gradient(-180deg, rgba(68, 92, 0, 0.2) 30%, #b8c8a0 100%), 
    linear-gradient(to bottom, rgba(68, 92, 0, 0.259), rgba(68, 92, 0, 0.094)), url('/images/JS-480x550.jpg');
    background-size:cover;
    background-position:center;
}

}

@media (max-width:420px){
.items-acerca-de{
    width:100%;
    padding:20px;
}
.items-vision-mision{
    width:100%;
    padding:20px;
}
}

@media (max-width:320px){
    .items-valores{
        display:flex;
        justify-content:center;
        align-items:center;
        flex-wrap:wrap;
        padding:20px;
        gap:20px;
}
    .contenedor-copy{
        display:flex;
        justify-content:center;
        width:100%;      
}

    .items-vision-mision{
        display:flex;
        width:100%;
        justify-content:center;
        flex-wrap:wrap;
        gap:20px;
}

    .item-vision, .item-mision{
        display:flex;
        width:100%;
        padding:20PX;
}
    .items-acerca-de{
        display:flex;
        width:100%;
        padding:10px;
}  
    .separador-v{
        border-right:solid 0px var(--color-principal);
}
    .separador-h{
        width:100%;
        height:30px;
        border-bottom:solid 2px var(--color-principal);
}
}
/*-------------------Media Query servicios--------------------------*/

@media (min-width:1800px){
    .img-categoria-servicio {
        background-image:url('/IMG/Servicios-categorias/1240X625.jpg');
        background-size:cover;
        background-position:center;   
}
}
@media (min-width:1302px){
    .main-contenedor-img-subcategoriaverde{
        width:70%;
        height:70%;
}
}
@media (min-width:1240px) {
    .img-categoria-servicio {
        background-image:url('/IMG/Servicios-categorias/1240X625.jpg');
        background-size:cover;
        background-position:center;   
} 
}
@media (min-width:940px) {
    .img-categoria-servicio {
        background-image:url('/IMG/Servicios-categorias/940x625.jpg');
        background-size:cover;
        background-position:center;   
}
    .contenedor-intro {
        width:70%;
        padding:30px 0;
}
    .info-2 {
        padding-left:150px;
}

    .items-subcategoriaverde {
        display:grid;
        width:80%;
        grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
        margin:auto;  
}
}
@media (min-width:734px){
    .items-responsive{
        display:grid;
        width:80%;
        grid-template-columns:repeat(auto-fit, minmax(500px, 1fr));
        margin:auto;  
}
}
@media (max-width:720px) {
    .img-categoria-servicio {
        background-image:url('/IMG/Servicios-categorias/720x625.jpg');
        background-size:cover;
        background-position:center;
}
  
}


@media (min-width:600px){
     .text-subcategoriaverde{
     
}
}
@media (max-width:480px) {
    .img-categoria-servicio {
        background-image:url('/IMG/Servicios-categorias/480x550.jpg');   
        background-size:cover;
        background-position:center;
}
    .main-contenedor-img-subcategoriaverde{
        width:100%;
        height:100%;
}
    .contenedor-img-subcategoriaverde{
        width:100%;
        height:100%;
}
    .img-subcategoriaverde{
        width:100%;
        height:100%;
        
}
}
@media (min-width:320px) {
    .img-categoria-servicio {
        background-image:url('/IMG/Servicios-categorias/320x450.jpg');
        background-size:cover;
        background-position:center;
}
    ul {
        padding:5px;
}
    .items-subcategoriaverde {
       margin:1px;
       width:80%;
}
    .text-subcategoriaverde{
        width:90%;
}
    .info-categoria-servicio{
        width:85%;        
}
}
/*---------------------Media Query galeria-------------------------*/
@media (max-width:1134px) {
    .titulo-items-galeria{
        font-size:clamp(1rem, 4vw + 1rem, 1.8rem); ;
}
}
@media (max-width:720px){
    .items-2{
        width:100%;
}
    .contenedor-items-galeria{
        margin:auto;
        width:80%;
}
}
@media (max-width:420px){
    .contenedor-copy-galeria{
        width:100%;
        padding:30px;
        margin:0;     
}

    .items-2{
        width:90%;
}
    .contenedor-copy-img-galeria{
        margin:0;
        width:100%;
}

    .img-servicios{
        width:100%;
}

    .items-1{
       width:90%;
}
    
}

@media (max-width:320px){
    .img-servicios{
        width:90%;
}
}
/*---------------------Media Query promociones-------------------------*/

@media (max-width:1053px){
    .contenedor-items-regalos{
        flex-wrap:wrap-reverse;
}
}
@media (max-width:940px){
    .item-1{
        width:100%;
        padding:30px;
}
    .item-2-promociones{
        width:100%;
}
}
@media (max-width:800px){
   .contenedor-banner-regalos .contenedor-items{
    flex-direction:column-reverse;
}
}
@media (max-width:480px){
    .item-2{
        width:100%;
        justify-content:center;    
}
    .item-1{
        width:90%;
}
}
@media (max-width:320px){
    .item-2{
            width:80%;
            justify-content:center;    
}
    .item-1-{
    padding-left:20px;
}      

}

/*--------------Media Query contacto---------------*/

@media (max-width:480px){
    .cotenedor-contacto{
        padding:20px;  
}
    .items-contacto{
        width:100%;   
}
    .mapa{
        width:75%;
}
    .info-contacto{
        width:75%;
}
}

@media (max-width:320px){
   .mapa{
        width:55%;
}
    .info-contacto{
        width:55%;
}
}