@import url('set.css');

.contacto{
   width: 100%;
   height: 800px;
   margin: auto;
   display: flex;
   /* border: #84C7AC 2px solid; */
   /* background-color: #84C7AC; */
   background-image: url("../img/Contacto/contacto.webp");
   /* background-size: cover; */
   background-size: 100% 100%;
   /* background-repeat: no-repeat; */
   justify-content:center;
   padding: 5px 40px;
}

.imagen_fondo_contacto{
   width: 35%;
   background-image: url("../img/Contacto/contacto_codigo_digital.webp");
   background-size: 100% 100%;
}
.contactanos{
   width: 30%;
   display: flex;
   flex-direction: column;
   justify-content: center;
}
.contactanos p{
   font-family: "Mont_Ext_Bold";
   font-size: 5em;
   color: #366955e7;
   line-height: 70px;
}
.contactanos h3{
   margin: 30px 0 10px 0;
   font-family: "Mont_Ext_Bold";
}
.formulario_contacto{
   display: flex;
   flex-direction: column;

}

.input_contacto{
   background-color: #84C7AC;
   padding: 10px;
   margin-bottom: 10px;
   font-size: 1.05em;
}
.mensaje{
   padding: 10px;   
   font-size: 1.05em;
   letter-spacing: 1px;
   max-width: 100%;
   min-width: 100%;
   max-height: 150px;
   min-height: 150px;
   line-height: 1.5;
   background-color: #84C7AC;
}
.contacto_enviar{
   padding: 8px 40px;
   margin-top: 20px;
   margin-left: 20px;
   background-color: #517B6B;
   border-radius: 10px;
   color: #f2f2f2;
   font-family: "Mont_Medium";
   font-size: 1.2em;
}

@media only screen and (max-width : 1400px) {}
@media only screen and (max-width : 900px) {

   .contacto{
      width: 100%;
      height: auto;
      margin: auto;
      display: flex;
      
      
      justify-content:center;
      padding: 30px 10px;
   }
   
   .imagen_fondo_contacto{
      display: none;
      /* width: 45%; */
      background-image: url("../img/Contacto/contacto_codigo_digital.webp");
      background-size: 100% 100%;
   }
   .contactanos{
      width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
   }
   .contactanos p{
      font-family: "Mont_Ext_Bold";
      font-size: 3em;
      color: #366955e7;
      line-height: 40px;
   }
   .contactanos h3{
      margin: 30px 0 10px 0;
      font-family: "Mont_Ext_Bold";
   }
   .formulario_contacto{
      display: flex;
      flex-direction: column;
   
   }
   
   .input_contacto{
      background-color: #84C7AC;
      padding: 15px;
      border-radius: 15px 0 0 0;
      margin-bottom: 10px;
      font-size: 1.05em;
   }
   .mensaje{
      padding: 10px;   
      border-radius: 15px 0 0 0;
      font-size: 1.05em;
      letter-spacing: 1px;
      max-width: 100%;
      min-width: 100%;
      max-height: 150px;
      min-height: 150px;
      line-height: 1.5;
      background-color: #84C7AC;
   }
   .contacto_enviar{
      width: 100%;
      padding: 5px;
      margin: 5px auto;
      text-transform: uppercase;
      font-size: 1.2em;
  }
   
}