/* Estilos generalales para centrar y decorar el formulario */

.formulario {
  width: 100%; 
  max-width: 600px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  
}
/* con este codigo dividimos el formulario en dos columnas con los dos fieldset que he colocado en el form */
form fieldset {
  float: left;
  width: 48%;
}

/* Estilos para los Labels del formulario */
label {
  font : .8em "typewriter", sans-serif;
  font-weight:bold;
  font-style:italic;
  line-height:15px;
  letter-spacing:3px;
  text-decoration:underline;
  text-transform:capitalize;
}
form div{
   color:red; 
   font-size:12px;
   font-family:Arial;
   font-weight:bold;
   line-height:15px;
   letter-spacing:2px;
   text-transform:capitalize;
   
}
/* Estilos para el boton del formulario */
input{
    font    : 1.4em/1.5em "handwriting", cursive, sans-serif;
    
    padding :6px;
    margin  : 0;
    width   : 80%;
    background : none;
    
}
/* estilo al apretar el boton */
input:focus{
    background   : rgba(0,0,0,.1);
    border-radius: 5px;
}

/* Estilos para los selects del formulario */
.select-css {
 /* con esta propiedad appearance los navegadores ya no le daran un aparencia por defecto a los select */    
 appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	
	/* para que aparezca la imagen de flecha que selecciono en el desplegable */
    background: url("flechaabajo.png") no-repeat right #fff;
    
 /* codigo para personalizar el select */
    max-width: 250px;
    margin:10px;
	position: relative;
	display: inline-block;
	width: 100%;
	cursor: pointer;
  	padding: 7px 10px;
  	height: 42px;
  	outline: 0; 
  	border: 0;
	border-radius: 0;
	background: #f0f0f0;
	color: #7b7b7b;
	font-size: 1em;
	color: #999;
	font-family: 
	'Quicksand', sans-serif;
	border:2px solid rgba(0,0,0,0.2);
    border-radius: 12px;
    position: relative;
    transition: all 0.25s ease;
}

/* códico para eleminar la flecha por defecto del desplegable */
.select-css:-ms-expand {
    display: none;
}
 
.select-css select:hover{
	background: #B1E8CD;
}