
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
  -moz-box-sizing:    border-box;
  -webkit-box-sizing: border-box;
  font-family: Verdana, Tahoma, sans-serif;  
}

h2 { /* TITULO DE FICHA DE INSCRIPCION */
  padding: 10px;
  font-size: 1.3rem;
  background-color: #58317b;
  color: aliceblue;
  text-align: center;
}

.encab {
  display:block;
  text-align: center;
  margin:auto;
  background-color: #fff;
  
}

.logocabeza {
  width: 70%;
}
.main { 
  width:70%;
  align-content: center;
  margin: 0 auto 0px;
  background-color: rgb(222, 176, 182);
}



/* AJUSTES GENERALES DEL FORMULARIO */
form {
  padding: 15px 10% 15px; 
  text-align: center;
  font-size: 0.95rem; /* TAMAÑO DE FUENTE DEL FORMULARIO - etiquetas */
  background-color: rgb(221, 209, 209); /* COLOR FONDO FORMULARIO*/
}

form h3 {
  text-align: left;
  padding: 8px 2% 8px;
  margin-top:10px;
  color: aliceblue;
  background-color: #58317b;
  margin-bottom:10px;
  font-size: 1.05em;
  font-weight: 400;
}
/* AJUSTES DE FILA Y BLOQUE */
.fila { 
  padding: 0 2%;
}

.grupocampo {
  float: left;
  width: 50%;
  padding: 0 2%;
  min-width: 300px;
  text-align: left;
}

/* AJUSTES GENERALES DE CAMPOS DEL FORMULARIO */
.etiqform{ /* Etiqueta de los campos*/
  padding: 12px 0 4px;
  color: rgb(4, 4, 94);
}
.errorcampo { /*Mensaje error en campo*/
  font-size: 0.8rem;
  font-style: italic;
  color: red;
  margin-top: 3px;
}

.Firefox  {
  font-size: 0.85rem;
}


.asterisco{ /* Color del asterisco */
  color: red;
}
form input{
  height: 30px;
  width: 100%;
  padding-left: 5px;
  font-size: 1em;
}


.grupoopciones{ /*PARA SEPARACION SUPERIOR DEL GRUPO OPCIONES*/
  margin-top: 8px;
}

form select{
  height: 30px;
  width: 100%;
  padding-left: 5px;
  font-size: 1em;
}

/* SEPARADOR GRUPOS DE DATOS 1. 2. */
.separador {
  padding: 0 2%;
  height: 20px;
}

.recuperar {
  clear: both;
}

/* ESTILOS BOTONES */
.boton{
	border:1px solid navy;
  border-radius: 6px;
} 
.boton:hover{background: navy; color:#fff; border:1px solid navy;}

/* ESTILOS CAMPOS VALIDOS E INVALIDOS */
input:valid, select:valid {
  /* background: #fff !important; */
  border-color: transparent;
}
input:invalid, select:invalid {
  /* background: #f8d1d1 !important; */
  box-shadow: none !important;
}


/* AJUSTES DE MEDIA */
@media screen and (max-width: 1200px){
  .grupocampo {
    float: left;
    width: 100%;
    padding: 0 2%;
    min-width: 300px;
   }
   form h3 {
    width: 100%;
   }

}

@media screen and (max-width: 820px){
  .main{
    width: 100%;
    align-content: center;
  }
  .logocabeza {
    width: 100%;
  }
  form {
    padding: 15px 10% 15px;
  }

  .header {
    padding: 0 5%;
  }
  .encab {
    display:block;
    text-align: center;
    margin:auto;
    width: 100%;
  }

}

@media screen and (max-width: 630px){
  h2 {
    font-size: 17px;
  }
  form {
    padding: 15px 0 15px;
    margin-left: auto;
    margin-right: auto;
  }
  .logocabeza {
    width: 100%;
  }
  .tituform {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
  }
  .fila {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
  }
  .separador{
    width: 95%;
    margin-left: auto;
    margin-right: auto;
  }
  form h3 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  h1 {
    font-size: 2vh;
  }
  .grupocampo {
    float: left;
    width: 100%;
    padding: 0 2%;
    min-width: 100px;
   }


}
