@charset "ISO-8859-1";



#cardFechaReservaContainer{
	/*border: 1px solid;*/
	width: 300px;
	margin: 0 auto;
	/*text-align: center;*/
}
#cardContainer{
	/*border: 1px solid;*/
	width: 100%;
}
#preloaderContainer{
	position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    z-index: 1000;
}

#preloaderDivContainer{
	/*border: 1px solid black;*/
	margin-top: 49%;
	 
}

#idBtnAnularAceptarContainer{
	margin: 0 auto;
	border: 1px solid;
}
#idLinkPDFContainer{
	margin-bottom: 20px;
	margin-top: 20px;
}

.classLoaderAnulacion{
	margin-top: 20px;
	/*border: 1px solid;*/
}

#buttonAnularContainer{
	/*border: 1px solid;*/
	margin-top: 20px;
	margin-bottom: 20px;
	margin: 0 auto;
}

.classBtnAgendarContainer{
	margin-bottom: 20px;
}


.classStepContainer{
	/*border: 1px solid;*/
	width: 90%;
}
#idAlertSeleccionOficina{
	margin-top: 10px;
}

#idTextoCargandoLoader{
	font-size: 10px;
	margin-top: 10px;
	margin-bottom: 20px;
	
}

#idHorasDisponiblesLoaderContainer{
	text-align: center;
	margin-top: 20px;
}
#idBuscarOficinaLoaderContainer{
	text-align: center;
	margin-top: 20px;
	margin-bottom: 20px;
}
#idSeleccionLoaderContainer{
	text-align: center;
	margin-top: 20px;
}
#idBuscarHoraLoaderContainer{
	text-align: center;
	margin-top: 20px;
}
#idAnularLoaderContainer{
	text-align: center;
	margin-top: 20px;
}
.card{
	margin-bottom: 20px;
}

#idTextoProximasHorasDisponibles{
	margin-bottom: 20px;
	text-align: center;
}

#idTextoPreguntaSeleccionaOficina{
	margin-top: 20px;
	margin-bottom: 10px;
}

#idBtnBuscarContainer{
	margin-top: 20px;
	margin-bottom: 100px;
}


#idSeleccionOficinaContainer{
	width: 90%;
	margin: 0 auto;
	text-align: center;
}

#idSolicitudContainer{
		width: 90%;
	margin: 0 auto;
	margin-bottom: 20px;
	text-align: center;
}

#idSeleccionFechaContainer{
			width: 90%;
	margin: 0 auto;
	margin-bottom: 20px;
	text-align: center;
}

.titleContainer{
	margin-bottom: 40px;
	margin-top: 20px;
}

#formularioMainContainer{
	width: 90%;
	/*border: 1px solid;*/
	margin: 0 auto;
}

.container{
    
    height:100px;
}

.progresses{
    	display: flex;
        align-items: center;
   }
   
   #idHorasDisponiblesMainContainer{
   margin-top: 20px;
   }
   
/*mobile*/
@media only screen and (max-width: 768px) {
	   .lineOK{
	    width: 0px;
	    height: 6px;
	    background: #005ea9;
	   }
	   .lineNOK{
	    width: 0px;
	    height: 6px;
	    background: #A5A5A5;
	   }
	   
	   #idHorasDisponiblesContainer{
		width: 325px;
		margin: 0 auto;
		margin-bottom: 20px;
		margin-top: 20px;
		/*border: 1px solid;*/
		}
		
	    .stepsOK{
		    display: flex;
		    background-color: #005ea9;
		    color: #fff;
		    font-size: 10px;
		    width: 70px;
		    height: 70px;
		    align-items: center;
		    justify-content: center;
		    border-radius: 50%;
		    cursor:pointer 
		   }
		   
		
		
		   
		 .stepsNOK{
		    display: flex;
		    background-color: #A5A5A5;
		    color: #fff;
		    font-size: 10px;
		    width: 70px;
		    height: 70px;
		    align-items: center;
		    justify-content: center;
		    border-radius: 50%;
		    /*cursor:pointer*/
		   }
		   
		   
		
}
/*desktop*/
@media only screen and (min-width: 768px) {
	   .lineOK{
	    width: 60px;
	    height: 6px;
	    background: #005ea9;
	   }
	   .lineNOK{
	    width: 60px;
	    height: 6px;
	    background: #A5A5A5;
	   }
	   
	   #formularioMainContainer{
			width: 700px;
			/*border: 1px solid;*/
			margin: 0 auto;
		}
		
		#idHorasDisponiblesContainer{
			width: 625px;
			margin: 0 auto;
			margin-bottom: 20px;
			margin-top: 20px;
			/*border: 1px solid;*/
		}
		
		   .stepsOK{
		    display: flex;
		    background-color: #005ea9;
		    color: #fff;
		    font-size: 14px;
		    width: 85px;
		    height: 85px;
		    align-items: center;
		    justify-content: center;
		    border-radius: 50%;
		    cursor:pointer 
		   }
		   
		
		
		   
		   .stepsNOK{
		    display: flex;
		    background-color: #A5A5A5;
		    color: #fff;
		    font-size: 14px;
		    width: 85px;
		    height: 85px;
		    align-items: center;
		    justify-content: center;
		    border-radius: 50%;
		    /*cursor:pointer*/
		   }
}

.nomDireccionOficinaCard{
	border: none;
	/*width: 350px;*/
}
   
