
/* default */
html{
	-webkit-font-smoothing: antialiased;
	/*overflow-x: hidden;*/
}
body{
	/*overflow-x: hidden;*/
	background: white;
	
	color: black;
	
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
}

/* scrollbar */
html::-webkit-scrollbar {
    width: 20px;
}      
html::-webkit-scrollbar-track {
    background-color: black;
}       
html::-webkit-scrollbar-thumb {
    border-radius: 0px;
	background: url(../_img/ui/scroll.png);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 15px;
}

/* espaciado */
.espacio-horizontal{
	padding-right: 75px;
	padding-left: 75px;
}

.espacio-vertical{
	padding-top: 150px;
	padding-bottom: 150px;
}
.espacio-vertical-chico{
	padding-top: 100px;
	padding-bottom: 100px;
}

.mt-40{
	margin-top: 40px;
}
.mb-40{
	margin-bottom: 40px;
}
.mt-75{
	margin-top: 75px;
}
.mb-75{
	margin-bottom: 75px;
}
.mt-100{
	margin-top: 100px;
}
.mb-100{
	margin-bottom: 100px;
}
.mt-150{
	margin-top: 150px;
}
.mb-150{
	margin-bottom: 150px;
}

.oh{
	overflow: hidden !important;
}
.no-padding{
	padding: 0 !important;
}

/* Micro clearfix */
.cf { zoom: 1; }
.cf:before,
.cf:after { content: ""; display: table; }
.cf:after { clear: both; }

/* texto */
h1, h2, h3, h4, h5, h6{
	font-weight: 800;
}

h1.titulo{
	font-size: 41px;
	font-weight: 900;
}
h1.titulo span{
	font-weight: 500;
}	

hr{
	display: block;
	margin: 40px 0;
	
	background: #ccc;
	border-color: #ccc;
}
p, li{
	font-size: 19px;
}
p strong{
	font-weight: 800;
}

.texto-blanco{
	color: #ffffff;
}

.fw-400{
	font-weight: 400;
}
.fw-500{
	font-weight: 500;
}
.fw-600{
	font-weight: 600;
}
.fw-700{
	font-weight: 700;
}
.fw-800{
	font-weight: 800;
}
.fw-900{
	font-weight: 900;
}

a.link,
p.link a{
	color: black;
	font-size: 15px;
	font-weight: 700;
	text-decoration: underline;
}
a.link:hover,
p.link a:hover{
	color: #444;
}

/* colores */
.blanco{
	background: #ffffff;
}
.gris-claro{
	background: #f8f8f8;
}
.gris-medio{
	background: #eeeeee;
}
.negro-claro{
	background: #222222;
}
.negro-medio{
	background: #111111;
}
.negro{
	background: #000000;
}
.celeste{
	background: #f1f8fb;
}
.azul{
	background: #3b9ded;
}
.amarillo{
	background: #fff112;
}
.lavanda{
	background: #b490d2;
}
.magenta{
	background: #c600ff;
}
.verde{
	background: #76ce0d;
}

.borde{
	border-top: solid 1px rgba(0,0,0,0.09);
}
.sin-borde{
	border: 0;
}

.sombra{
	box-shadow: 1px -1px 50px 5px rgba(0,0,0,0.07);
	-webkit-box-shadow: 1px -1px 50px 5px rgba(0,0,0,0.07);
	-moz-box-shadow: 1px -1px 50px 5px rgba(0,0,0,0.07);
}
.sombra-negra-derecha{
	box-shadow: 15px 15px 0px 0px rgba(0, 0, 0, 0.025);
	-webkit-box-shadow: 15px 15px 0px 0px rgba(0, 0, 0, 0.025);
}
.sombra-amarilla{
	box-shadow: -15px 15px 0px 0px rgba(255, 241, 18, 1);
	-webkit-box-shadow: -15px 15px 0px 0px rgba(255, 241, 18, 1);
}

/* interacción */
.hover{
	opacity: 1;
	transition: 1s;
}
.hover:hover{
	opacity: 0.66;
}
a.zoom{
	display: block;
	overflow: hidden;
}
a.zoom img{
	transform: scale(1);
	transition: transform 1s ease;
	transform-origin: 75% 40%;
}
a.zoom:hover img{
	transform: scale(2);
}

/* forma */
.redondeada-15{
	border-radius: 15px;
}
.redondeada-30{
	border-radius: 30px;
}
.forma{
	-webkit-border-top-left-radius: 30px;
	-webkit-border-bottom-right-radius: 30px;
	-moz-border-radius-topleft: 30px;
	-moz-border-radius-bottomright: 30px;
	border-top-left-radius: 30px;
	border-bottom-right-radius: 30px;
}

/* ui */
.boton{
	display: inline-block;

	height: 48px;
	padding: 0 20px;
	
	background: #222;
	-webkit-border-top-left-radius: 30px;
	-webkit-border-bottom-right-radius: 30px;
	-moz-border-radius-topleft: 30px;
	-moz-border-radius-bottomright: 30px;
	border-top-left-radius: 30px;
	border-bottom-right-radius: 30px;
	
	color: white;
	font-size: 18px;
	font-weight: 800;
	line-height: 50px;
	text-decoration: none;

}
.boton:hover{	
	background: #000;
	box-shadow: -7px 7px 0px 0px rgba(255, 255, 255, 1);
	-webkit-box-shadow: -7px 7px 0px 0px rgba(255, 255, 255, 1);
	
	color: #76ce0d;
}
.boton svg{
	float: left;
	margin-top: 18px;
	margin-left: 10px;
	fill: white;
}

.etiqueta{
	display: inline-block;
	height: 48px;
	padding: 0 20px;
	
	background: white;
	-webkit-border-top-left-radius: 30px;
	-webkit-border-bottom-right-radius: 30px;
	-moz-border-radius-topleft: 30px;
	-moz-border-radius-bottomright: 30px;
	border-top-left-radius: 30px;
	border-bottom-right-radius: 30px;
	box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.05);
	-webkit-box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.05);
	
	border: solid 1px rgba(0,0,0,0.1);
}
.etiqueta svg{
	display: inline;
	margin-right: 10px;
}
.etiqueta h6{
	display: inline;
	color: black;
	font-size: 15px;
	font-weight: 700;
	line-height: 48px;
}

.etiqueta-grande{
	height: 60px;
	padding: 0 40px;
}
.etiqueta-grande svg{
	margin: 0 20px 9px 0;
	scale: 1.25;
}
.etiqueta-grande h6{
	font-size: 20px;
	font-weight: 800;
	line-height: 60px;
}

.etiqueta-move svg{
	fill: #fff112;
}
.etiqueta-empresa svg{
	fill: #3b9ded;
}
.etiqueta-shop svg{
	fill: #b490d2;
}
.etiqueta-full svg{
	fill: #c600ff;
}
.etiqueta-parklock svg{
	fill: #76ce0d;
}

ul.lista{
	padding: 0;
	list-style: none;
}
ul.lista li{
	display: block;
	padding: 0 0 10px 30px;
	
	background: url(../_img/ui/flecha.png) no-repeat 0 12px;
	background-size: 12px;
}
ul.lista li:last-child{
	padding-bottom: 0;
}

ul.lista.lista-blanca li{
	display: block;
	padding: 0 0 10px 30px;
	
	background: url(../_img/ui/flecha-blanca.png) no-repeat 0 12px;
	background-size: 12px;
}

/* footer */
.fin{
	position: relative;
}
.fin p{
	display: block;
	margin: 0;
	padding: 25px 0;
	
	color: #777777;
	font-size: 15px;
	font-weight: 500;
}
.fin p a{
	color: #777777;
	font-weight: 500;
	text-decoration: none;
}
.fin img{
	position: absolute;
	bottom: 0;
	right: 60px;
}

.footer{
	display: block;
}
.footer h5, h6{	
	font-size: 21px;
	font-weight: 700;
}
.footer h5{	
	padding-right: 2rem;
}
.footer nav.redes a{
	display: inline-block;
	margin-right: 30px;
}
.footer nav.redes a:hover svg{
	fill: #76ce0d;
}
.footer nav.footer-links{
	margin-top: 20px;
	margin-bottom: 40px;
}
.footer nav.footer-links a{
	display: block;
	margin-bottom: 10px;
	
	color: #444;
	font-weight: 500;
	text-decoration: none;
}
.footer nav.footer-links a:hover{
	color: black;
	text-decoration: underline;
}

/* sos conductor */
.sos-conductor h3{
	padding-right: 10rem;
}

/* otros */
.otros{
	overflow: hidden;
}
.otros-pista{
	display: flex;
	width: max-content;
	animation: otros-scroll 45s linear infinite;
}
.otros:hover .otros-pista{
	animation-play-state: paused;
}
@keyframes otros-scroll{
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
	.otros{ overflow-x: auto; }
	.otros-pista{ animation: none; }
	.otros.otros-forzar{ overflow: hidden; }
	.otros.otros-forzar .otros-pista{ animation: otros-scroll 45s linear infinite; }
	.otros.otros-forzar:hover .otros-pista{ animation-play-state: paused; }
}

.otro-item{
	position: relative;
	flex: 0 0 378px;
	width: 378px;
	margin-left: 60px;
}
.otro-item h5{
	display: block;
	min-height: 75px;
	
	color: white;
	font-size: 18px;
	font-weight: 700;
}
.otro-item a{
	color: #aaaaaa;
	font-size: 15px;
	font-weight: 700;
	text-decoration: underline;
}
.otro-item a:hover{
	color: #76ce0d;
}

.otro-icono{
	z-index: 1;
	position: absolute;
	top: 100px;
	left: -26px;
	
	height: 52px;
	width: 52px;
	border-radius: 52px;
	background: #000;
	
	outline-style: solid;
	outline-color: #222;
	outline-width: 9px;
	
	text-align: center;
}
.otro-icono svg{
	margin-top: 15px;
	fill: white;
}

.otro-move .otro-icono svg{
	fill: #fff112;
}
.otro-shop .otro-icono svg{
	fill: #b490d2;
}
.otro-empresa .otro-icono svg{
	fill: #3b9ded;
}
.otro-full .otro-icono svg{
	fill: #c600ff;
}
.otro-parklock .otro-icono svg{
	fill: #76ce0d;
}

/* header */
.header h1{
	font-size: 48px;
	font-weight: 800;
}
.header h1 span{
	color: #76ce0d;
}
.header h2{
	font-size: 40px;
}

.header-parrafo{
	line-height: 36px;
	font-size: 24px;
	font-weight: 600;
}

.icono-texto{
	clear: both;
	display: block;
	float: left;
	width: 100%;
	margin-bottom: 10px;
}
.icono-texto .circulo-blanco-icono{
	float: left;
}
.circulo-blanco-icono{
	display: block;
	height: 52px;
	width: 52px;
	border-radius: 52px;
	background: white;
	text-align: center;
}
.circulo-blanco-icono svg{
	margin-top: 15px;
}
.icono-texto p{
	display: block;
	float: left;
	width: 70%;
	margin-left: 30px;
}

/* inicio: descubri */
.descubri h2 span{
	color: #76ce0d;
}
	
.descubri .otro-item h5{
	margin-top: 10px;
	margin-bottom: 20px;
	min-height: auto !important;
	
	color: black;
	font-size: 25px;
}
.descubri .otro-item a{
	color: #000;
}
.descubri .otro-item a:hover{
	color: #76ce0d;
}
.descubri .otro-icono{
	outline-color: white;
}

.descubri .otro-move{
	margin-bottom: 225px;
}
.descubri .otro-empresa{
	margin-bottom: 225px;
}

.descubri .otro-shop{
	margin-top: 225px;
}
.descubri .otro-full{
	margin-top: 225px;
}

.asfalto{
	position: relative;
}
.asfalto .auto{
	position: absolute;
	top: 0;
	left: 153px;
	will-change: transform;
}

/* inicio: header */
.header-inicio{
	min-height: 900px;
	
	background: #f1f8fb url(../_img/inicio/header.jpg) no-repeat right top;
	background-size: 1020px;
}

/* nav */
nav.navbar-tecxi{
	padding-top: 20px;
	padding-bottom: 20px;
	
	background: #111111;
}

.navbar-toggler{
	background: white;
}

li.nav-item{
	margin-left: 45px;
}
a.nav-link{
	color: white;
	font-size: 18px;
	font-weight: 700;
	opacity: 1;
}
a.nav-link:hover{
	opacity: 0.75;
}
	
a.nav-move svg{
	fill: #fff112;
}
a.nav-shop svg{
	fill: #b490d2;
}
a.nav-parklock svg{
	fill: #76ce0d;
}
a.nav-pago svg{
	fill: white;
}

/* move */
body.Move .caja{
	min-height: 675px;
}

.caja{
	padding: 48px;
}
.caja h5{
	font-size: 20px;
}
.caja section{
	position: relative;
}

.caja section .caja-icono{
	z-index: 1;
	position: absolute;
	top: -15px;
	left: -75px;
	
	height: 52px;
	width: 52px;
	border-radius: 52px;
	background: #fff112;
	
	outline-style: solid;
	outline-color: white;
	outline-width: 9px;
	
	text-align: center;
}
.caja section .caja-icono.caja-icono-shop{
	background: #b490d2;
}
.caja section .caja-icono.caja-icono-parklock{
	background: #76ce0d;
}

.caja section .caja-icono svg{
	margin-top: 15px;
	fill: black;
}
.caja section .caja-icono.caja-icono-shop svg{
	fill: white;
}
.caja section .caja-icono.caja-icono-parklock svg{
	fill: white;
}

.caja-negra{
	color: white;
}
.caja-negra h5{
	color: yellow;
}

.caja-negra.caja-negra-verde h5{
	color: #76ce0d;
}

ol.lista-ordenada{
	line-height: auto;
}
ol.lista-ordenada li{
	padding-bottom: 15px;
}
ol.lista-ordenada li::marker {
	color: black;
	font-weight: 700;
}

/* parklock */
body.ParkLock .caja{
	min-height: 470px;
}


















