/* Navbar */
.navbar-toggler{
  border: 0;
}
.navbar-toggler:focus{
  box-shadow: 0 0 0 0;
}
.nav-link{
  color: #fff;
}
/* Main content div with top padding for navbar */
div#main{
  padding-top:80px;
  height: 450px;
  text-align: center;
}
/* General */
img.full{
  width: 100%;
  max-width: 850px;
}
img.decor{
  width: 100%;
  height: 550px;
}
img.my{
  margin: 20px auto;
}
.block{
  display: block;
}
.center{
  text-align: center !important; 
}
/* Promoción */
div#promocion{
  background-color: #0B5FDA;
  padding: 10px 0;
  /*cursor: pointer;*/
}
div#promocion h1{
  color: #fff;
  font-family: 'Overlock', cursive;
  font-size: 17px;
  max-width: 90%;
  margin: 0 auto;
  text-transform: uppercase;
}
div#promocion p{
  color: #fff;
  font-size: 14px;
  max-width: 90%;
  margin: 5px auto 0 !important;
}
/* Aprende */
div#aprende{
  background-color: #fff;
  text-align: center;
}
div#aprende h1{
  color: #333;
  font-family: 'Overlock', cursive;
  font-size: 35px;
  padding: 25px 10px 0;
  max-width: 90%;
  margin: 0 auto;
}
div#aprende p{
  color: #333;
  font-size: 16px;
  padding: 10px 0 0 0;
  max-width: 90%;
  margin: 0 auto;
}
button#precios{
  margin: 45px auto 60px;
  padding: 10px 15px;
}
/* Conoce nuestros Servicios */
div#conoce_servicios{
  background: #cee2ff;
  text-align: center;
  margin: 0 0;
  padding: 35px 0;
}
div#conoce_servicios h1{
  color: #000;
  font-family: 'Overlock', cursive;
  font-size: 20px;
  padding: 0px 0 35px 0;
  margin: 0 auto 0;
  max-width: 90%;
}
button#ir_servicios{
  margin: 20px auto 0px;
  padding: 10px 15px;
}
/* Mapa */
div#mapa{
  background: #fff;
  text-align: center;
  margin: 0 0;
  padding: 35px 0;
}
div#mapa h1{
  color: #333;
  font-family: 'Overlock', cursive;
  font-size: 26px;
  padding: 10px 0 10px 0;
  margin: 0 auto 0;
  max-width: 90%;
}
div#mapa p{
  color: #333;
  font-size: 16px;
  max-width: 90%;
  margin: 0 auto 10px;
}
a#mapa{
  margin: 20px auto 0px;
  padding: 10px 15px;
  width: 115px;
}
/* Precios */
div#precios{
  background: #fff;
  text-align: center;
  margin: 0 auto;
  padding: 0px 0px 35px;
  text-align: center;
}
div#precios h1{
  color: #333;
  font-family: 'Overlock', cursive;
  font-size: 22px;
  text-transform: uppercase;
  text-align: left;
  margin: 0 auto 20px;
  padding: 20px 25px 0;
}
div#precios h1.highlight{
  background-color: #ECEDEE;
  color: #090979;
  /*font-family: var(--bs-body-font-family);*/
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
  text-align: left;
  margin: 25px 0 0;
  padding: 10px 25px;
}
div#precios h2{
  color: #090979;
  font-family: 'Overlock', cursive;
  font-size: 20px;
  font-weight: bold;
  margin: 30px auto 10px;
  text-align: left;
  padding: 0 25px;
}
div#precios table{
  text-align: left;
  color: #333;
}
div#precios table th{
  padding: 10px 25px;
}
div#precios table td{
  padding: 10px 25px;
}
div#precios ul{
  color: #333;
  font-size: 16px;
  margin: 5px auto;
  text-align: justify;
  padding: 0 25px 0 40px;
}
div#precios p{
  color: #333;
  font-size: 16px;
  margin: 0px auto 0px;
  text-align: justify;
  padding: 0 25px;
}
/* Servicios */
div#servicios{
  background: #fff;
  text-align: center;
  margin: 0 auto;
  padding: 0px 10px 35px;
  text-align: center;
  width: 97%;
  max-width: 450px;
}
div#servicios h1{
  color: #333;
  font-family: 'Overlock', cursive;
  font-size: 22px;
  text-transform: uppercase;
  text-align: center;
  margin: 15px auto 20px;
  padding: 0px 25px 0px;
}
div#servicios p{
  color: #333;
  font-size: 18px;
  margin: 0px auto 0px;
  text-align: left;
}
div#servicios ul{
  color: #333;
  font-size: 18px;
  text-align: left;
}
div#servicios_imgs{
  background: #fff;
  text-align: center;
  margin: 0 auto;
  padding: 0px 0px;
  text-align: center;
  width: 100%;
}
div#servicios_imgs img{
  height: auto;
  width: 100%;
  margin: 0px auto;
}
/* Contacto */
div#contacto_main{
  background-color: #fff;
}
div#contacto{
  background: #fff;
  margin: 0 auto;
  padding: 0px 0px 55px;
  text-align: center;
  width: 90%;
  max-width: 450px;
}
div#contacto h1{
  color: #333;
  font-family: 'Overlock', cursive;
  font-size: 22px;
  text-transform: uppercase;
  text-align: center;
  margin: 0px auto 0px;
  padding: 40px 5px 30px;
}
div#contacto svg{
  margin: 0 10px 0 0;
}
div#contacto iframe{
  width: 100%;
  height: 200px;
}
div#escribenos{
  background: #fff;
  text-align: center;
  margin: 0 auto;
  padding: 0px 0px 35px;
  width: 90%;
  max-width: 450px;
}
div#escribenos h1{
  color: #333;
  font-family: 'Overlock', cursive;
  font-size: 22px;
  text-transform: uppercase;
  text-align: center;
  margin: 0px auto 0px;
  padding: 40px 5px 30px;
}
div#escribenos form{
  text-align: left;
}
/* Informes */
div#informes{
  background: #cee2ff;
  text-align: center;
  margin: 0 0;
  padding: 35px 0;
}
div#informes a{
  text-decoration: none;
  color:#000;
}
div#informes h1{
  color: #333;
  font-family: 'Overlock', cursive;
  font-size: 22px;
  margin: 20px auto 20px;
  max-width: 85%;
}
div#informes p{
  color: #333;
  font-size: 15px;
  max-width: 75%;
  margin: 35px auto 20px;
}
button.informes{
  background-color: #fff;
  margin: 20px auto 0px;
  padding: 10px 15px;
  min-width: 250px;
}
button.informes:hover{
  background-color: #fff;
}
button.informes:focus{
  background-color: #fff;
}
button.informes img{
  margin: 0 10px 0 0;
  width: 25px;
}
/* Flex Footer */
div#flexfooter{
  background-color: #fff;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  width: 100%;
}
/* Redes */
div#redes{
  background: #fff;
  text-align: center;
  margin: 0 0;
  padding: 25px 10px;
}
div#redes h1{
  color: #090979;
  font-family: 'Overlock', cursive;
  font-size: 20px;
  text-transform: uppercase;
  margin: 5px auto 25px;
}
a.red{
  width: 65px;
  margin: 5px auto;
  display: inline-block;
}
a.red img.social{
  margin: 5px 0px;
  height: 60px;
  padding: 5px 0px;
}
/* ADEN & ISSA */
div#adenissa{
  background: #fff;
  text-align: center;
  margin: 0 0;
  padding: 25px 10px;
}
div#adenissa h1{
  color: #090979;
  font-family: 'Overlock', cursive;
  font-size: 20px;
  text-transform: uppercase;
  margin: 5px auto 25px;
}
div#adenissa img.aden{
  height: 60px;
  margin: 10px 10px;
}
div#adenissa img.issa{
  height: 60px;
  margin: 10px 10px;
}
/* Info */
div#info{
  text-align: center;
  margin: 0 0;
  padding: 25px 0;
}
/* Footer */
footer{
  background-color: #090979;
  padding: 0px;
}
footer hr{
  color: #fff;
  margin: 0;
  padding: 0 0 5px 0;
}
footer p{
  color: #fff;
  font-size: 12px;
  margin: 0px auto;
  max-width: 95%;
}
footer a{
  color: #fff;
}

/*****************************
    MEDIA QUERIES - MAX 333
******************************/
@media only screen and (max-width:333px){
  /* Navbar Img */
  a.navbar-brand img{
    height: 40px !important;
  }
  /* Main Div */
  div#main{
    padding-top: 60px;
  }
}
/*****************************
    MEDIA QUERIES - MIN 768
******************************/
@media only screen and (min-width: 768px) {
  /* Navbar */
  nav div.container-fluid{
    width: auto;
  }
  /* Aprende */
  div#aprende p{
    font-size: 20px;
    max-width: 660px;
  }
  /* Conoce nuestros Servicios */
  div#conoce_servicios h1{
    font-size: 22px;
  }
  div#conoce_servicios img.full{
    width: 330px;
  }
  /* Mapa */
  div#mapa img.full{
    width: 660px;
  }
  div#mapa iframe{
    width: 660px;
    height: 220px;
  }
  /* Precios */
  div#precios div.col{
    display: inline-block;
    width: 40%;
    max-width: 580px;
    vertical-align: top;
    text-align: center;
  }
  div#precios div.ml{
    margin-left: 55px;
  }
  div#precios img.full{
    margin: 30px auto 0;
  }
  div#precios br{
    display: none;
  }
  div#precios h1{
    font-size: 26px;
    text-align: center;
  }
  /* Servicios */
  div#servicios_imgs img{
    width: 100%;
    max-width: 900px;
  }
}

/*****************************
    MEDIA QUERIES - MIN 915
******************************/
@media only screen and (min-width: 915px) { /*850*/
  /* Body */
  body{
    background-color: #eee;
  }
  /* Main Div */
  div#main{
    margin: auto;
    width: 80%;
  }
  /* Promoción */
  div#promocion{
    margin: 30px 0 0px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  div#promocion p{
    font-size: 16px;
    margin: 0;
  }
  /* Aprende */
  div#aprende img{
    margin-top: 60px;
    width: 100%;
    max-width: 850px;
  }
  /* Servicios */
  div#servicios_imgs img{
    margin-top: 60px;
    width: 100%;
    max-width: 850px;
  }
}

/*****************************
    MEDIA QUERIES - MIN 1255
******************************/
@media only screen and (min-width: 1255px) { /*Contacto side by side min*/
  /* Contacto*/
  div#contacto{
    display: inline-block;
    vertical-align: top;
    margin-left: 5%;
  }
  div#escribenos{
    display: inline-block;
    margin-right: 5%;
  }
}