*, *::after, *::before {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    
}
:root{
    --negro: rgb(43,54,58);
    --azul: rgb(74,197,241);
    --azul-marino: rgb(27,126,193);
    --morado: rgb(85,103,175);

}
.menu-navegacion{
    
    
    width: 100%;
    height: 9vh;
    display: flex;
    justify-content: space-around;
    align-items: center;
    right: 0;
    left: 0;
    top: 0;
    margin: auto;
    overflow: hidden;
    
  
}


.logo{
    height: 50px;
}

.logo img{
    display: block;
    height: 50px;
    width: 50px;
    border-radius: 50%;


}

.menu li{
    list-style: none;
    display: inline-block;
    color: var(--negro);
}

.menu a{
    font-family: 'Poppins', sans-serif;
    color: var(--negro);
    text-decoration: none;
    padding: 0 20px;
    font-weight: 500;
    font-size: 20px;
    transition: all 500ms ease;
}

.menu a:hover{
    color: var(--azul-marino);
    border-bottom: 4px solid var(--azul-marino) ;
}





.container{
    padding: 0px 80px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; 
    grid-template-rows: 33vh 33vh 33vh; 
    align-items: center;
    margin-top: 10px;
    grid-template-areas: 
    "img1 img2 img3"
    "nombre nombre nombre"
    "img4 img5 img6"; 
}
.img1 { grid-area: img1; }
.img2 { grid-area: img2; }
.img3 { grid-area: img3; }
.nombre { grid-area: nombre; }
.img4 { grid-area: img4; }
.img5 { grid-area: img5; }
.img6 { grid-area: img6; }
.container img{
    width: 85%;
    height: 100%;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}
.nombre{
    display: grid;
    justify-content: center;
    font-family: 'Poppins', sans-serif;
}
.nombre h1{
    color: var(--morado);
    font-size: 2.5em;
    margin-top: 25px;
}
.nombre h3{
    color: var(--azul);
    font-size: 2em;
    text-align: center;
    margin-bottom: 25px;

}

.wave{
    
    background-image: url(../src/fondofigura.svg);
    background-repeat: no-repeat;
}
.serv-nutri{
    
    transform: translateY(150px);
    opacity: 0;
    transition: .5s all ease;
    margin-bottom: 50px;
}
.serv-nutri.active{
    transform: translateY(0);
    opacity: 1;
  }
.serv-nutri h3{
    font-family: 'Poppins', sans-serif;
    font-size: 3em;
    color:var(--morado);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 0px;

}

.nutricional{
    padding: 20px 50px;
    display: flex;
    justify-content: space-between;
    font-family: 'Poppins', sans-serif;
    color:var(--morado);
    
    
}
.n-i{
    
    flex:1;
    
}
.n-i h1{
    display: flex;
    justify-content: center;
}
.n-i img{
    width: 30px;
}
.list{
    margin-top: 70px;
    display: flex;
    justify-content: space-evenly;
    height: 15vh;
    color: var(--negro);
}
p{
    font-size: 20px;
}



/*aparatologia*/



.aparatologia{
    padding: 20px 50px;
    display: flex;
    justify-content: center;
    font-family: 'Poppins', sans-serif;
    color:var(--morado);
    transform: translateY(150px);
    opacity: 0;
    transition: .5s all ease;
    
   
}
.aparatologia.active{
  transform: translateY(0);
  opacity: 1;
}
.a-i{
    flex:1;
}
.a-i h1{
    display: flex;
    justify-content: center;
}
.a-i img{
    width: 30px;
}
.list-a{
    display: flex;
    margin-top: 50px;
    align-items: center;
    justify-content: space-evenly;
    color: var(--negro);
}




.tratamientos{
    padding: 20px 50px;
    display: flex;
    justify-content: center;
    font-family: 'Poppins', sans-serif;
    color:var(--morado);
    transform: translateY(150px);
    opacity: 0;
    transition: .5s all ease;
    
}
.tratamientos.active{
    transform: translateY(0);
    opacity: 1;
  }
.t-i{
    flex:1;
}
.t-i h1{
    display: flex;
    justify-content: center;
}
.t-i img{
    width: 30px;
}
.list-t{
    display: flex;
    height: 25vh;
    align-items: center;
    justify-content: space-around;
    color: var(--negro);
    margin-top: 70px;
}




.farmacologicos{
    padding: 20px 50px;
    display: flex;
    justify-content: center;
    font-family: 'Poppins', sans-serif;
    color:var(--morado);
    transform: translateY(150px);
    opacity: 0;
    transition: .5s all ease;
    
}
.farmacologicos.active{
    transform: translateY(0);
    opacity: 1;
  }
    
.f-i{
    flex:1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.f-i p{
    color: var(--negro);
    text-align:justify;
    padding: 15px 280px 0;
}


.consulta{
    transform: translateY(150px);
    opacity: 0;
    transition: .5s all ease;
    
}
.consulta.active{
    transform: translateY(0);
    opacity: 1;
  }


.consulta h1{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 0px 0px 0px;
    font-family: 'Poppins', sans-serif;
    color: var(--morado);
    font-size: 3em;
    font-weight: 800;
}
.consultas{
height: 100vh;
display: flex;
padding: 60px 80px ;
justify-content: space-between;
font-family: 'Poppins', sans-serif;
background-image: url(../src/wave.svg);
background-repeat: no-repeat;
background-position-y: 530px;
position: relative;
z-index: 0;

}
.consultas h3{
    font-size: 2em;
    padding: 20px;
    font-weight: 800;
    text-align: center;
    color: var(--azul-marino);
}
.consultas h4{
    font-size: 2.0em;
    text-align: center;
    font-weight: 900;
    padding: 50px;
}
.consultas li{
    font-family:'Poppins', sans-serif;
    font-size: 1.5em;
    padding: 15px;
    list-style-position: inside;
    color: var(--negro);
}
.c-i{
    background-color: rgba(113, 0, 141, 0.3) ;
    border-radius: 20px;
    width: 40%;
    height: 100%;
}
.c-i h4{
    
    padding: 140px 0 0 0;
}
.c-d{
    background-color: rgba(113, 0, 141, 0.3) ;
    border-radius: 20px;
    width: 40%;
    height: 100%;
}




footer{
    height:34vh;
    display: grid;
    grid-template-columns: 33% 33% 33%;
    padding: 20px 20px;
    font-family:'Poppins', sans-serif;
    background-color: var(--azul);  
    position: relative;
    z-index: 1;
}
.fo-i{
    display: flex;
    align-items: left;
    flex-direction: column;

    
}
.fo-i img{
    width: 35px;
    margin-right: 20px;
}
.desc{
    padding: 20px 0;
    font-size: 1.1em;
    font-family:'Poppins', sans-serif;

}
.fo-i h1{
}
.fo-c{
    font-family:'Poppins', sans-serif; 
    
}
.dir{
    font-family:'Poppins', sans-serif; 
    font-size: 1.1em;
    padding: 20px 0px;
}
.fo-d{

}
.fo-d iframe{
    width: 100%;
    height: 100%;
}


.img{
    display: flex;
    
}
footer h2{
    font-size: 1em;
    color:white;
}
.derechos{
    grid-column: 1/4;
    text-align: center;
    font-family:'Poppins', sans-serif; 
}