/* COMMON */

body { font-family: 'Open Sans', sans-serif; }

a{color: #F63B2E; }
a:hover{color: #F63B2E}
.numero { font-family: 'Open Sans', sans-serif; }

img{max-width: 100%;}

h1,h2,h3,h4{line-height: normal;}

.form-control{border-radius: 0;}
.form-control:focus { outline: none !important; border-color: #F63B2E; box-shadow: none; }
.form-control.error,
.form-control.error:focus{border-color:red;}
.requiredCheck.error:focus{box-shadow: 0 0 3px 1px rgba(255,0,0,0.6);}

.boton { border: 1px solid #F63B2E; background-color: #F63B2E; color: #fff; border-radius: 30px; font-size: 16px;  line-height: 40px; text-align: center; transition: all 0.3s; padding: 0 20px;}
.boton:hover{background: #fff; color: #F63B2E; border-color: #F63B2E !important; text-decoration: none;}
.boton:focus{outline: none;}
.boton.blanco{background: #fff; color: #F63B2E;}
.boton.blanco:hover{background: #F63B2E ; color: #fff;}

.titulo-apartado{font-size: 26px; font-weight: 700; position: relative; text-align: center;}
#listadoVehiculos .titulo-apartado.titulo-filtro,
#detalle .titulo-apartado,
.caja-color .titulo{font-size: 23px; font-weight: normal;}
.text-hidden{ font-size: 0; width: 1px; height: 1px; display: inline-block; overflow: hidden; position: absolute !important; border: 0 !important; padding: 0 !important; margin: 0 !important; clip: rect(1px, 1px, 1px, 1px); }

input.form-control,
textarea.form-control,
select.form-control {box-shadow:inset 0 1px 1px rgba(0,0,0,.075); border-radius: 4px;}

.icono-color{fill: #F63B2E;}

.caja-color{background-color: #F63B2E; padding: 30px 25px; color: white; border-radius: 4px; margin-bottom: 10px;}
.caja-color .boton{width: 100%; background: #212529;}
.caja-color .boton:hover{ border-color:#212529 !important; color: #212529 !important; background: #fff;}
.caja-color .titulo { text-align: center; margin-bottom: 25px; }

.badge { font-size: 85%;}


/* HEADER */
#header { padding: 30px 15px; background: #171717;}
#header .menu{display: flex; justify-content: space-around; align-items: center;}
#header a:hover{text-decoration: none;}

#header .cola{font-size: 11px; color: #fff; text-transform: uppercase;}
#header .icono-contactar { height: 21px; width: 21px; }
#header .btn-contacto { display: none; }
#header .contactar:hover { text-decoration: none; }
#header .contactar svg{fill: #fff;}
#header .pipe { margin-left: 10px; height: 40px; width: 1px; background-color: rgb(190, 190, 190); }
#header .boton{ padding: 0 5px; color: #fff; background: none !important; font-weight: normal; display: inline-block; letter-spacing: 0.8px; font-size: 12px; border: none !important}

#header .boton:hover{color: #F63B2E;}
#header .menu > .col:nth-child(1){flex-grow: 0;}
#header .menu > .col:nth-child(2){padding: 0; flex-grow: 0;}
#header .menu > .col:nth-child(3){padding-left: 0; flex-shrink: 0;}
#header .linkLogo{justify-content: center;
    justify-self: center;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;}
#header .secciones{display: flex; justify-content: center; align-items: center; margin-top: 20px;}
#header .dropdown{margin-left: 15px;}
#header .contenedor-usuario { border-radius: 34%; border: none; width: 34px; height: 34px;  background-color: #F63B2E; fill: #fff;}
#header .contenedor-usuario:focus { outline: none; }
#header .contenedor-usuario .icono-usuario { height: 21px; width: 21px; }
#header .texto-largo { display: none; margin-right: 5px; }
#header .dropdown-item { font-size: 13px; font-weight: 400; }
#header hr { margin-top: 0.5rem; margin-bottom: 0.5rem; }
#header .dropdown-menu { z-index: 1021; }
#header .nombre-profesional { font-size: 13px; font-weight: 300; width: 100%; padding: .25rem 1.5rem; color: #F63B2E; text-align: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 218px; }

@media (min-width: 576px) {	
	#header .btn-contacto { font-size: 11px; color: black; margin-left: 10px; display: initial; }
	#header .texto-largo { display: inline-block; }
	#header .contenedor-usuario { width: 40px; height: 40px;}
    #header .contenedor-usuario .icono-usuario { height: 26px; width: 26px; }
    #header .secciones{justify-content: flex-end; margin-top: 0;}
}
@media (min-width: 768px) {	
	.titulo-apartado{font-size: 32px;}
	#header .cola{font-size: 18px;}
	#header .icono-contactar { height: 24px; width: 24px; }
	#header .btn-contacto { font-size: 13px; margin-left: 10px; }	
	
	#header .boton{padding: 0 19px; font-size: 16px; line-height: 40px; }
	
}
@media (min-width: 992px) {
	#header .cola{font-size: 19px;}

	#header .menu > .col:nth-child(2){padding: 0 15px;  flex-grow: 1;}
	#header .menu > .col:nth-child(3){padding: 0 15px; flex-shrink: 0;}
	  #header .menu > .col:nth-child(1){flex-grow: 1;}
	  #header .boton{margin-left: 0;}
}


/* HOME */
#home .container{padding-top: 100px; padding-bottom: 100px; min-height:calc(100vh - 250px);}
#home .container > .row{box-shadow: 1px 1px 8px 2px rgba(0,0,0,0.5); border-radius: 10px;}
#home .caja-color{border-radius: 0; margin-bottom:0; padding-left: 15px; padding-right: 15px; border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
#home .caja-color a{color: #fff; margin-top: 15px;}
#home .coverImg{background-image:url("/img/banner.png"); border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
#home .coverImg .opacidad{background:linear-gradient(to bottom, rgba(246,60,46,0.75) 0%, rgba(239,58,43,0.56) 45%, rgba(231,56,39,0.13) 100%); position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
#home .contTexto{position: absolute; z-index: 10; color: #fff; top: 50%; transform: translateY(-50%); text-align: center; padding-right: 15px; padding-left: 15px;}
#home .contTexto p{font-size: 20px;}
#home .contTexto .contBoton{margin-top: 30px;}

/* HOME */
@media (max-width:767px){
	#home .container{padding-top: 30px; padding-bottom: 30px;}
	#home .coverImg{height: 400px;}
	#home #login{padding-top: 0;}
	#home .caja-color{border-top-right-radius: 10px; border-bottom-left-radius: 0;}
	#home .coverImg{border-top-right-radius: 0; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;}
	#home .coverImg .opacidad{border-bottom-left-radius: 10px;}
}

@media (min-width: 768px) {
	#home .contTexto{padding-left: 40px; padding-right: 40px;}
}

@media (min-width: 992px) {
	#home .contTexto{padding-left: 100px; padding-right: 100px;}
	#home .contTexto .titulo-apartado{font-size: 32px;}
}
  

/* FOOTER */
#dondeEstamos { padding: 40px 0px; background-color: #1e1e1e; color: white; }
#dondeEstamos .titulo-apartado {margin: 40px 0px; }
#dondeEstamos .localizacion { margin: 35px 0px; }
#dondeEstamos .separador { height: 1px; background-color: white; }
#dondeEstamos .localizacion .titulo { margin-bottom: 30px; }
#dondeEstamos .localizacion .texto { margin-left: 15px; font-size: 22px; font-weight: 700; }
#dondeEstamos .localizacion .direccion { text-align: center; font-size: 16px; margin-bottom: 40px; }
#dondeEstamos .localizacion .direccion a { color: white; font-weight: normal; }
#dondeEstamos .localizacion .enlace { text-align: center; font-size: 14px; font-weight: bold; color: white; }

@media (min-width: 768px) {
  #dondeEstamos .localizacion { width: 325px; }
  #dondeEstamos .separador { width: 1px; height: auto; }
}

#footer { padding: 40px 0px; background-color: #F63B2E; }
#footer .copyright{ font-size: 12px; color: white; margin: 5px 15px; font-weight: 300; flex-basis: 100%; text-align: center; margin-top: 30px;}
#footer .copyright .powered{margin-left: 30px;}
#footer .copyright .powered a{margin-left: 0; font-size: 12px; font-weight: 400;}
#footer a { color: white; font-size: 16px; margin: 5px 15px; font-weight: 400;}


/* LOGIN */
#login { padding: 40px 0px; }
#login .titulo-apartado {margin: 40px 0px; }
#login .contenedor-login .error { color: white; margin-top: 30px; }


/* LISTADO */
.texto-llamativo-listado {color: #161616; border-radius: 10px; padding: 10px; margin-top: 30px; margin-bottom: 30px; background-color: #F63B2E}
#listadoVehiculos { padding-bottom: 40px; }
#listadoVehiculos .titulo-apartado { margin-bottom: 40px; }
#listadoVehiculos .filtro { position: fixed; opacity: 0; z-index: -1; left: 0; top: 0; bottom: 0; right: 0; background-color: white;	padding: 40px 30px; overflow-y: auto; padding-top: 60px; transition: all 0.3s; }
#listadoVehiculos .filtro.show { opacity: 1; z-index: 2; }
#listadoVehiculos .titulo-apartado.titulo-filtro{margin-top: 54px; }
#listadoVehiculos .listado { width: 100%; }
#listadoVehiculos .vehiculo { margin: 20px 0px;  transition: all 0.3s; cursor: pointer; color: black; border-radius: 4px;}
#listadoVehiculos .vehiculo:hover { box-shadow: 3px 3px 3px 0 rgba(0,0,0,.3); text-decoration: none; }
#listadoVehiculos .vehiculo .galeria { width: 100%;	text-align: center; background-color: #eeeeee; border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
#listadoVehiculos .vehiculo .informacion { width: 100%; padding: 10px; position: relative; background-color: #eee; border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
#listadoVehiculos .vehiculo .informacion .precio { font-size: 24px; font-weight: 400; line-height: 1.1; letter-spacing: 1px; color: #F63B2E;}
#listadoVehiculos .vehiculo .informacion .year {	font-size: 13px; letter-spacing: 1px; font-weight: 400;}
#listadoVehiculos .vehiculo .informacion .iva_rebu {	 top: 6px; right: 15px; font-size: 11px; background-color: black; color: white; padding: 5px; border-radius: 0px; line-height: 10px;}
#listadoVehiculos .vehiculo .informacion .titulo { width: 100%; font-size: 15px; margin-bottom: 20px; font-weight: 600; letter-spacing: 1px; }
#listadoVehiculos .vehiculo .informacion .boton { width: 100%;}
#listadoVehiculos .vehiculo .informacion .mas-info { margin: -5px; margin-bottom: 10px; }
#listadoVehiculos .vehiculo .informacion .mas-info>div { padding: 5px; border-radius: 3px; font-size:14px; width: 46%; min-width: 110px; margin-bottom: 5px; margin-top: 5px; }
#listadoVehiculos .vehiculo .informacion .mas-info>div>span { font-size: 11px; }
#listadoVehiculos .paginacion { padding-left: 0px; margin-top: 40px; margin-bottom: 0px; }
#listadoVehiculos .paginacion li { display: inline-block; font-size: 16px; padding: 5px 10px; color:black; transition: all 0.3s; }
#listadoVehiculos .paginacion li.pagina.active, #listadoVehiculos .paginacion li.pagina:hover{ color: white; background-color: #F63B2E; cursor:pointer; border-radius: 30px;}
#listadoVehiculos .filtro_orden {	width: 100%; margin-top: 20px; }
#listadoVehiculos .icono-filtro {	width: 25px; height: 25px; }
#listadoVehiculos .orden button { padding: 0px; background-color: white; border: none; }
#listadoVehiculos .orden button:focus { outline: none; }
#listadoVehiculos .orden .icono-flecha { width: 20px; height: 20px; }
#listadoVehiculos .dropdown-menu .dropdown-item { cursor: pointer; }
#listadoVehiculos .dropdown-menu .dropdown-item.active, #listadoVehiculos .dropdown-menu .dropdown-item:active { background-color: #F63B2E; }
#listadoVehiculos .filtro .dropdown {	width: 100%; max-width: 250px;	margin-bottom: 30px;}
#listadoVehiculos .filtro .dropdown button { width: 100%; background-color: white; border:1px solid #ddd; font-size: 16px; font-weight: 600; border-radius: 4px; line-height: 38px; padding: 0; justify-content: center;}
#listadoVehiculos .filtro .dropdown button:focus { outline: none; }
#listadoVehiculos .filtro .dropdown .icono-flecha { width: 20px; height: 20px; margin-left:10px;}
#listadoVehiculos .filtro .dropdown .dropdown-menu { width: 100%; max-height: 250px; overflow-y: auto; }
#listadoVehiculos .filtro .enviar {	width: 100%; max-width: 250px; }
#listadoVehiculos #cerrarFiltro .icono-cerrar {	width: 30px; height: 30px; position: absolute; top: 15px; right: 15px; }

@media (min-width: 576px) {
  #listadoVehiculos .vehiculo .galeria { max-width: 350px }
}
@media (min-width: 768px) {
  #listadoVehiculos .filtro_orden {	width: auto; margin-top: 0px; }
  #listadoVehiculos #abrirFiltro { margin-right: 40px; }
}
@media (min-width: 992px) {
  .texto-llamativo-listado {margin-bottom: 0px;}
  #listadoVehiculos #abrirFiltro { display: none; }
  #listadoVehiculos .titulo-apartado { margin-top: 40px; }
  #listadoVehiculos .filtro { width: 300px; position: relative; opacity: 1; z-index:1; padding: 0px; overflow-y: inherit; padding-top: 0px; }
  #listadoVehiculos .listado { margin-left: 20px; }
  #listadoVehiculos .vehiculo .informacion .precio { font-size: 26px; }
  #listadoVehiculos .vehiculo .informacion .year {	font-size: 15px; }
  #listadoVehiculos .vehiculo .informacion .titulo { font-size: 22px;margin-top:10px; }
  #listadoVehiculos .vehiculo .informacion { padding: 15px; }
  #listadoVehiculos .vehiculo .informacion .mas-info { margin-bottom: 20px; }
  #listadoVehiculos .vehiculo .informacion .mas-info>div { width: 48%; }
  #listadoVehiculos #cerrarFiltro { display: none; }
}
@media (min-width: 1200px) {
  #listadoVehiculos .vehiculo .informacion .mas-info>div { min-width: auto; width: 24%; }
}

/* DETALLE */
#detalle { padding-top: 3px; padding-bottom: 40px; }
#detalle .volver{cursor: pointer;}
#detalle .volver svg{width: 25px; height: 25px;}
#detalle .titulo-apartado {	margin-bottom: 40px; font-size: 23px; font-weight: normal;}
#detalle .barraSuperior { padding: 10px 10px; background-color: white; flex-wrap:wrap; justify-content: space-between;}
#detalle .barraSuperior .informacion {margin-left: 30px;}
#detalle .barraSuperior .informacion .precio { font-size: 26px; font-weight: normal;	line-height: 25px; }
#detalle .barraSuperior .informacion .separacion { margin: 0px 10px; width: 1px; height: 25px; background-color: black; }
#detalle .barraSuperior .informacion .iva_rebu { font-weight: 700; font-size: 14px; line-height: 14px; }
#detalle .barraSuperior .informacion .titulo { font-size: 16px; font-weight: 300; color: #F63B2E; letter-spacing: 1px; }
#detalle .barraSuperior .acciones { margin-top: 20px; justify-content: center; }
#detalle .barraSuperior .acciones .contactar { font-size: 13px; padding: 0px 20px; margin-right: 10px;}
#detalle .barraSuperior .acciones .reservar { font-size: 13px;padding: 0px 20px; margin-left: 10px; }
#detalle .barraSuperior .acciones .whatsapp { margin: 0px 20px; padding: 0px; border: none; background-color: white; }
#detalle .barraSuperior .acciones .whatsapp .icono { width: 35px; height: 35px; fill: #25d366;}
#detalle .barraSuperior .acciones .whatsapp:hover { background-color: white; }
#detalle .barraSuperior .reservado { font-size: 20px; font-weight: 700; }

#detalle .contenido { padding-top: 40px; }
#detalle .contenido .fotos { width: 100%; margin-bottom: 40px; }
#detalle .contenido .caracteristicas .icono-caracteristica { height: 25px; width: 25px; margin-right: 15px; }
#detalle .contenido .caracteristicas .caracteristica { margin-bottom: 30px; }
#detalle .contenido .caracteristicas .texto { font-size: 12px; color: #161616; text-transform: uppercase; }
#detalle .contenido .otras-caracteristicas { padding-bottom: 40px; }
#detalle .contenido .equipamiento { padding-bottom: 40px; line-height: 2;}
#detalle .contenido .descripcion { padding-bottom: 40px; }

#detalle .modal textarea {min-height: 115px;}
#detalle .modal a { color: white; }
#detalle .modal-footer .boton{ -webkit-appearance: none;}
#detalle .modal-content { background-color: #AAADAE; border:none}
#detalle .modal-header { border-bottom: 1px solid rgba(255,255,255,0.3); color: white; }
.modal-footer{border-top-color: rgba(255,255,255,0.3);}
#detalle .modal-header .close { color: #333; text-shadow: 0 1px 0 #5c5c5c; opacity: .8; }
#detalle .modal-header .close:hover { color: #fff; }
#detalle .modal-body { color: white; }
#detalle .modal-body .correcto { font-size: 20px; text-align: center; }
#detalle .modal-body .error { font-size: 17px; text-align: center; color: #ff5555; margin-top: 20px; }

#detalle .nav-pills { border: 1px solid #F63B2E;}
#detalle .nav-link {
  border-right: 1px solid #F63B2E;
  border-radius: 0px;
  background-color: white;
  color: #F63B2E;
  transition: 0.3s;
}
#detalle .nav-link:hover, #detalle .nav-link.active {
	background-color: #F63B2E;
	color: white;
}
#detalle .tab-content {
  padding: 20px 30px;
}

@media (min-width: 576px) {
  #detalle .contenido .caracteristicas .icono-caracteristica { height: 35px; width: 35px; margin-right: 20px; }
  #detalle .contenido .caracteristicas .texto { font-size: 15px; }
  #detalle .barraSuperior { padding: 10px 15px; }
}

@media (min-width: 768px) {
  #detalle .contenido .fotos_caracteristicas { padding-bottom: 40px; }
  #detalle .contenido .fotos { width: 400px; padding-right: 20px; }
  #detalle .contenido .caracteristicas .icono-caracteristica { height: 30px; width: 30px; margin-right: 15px; }
  #detalle .contenido .caracteristicas .texto { font-size: 13px; }
  #detalle .barraSuperior .informacion .titulo { font-size: 19px; }
  #detalle .barraSuperior .acciones .contactar { font-size: 14px; padding: 0px 25px; margin-right: 10px; }
  #detalle .barraSuperior .acciones .reservar { font-size: 14px; padding: 0px 25px; margin-left: 10px; }  
}
@media (min-width: 992px) {
  #detalle .volver svg{width: 30px; height: 30px;}
  #detalle .barraSuperior .informacion {margin-right: auto;}
  #detalle .barraSuperior .informacion .titulo { font-size: 19px; }
  #detalle .barraSuperior .acciones { margin-top: 0px; }
  #detalle .contenido .fotos { width: 500px; padding-right: 25px; }
  #detalle .contenido .caracteristicas .icono-caracteristica { height: 30px; width: 30px; margin-right: 15px; }
  #detalle .contenido .caracteristicas .texto { font-size: 16px; }
}
@media (min-width: 1200px) {
  #detalle .contenido .fotos { width: 600px; padding-right: 30px; }
}


/* CONTACTO */
#contactar { padding: 40px 0px; }
#contactar .titulo-apartado{ margin: 40px 0px; }
#contactar .contenedor-contactar .legal a { color: white; }
#contactar .contenedor-contactar .error label, #contactar .contenedor-contactar .error label a { color: #000; }
#contactar .contenedor-contactar .error input, #contactar .contenedor-contactar .error textarea { background-color: #fca7a7; }
#contactar .contenedor-contactar .respuestas .correcto { text-align: center; font-size: 30px; }
#contactar .contenedor-contactar .respuestas .error { text-align: center; font-size: 20px; color: white; }

/* REGISTRO */
#registro { padding: 40px 0px; }
#registro .titulo-apartado{ margin: 40px 0px; }
#registro .caja-color .titulo{margin-bottom: 5px;}
#registro .subtitulo{font-size: 18px; margin-bottom: 25px;}
#registro .contenedor-registro .legal a { color: white; }
#registro .contenedor-registro .error label, #registro .contenedor-registro .error label a { color: #000; }
#registro .contenedor-registro .error input, #registro .contenedor-registro .error textarea, #registro .contenedor-registro .error select { background-color: #fca7a7; }
#registro .contenedor-registro .respuestas .correcto { text-align: center; font-size: 30px; }
#registro .contenedor-registro .respuestas .error { text-align: center; font-size: 20px; color: white; }

/* RESTABLECER CONTRASEÑA */
#restablecer { padding: 40px 0px; }
#restablecer .titulo-apartado { margin: 40px 0px; }
#restablecer .contenedor-restablecer .error { color: white; margin-top: 30px; }
#restablecer .contenedor-restablecer .correcto { text-align: center; font-size: 20px; }

/* RESTABLECER CONTRASEÑA */
#cambiarContrasena { padding: 40px 0px; }
#cambiarContrasena .titulo-apartado { margin: 40px 0px; }
#cambiarContrasena .contenedor-cambiarContrasena .error { color: white; margin-top: 30px; }
#cambiarContrasena .contenedor-cambiarContrasena .correcto { text-align: center; font-size: 20px; }

/* LEGAL */
#legal { padding-top: 40px; padding-bottom: 40px; }
#legal .titulo-apartado { margin: 40px 0px; }
#legal h3 { font-size: 21px; }
#legal p { font-size: 14px; }

/* COOKIES */
#cookies { padding-top: 40px; padding-bottom: 40px; font-size: 14px; }
#cookies .titulo-apartado { margin: 40px 0px; }
#cookies p { font-size: 14px; }
#cookies a { color: #007bff; font-weight: normal; }

/* BANNER COCOKIES */
#bannerCookies { display: none; background-color: #F63B2E; color: #fff; position: fixed; bottom: 0; text-align: center; width: 100%; z-index: 1000; padding: 10px; }
#bannerCookies .link{ color: #fff;text-decoration: underline; }

/* MODIFICAR DATOS */
#modificar-datos { padding: 40px 0px; }
#modificar-datos label{color: #fff;}
#modificar-datos .legal label{color: #fff;}
#modificar-datos .titulo-apartado{ margin: 40px 0px; }
#modificar-datos .contenedor-datos .legal a { color: #fff; text-decoration: underline;}
#modificar-datos .contenedor-datos .error label, #modificar-datos .contenedor-datos .error label a { color: #ff5555; }
#modificar-datos .contenedor-datos .error input, #modificar-datos .contenedor-datos .error textarea, #modificar-datos .contenedor-datos .error select { background-color: #fca7a7; }
#modificar-datos .contenedor-datos .respuestas .correcto { text-align: center; font-size: 30px; }
#modificar-datos .contenedor-datos .respuestas .error { text-align: center; font-size: 20px; color: white; }
