* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root{
  scroll-behavior: smooth;
}


@font-face {
  font-family: 'Poppins-Bold';
  src: url(../Fuentes/Poppins-Bold.ttf) format("truetype");
}
@font-face {
  font-family: 'Poppins-ExtraBold';
  src: url(../Fuentes/Poppins-ExtraBold.ttf) format("truetype");
}
@font-face {
  font-family: 'Poppins-Light';
  src: url(../Fuentes/Poppins-Light.ttf) format("truetype");
}
@font-face {
  font-family: 'Poppins-Regular';
  src: url(../Fuentes/Poppins-Regular.ttf) format("truetype");
}
@font-face {
  font-family: 'Poppins-SemiBold';
  src: url(../Fuentes/Poppins-SemiBold.ttf) format("truetype");
}

.contenedorbg{
  max-width: 1280px;
  width: 90%;
  margin:auto;
}

body {
  font-family: 'Poppins-Regular';
  background-color: #F0F2E3;
  font-size: 80%;
}

.titulo_1{
    font-size: .9em;
}

.contenedor {
  padding: 60px 0;
  width: 90%;
  max-width: 100%;
  margin: auto;
  overflow: clip;
}

/* Header */

header {
  width: 100%;
  height: 100vh;
  background-image: url(../imagenes/fondo1.png);
  background-size: cover;
}



h1{
    font-size:20%;
    color:red;
}





@media screen and (max-width:768px){

/*header*/

  header {
    width: 100%;
    height: 100vh;
    background-size: cover;
  }

  .logo img{
    width: 140px;
    padding: 10px 0 0 10px;
  }

  .contenedor_header{
    justify-content: center;
    padding-top: 160px;
  }

/*sobre-nosotros*/

  .contenedor-sobre-nosotros{
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .imagen-about-us{
    width: 492px;
  }

  .sobre-nosotros{
    width: 90%;
  }

  .contenido-textos{
    text-align: left;
    width: 70%;
    padding-top: 30px;
  }

/*Modalidades*/

.contenido-texto p{
  width: 100%;
  font-size: .9em;
}

.contenido-texto{
  width: 100%;
}

.marcador1 img{
  width: 25px;
  padding-top: 15px;
}

.marcador2 img{
  width: 25px;
  padding-bottom: 15px;
}

  /*nav-bar*/

  nav{
    position: absolute;
    top: 80px;
    left: 0;
    align-items: center;
    text-align: left;
    background: rgba(30, 60, 59, .66);
    width: 100%;
    height: 180px;
    z-index: 1;
    padding: 10px 0 10px 10px;
    display: none;
    flex-direction: column;
    align-items: flex-start;

  }

  nav > a{
    color:#fff;
    font-weight: 300;
    text-decoration: none;
    font-size: .8em;
    display: flex;
    flex-direction: column;
    padding-bottom: 5px;
  }

  .contenedor-nav-logo{
    height: 80px;
  }


  nav > a:hover{
    text-decoration: none;
    color: #E5B7E4;
  }

  .menu-icon{
    display: block;
    padding: 0 30px 0 0;
    width: 60px;
  }


/*motivos*/

.lista-motivos1 li{
  font-size: 1em;
}

.lista-motivos2 li{
  font-size: 1em;
  padding-left: 40px;
}

/*contacto*/

.contactanos{
  display: flex;
  flex-direction: column;
}

.mail{
  padding-left: 0px;
}

.titulos-contacto{
  padding-bottom: 5px;
}
.titulos-contacto-2{
  padding-bottom: 5px;
}

.siguenos{
  width:40%;
}

.contenedor-redes2{
  align-items: baseline;
}

.redes{
  padding-bottom: 3px;
}

}

@media screen and (max-width:500px){

  /*header*/

    header {
      width: 100%;
      height: 100vh;
      background-image: url(../imagenes/fondo2.jpg);
      background-size: cover;
    }

    .contenedor-nav-logo{
      height: 80px;
    }

    nav > a{
      padding-bottom: 5px;
    }


      /*sobre-mosotros*/

    .contenedor-sobre-nosotros{
      width: 100%;

    }

    .contenedor-devenir{
      width: 80%;
    }

    .contenedor_titulos{
      width: 100%;
      display: flex inline;
      align-items: baseline;
    }

    .titulo-about-us{
      width: 50%;
      padding: 0px 0px 10px 0px;
      font-size: 1.4em;
      font-weight: SemiBold;
      text-align: right;

      color: #004F5B;
    }

    .titulo-about-us-2{
      width: 50%;
      padding: 0px 0px 10px 7px;
      font-size: 1.4em;
      font-weight: ExtraBold;
      text-align: left;
      color: #7C5076;
    }

    .contenido-textos{
      width: 85%;
      padding-top: 0px;
    }

    .Sobre-nosotros .titulo_2{
      font-size: 2em;
      padding-top: 40px;
    }

    .imagen-sobre-nosotros svg{
      width: 75px;
    }

    #esp_1{
      display: none;
    }

      /*Servicios*/

      .contenedor-servicios{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
      }

      .servicio h4{
        font-size: .9em;
      }

      .Servicios img{
        width: 60px;
        padding-bottom: 0px;
      }

      #servicio2 {
        width: 40px;
        padding-bottom: 40px;
      }
      .contenedor-servicios #servicio2 {
        width: 100%;
        padding-bottom: 40px;
      }

      .servicio{
        padding-bottom: 40px;
      }

      .leyenda{
        width: 100%;
        display: flex;
        justify-content: center;

      }

      .leyenda p{
        width: 80%;
        margin: 0;
        font-size: .48em;
      }

      .red img{
        width: 42px;
      }

      .Servicios .titulo_3{
      font-size: 2em;
    }

    /*Modalidades*/

    .contenedor-modalidades{
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .modalidad {
      width: 100%;
      padding-bottom: 30px;
    }

    .contenido-texto{
      width: 100%;
      display: flex;
      justify-content: center;
    }

    .contenido-texto p{
      width: 65%;
      text-align: left;
      padding-left: 10px;
    }

    .imagen-modalidad img{
      width: 65px;
    }

    .modalidad2 {
      width: 100%;
    }

    .Modalidades .titulo_2{
      font-size: 2em;
    }

    .marcadores{
      height: 130px;
      padding: 0px;
    }

    .marcador1 img{
      width: 25px;
      padding-top: 5px;
    }

    .marcador2 img{
      width: 25px;
      padding-top: 35px;
    }



    /*Motivos*/
    .contenedor-motivos{
      width: 100%;
      display: flex;
      flex-direction: column;
      padding-top: 40px;
    }

    .contenedor-lista-motivos{
      width: 90%;
      display: flex;
      flex-direction: column;
    }

    .lista-motivos1{
      width: 100%
    }
    .lista-motivos2{
      width: 100%
    }

    .lista-motivos2 #esp_2{
      display: none;
    }

    #esp_3{
      display: flex;
    }

    .imagen-motivos svg{
      width: 75px;
    }

    #titulo_3_m{
      display: none;
    }

    .titulo_3b{
      display: flex;
      color: #E5B7E4;
      font-size: 1.7em;
      text-align: center;
    }

    .marcador1 img{
      width: 25px;
    }

    .marcador2 img{
      width: 25px;
    }

    #m-agua1{
      display: none;
    }

    #m-agua2{
      display: flex;
      justify-content: flex-end;
    }

    #m-agua2 img{
      width: 220px;
    }

    .marca-agua{
      width: 100%;
      display: flex;
      justify-content: flex-end;
      padding-top: 600px;
      padding-right: 20px;
    }

/*Preguntas*/

.contenedor-preguntas{
  display: flex;
  flex-direction: column;
  padding: 30px 0px 0px 0px;
}

#titulo_2_p{
  display: none;
}

.titulo_2b{
  display: flex;
  color: #FF805A;
  font-size: 1.7em;
  text-align: center;
}
.imagen-pregunta{
  padding-bottom: 10px;
}

.imagen-pregunta svg{
  width: 75px;
}

.listado-preguntas{
  width: 100%;
}

.listado-preguntas hr{
  width: 100%;
}

.pregunta{
  width: 100%;
}



/*CONTACTO*/

.Contacto{
  padding-top: 70px;
}

.contenedor-redes2{
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 40px;
}

.llama-escribenos{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.mail{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.contactanos{
  display: flex;
  align-items: center;
}

#contactanos{
  padding: 0px;
  height: 50px;
}
#mail{
  padding: 0px;
  height: 50px;
  margin-top: 20px;
}


}
