body{
   background:  url('/ASSETS/IMG/fondo.webp') rgba(6, 3, 3, 0.6) !important; 
   background-blend-mode: multiply;
   background-position: center;
   background-size: cover;
   background-repeat: repeat;
}

body::-webkit-scrollbar {
   display: none;
}

#titulo {
   font-family: 'Overlock', serif;
   font-weight: 700;
   font-size: 3rem !important;
   color: #98BF3E !important;
   text-align: center;
   margin-top: 1.5rem !important;
} 

h5 {
   font-family: 'Overlock', serif !important;
   font-weight: 700;
   font-size: 2rem !important;
   color: #98BF3E !important;
   text-align: center;
   margin: 20px 0;
}

#mainContainer {
   display: flex;
   justify-content: space-between;
   align-items: stretch;
   padding: 20px;
   /* margin: 40px auto; */
   max-width: 1800px;
   gap: 20px;

}

#contactanosDatos,
#formularioDatos {
   background-color: #222;
   border-radius: 10px;
   padding: 20px;
   width: 48%;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
   min-height: 400px
}

#contactanosDatos h5,
#contactanosDatos p {
   display: inline;
}

#contactanosDatos h5 {
   font-family: 'Overlock', serif;
   color: white;
   margin-right: 5px;
}

#contactanosDatos p {
   font-family: 'Montserrat', sans-serif;
   font-size: 1.5rem;
   color: white;
}

p, label, input, textarea, button {
   font-family: 'Montserrat', sans-serif;
   color: white;
}

.form-control {
   background-color: black !important;
   color: white !important;
   border: 2px solid green;
   padding: 10px;
   border-radius: 5px;
}

.form-control::placeholder {
   color: #ccc !important;
   opacity: 1;
}

.form-control:focus {
   background-color: black;
   color: white;
   outline: none;
   border-color: #98BF3E;
}

.form-label {
   color: rgb(253, 252, 252);
}

#contactanosDatos {
   display: flex;
   flex-direction: column;
   align-items: center;
}

#contactanosDatos iframe {
   margin-top: 10px;
   height: auto;
   aspect-ratio: 1 / 1;
   border-radius: 15px;
   margin-bottom: 10px;
}

@media (max-width: 768px) {
   #mainContainer {
      flex-direction: column;
      align-items: center;
   }

   #contactanosDatos,
   #formularioDatos {
      width: 100%;
      margin-bottom: 20px;
   }

   h1 {
      font-size: 30px;
   }

   #contactanosDatos iframe {
      margin-top: 10px; 
      height: 90%;
      width: 90%;
   }
}

#alertaFormulario {
   position: fixed;
   top: 5%;
   left: 50%;
   transform: translateX(-50%); 
   width: auto;
   max-width: 90%;
   text-align: center;   
}