body {
 /* foont-family: 'Indie Flower', cursive;*/
  font-family: 'Comic Neue', cursive;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color:#FFFFFF;
  margin  : 0px;
  background : #222;
}
.bg { 
	background-image: url("../img/background-azul.png");
	/* Para dejar la imagen de fondo centrada, vertical y horizontalmente */
	background-position: center center;
	/* Para que la imagen de fondo no se repita */
	background-repeat: no-repeat;
	/* La imagen se fija en la ventana de visualización para que la altura de la imagen no supere a la del contenido */
	background-attachment: fixed;
	/* La imagen de fondo se reescala automáticamente con el cambio del ancho de ventana del navegador */
	background-size: cover;
	/* Se muestra un color de fondo mientras se está cargando la imagen de fondo o si hay problemas para cargarla */
	background-color: #66999;
}
.login{
	display: flex;
  	align-items: center;
  	justify-content: center;
  	min-height: 100vh;
}
#cont {
	justify-content: center;
	align-items: center;

	
	width: 100%;
}
#contCitas {
	padding    : 10px;
	font-family: 'Comic Neue', cursive;
	font-family: 'Montserrat', sans-serif;
	font-size: 12px;
  	border  : 2px solid #656565;
  	border-radius: 5px;
  	background   : #dadada;
  	color   : #dadada;
  	cursor : pointer;
	margin-left:25%;
	margin-right:25%;
}
#cita{
    border-bottom: 1px solid #656565;
    color: #656565; /*#8c8c8c;*/
    background: #dadada;
    padding: 15px;
}
h1, h2, #form_usuario, #form_password, .button, .fecha, .centrar {
  text-align:center;
}
#dialog-message, #dialog-message2, .ui-dialog-title{
  font-family: 'Comic Neue', cursive;
font-family: 'Montserrat', sans-serif;
font-size: 15px;
  text-align:center;
}
.titulo h1{
	  font-size: 90px;
	  margin-top:25px;
	  text-shadow: 2px 2px 1px #444;
	  font-weight:100;
}
.titulo h2{
	  font-size: 2em;
	  text-shadow: 2px 2px 1px #444;
}
#nav{
    width: 100%;
    display: flex;
    align-content: center;
    justify-content: center;
	margin:5px;
}
#nav input{
	width:50px;
	text-align: center;
    padding: 5px;
	
}
.siguiente{
	float:right;
	width:33%;
	margin-top:-20px;
}
.anterior{
	float:left;
	width:33%;
	margin-top:-20px;
}

input[type= "checkbox" ]{
  width: 1em;
  height: 1em; 
}

select, input {
  font-family: 'Comic Neue', cursive;
font-family: 'Montserrat', sans-serif;
font-size: 1em;
  border  : 1px solid #ffffff;
  border-radius: 5px;
  padding : 0 10px;
  margin  : 1em;
  width   : 240px;
  color   : #fff;
  background: none;
}
input:focus, textarea:focus{
  background   : rgba(0,0,0,.1);
  border-radius: 5px;
  outline      : none;
}
select, input {
    height: 2.5em; /* for IE */
    vertical-align: middle; /* This is optional but it makes legacy IEs look better */
}

button {
  margin-top : 40px;
  padding    : 10px;
  font-family: 'Comic Neue', cursive;
font-family: 'Montserrat', sans-serif;
font-size: 1em;
  border  : 2px solid #ffffff;
  border-radius: 5px;
  background   : none;
  color   : #fff;
  cursor : pointer;
  text-align:center;
  

-webkit-transform: rotate(-1.5deg);
   -moz-transform: rotate(-1.5deg);
    -ms-transform: rotate(-1.5deg);
     -o-transform: rotate(-1.5deg);
        transform: rotate(-1.5deg);
}

button:after {
  /*content: " >>>";*/
}

button:hover,
button:focus, .cerrar:hover, .cerrar:focus {
  outline   : none;
  background: #fff;
  color   : #000;
}

.cerrar{
  display:block;
  position: relative;
  width  : 100px;
  margin : 0 auto;
  margin-top : 40px;
  padding    : 10px;
  font-family: 'Comic Neue', cursive;
font-family: 'Montserrat', sans-serif;
font-size: 1em;
  border  : 2px solid #ffffff;
  border-radius: 5px;
  background   : none;
  color   : #fff;
  cursor : pointer;
  text-align:center;

-webkit-transform: rotate(-1.5deg);
   -moz-transform: rotate(-1.5deg);
    -ms-transform: rotate(-1.5deg);
     -o-transform: rotate(-1.5deg);
        transform: rotate(-1.5deg);

}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #fff;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #fff;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #fff;
}

hr {
	width:50%;
	border: 2px solid #fff; 
	border-radius: 300px/10px; 
	height: 0px; 
	text-align: center;}
.info{
    margin-left: auto;
    margin-top: auto;
}

.fecha{
	padding: 10px;
}


@media only screen and (min-width : 100px) and (max-width : 520px) {
.info{
    margin-top: auto;
}
/*Boton VER formulario seleccionar fecha */
#ver{
	margin: 10px 0px;
}

#contCitas {
	margin-left:5%;
	margin-right:5%;
}

#cita{
    padding: 5px;
}

.titulo h2{
	  font-size: 1.3em;
}

}


.form-cont{}
.button{}