@import "main.css";

/*Seccion 1 Banner */
.seccion-cont {
  margin-top: 79px;
  width: 100vw;
}

.banner1-cont {
  display: flex;
  flex-direction: row;
}

/*.img-banner-cont {
  transform: translateX(-56px);
}*/

.img-banner-cont img {
  max-width: 100vw;
}

.titulo-alka {
  background: #F6E100;
  color: black;
  font-size: 30px;
  width: 9em;
  text-align: center;
  transform: translate(60px, -60px);
}

@media screen and (max-width:1227px){
  .img-banner-cont{
    transform: translate(0,-16px);
  }
  .titulo-alka {
    width: 10em;
    font-size: 22px;
    transform: translate(10px, -60px);
  }
}

/* Historia Intro*/

.historia {
  text-align: justify;
  padding: 0 100px;
}

@media screen and (max-width:1227px){
  .historia{
    margin-top: -60px;
    padding: 20px;
  }
}
/* Seccion 2 Formulario */

.formulario-s{
  display: flex;
}

.info-contacto{
  background: #999999;
  text-align: center;
  padding: 30px;
  margin-left: 60px;
}

.formulario-form{
  padding: 0 80px;
}

.input-class{
  background: #ebebeb;
  border: 1px solid #dadada;
  border-radius: 5px;
  padding: 10px;
  width: 60vw;
}

.i-txt-a{
  background: #ebebeb;
  border: 1px solid #dadada;
  border-radius: 5px;
  padding: 10px;
  resize: none;
  width: 60vw;
  height: 150px;
}

.btn-enviar-form{
  background: #F6E100;
  border: none;
  color: black;
  font-size: 25px;
  padding: 5px 20px;
  cursor: pointer;
  transition: .4s;
}

.btn-enviar-form:hover{
  background: #d3c207;
}

@media screen and (max-width:1227px){
  .info-contacto{
    margin-left: 0px;
  }
  .formulario-s{
    display: flex;
    flex-direction: column;
  }
  .formulario-form{
    margin-top: 50px;
  }
}

/* Mapa */

.mapa-contacto {
  margin-left: 0px;
  padding: 30px;
}

@media screen and (max-width:1227px) {
  .mapa-contacto{
    padding: 16px;
  }  
}