/*------- TIPOGRAFIAS -------*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');

/*Bliss Pro*/
@font-face {
    font-family: 'Roboto', sans-serif;
  	font-weight: 700;
    src: url('/resources/fonts/autopase/BlissPro-Bold.eot');
    src: url('/resources/fonts/autopase/BlissPro-Bold.eot?#iefix') format('embedded-opentype'),
         url('/resources/fonts/autopase/BlissPro-Bold.woff') format('woff'),
         url('/resources/fonts/autopase/BlissPro-Bold.ttf') format('truetype'),
         url('/resources/fonts/autopase/BlissPro-Bold.svg#BlissPro-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*Bliss Regular*/
@font-face {
    font-family: 'Roboto', sans-serif;
  	font-weight: 400;
    src: url('/resources/fonts/autopase/BlissPro-Regular.eot');
    src: url('/resources/fonts/autopase/BlissPro-Regular.eot?#iefix') format('embedded-opentype'),
         url('/resources/fonts/autopase/BlissPro-Regular.woff') format('woff'),
         url('/resources/fonts/autopase/BlissPro-Regular.ttf') format('truetype'),
         url('/resources/fonts/autopase/BlissPro-Regular.svg#BlissPro-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*Standard Regular*/
@font-face {
    font-family: 'Standard-Regular';
    src: url('/resources/fonts/autopase/stan0755.eot');
    src: url('/resources/fonts/autopase/stan0755.eot?#iefix') format('embedded-opentype'),
         url('/resources/fonts/autopase/stan0755.woff') format('woff'),
         url('/resources/fonts/autopase/stan0755.ttf') format('truetype'),
         url('/resources/fonts/autopase/stan0755.svg#stan0755') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*------- GENERAL -------*/
body, html, h1, h2, h3, h4, h5, h6, p, a, ul, ol, li, img{
	padding: 0;
	border: none;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}
h1, h2, h3, h4, h5, h6, p, a{ -webkit-font-smoothing: antialiased; font-weight: normal; color: #fff;}
body{
	background-color: #FFF;
	margin-top: 0px;
}
a{ font-family: 'Roboto', Arial;
font-weight: 400; text-decoration: none; color: #43484a;}
p, li{
	font-family: 'Roboto', Arial;
font-weight: 400;
	font-size: 15px;
	line-height: 25px;
	color: #333;
}
input{ outline: none !important;}
input:focus{border: none !important;}
.ultimo{margin-right: 0px !important; padding-right: 0px !important; border: none !important;}
.primero{margin-left: 0px !important; padding-left: 0px !important;}
.linea{clear: both; width: 100%; height: 1px; margin: 10px 0px; background-color: #bfc0c4}
.franja{clear: both; width: 100%; height: 10px; margin: 10px 0px; background-color: #d2d3d7}
.clear {clear: both;}
/*CLEARFIX*/
/* IE6 */
* html .clearfix{ height: 1%; overflow: visible;}
/* IE7 */
*+html .clearfix{ min-height: 1%;}
/* Los otros */
.clearfix:after{clear: both; content: "."; display: block; height: 0; visibility: hidden; font-size: 0;}

h1{
	font-family: 'Roboto', Arial;
font-weight: 400;
	font-size: 40px;
	text-transform: uppercase;
	padding-top: 55px;
	margin-bottom: 60px;
}

h1 span{
	font-family: 'Roboto', Arial;
font-weight: 700;
}

h2{
	font-family: 'Roboto', Arial;
font-weight: 400;
	text-transform: uppercase;
	font-size: 21px;
	margin-bottom: 10px;
}

h3{
	font-family: 'Roboto', Arial;
font-weight: 400;
	font-size: 18px;
	margin-bottom: 10px;
	text-transform: uppercase; 
}

ul{
	list-style: none;
}

/*CLASES GENERALES*/
.info{
	background-repeat: no-repeat;
	float: left;
}

.info.doble{
	margin-top: 20px;
	width: 310px;
	background-position: left top;
	padding-left: 130px;
	min-height: 180px;
	margin-right: 100px;
}

.info.triple{
	width: 270px;
	margin-right: 85px;
	background-position: top center;
	background-repeat: no-repeat;
	padding-top: 90px;
}

.sombra{
	-webkit-box-shadow: 0px 2px 3px rgba(0,0,0,0.2) !important;
	box-shadow: 0px 2px 3px rgba(0,0,0,0.2) !important;
}

.masinfo{
	display: block;
	width: 227px;
	margin: 70px auto;
}

/*TOOLTIP*/
.ui-tooltip {
	padding: 10px !important;
	color: #3c4951 !important;
	border-radius: 3px !important;
	font: normal 11px 'Roboto', Sans-Serif !important;
	text-transform: uppercase;
	/*box-shadow: 0 0 10px #ccc !important;*/
	border: 1px solid #24475e !important;
}

/*CABECERA*/
#cabecera_wrap{
	background-color: #fff;
	position: relative;
	width: 100%;
	top: 0px;
	z-index: 99;
	-webkit-box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
	box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
}

#sombra_cabecera{
	background-color: #fff;
	position: fixed;
	width: 100%;
	height: 113px;
	top: 0px;
	z-index: 98;
	-webkit-box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
	box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
}

.cabecera{
	position: relative;
	width: 980px;
	height: 113px;
	margin: 0 auto;
}

.cabecera #logo_autopase{
	position: absolute;
	top: 0px;
	left: 0px;
	display: block;
}

/*UTILITARIOS*/
#utilitarios{
	position: absolute;
	right: 30px;
	top: 18px;
	display: none;
}



/*MENU PRINCIPAL*/
#menu_principal{
	right: 0;
	position: absolute;
	margin-left: 5px;
	bottom: 0px;
	display: none;
}



/*SUSCRIBETE*/
#suscribete_wrap{
	background-image: url(/resources/images/autopase/bg_suscribete.jpg);
	background-repeat: no-repeat;
	background-position: bottom center;
	height: 478px;
	width: 100%;
}

#suscribete_wrap #suscribete{
	width: 980px;
	height: 478px;
	margin: 0 auto;
	position: relative;
}

#suscribete_wrap #suscribete #flecha_suscribete{
	display: block;
	position: absolute;
	top: 20px;
	left: 45px;
	z-index: 2;
}

#suscribete_wrap #suscribete #btn_suscribete{
	display: block;
	position: absolute;
	top: 235px;
	right: 25px;
	z-index: 1;
}


#suscribete_wrap #suscribete .info{
	float: none;
	position: absolute;
	top: 32px;
	left: 6px;
	width: 460px;
}

#suscribete_wrap #suscribete .info p{
	font-family: 'Roboto', Arial;
font-weight: 700;
	text-shadow: 1px 1px rgba(0,0,0,0.8);
}

#suscribete_wrap #suscribete .info p span{
	font-size: 20px;
	text-transform: uppercase;
	font-style: italic;
}

/*BENEFICIOS*/
#beneficios_wrap{
	position: relative;
	width: 100%;
	background-color: #24475e;	
	background-image: url(/resources/images/autopase/portada/bg_beneficios.gif);
	background-position: 100% 0%;
	background-repeat: no-repeat;
	padding-bottom: 60px;
}

#beneficios_wrap #beneficios .flecha{
	position: absolute;
	top: -20px;
	left: 50%;
	margin-left: -40px;
	cursor: pointer;
}

#beneficios_wrap #beneficios{
	width: 980px;
	margin: 0 auto;
}

	#beneficios .info{
		width: 150px;
		margin-right: 28px;
		border-right: 1px solid #247088;
		min-height: 160px;
		padding-right: 28px;
		padding-top: 100px;
		background-position: 36px 0px;
		background-repeat: no-repeat;
	}

	#beneficios .info.auto{background-image: url(/resources/images/autopase/portada/ico_auto.gif);}
	#beneficios .info.estacionamiento{background-image: url(/resources/images/autopase/portada/ico_estacionamiento.gif);}
	#beneficios .info.tag{background-image: url(/resources/images/autopase/portada/ico_tag.gif);}
	#beneficios .info.monedas{background-image: url(/resources/images/autopase/portada/ico_monedas.gif);}
	#beneficios .info.ticket{background-image: url(/resources/images/autopase/portada/ico_ticket.gif);}

/*ACERCA DE AUTOPASE*/
#acerca_wrap{
	width: 100%;
	background-color: #c9333e;
	background-image: url(/resources/images/autopase/portada/bg_acerca.gif);
	background-position: 0% 90%;
	background-repeat: no-repeat;
	padding-bottom: 60px;
}

#acerca_wrap #acerca{
	width: 980px;
	margin: 0 auto;
	position: relative;
}

#acerca_wrap #acerca .flecha{
	position: absolute;
	top: -20px;
	left: 50%;
	margin-left: -40px;
	cursor: pointer;
}

	#acerca_wrap .info img{
		float: left;
		margin-right: 60px;
	}

	#acerca_wrap .info p{
		font-size: 20px;
		line-height: 35px;
		margin-top: 5px;
	}

/*SERVICIOS*/
#servicios_wrap{
	position: relative;
	width: 100%;
	background-color: #1ab0c2;
	background-image: url(/resources/images/autopase/portada/bg_servicios.gif);
	background-position: 100% 0%;
	background-repeat: no-repeat;
}

#servicios_wrap #servicios .flecha{
	position: absolute;
	top: -20px;
	left: 50%;
	margin-left: -40px;
	cursor: pointer;
}

#servicios_wrap #servicios{
	width: 980px;
	margin: 0 auto;
}

	#servicios .info img{
		float: left;
		margin-right: 60px;
	}

	#servicios .info p{
		font-size: 20px;
		line-height: 35px;
		margin-top: 5px;
	}

/*FOOTER*/
#footer_wrap{
	width: 100%;
	height: 170px;
	background-color: #383737;
}

#footer_wrap #footer{
	width: 980px;
	margin: 0 auto;
	padding-top: 30px;
}

#footer_wrap #footer #logo_footer{
	float: left;
	padding: 30px 20px 30px 0px;
	margin-right: 20px;
	border-right: 1px dotted #646363;
}

#footer_wrap #footer #info_footer{
	float: left;
}

	/*Utilitarios Footer*/
	#footer_wrap #footer #info_footer #utilitarios_footer{
	padding-bottom: 5px;
	margin-bottom: 5px;
	border-bottom: 1px solid #646363;
	padding-top: 10px;
	padding-right: 30px;
	display: none;
	}


	
	/*Copyright*/
	#footer_wrap #footer #info_footer p.copy{
		color: #b6b6b8;
		font-family: 'Roboto', Arial;
font-weight: 400;
		font-size: 8px;
		margin: 10px 0px;
	}

	/*Cybercenter*/
	#footer_wrap #footer #info_footer a#cyber{
		color: #646363;
		font-family: 'Roboto', Arial;
font-weight: 400;
		font-size: 8px;
		text-transform: uppercase; 
	}

	#footer_wrap #footer #info_footer a#cyber:hover{
		color: #fff;
	}.texto ul {
}
.texto ul li {
	list-style-type: disc;
	list-style-position: inside;
	font-weight: normal;
}


/*------- INTERIOR -------*/
#interior_wrap{
	position: relative;
	background-repeat: no-repeat;
	background-position: top center;
}

	/*Fondos*/
	#interior_wrap.servicios{
		background-color: #1ab0c2;
	}

	#interior_wrap.contacto{
		background-image: url(/resources/images/autopase/interior/contacto/bg_contacto.jpg);
	}

	#interior_wrap.preguntas_frecuentes, #interior_wrap.politicas_privacidad{
		background-color: #c9333e; 
	}

	/*Linea*/
	#interior_wrap .linea_interior{
		position: absolute;
		height: 1px;
		width: 100%;
		top: 70px;
	}

	#interior_wrap.servicios .linea_interior{
		background-color: #91d9e2;
	}

	#interior_wrap.contacto .linea_interior{
		background-color: #7f807e;
	}

	#interior_wrap.politicas_privacidad .linea_interior{
		background-color: #d45c65;	
	}

#interior_wrap #interior{
	width: 980px;
	margin: 0 auto;
	padding-bottom: 50px;
	background-repeat: no-repeat;
}

	/*Fondos*/
	#interior_wrap.servicios #interior{
		background-image: url(/resources/images/autopase/interior/bg_contenido_servicios.gif);
		background-position: 325px 5px;
	}

	#interior_wrap.preguntas_frecuentes #interior, #interior_wrap.politicas_privacidad #interior{
		background-image: url(/resources/images/autopase/interior/bg_contenido_preguntas.gif);
		background-position: 5px 5px;
	}

#interior_wrap #interior h1{
	margin-bottom: 5px;
	padding-top: 0px;
	font-size: 28px;
	text-transform: none;
	color: #333;
}

#interior_wrap #interior h2{
	margin-bottom: 30px;
	font-size: 20px;
	text-transform: none;
}

#interior_wrap #interior p#titulo_seccion{
	font-family: 'Roboto', Arial;
font-weight: 700;
	font-size: 40px;
	text-transform: uppercase;
	padding: 25px 0px;
}

/*Contenido*/
#contenido{
	float: right;
	width: 980px;
	padding-top: 30px;
}
	
#contenido .texto{
	float: left;
	width: 450px;
	margin-right: 40px;
}

#contenido p{
	margin-bottom: 25px;
}

#contenido .img_derecha{
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}

/*Menu lateral*/
#menu_lateral{
	float: left;
	width: 250px;
	margin-right: 20px;
	margin-left: -5px;
	display: none;
}



/*Google Maps*/
#map_canvas{
	width: 710px;
	height: 500px;
	margin: 20px 0px;
}

.marcadores{
	width: 300px;
}

.marcadores p{
	color: #383737;
}

#ejemplos_marcadores{
	width: 630px;
	margin: 0 auto;
}

#ejemplos_marcadores h3{
	font-family: 'Roboto', Arial;
font-weight: 700;
	line-height: 90px;
	font-size: 25px;
}

#ejemplos_marcadores #estacionamiento{
	float: left;
	width: 320px;
	margin-right: 30px;
}

#ejemplos_marcadores img{
	float: left;
	margin-right: 20px;
}

/*--------------------TABLA------------------------*/

.table1{
	width:100%;
	margin-bottom:20px;
	font-family: 'Roboto', Arial;
font-weight: 400;
	color: #333;
	}
	
.table1 input,
.table1 select,
.table1 select option
{
	font-size:10px;
	font-size:9px;
	}

.table1 th{
	background-color: #fff;
	padding:13px;
	color:#333;
	font-size:14px;
	font-weight: normal;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	text-transform: uppercase;
	}
	
.table1 th.azul{
	background-color:#385fa0;
	/*padding:7px;
	color:#FFF;
	font-size:12px;
	font-weight: bold;
	border-bottom-width: 7px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;*/
	}	
	
.table1 td{
	padding:13px;
	font-size:14px;
	color:#333;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	}

.contenidos .imprimir{
	width:135px;
	height:40px;
}
.contenidos .imprimir a{
	width:135px;
	height:40px;
	display:block;
	background-repeat: no-repeat;
	background-position: left top;
}
.contenidos .imprimir a:hover{

	background-position: left bottom;

}


/*----------------------------------COMPROBANTE-------------------------------*/

.contenidos .comprobante, 
.contenidos .comprobante2{
	/*width:98%;*/
	width:700px;
	border: 4px solid #CCC;
	margin-top:10px;
	margin-right: auto;
	margin-left: auto;
	
	}
.contenidos .comprobante p.titular,
.contenidos .comprobante2 p.titular{
	font-size:17px;
	text-align: center;
	font-weight: bold;	
	}
.contenidos .comprobante .numero_compr,
.contenidos .comprobante2 .numero_compr{
	min-width:500px;
	float:right;
	text-align: center;
	width: 100%;
	margin-bottom: 20px;
	}
.contenidos .comprobante .numero_compr p.txt,
.contenidos .comprobante2 .numero_compr p.txt{
	font-size:15px;
	color:#92a2ae;
	font-size:10px;
	padding:0px !important;
	margin:0px !important;
	
	}
.contenidos .comprobante .numero_compr p.emision,
.contenidos .comprobante2 .numero_compr p.emision{
	font-size:16px;
	color:#92a2ae;
	font-weight: bold;
	line-height: 15px;
	}
.contenidos .comprobante .numero_compr p.numero,
.contenidos .comprobante2 .numero_compr p.numero{
	font-size:30px;
	color:#92a2ae;
	font-weight: bold;
	padding:0px !important;
	margin:0px !important;
	}
.contenidos .comprobante .cont_datos,
.contenidos .comprobante2 .cont_datos{
	width:80%;
	margin-right:auto;
	margin-left:auto;
	border: 1px solid #ccc;
	margin-bottom:15px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 40px;
	padding-left: 20px;
	}
.contenidos .comprobante .cont_datos p,
.contenidos .comprobante2 .cont_datos p{
	font-size:15px;
	padding-bottom:40px;
	clear:both;
	}
.contenidos .comprobante .cont_datos p strong,
.contenidos .comprobante2 .cont_datos p strong{
	width:200px;
	display:block;
	float:left;
	}
.contenidos .comprobante .cont_datos p span,
.contenidos .comprobante2 .cont_datos p span{
	display:block;
	float:left;
	}
	
.contenidos .comprobante p.titular,
.contenidos .comprobante2 p.titular {
    font-size: 17px;
    font-weight: bold;
    text-align: center;
}
.contenidos .comprobante .firma img,
.contenidos .comprobante2 .firma img{
	width:200px;
	}
.contenidos .comprobante .firma img,
.contenidos .comprobante2 .firma img{
	width:200px;
	}
.contenidos .comprobante .lfirma,
.contenidos .comprobante2 .lfirma{
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #CCC;
	width:200px;
	margin-left:auto;
	margin-right:auto;
	text-align: center;	
	}
	
	
.comprobante .logo,
.comprobante .logo{
	width:257px;
	margin-left:auto;
	margin-right:auto;
	padding: 15px;
	}	
	
.contenidos .botones_inteligentes {	
	display: none;
}

.cont_derecho .cont_boton {
	display: none;	
}

.contenidos .alerta {	
	margin: 0 !important;
	padding: 20px !important;
}
.contenidos .borde_foto {
    border: 2px solid #d0d9db;
}

/** */

/*PREGUNTAS FRECUENTES*/
#preguntas_frecuentes h2{
	margin-bottom: 5px !important;
	margin-top: 20px !important;
}

/*POLITICAS DE PRIVACIDAD*/
#politicas_privacidad{
	margin: 30px 0px;
}

#politicas_privacidad .flota_der{
	width: 450px;
	float: right;
}

#politicas_privacidad .flota_izq{
	width: 450px;
	float: left;
	margin-right: 50px;
}

#politicas_privacidad p{
	margin-bottom: 20px;
}

#politicas_privacidad p span{
	font-size: 20px;
	font-family: 'Roboto', Arial;
font-weight: 700;
	line-height: 35px;
}


/*------------------------ICONOS-------------------------*/
.contenidos .icono{
	padding-left:110px;
	}
.contenidos .icono span.titulo{
	font-family: 'Roboto', sans-serif !important;
  	font-weight: 400;
	font-size:18px;
	color:#FFF;
	display:block;
	padding-top:9px;
	padding-bottom:2px !important;
	font-weight: bold;
	}
	
	
	.contenidos .icono span.titulo2{
	font-family: 'Roboto', sans-serif !important;
  	font-weight: 400;
	font-size:15px;
	color:#76808d;
	display:block;
	padding-top:16px;
	padding-bottom:4px !important;
	font-weight: bold;
	}
	
.contenidos .icono span.peso{
	font-family: 'Roboto', sans-serif !important;
  	font-weight: 400;
	font-size:11px;
	color:#FFF;
	display:block;
	padding-bottom:10px;
	}




.contenidos .pdf{
	background-image: url(../../images/autopase/pdf.png);
	background-repeat: no-repeat;
	background-position: left top;
	display:block;
	margin-bottom: 20px;
	height: 105px;
	border-top-width: 5px;
	border-bottom-width: 5px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #383737;
	border-bottom-color: #383737;
	}
	

/*------------------------LISTA-------------------------*/

	p.bajada {
	font-size: 24px;
	line-height: 29px;
	text-transform: uppercase;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: rgba(255,255,255,0.4);
	padding-bottom: 13px;
}


a.botones {
	font-family: 'Roboto', Arial;
font-weight: 400;
	display: inline-block;
	background-color: #FFF;
	color: #069;
	border-radius: 27px;
	font-size: 13px;
	text-decoration: none;
	text-transform: uppercase;
	padding-top: 5px;
	padding-right: 14px;
	padding-bottom: 5px;
	padding-left: 14px;
}


a.botones:hover {
	display: inline-block;
	background-color: #383737;
	color: #fff;
}



/***********************************************************************************************************************
DOCUMENT: style/format.css
DEVELOPED BY: Ryan Stemkoski
COMPANY: Zipline Interactive
EMAIL: ryan@gozipline.com
PHONE: 509-321-2849
DATE: 2/26/2009
DESCRIPTION: This document contains the structural formatting files for the accordion style menu.
************************************************************************************************************************/
.accordion {
	width: 97%;
}

.accordionButton {
	width: 980px;
	float: left;
	/*_float: none;   Float works in all browsers but IE6 */
	font-weight: bold;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #d45c65;
	cursor: pointer;
	background-image: url(/resources/images/autopase/mas.png);
	background-repeat: no-repeat;
	background-position: right center;
	padding-top: 20px;
	padding-bottom: 10px;
	font-size: 15px;
	text-transform: uppercase;
	color: #fff;
	padding-right:30px;
	margin: 0px 0px 5px 0px;
	}
	
.accordionContent {
	float: left;
	/*_float: none;*/
	padding-top: 10px;
	padding-bottom: 50px;
	width: 845px;
	margin-left: 50px;
	display: block !important;
	}
	
/***********************************************************************************************************************
 EXTRA STYLES ADDED FOR MOUSEOVER / ACTIVE EVENTS
************************************************************************************************************************/

.on {
	background-image: url(/resources/images/autopase/menos.png);
	background-repeat: no-repeat;
	background-position: right center;
	color: #F8B847;
	}
	
.over {
	color: #F8B847;
	}


#m_lateral{
	width:226px;
	float:left;
	margin-top:20px;
	display: none;	
	}
	
	
	#contenido{
	float: left !Important;
	width: 940px !Important;
	padding-top: 30px;
	margin-left:20px;
}

.pasos{
	display: none !Important;	
	}


#figura1{
	display: none;	
	}
	
#figura2{
	display: none;	
	}	
	
#figura3{
	display: none;	
	}	
#figura4{
	display: none;	
	}	
	
#figura5{
	display: none;	
	}	
	
	
#logo_autopase{
	display: none;	
	}	
		

.cerrar_sesion{
	display: none;	
	}	

	.destacado_plomo{
	background-color:#ebecee;
	-moz-border-radius: 20px 20px 20px 20px;
	-webkit-border-radius: 20px 20px 20px 20px;
	border-radius: 20px 20px 20px 20px;
	width:70%;
	margin-left:auto;
	margin-right:auto;
	padding:20px;
	margin-top:20px;
	margin-bottom:20px;
	
	}
.destacado_plomo .titulo{
	font-family: 'Roboto', Arial;
font-weight: 400;
	color:#6e7882;
	font-size: 15px;
	text-transform: uppercase;
	}
	
	
	.caja_destacado{
	border: 1px solid #969aa3;
	padding:15px;
	}
	
.logo_auto_pase{
	position:absolute;
	top:0px;
	right:0px;
	width:228px;
	height:61px;
	}

