/* LOGIN ======================================================================================================================= ================================================================================================================================ */ body.login p{ font-size: 13px; } /* FUENTE PX GROTESK */ @font-face { font-family: 'Px Grotesk Screen'; /* Nombre que usarás para referenciar la fuente */ src: url('/css/Px-Grotesk-Screen.ttf') format('truetype'); /* Ruta al archivo TTF (si es necesario) */ font-weight: normal; /* O el peso que corresponda */ font-style: normal; /* O el estilo que corresponda */ } /* BOTONES ======================================================================================================================= ================================================================================================================================ */ /* BOTONES */ .btn{ letter-spacing: 1px; font-weight: 500; } /* BTN INICIO CONSISTE */ .btn_consiste {color: #0080BB;background-color: #fff;font-size: 0.75rem; padding:0.75rem 2rem;font-weight: 600; transition: background 0.5s, color 0.5s;} .btn_consiste:hover {color:#fff;background-color: #0080BB;} /* BTN INICIO RECOMENDACIÓN */ .btn_recomendacion a{color: #fff;background-color: #00BCF1;font-size: 1rem; padding: 2px 0px 5px 1px; border-radius: 30px;font-weight: 500; transition: background 0.5s;box-shadow: 1px 5px 8px rgba(0, 0, 0, 0.4);} .btn_recomendacion a:hover {background-color: #164184;} .btn_recomendacion a img{ float: left; display: block; margin-right: 10px; position: absolute; bottom: 0; } .btn_recomendacion a div{ margin: 15px 0px 10px ;float: left; display: block; text-align: left; padding: 0 3rem 0 5rem; } /* BTN INICIO VER */ .btn_inicio_ver{ float: right; margin-bottom: 2rem;} .btn_inicio_ver a{color: #fff;background-color: #0080BB;font-size: 1rem; padding: 5px; border-radius: 30px;font-weight: 500; transition: background 0.5s;} .btn_inicio_ver a:hover {background-color: #164184;} .btn_inicio_ver a img{ float: left; display: block; margin-right: 10px; } .btn_inicio_ver a div{ margin-top: 15px;float: left; display: block; text-align: left; padding: 0 3rem 0 1rem; } /* BTN INICIO PUBLICA */ .btn_inicio_publica{ float: left; margin-bottom: 2rem;} .btn_inicio_publica a{color: #fff;background-color: #00BCF1;font-size: 1rem; padding: 5px; border-radius: 30px;font-weight: 500; transition: background 0.5s;} .btn_inicio_publica a:hover {background-color: #164184;} .btn_inicio_publica a img{ float: left; display: block; margin-right: 10px; } .btn_inicio_publica a div{ margin-top: 15px;float: left; display: block; text-align: left; padding: 0 3rem 0 1rem; } /* BTN INICIO TECNICO */ .btn_tecnico a{color: #fff;background-color: #0080BB;font-size: 1rem; padding: 2px 0px 5px 1px; border-radius: 30px;font-weight: 500; transition: background 0.5s;} .btn_tecnico a:hover {background-color: #164184;} .btn_tecnico a img{ float: left; display: block; margin-right: 10px; position: absolute; bottom: 0; } .btn_tecnico a div{ margin: 15px 0px 10px ;float: left; display: block; text-align: left; padding: 0 3rem 0 5rem; } .btn_tecnico_3 a div{ line-height: 13px; font-size: 13px; margin-left: 10px; } /* BTN Oferta Inmediata */ .btn_oferta a{color: #585858;background-color: #fff; border: #00BCF1 1px solid;font-size: 1rem; padding: 2px 1em 5px 1em; border-radius: 30px;font-weight: 500; transition: background 0.5s;} .btn_oferta a:hover {background-color: #164184; color: #fff;} .btn_oferta a img{ float: left; display: inline-block; margin-right: 10px; width: 100px; } .btn_oferta a div{ margin: 30px 0px 10px ;float: left; display: inline-block; text-align: left; line-height: 26px; font-size: 1.2em; } /* FONDO CELESTE Y TEXTO BLANCO */ .btn_primario {color: #fff;background-color: #0800FF;border-color: #0800FF;} .btn_primario:hover {border-color: #0690d2;} .btn_primario:focus, .btn_primario.focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} .btn_primario.disabled, .btn_primario:disabled {color: #fff;background-color: #007bff;border-color: #007bff;} .btn_primario:not(:disabled):not(.disabled):active, .btn_primario:not(:disabled):not(.disabled).active,.show > .btn_primario.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;} .btn_primario:not(:disabled):not(.disabled):active:focus, .btn_primario:not(:disabled):not(.disabled).active:focus,.show > .btn_primario.dropdown-toggle:focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} /* FONDO BLANCO Y BORDE CELESTE Y TEXTO CELESTE */ .btn_primario2 {color: #00BCF1;background-color: transparent;border-color: #00BCF1;} .btn_primario2:hover {color: #fff;background-color: #164184;border-color: #164184;} .btn_primario:focus, .btn_primario.focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} .btn_primario.disabled, .btn_primario:disabled {color: #fff;background-color: #007bff;border-color: #007bff;} .btn_primario:not(:disabled):not(.disabled):active, .btn_primario:not(:disabled):not(.disabled).active,.show > .btn_primario.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;} .btn_primario:not(:disabled):not(.disabled):active:focus, .btn_primario:not(:disabled):not(.disabled).active:focus,.show > .btn_primario.dropdown-toggle:focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} /* FONDO CELESTE OSCURO Y TEXTO BLANCO */ .btn_secundario {color: #fff;background-color: #0080BB;border-color: #0080BB;} .btn_secundario:hover {color: #fff;background-color: #164184;border-color: #164184;} .btn_secundario:focus, .btn_secundario.focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} .btn_secundario.disabled, .btn_secundario:disabled {color: #fff;background-color: #007bff;border-color: #007bff;} .btn_secundario:not(:disabled):not(.disabled):active, .btn_secundario:not(:disabled):not(.disabled).active,.show > .btn_secundario.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;} .btn_secundario:not(:disabled):not(.disabled):active:focus, .btn_secundario:not(:disabled):not(.disabled).active:focus,.show > .btn_secundario.dropdown-toggle:focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} /* FONDO BLANCO Y TEXTO AZUL */ .btn_terciario {color: #0080BB;background-color: #fff;border-color: #fff;font-size: 0.75rem; padding:0.75rem 2rem;} .btn_terciario:hover {color: #fff;background-color: #0080BB;border-color: #0080BB;} .btn_terciario:focus, .btn_terciario.focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} .btn_terciario.disabled, .btn_terciario:disabled {color: #fff;background-color: #007bff;border-color: #007bff;} .btn_terciario:not(:disabled):not(.disabled):active, .btn_terciario:not(:disabled):not(.disabled).active,.show > .btn_terciario.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;} .btn_terciario:not(:disabled):not(.disabled):active:focus, .btn_terciario:not(:disabled):not(.disabled).active:focus,.show > .btn_terciario.dropdown-toggle:focus {box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);} /* FONDO TURQUESA Y TEXTO AZUL */ .btn_cuaternario{color: #283370;background-color: #06EDCF;border-color: #06EDCF;font-size: 0.75rem;} .btn_cuaternario:hover {color: #283370;background-color: #D0D4D6;border-color: #D0D4D6;} /* BTN RESETEAR */ .btn-resetear {color: #0080BB;background-color: #fff;font-size: 1rem;padding:15px 30px; border-radius: 30px;} .btn-resetear:hover {color: #0080BB;background-color: #D0D4D6;} /* BTN SUGERIDOS */ .btn-sugeridos {color: #0080BB;background-color: #06EDCF;font-size: 1rem; padding:15px 30px; border-radius: 30px;} .btn-sugeridos:hover {color: #0080BB;background-color: #D0D4D6;} /* BTN RRSS */ .btn-facebook {color: #fff;background-color: #4466AA;border-color: #4466AA;} .btn-facebook:hover {color: #fff;background-color: #0F2E60;border-color: #0F2E60;} .btn-google {color: #fff;background-color: #E85839;border-color: #E85839;} .btn-google:hover {color: #fff;background-color: #B72F18;border-color: #B72F18;} .btn-robot { overflow: hidden; } .btn-robot img{position: relative;top: -30px } /* BTN SERVICIOS */ .btn_servicios{color: #fff;background-color: #00BCF1;border-color: #00BCF1; font-size: 12px; display: inline-block;} .btn_servicios:hover{color: #fff;background-color: #164184;border-color: #164184;} .btn_servicios img{ height: 25px; margin-right: 10px; } .btn-delgado{ padding: 0.35rem 0.75rem; } /* BTN CON IMAGEN FONDO TURQUESA Y TEXTO AZUL */ .btn_con_imagen_turquesa{color: #283370;background-color: #06EDCF;border-color: #06EDCF;font-size: 0.75rem; padding: 5px 2rem 5px 5px; border-radius: 35px;} .btn_con_imagen_turquesa:hover {color: #fff;background-color: #164184;border-color: #164184;} .btn_con_imagen_turquesa img{ float: left; display: block; margin-right: 10px; } .btn_con_imagen_turquesa div{ float: left; display: block; text-align: left;} /* BTN CON IMAGEN CON FONDO CELESTE Y TEXTO BLANCO */ .btn_con_imagen_celeste{color: #fff;background-color: #00BCF1;border-color: #00BCF1;font-size: 0.75rem; padding: 5px 2rem 5px 5px; border-radius: 35px;} .btn_con_imagen_celeste:hover {color: #ffffff;background-color: #164184;border-color: #164184;} .btn_con_imagen_celeste img{ float: left; display: block; margin-right: 10px; } .btn_con_imagen_celeste div{ float: left; display: block; text-align: left;} /* BTN CON IMAGEN CON FONDO CELESTE Y TEXTO BLANCO */ .btn_con_imagen_azul{color: #fff;background-color: #0080BB;border-color: #0080BB;font-size: 0.75rem; padding: 5px 2rem 5px 5px; border-radius: 35px;} .btn_con_imagen_azul:hover {color: #ffffff;background-color: #164184;border-color: #164184;} .btn_con_imagen_azul img{ float: left; display: block; margin-right: 10px; } .btn_con_imagen_azul div{ float: left; display: block; text-align: left;} /* BTN CON IMAGEN UN LINEA */ .btn_con_imagen_una_linea div{ margin-top: 18px } .btn_dos_lineas{ font-size: 0.75rem; line-height: 14px;} .btn_tipo_auto{ border: 1px solid #BABABA; overflow: hidden; border-radius: 10px; display: block; margin-bottom: 20px; padding:10px; } .btn_tipo_auto:hover{ border: 1px solid #A5D7F2; background:#A5D7F2;} a.btn_filtro{ color: #0080BB; font-weight: 600; } a.btn_filtro:hover{text-decoration: none;} a.btn_filtro:after{content: "\f055"; font-family: 'Font Awesome 5 Free'; font-size: 20px;} .btn_redondo{color: #0080BB; background: #fff; border:1px solid #0080BB; border-radius: 50%; width: 42px; height: 42px; } .btn_redondo:hover, .btn_redondo:active{color: #fff; background: #0080BB;transition: color 0.5s, background 0.5s; } /* BTN TALLER */ .btn_taller{ border-radius: 5px; background: #00BCF1; color: #fff; display: block; margin-bottom: 10px; font-size: 12px; min-height: 90px;padding: 23px 20px;} .btn_taller:hover{border-radius: 5px;background: #E8E8E9; color: #D1D1D1; display: block;margin-bottom: 10px; font-size: 12px; min-height: 90px;padding: 23px 20px;} .btn_taller_mecanica{ background-image: url(../img/icono_mecanica_blanco.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_mecanica:hover{ background-image: url(../img/icono_mecanica_gris.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_mantenimiento{ background-image: url(../img/icono_mantenimiento_blanco.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_mantenimiento:hover{ background-image: url(../img/icono_mantenimiento_gris.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_diagnostico{ background-image: url(../img/icono_diagnostico_blanco.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_diagnostico:hover{ background-image: url(../img/icono_diagnostico_gris.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_lavado{ background-image: url(../img/icono_lavado_blanco.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_lavado:hover{ background-image: url(../img/icono_lavado_gris.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_pintura{ background-image: url(../img/icono_pintura_blanco.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_pintura:hover{ background-image: url(../img/icono_pintura_gris.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_revision{ background-image: url(../img/icono_accesorios_blanco.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } .btn_taller_revision:hover{ background-image: url(../img/icono_accesorios_gris.svg);background-size: 60px;background-repeat: no-repeat;background-position:20px center; } /* PORTADA CARACTERISTICAS */ .caract{ padding: 20px; } .caract img{ margin-bottom: 20px; } .caract h6{ margin-bottom: 20px; line-height: 30px; } .caract p{} .caract a{} .caract a{} /* PORTADA TARJETA SERVICIOS */ .tarjeta_servicios{ box-shadow: 1px 8px 5px rgba(0, 0, 0, 0.29);border-radius: 20px; color: #0080BB;overflow: hidden;} .tarjeta_servicios img{float: left; margin-right: 20px;} :placeholder-shown {/* Se aplica al input cuando el texto del placeholder se está mostrando */background-color: none;} ::placeholder {/* Se aplica específicamente al texto del placeholder */ font-family: 'Red Hat Display'; color: #BABABA;font-size: 13px;font-style: italic;} /* COMPRA SEGURA PORTADA */ .compra_segura {padding:3em;} .compra_segura h2{ font-size:} /* NECESITAS AYUDA PORTADA */ .necesitas_ayuda{padding:3em;} .necesitas_ayuda .btn {padding-left: 50px; padding-right: 50px;} /* SERVICIOS PORTADA */ .servicios{ padding: 2em 0; } /* ITEM CAROUSEL PORTADA */ .item_portada{ border: 1px solid #D0D0D0; overflow: hidden; border-radius: 20px; margin-top:2em; padding-right: 20px; } .item_portada img{ float: left; margin-right: 20px;} .item_portada h4{ color: #00BCF1; padding-top: 20px; font-weight: 400; font-size: 16px;} .item_portada p{ font-size: 13px; } .item_portada a{ font-size: 12px; } .item_portada h4 a{font-size: 15px; } /* ITEM CAROUSEL GALERIA FOTOS */ .item_galeria{ overflow: hidden; } .item_galeria img{ width: 54%; margin-right: 7px; } .precio_rango{ background: #fff; border: 1px solid #BABABA; border-radius: 15px; font-size:30px; color: #000; max-height: 100px; padding: 30px; text-align: center; font-weight: 600; } .escalaprecio {position: relative; font-weight:500;height:100px;background: #F3F2F3;border: 1px solid #D0D0D0; border-radius: 15px; height: 100px;padding: 20px 0 20px 60px; text-align: left; overflow: hidden;} .escalaprecio span{color:#585858;font-size: 12px;} .escalaprecio h6{ font-size: 18px; margin-bottom: 2px; } .escalaprecio .roj h6{ color:#E22E1F;} .escalaprecio .nar h6{ color:#F3B73A;} .escalaprecio .ver h6{ color:#33994D;} .escalaprecio .roj:before, .escalaprecio .nar:before, .escalaprecio .ver:before {position: absolute;font-family: 'FontAwesome';font-size:50px;top: 10px;left: 10px;color:#fff;} .escalaprecio .roj:before { content: "\f058"; color:#E22E1F;} .escalaprecio .nar:before { content: "\f058"; color:#F3B73A; } .escalaprecio .ver:before { content: "\f058"; color:#33994D; } /* CAJAS ======================================================================================================================= ================================================================================================================================ */ .box_comunidad{ padding: 3em 4em; } .box_comunidad p{ margin: 0 0 80px 0; } /* CAJAS PLAN */ .box_plan {background: #F3F2F3;border: 1px solid #D0D0D0; border-radius: 10px; padding:20px; text-align: center;} .box_plan p{color:#727172;} .box_plan ul{text-align: left; list-style: none; list-style-position: inside;padding-left: 10px;} .box_plan li{background: url('../img/icono_check.svg') no-repeat left top; background-size: 22px; line-height: 22px;font-size: 14px;padding-left: 30px;padding-bottom: 10px;} .box_plan li.reforestar{background: url('../img/icono_arbol.svg') no-repeat left top;background-size: 22px;} /* CAJAS PLAN GRATIS */ .box_gratis{background: #F3F2F3;border: 1px solid #D0D0D0; border-radius: 10px; padding:60px 20px; text-align: center;} .box_gratis_1{ height: 526px } .box_gratis_2{} /* CAJAS PLAN PROVEEDOR */ .box_proveedor{background: #F3F2F3;border: 1px solid #D0D0D0; border-radius: 10px; padding:20px; text-align: center;} .box_proveedor p{color:#727172;} .box_proveedor ul{text-align: left; list-style: none; list-style-position: inside;padding-left: 10px;} .box_proveedor li{background: url('../img/icono_check.svg') no-repeat left top;;background-size: 22px;line-height: 22px;font-size: 14px;padding-left: 30px;padding-bottom: 10px;} .box_proveedor li.reforestar{background: url('../img/icono_arbol.svg') no-repeat left top;;background-size: 22px;} .box_proveedor_1 h4 span, .box_proveedor_2 h4 span, .box_proveedor_3 h4 span{ font-weight: 400; font-size: 80%;} /* CAJAS AUTO */ .box_auto{background: #fff;border: 1px solid #D0D0D0; border-radius: 10px;text-align: center; margin-bottom: 20px;} .box_auto img{ border-radius: 10px 10px 0 0;} .box_auto .badges, .box_auto .comentario { text-align: left; padding-left: 10px; margin-top: -23px;} .box_auto .badges img, .box_auto .comentario img{ border-radius:0; margin-right: 5px; width: 40px;} .box_auto .marca{ display: block; color: #000; font-size: 16px;} .box_auto .anno{ display: block; color: #000; font-size: 12px; } .box_auto .kilometros{ display: block; color: #000; font-size: 16px; } .box_auto .precio{ display: block;color: #00BCF1; font-size: 20px; font-weight: 600; margin-bottom: 20px; margin-top: 10px; } .box_auto .thumbs img{ float: left; margin:10px; } /* CAJAS COMENTARIOS EN CONCESIONARIOS */ .box_comentarios{background: #F3F2F3;border-radius: 10px; padding: 2em 1em 2em 0;} .box_comentarios .comentarios{ overflow-y: scroll; overflow-x: hidden; height: 200px; } .box_comentarios .comentarios div.row{ padding: 10px 20px; } .box_comentarios .comentarios p{ font-size: 14px; } .box_comentarios .comentarios h6{ font-size: 16px; color: #00BCF1;} .box_comentarios .comentarios a{ font-size: 14px; } /* CAJAS COMENTARIOS EN AUTO */ .box_comentario_auto{ padding: 2rem 0 0rem 0;} .box_comentario_auto .comentarios{} .box_comentario_auto .comentarios p{ font-size: 14px; } .box_comentario_auto .comentarios img{ border-radius: 50%; } /* CAJAS ATRIBUTOS */ .box_atributo{box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.5); width: 18%; margin:0 1% 1rem; border-radius: 20px; background: #fff; padding: 20px 5px; text-align: center; font-size: 14px;font-weight: 600; min-height: 81px;height: 100px; } .box_atributo span.gr{ font-size: 20px; display: block; } .box_atributo span.ch{ font-size: 16px; margin-bottom: 6px; display: block;} .box_atributo p{font-size: 12px; color: #0080BB;font-weight: 400;} /* CAJAS ATRIBUTOS EN TAB */ .box_atributo_tab{box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.5); width: 100%; margin:0 0 1rem; border-radius: 20px; background: #fff; padding: 20px 5px; text-align: center; font-size: 14px;font-weight: 600; min-height: 81px;height: 80px; } .box_atributo_tab span.gr{ font-size: 20px; display: block; } .box_atributo_tab span.ch{ font-size: 16px; margin-bottom: 6px; display: block;} .box_atributo_tab p{font-size: 12px; color: #0080BB;font-weight: 400;} /* CAJA CONTENEDORA REDONDA */ .box_cont_gris{border-radius: 10px; overflow: hidden; padding: 20px 0;} /* CAJAS DESCUENTOS */ .box_descuento{ color: #0080BB; font-weight: 600; background: url(../img/icono_certificado.svg) no-repeat; padding-left: 80px; overflow: hidden;} .box_descuento span.num{ font-size: 50px; float: left; font-weight: 600;} .box_descuento div.pordcto{ float: left; line-height: 27px; margin-top: 20px;} .box_descuento div.pordcto span.por{ font-size: 35px;float: left; } .box_descuento div.pordcto span.dcto{ font-size: 12px;float: left; } p.descuento{ margin-top: 5.5rem } /* CAJA MANTENCIÓN */ .box_mantencion{ margin-top: 20px; } .box_mantencion img{float: left; margin-right: 10px;} .box_mantencion .texto{text-align: left;float: left;} .box_mantencion .texto span.prox{ font-size: 21px; color: #0080BB; font-weight: 600; display: block; margin-bottom: -5px } .box_mantencion .texto span.fech{ font-size: 30px; color: #00BCF1; font-weight: 800; display: block;} img.box_badge {position: relative;z-index: -10;} .box_badges img{ position: relative;z-index: 10; margin: -70px 10px 0; width: 20%; } /* CAJAS ASPECTOS AUTOS */ .box_aspectos{ overflow: hidden; } .box_aspectos img{float: left; margin-right: 10px; width: 70px;} .box_aspectos .texto{text-align: left;} .box_aspectos .texto span.prox{ font-size: 18px; color: #0080BB; font-weight: 500; display: block; } .box_aspectos .texto span.fech{ font-size: 22px; color: #00BCF1; font-weight: 700; display: block; } /* CAJAS MATCH */ .match, .match_activo{ color:#00BCF1; text-align: left;} .match span, .match_activo span{font-size: 18px;font-weight: 600;margin-right: 6px;} .match sup, .match_activo sub{top: -12px;font-weight: 500;font-size: 11px;} .match_activo{ color:#06EDCF;} .match_gr span{font-size: 24px;} .match_gr sup{font-size: 16px;} /* CAJAS VENDE Y RESPALDA */ .vende_respalda{ background: #fff; border-radius: 10px; border: 1px solid #D0D0D0; padding: 20px; overflow: hidden;} .vende_respalda h6{ float: left; color: #A2A1A1; font-weight: 600;font-size: 14px; } .vende_respalda div{ float: right; } .vende_respalda img{ margin-bottom: 20px; } .vende_respalda p{ margin-bottom: 0px; font-size: 14px; } .vende_respalda a{ color: #0080BB; font-size: 14px; float: right;font-weight: 600;} .vende_respalda i{ color:#0080BB ;} /* CAJAS VENDE */ .box_vende{ background: #fff; border-radius: 10px; border: 1px solid #D0D0D0; padding: 10px 20px; overflow: hidden; margin-bottom: 1rem;} .box_vende h6{ float: left; color: #A2A1A1; font-weight: 600;font-size: 14px; } .box_vende h4{ float: right; color: #00BCF1; font-weight: 600; margin-top: 15px;} .box_vende div{ float: right; } .box_vende img{ margin-bottom: 20px; float: left; } .box_vende p{ margin-bottom: 0px; font-size: 14px; } .box_vende a{ color: #0080BB; font-size: 14px; float: right;font-weight: 600;} .box_vende i{ color:#0080BB ;} /* CAJAS MISIONES */ .box_misiones{ margin: 0 1%; width:18%; float: left; text-align: center; padding: 10px 10px; min-height: 191px; overflow: hidden;} .box_misiones img{ margin-bottom: 10px;} .box_misiones_check {background: url('../img/icono_check.svg') no-repeat;top: 0;left: 140px;height: 40px;width: 40px; position: relative; width: 80% } .box_misiones_no_check{} .box_misiones_no_check p{ margin-top: 10px; } .box_misiones_no_check a{ margin-top: 9px;display: block; } /* CAJAS TALLERES */ .box_talleres{ border-radius: 10px; box-shadow: 1px 5px 8px rgba(0, 0, 0, 0.4); color: #0080BB; overflow: hidden; margin-bottom: 20px;} .box_talleres h6{ font-size: 17px; font-weight: 600; margin-top: 30px;} .box_talleres a{ font-size: 12px; } .box_talleres i{color: #00BCF1;} .box_talleres p{ font-size: 0.8rem; } .box_talleres div.like i { color: #06EDCF; float: right; position: relative;top: 10px; right: 10px;} .box_talleres div.certificado img{ color: #06EDCF; float: right; position: relative;right: 10px;} .box_servicio{ font-size: 12px; margin-bottom: 20px;} .box_servicio span{ display: block;} .box_servicio_activo{} .box_descripcion_auto{} .box_descripcion_auto h6{margin-bottom: 0px;} .box_descripcion_auto p{margin-bottom: 0px;} /* CLUB BENEFICIOS ===================================================================================================================================== ======================================================================================================================================================== */ /* ETIQUETAS */ .etiquetas{ margin-bottom: 10px; overflow: hidden; } .etiquetas a{ background:#E8E8E9; border-radius:20px; float: left; color: #000; margin: 10px 10px 10px 0; font-size: 12px; font-weight: 500;padding: 5px 15px; transition: background 0.5s;} .etiquetas a:hover{ background:#D0D0D0; text-decoration: none; } /* CAJAS PRODUCTOS */ .box_producto{ border-radius: 20px; border:1px solid #D0D0D0; padding-bottom: 20px; margin-bottom: 35px; background: #fff; } .box_producto h5{margin-bottom: 40px;text-align: center;margin-top: 20px;} .box_producto img{ border-radius: 20px 20px 0px 0px;margin-bottom: 10px;} .box_producto ul{ border-left: 1px solid #D0D0D0; font-size: 12px; color: #D1D1D1; padding: 10px 0px 10px 10px; list-style: none; } .box_producto ul li{ font-weight: 600; } /* CARRUSEL DESTACADOS */ .carousel_destacados{ background: #fff; border:1px solid #D0D0D0;border-radius: 20px; } .carousel_destacados h4{ margin-top: 20px; } .carousel_destacados p{ font-size: 12px; margin-right: 15px; margin-bottom: 40px; } .carousel_destacados ul{ border-left: 1px solid #D1D1D1; font-size: 12px; color: #D1D1D1; padding: 10px 0px 10px 10px; list-style: none; } .carousel_destacados ul li{ font-weight: 600; } .carousel-control-prev{left:-3%;} .carousel-control-next{right:-3%;} .carousel_destacados .btn_primario{ padding-right: 30px; padding-left: 30px; } .carousel_destacados img{ } /* GALERIA PRODUCTOS */ .galeria_productos_actual {display: flex;width: 100%;flex-direction: row;justify-content: center;align-items: flex-start;padding: 0;} .galeria_productos_actual img{border-radius: 20px 0 0 20px;} .galeria_productos_miniatura { overflow: hidden; } ul.lista_miniaturas{ overflow: hidden; padding: 0;} .galeria_productos_miniatura .lista_miniaturas li {margin-bottom: 5px;cursor: pointer;position: relative;width: 100px;height: auto; float: left; margin-right: 10px; list-style: none;} .galeria_productos_miniatura .lista_miniaturas li img {display: block;width: 100%;} .galeria_productos_miniatura .lista_miniaturas li:hover::before {content: "";width: 3px;height: 100%;background: #00BCF1;position: absolute;top: 0;left: 0;} /* GALERIA FOTOS AUTO */ .galeria_fotos {display: flex;width: 100%;flex-direction: row;justify-content: center;align-items: flex-start;padding: 0;} .galeria_fotos img{border-radius: 10px;} .galeria_fotos_miniatura { overflow: hidden; } ul.lista_fotos_miniaturas{ overflow: hidden; padding: 0; margin-top: 20px;} .galeria_fotos_miniatura .lista_fotos_miniaturas li {cursor: pointer;position: relative;list-style: none;} .galeria_fotos_miniatura .lista_fotos_miniaturas li img {display: block;width: 100%;border-radius: 10px;} .galeria_fotos_miniatura .lista_fotos_miniaturas li:hover::before {content: "";width: 0px;height: 100%;background: #00BCF1;position: absolute;top: 0;left: 0;} /* PAGINA CONCESIONARIO ===================================================================================================================================== ======================================================================================================================================================== */ .concesionario{ padding: 30px 0;} .concesionario img.marca{ border-radius: 50%; border:5px solid #0080BB;box-shadow: 1px 3px 12px rgba(0, 0, 0, 0.5); float: left;display: block;margin-right:10px; } .concesionario h4{font-size:20px; font-weight: 400; margin-top: 20px;} .concesionario h5{ font-size: 14px; font-weight: 400;} .concesionario span{ float: left; margin-right: 10px;font-weight: 400;} .concesionario{} .concesionario sub.n_coment{ background: #fff; padding: 13px 15px 13px 10px; bottom: 20px; left: 50px; font-weight: 600; border-radius: 50%; font-size: 12px; display: block; width: 10px; height: 10px;} .concesionario2{background: #F3F2F3; border-radius: 20px; padding: 20px 10px; overflow: hidden;} .concesionario2 img{margin-right: 10px;} .concesionario2 h5 span{ font-size: 24px } /* BÁSICOS (Colores textos y fondos, sombras, etc) ============================================================================= ================================================================================================================================ */ /* FONDOS */ .bgcelclr{ background: #00BCF1; } .bggriscl{ background: #F3F2F3; } .bgazlosc{ background: #164184; } .bgcelosc{ background: #0080BB; } .bgblanco{ background: #ffffff; } /* COLORES TEXTOS */ .tcol_blc{ color: #ffffff !important; } .tcol_cel{ font-size: 2.25rem !important; /*text-shadow: 0px 0px 5px rgb(0 0 0 / 41%);*/ color: #0800FF;} .tcol_tur{ color: #06EDCF !important; } .tcol_azl{ color: #0080BB !important; } .tcol_roj{ color: #E22E1F !important; } .tcol_nar{ color: #F3B73A !important; } .tcol_ver{ color: #33994D !important; } .tcol_grs{ color: #A2A1A1 !important; } .tcol_mrg{ color: #3A3A3A !important; } .tcol_veo{ color: #5DB254 !important; } .tcol_azl{ color: #0080BB !important; } .tcol_ama{ color: #EECC64 !important; } .tcol_aca{ color: #FFBD00 !important; } /* SOMBRAS */ .boxshadow{box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.29)} /* MARGEN PIE */ .mb_sticky_unboton{margin-bottom: 11rem;} .mb_sticky_dosbotones{margin-bottom: 8rem;} /* BORDES Y RADIOS */ .b_rad_10{border-radius: 10px} .sin_borde{border:none !important;} /* TAMAÑOS FUENTES */ .fs11{ font-size: 11px !important; } .fs12{ font-size: 12px !important; } .fs13{ font-size: 13px !important; } .fs14{ font-size: 14px !important; } a.iniciolink{ font-size: 13px; text-decoration: none; margin:0 10px; } a.tcol_tur{color: #06EDCF !important;} a.tcol_tur:hover{color: #09C6A6 !important;} /* TABLAS ====================================================================================================================== ================================================================================================================================ */ /* TABLA FACTURA */ table.factura{font-size: 21px; border-spacing: 0px;} table.factura thead{background:#D1D1D1;} table.factura thead td{padding: 10px 5px;} table.factura tbody{font-size: 16px;} table.factura tbody td{padding: 10px 5px;} table.factura tbody td span{font-size: 28px; font-weight: 600;} table.factura tfoot{background:#D1D1D1;padding: 5px } table.factura tfoot td{ background:#D1D1D1;padding: 5px } table.talleres{text-align: left; border-top: 1px solid #E8E8E9;} table.talleres tr{ border-bottom: 1px solid #E8E8E9; } table.talleres tr.even{ background: #F3F2F3; } table.talleres tr td.texto{ padding:30px 20px 0;} table.talleres tr td i{ color: #00BCF1;} table.talleres tr td h6{ color: #0080BB; } .talleres th, .talleres td{ padding: 0 } table.horario{ border: none; margin: 20px auto; font-size: 14px;} table.horario th, table.horario td{border: none; padding: 5px 0;} table.horario td{ width: 30%;} /* FOOTER ====================================================================================================================== ================================================================================================================================ */ footer{ background: #F3F2F3; padding: 30px 0; } footer p{ font-size: 14px; width: 250px;} footer p a{ font-size: 14px; display: block; font-weight: 400;} footer img.logo{margin-bottom: 20px;} footer img.ausp_foot{ margin-left: 10px; width: 20%; } footer i.ico_foot{margin: 30px 0px 20px 10px;} .sticky_footer{position: fixed;bottom: 0;width: 100%;} /* CARRUSEL RESPONSIVO ========================================================================================================= ================================================================================================================================ */ .owl-carousel {display: none;width: 100%;-webkit-tap-highlight-color: transparent;/* position relative and z-index fix webkit rendering fonts issue */position: relative;z-index: 1; } .owl-carousel .owl-stage {position: relative;-ms-touch-action: pan-Y;touch-action: manipulation;-moz-backface-visibility: hidden;/* fix firefox animation glitch */ } .owl-carousel .owl-stage:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0; } .owl-carousel .owl-stage-outer {position: relative;overflow: hidden;/* fix for flashing background */-webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper, .owl-carousel .owl-item {-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;-ms-backface-visibility: hidden;-webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item {position: relative;min-height: 1px;float: left;-webkit-backface-visibility: hidden;-webkit-tap-highlight-color: transparent;-webkit-touch-callout: none; } .owl-carousel .owl-item img {display: block; } .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled {display: none; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot {cursor: pointer;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot {background: none;color: inherit;border: none;padding: 0 !important;font: inherit; } .owl-carousel .owl-nav .owl-prev{ float: left; } .owl-carousel .owl-nav .owl-next{ float: right; } .owl-carousel.owl-loaded {display: block; } .owl-carousel.owl-loading {opacity: 0;display: block; } .owl-carousel.owl-hidden {opacity: 0; } .owl-carousel.owl-refresh .owl-item {visibility: hidden; } .owl-carousel.owl-drag .owl-item {-ms-touch-action: pan-y;touch-action: pan-y;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; } .owl-carousel.owl-grab {cursor: move;cursor: grab; } .owl-carousel.owl-rtl {direction: rtl; } .owl-carousel.owl-rtl .owl-item {float: right; } .no-js .owl-carousel {display: block; } .owl-carousel .animated {animation-duration: 1000ms;animation-fill-mode: both; } .owl-carousel .owl-animated-in {z-index: 0; } .owl-carousel .owl-animated-out {z-index: 1; } .owl-carousel .fadeOut {animation-name: fadeOut; } @keyframes fadeOut { 0% {opacity: 1; } 100% {opacity: 0; } } .owl-height {transition: height 500ms ease-in-out; } .owl-carousel .owl-item {/**This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrongcalculation of the height of the owl-item that breaks page layouts*/ } .owl-carousel .owl-item .owl-lazy {opacity: 0;transition: opacity 400ms ease; } .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {max-height: 0; } .owl-carousel .owl-item img.owl-lazy {transform-style: preserve-3d; } .owl-carousel .owl-video-wrapper {position: relative;height: 100%;background: #000; } .owl-carousel .owl-video-play-icon {position: absolute;height: 80px;width: 80px;left: 50%;top: 50%;margin-top: -40px;background: url("owl.video.play.png") no-repeat;cursor: pointer;z-index: 1;-webkit-backface-visibility: hidden;transition: transform 100ms ease; } .owl-carousel .owl-video-play-icon:hover {-ms-transform: scale(1.3, 1.3);transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-tn,.owl-carousel .owl-video-playing .owl-video-play-icon {display: none; } .owl-carousel .owl-video-tn {height: 100%;background-position: center center;background-repeat: no-repeat;background-size: contain;transition: opacity 400ms ease; } .owl-carousel .owl-video-frame {position: relative;z-index: 1;height: 100%;width: 100%; } .owl-theme .owl-nav {margin-top: 0px;text-align: center;-webkit-tap-highlight-color: transparent; } .owl-theme .owl-nav [class*='owl-'] {color: #FFF;font-size: 14px;margin: 5px;padding: 4px 7px;background: none;display: inline-block;cursor: pointer;border-radius: 3px} .owl-theme .owl-nav [class*='owl-']:hover {background: none;color: #FFF;text-decoration: none; } .owl-theme .owl-nav .disabled {opacity: 0.5;cursor: default; } .owl-theme .owl-nav.disabled + .owl-dots {margin-top: 10px; } .owl-theme .owl-dots {text-align: center;-webkit-tap-highlight-color: transparent; } .owl-theme .owl-dots .owl-dot {display: inline-block;zoom: 1;*display: inline; } .owl-theme .owl-dots .owl-dot span {width: 10px;height: 10px;margin: 5px 7px;background: #D6D6D6;display: block;-webkit-backface-visibility: visible;transition: opacity 200ms ease;border-radius: 30px; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {background: #869791; } .main-content {position: relative;} .owl-theme .custom-nav {position: absolute;top: 30%;left: 0;right: 0;} .owl-prev, .owl-next {position: absolute;height: 100px;color: inherit;background: none;border: none;z-index: 100;} .owl-prev {left: 0;} .owl-next {right: 0;} .owl-theme .custom-nav2 {position: absolute;top: -10%;} .custom-nav2 .owl-prev {left: 0;} .custom-nav2 .owl-next {right: 0;} /* FORMULARIOS ================================================================================================================= ================================================================================================================================ */ /* LABEL Y SELECT */ form.publicar{ margin-bottom: 3em; margin: 0 11%; padding-top: 25px; padding-bottom: 35px; background-color: rgb(100%, 100%, 100%, 0.82);} form.publicar label{ font-size: 17px; font-weight: 400; } form.publicar .select {position: relative;border: 1px solid #ccc;width: 100%;border-radius: 30px;overflow: hidden;background-color: #fff;} form.publicar .select:before {content: '';position: absolute;right: 12px;top: 16px;width: 0;height: 0;border-style: solid;border-width: 10px 8px 0 8px;border-color: #000000 transparent transparent transparent;z-index: 5;pointer-events: none;} form.publicar .select select {padding: 5px 8px;width: 100%;border: none;box-shadow: none;background-color: transparent;background-image: none;appearance: none;} form.publicar small{margin-top: 15px;font-size: 70%;display: block;} @media (max-width: 992px) { form.publicar{ padding-top: 25px; margin: 0 5%; } form.publicar label { font-size: 16px; } } /* PASOS FORMULARIO */ .step{ background: #F2F2F2; color: #0690d2; font-weight: 600; font-size:28px; padding-top: 3px; display: block;border-radius: 50%; width: 50px; height: 50px; text-align: center;box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.2); margin: 0 auto;margin-bottom: 10px;} .stept{ color: #0690d2; font-size: 14px;font-weight: 600;text-align: center;width: 100px;display: block;margin: 0 auto;} .steppasado{ background: #06EDCF; color: #fff; } .steptpasado{ color: #06EDCF; } .stepactual{ background: #000; color: #fff; } .steptactual{ color: #2B3A39 ;} /* NEW CHECK*/ .newcheck {display: block;position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;} /* Hide the browser's default checkbox */ .newcheck input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;} /* Create a custom checkbox */.newcheck .checkmark {position: absolute;top: 0;left: 0;height: 25px;width: 25px;background-color: #fff;border: 1px solid #bababa;border-radius: 5px;} /* On mouse-over, add a grey background color */.newcheck:hover input ~ .checkmark {background-color:none;} /* When the checkbox is checked, add a blue background */.newcheck input:checked ~ .checkmark {background-color: #fff;border: 1px solid #bababa;border-radius: 5px;} /* Create the checkmark/indicator (hidden when not checked) */.newcheck .checkmark:after {content: "";position: absolute;display: none;} /* Show the checkmark when checked */.newcheck input:checked ~ .checkmark:after {display: block;} /* Style the checkmark/indicator */.newcheck .checkmark:after {left: 9px;top: 3px;width: 7px;height: 15px;border: solid #00BCF1;border-width: 0 3px 3px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);} label.newcheck{ padding-top: 5px; } /* RADIO BUTTON*/ .newradio {display: block;position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;} /* Hide the browser's default radio button */.newradio input {position: absolute;opacity: 0;cursor: pointer;} /* Create a custom radio button */.newradio .checkmark {position: absolute;top: 0;left: 0;height: 25px;width: 25px;background-color: #fff;border-radius: 50%;border: 1px solid #ccc;} /* On mouse-over, add a grey background color */.newradio:hover input ~ .checkmark {background-color: ;} /* When the radio button is checked, add a blue background */.newradio input:checked ~ .checkmark {background-color: #fff;} /* Create the indicator (the dot/circle - hidden when not checked) */.newradio .checkmark:after {content: "";position: absolute;display: none;} /* Show the indicator (dot/circle) when checked */.newradio input:checked ~ .checkmark:after {display: block;} /* Style the indicator (dot/circle) */.newradio .checkmark:after {top: 5px;left: 5px;width: 14px;height: 14px;border-radius: 50%;background: #00BCF1;} /* RANGO */ .rangocontainer {width: 100%;} .rango {-webkit-appearance: none;width: 100%;height: 15px;border-radius: 5px;background: rgba(51,153,77,1);background: -moz-linear-gradient(left, rgba(51,153,77,1) 0%, rgba(93,178,84,1) 15%, rgba(155,196,72,1) 30%, rgba(218,218,31,1) 46%, rgba(244,230,33,1) 60%, rgba(239,159,10,1) 73%, rgba(231,105,26,1) 86%, rgba(226,47,31,1) 100%);background: -webkit-gradient(left top, right top, color-stop(0%, rgba(51,153,77,1)), color-stop(15%, rgba(93,178,84,1)), color-stop(30%, rgba(155,196,72,1)), color-stop(46%, rgba(218,218,31,1)), color-stop(60%, rgba(244,230,33,1)), color-stop(73%, rgba(239,159,10,1)), color-stop(86%, rgba(231,105,26,1)), color-stop(100%, rgba(226,47,31,1)));background: -webkit-linear-gradient(left, rgba(51,153,77,1) 0%, rgba(93,178,84,1) 15%, rgba(155,196,72,1) 30%, rgba(218,218,31,1) 46%, rgba(244,230,33,1) 60%, rgba(239,159,10,1) 73%, rgba(231,105,26,1) 86%, rgba(226,47,31,1) 100%);background: -o-linear-gradient(left, rgba(51,153,77,1) 0%, rgba(93,178,84,1) 15%, rgba(155,196,72,1) 30%, rgba(218,218,31,1) 46%, rgba(244,230,33,1) 60%, rgba(239,159,10,1) 73%, rgba(231,105,26,1) 86%, rgba(226,47,31,1) 100%);background: -ms-linear-gradient(left, rgba(51,153,77,1) 0%, rgba(93,178,84,1) 15%, rgba(155,196,72,1) 30%, rgba(218,218,31,1) 46%, rgba(244,230,33,1) 60%, rgba(239,159,10,1) 73%, rgba(231,105,26,1) 86%, rgba(226,47,31,1) 100%);background: linear-gradient(to right, rgba(51,153,77,1) 0%, rgba(93,178,84,1) 15%, rgba(155,196,72,1) 30%, rgba(218,218,31,1) 46%, rgba(244,230,33,1) 60%, rgba(239,159,10,1) 73%, rgba(231,105,26,1) 86%, rgba(226,47,31,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33994d', endColorstr='#e22f1f', GradientType=1 );outline: none !important;} .rango:hover {} .rango::-webkit-slider-thumb {-webkit-appearance: none;appearance: none;width: 25px;height: 25px;border-radius: 50%;background: #4CAF50;cursor: pointer;} .rango::-moz-range-thumb {width: 50px;height: 50px;border-radius: 50%;background: #ddd;cursor: pointer;outline: none !important;} /* SUBIR FOTO */ .upload_btn_wrapper {position: relative;overflow: hidden;display: inline-block; background:#F3F2F3; border: 1px dashed #BABABA;padding: 20px;border-radius: 10px; width: 100%; text-align: center;margin-top: 0rem !important; margin-bottom: 3rem} .upload_btn_wrapper p{ color: #BABABA;margin: 10px 0 80px 0; font-style: italic; } .btnupload {background:#BABABA;color: #fff; padding: 8px 20px;border-radius: 30px;border:none;font-size: 20px;font-weight: bold; margin: 80px 0 0 0;} .upload_btn_wrapper input[type=file] {font-size: 200px;position: absolute;left: 0;top: 0;opacity: 0;} /* COLORES ---------------------- */ /* The container */.seleccion_colores {position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; float: left;width: 70px; height: 70px; border-radius: 50%; display: block; float: left;} /* Hide the browser's default checkbox */.seleccion_colores input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;} /* Create a custom checkbox */.checkmark {position: absolute;top: 0;left: 7px;height: 46px;width: 46px;border-radius: 50%; } /* On mouse-over, add a grey background color */.seleccion_colores:hover input ~ .checkmark {background-color: none;width: 46px; height: 46px; border-radius: 50%; padding: 4px; float: left;} /* When the checkbox is checked, add a blue background */.seleccion_colores input:checked ~ .checkmark {background-color: none;} /* Create the checkmark/indicator (hidden when not checked) */.checkmark:after {content: "";position: absolute;display: none;} /* Show the checkmark when checked */.seleccion_colores input:checked ~ .checkmark:after {display: block;} /* Style the checkmark/indicator */.seleccion_colores .checkmark:after {left: -7px;top: -7px;width: 5px;height: 10px;border: solid white; border: 2px solid #368AC0;width: 58px; height: 58px; border-radius: 50%; padding: 4px; float: left;} div.colores{ margin-top: 25px; overflow: hidden; padding: 20px 0px; text-align: center; } .c_blc{background: #ffffff; border: 1px solid #000000;} .c_ngr{background: #000000; border: 1px solid #000000;} .c_bdo{background: #BD342E; border: 1px solid #BD342E;} .c_roj{background: #E42B12; border: 1px solid #E42B12;} .c_ama{background: #F4E621; border: 1px solid #F4E621;} .c_ver{background: #33994D; border: 1px solid #33994D;} .c_mor{background: #3B4192; border: 1px solid #3B4192;} .c_plt{background: #D1D1D1; border: 1px solid #D1D1D1;} .c_grs{background: #898989; border: 1px solid #898989;} .c_mrg{background: #3A3A3A; border: 1px solid #3A3A3A;} .c_tur{background: #40B0A7; border: 1px solid #40B0A7;} .c_pur{background: #6A3F90; border: 1px solid #6A3F90;} .c_cel{background: #86CEF3; border: 1px solid #86CEF3;} .c_azl{background: #337EC0; border: 1px solid #337EC0;} /* CHECKBOX BOTON ---------------------- */ .btn_check{ color: #999; } /* The container */.seleccion_boton {position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; float: left;width: 100%; height: 70px; border-radius: 30px; display: block;} /* Hide the browser's default checkbox */.seleccion_boton input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;} /* Create a custom checkbox */.seleccion_boton .checkmark {position: absolute;top: 0;left: 0px;height: 100%;width: 100%;border-radius: 40px;background:#E8E8E9;color: #D1D1D1;} /* On mouse-over, add a grey background color */.seleccion_boton:hover input ~ .checkmark {background-color: none;padding: 4px; float: left;} /* When the checkbox is checked, add a blue background */.seleccion_boton input:checked ~ .checkmark {background-color: none;} /* Create the checkmark/indicator (hidden when not checked) */.checkmark:after {content: "";position: absolute;display: none;} /* Show the checkmark when checked */.seleccion_boton input:checked ~ .checkmark:after {display: block;} /* Style the checkmark/indicator */.seleccion_boton .checkmark:after {left: 0px;top: 0px;width: 100%; height: 100%; border-radius: 40px; padding: 4px; float: left; background: #00BCF1; color: #fff;} .seleccion_boton label{z-index: 1000;} /* FORMULARIO AYUDA ===================================================================================================================================== ======================================================================================================================================================== */ .caja_ayuda{box-shadow: 1px 5px 7px rgba(0, 0, 0, 0.29); border-radius: 20px; padding:10px 20px; margin-bottom: 20px; overflow: hidden;} /* BOTONES SELECCIONADORES */ .btn_selec{color: #fff;background-color: #00BCF1;border-color: #00BCF1;width: 100%; margin-bottom: 10px; padding: 20px 25px; border-radius: 40px; height: 70px;} .btn_selec:hover {color: #D1D1D1;background-color: #E8E8E9;border-color: #E8E8E9;width: 100%; margin-bottom: 10px;padding: 20px 25px; border-radius: 40px; height: 70px;} .btn_deselec{color: #D1D1D1;background-color: #E8E8E9;border-color: #E8E8E9;width: 100%; margin-bottom: 10px; padding: 20px 25px; border-radius: 40px; height: 70px;} .btn_deselec:hover {color: #D1D1D1;background-color: #E8E8E9;border-color: #E8E8E9;width: 100%; margin-bottom: 10px;padding: 20px 25px; border-radius: 40px; height: 70px;} .espacio{ border: 1px solid #ccc; border-radius: 20px; padding: 20px 10px; } .espacio a{color: #D1D1D1;background-color: #fff;width: 100%; margin-bottom: 10px; padding: 20px 25px; border-radius: 40px; height: 70px; border:3px dashed #ccc;} .espacio a:hover {color: #D1D1D1;background-color: #fff;width: 100%; margin-bottom: 10px;padding: 20px 25px; border-radius: 40px; height: 70px; border:3px dashed #ccc;} .btn_selec2, .btn_selec2:hover{ line-height: 19px; padding: 15px 25px; } /* COLORES ---------------------- */ /* The container */.seleccion_colores {position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; float: left;width: 70px; height: 70px; border-radius: 50%; display: block; float: left;} /* Hide the browser's default checkbox */.seleccion_colores input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;} /* Create a custom checkbox */.checkmark {position: absolute;top: 0;left: 7px;height: 46px;width: 46px;border-radius: 50%; } /* On mouse-over, add a grey background color */.seleccion_colores:hover input ~ .checkmark {background-color: none;width: 46px; height: 46px; border-radius: 50%; padding: 4px; float: left;} /* When the checkbox is checked, add a blue background */.seleccion_colores input:checked ~ .checkmark {background-color: none;} /* Create the checkmark/indicator (hidden when not checked) */.checkmark:after {content: "";position: absolute;display: none;} /* Show the checkmark when checked */.seleccion_colores input:checked ~ .checkmark:after {display: block;} /* Style the checkmark/indicator */.seleccion_colores .checkmark:after {left: -7px;top: -7px;width: 5px;height: 10px;border: solid white; border: 2px solid #368AC0;width: 58px; height: 58px; border-radius: 50%; padding: 4px; float: left;} /* RANGOS */ .rs-container *{box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} .rs-container{font-family:Arial,Helvetica,sans-serif;height:45px;position:relative} .rs-container .rs-bg, .rs-container .rs-selected{background-color:#A5D7F2;border:1px solid #ededed;height:10px;left:0;position:absolute;top:5px;width:100%;border-radius:3px} .rs-container .rs-selected{background-color:#0080BB;border:1px solid #0080BB;transition:all .2s linear;width:0} .rs-container .disabled .rs-selected{background-color:#ccc;border-color:#bbb} .rs-container .rs-pointer{background-color:#0080BB;border-radius:20px;cursor:pointer;height:40px;left:-10px;position:absolute;top:-10px;transition:all .2s linear; width:40px;box-shadow: 1px 1px 4px rgba(0,0,0,0.5)} .rs-container .disabled .rs-pointer{border-color:#ccc;cursor:default} .rs-container .rs-pointer::after, .rs-container .rs-pointer::before{content:'';position:absolute;width:1px;width: 3px;height: 16px;background-color: #00BCF1;left: 13px;top: 11px;} .rs-container .rs-pointer::after{left:auto;right:12px} .rs-container .sliding .rs-pointer, .rs-container.sliding .rs-selected{transition:none} .rs-container .rs-scale{left:0;position:absolute;top:5px;white-space:nowrap} .rs-container .rs-scale span{float:left;position:relative} .rs-container .rs-scale span::before{background-color:#000;content:"";height:8px;left:0;position:absolute;top:10px;width:1px} .rs-container.rs-noscale span::before{display:none} .rs-container.rs-noscale span:first-child::before, .rs-container.rs-noscale span:last-child::before{display:none} .rs-container .rs-scale span:last-child{margin-left:-1px;width:0} .rs-container .rs-scale span ins{color:#333;display:inline-block;font-size:12px;margin-top:20px;text-decoration:none; display: none;} .rs-container .disabled .rs-scale span ins{color:#999} .rs-tooltip{color:#0080BB;width:auto;min-width:60px;height:30px;background:#fff;border:1px solid #fff;border-radius:3px;position:absolute; transform:translate(-50%,-35px);left:13px;text-align:center;font-size:13px;padding:6px 10px 0; box-shadow:0px 1px 7px #ccc;} .rs-container .disabled .rs-tooltip{border-color:#fff;color:#0080BB; box-shadow: 1px 2px 3px #ccc;} .google-maps {position: relative;padding-bottom: 75%; // This is the aspect ratioheight: 0;overflow: hidden; border-radius: 10px;} .google-maps iframe {position: absolute;top: 0;left: 0;width: 100% !important;height: 100% !important;} /* ----- MODAL STYLE ----- */ .modal.left .modal-dialog, .modal.right .modal-dialog { position: fixed; margin: 0px; width: 400px; height: 100%; -webkit-transform: translate3d(0%, 0, 0); -ms-transform: translate3d(0%, 0, 0); -o-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0); } .modal.left .modal-content, .modal.right .modal-content { height: 100%; overflow-y: auto; } .modal.left .modal-body, .modal.right .modal-body { padding: 0px; } /*Left*/ .modal.left.fade .modal-dialog{ left: -350px; -webkit-transition: opacity 0.3s linear, left 0.3s ease-out; -moz-transition: opacity 0.3s linear, left 0.3s ease-out; -o-transition: opacity 0.3s linear, left 0.3s ease-out; transition: opacity 0.3s linear, left 0.3s ease-out; } .modal.left.fade.in .modal-dialog{ left: 0; } /*Right*/ .modal.right.fade .modal-dialog { right: -350px; -webkit-transition: opacity 0.3s linear, right 0.3s ease-out; -moz-transition: opacity 0.3s linear, right 0.3s ease-out; -o-transition: opacity 0.3s linear, right 0.3s ease-out; transition: opacity 0.3s linear, right 0.3s ease-out; } .modal.right.fade.in .modal-dialog { right: 0; } /* ESTILO PINTEREST */ [class^='imghvr-'], [class*='imghvr-'] {border-radius: 10px 10px 0 0 ;position: relative;display: inline-block;margin: 0;max-width: 100%;background: none;overflow: hidden;-webkit-backface-visibility: hidden;backface-visibility: hidden;-moz-osx-font-smoothing: grayscale;-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);-o-transform: translateZ(0);transform: translateZ(0);} [class^='imghvr-'] > img, [class*='imghvr-'] > img {vertical-align: top;max-width: 100%;} [class^='imghvr-'] figcaption, [class*='imghvr-'] figcaption { padding: 30px;position: absolute;top: 0;bottom: 0;left: 0;right: 0;} [class^='imghvr-'] figcaption h1, [class^='imghvr-'] figcaption h2, [class^='imghvr-'] figcaption h3, [class^='imghvr-'] figcaption h4, [class^='imghvr-'] figcaption h5, [class^='imghvr-'] figcaption h6, [class*='imghvr-'] figcaption h1, [class*='imghvr-'] figcaption h2, [class*='imghvr-'] figcaption h3, [class*='imghvr-'] figcaption h4, [class*='imghvr-'] figcaption h6 {color: #ffffff;} [class^='imghvr-'] a, [class*='imghvr-'] a {position: absolute;top: 0;bottom: 0;left: 0;right: 0;z-index: 1;} [class^='imghvr-'], [class*='imghvr-'], [class^='imghvr-']:before, [class^='imghvr-']:after, [class*='imghvr-']:before, [class*='imghvr-']:after, [class^='imghvr-'] *, [class*='imghvr-'] *, [class^='imghvr-'] *:before, [class^='imghvr-'] *:after, [class*='imghvr-'] *:before, [class*='imghvr-'] *:after {box-sizing: border-box;-webkit-transition: all 0.35s ease;-moz-transition: all 0.35s ease;transition: all 0.35s ease;} [class^='imghvr-fade'] figcaption, [class*='imghvr-fade'] figcaption {opacity: 0;} [class^='imghvr-fade']:hover > img, [class*='imghvr-fade']:hover > img {opacity: 1;} [class^='imghvr-fade']:hover figcaption, [class*='imghvr-fade']:hover figcaption {opacity: 1;} [class^='imghvr-fade']:hover > img, [class^='imghvr-fade']:hover figcaption, [class*='imghvr-fade']:hover > img, [class*='imghvr-fade']:hover figcaption {-webkit-transform: translate(0, 0);-moz-transform: translate(0, 0);-ms-transform: translate(0, 0);-o-transform: translate(0, 0);transform: translate(0, 0);} a.pin i{ background: #fff; border-radius: 50%; padding: 10px; box-shadow: 1px 5px 8px rgba(0, 0, 0, 0.4); font-size: 25px;} a.pin img{ background: #fff; border-radius: 50%; padding: 0px; box-shadow: 1px 5px 8px rgba(0, 0, 0, 0.4);} a.p1{ position: absolute;top: -40px; left: -10px; } a.p2{ position: absolute;top: -20px; left: -80px; } a.p3{ position: absolute;top: 20px; left: -150px; } a.p4{ position: absolute;top: 70px; left: -190px; } /* -------------------------------------------------------------------------------------------------------------------------------- ---------------------------------------------------------------- XXS B4 Extra small devices (portrait phones, less than 576px) */ @media (max-width: 380px) { .tarjeta_servicios{ box-shadow: 1px 8px 5px rgba(0, 0, 0, 0.29);border-radius: 20px; color: #0080BB;overflow: hidden; margin-bottom: 30px;} .tarjeta_servicios img{float: left; margin-right: 10px; width: 100px} .tarjeta_servicios h5{font-size: 12px; margin-top: 10px;} .tarjeta_servicios h6{font-size: 12px;} .tarjeta_servicios i{} .tarjeta_servicios a{font-size: 12px; display: block;} .tarjeta_servicios p {color: #06EDCF; } .tarjeta_servicios p i{} .tarjeta_servicios img.ico{float: right; margin-right: 10px;margin-bottom: 10px;width: 10%;} .tarjeta_servicios .match{ float: left; color: #06EDCF; } .tarjeta_servicios .match span{ font-weight: 500;overflow: hidden;} .tarjeta_servicios .match sup{ float: left; color: #06EDCF;top: 0em; } .tarjeta_servicios i.match{ color: #06EDCF; } } /* background: #000 -------------------------------------------------------------------------------------------------------------------------------- ---------------------------------------------------------------- XS B4 Extra small devices (portrait phones, less than 576px) */ @media (max-width: 575px) { .container {max-width: 540px; } .compra_segura {padding: 1.5rem 0 2.5rem;} .compra_segura h2{ font-size:1.5rem;} .compra_segura img{max-width: 80px;} .compra_segura p{font-size: 13px;} .compra_segura span{font-size: 11px;} .btn_consiste {padding:0.75rem 1rem;} .btn_consiste:hover {} .btn_oferta a{color: #585858;background-color: #fff; border: #00BCF1 1px solid;font-size: 1rem; padding: 2px 1em 5px 1em; border-radius: 30px;font-weight: 500; transition: background 0.5s;} .btn_oferta a:hover {background-color: #164184; color: #fff;} .btn_oferta a img{ float: left; display: inline-block; margin-right: 10px; width: 80px; } .btn_oferta a div{ margin: 20px 0px 10px ;float: left; display: inline-block; text-align: left; line-height: 26px; font-size: 0.9em; } .item_portada{ padding-right: 0px; } .item_portada img{ width: 100%; margin-bottom: 20px;} .item_portada h4{ padding: 0 20px; } .item_portada p{ padding: 0 20px; } .item_portada a{ padding: 0 20px; margin-bottom: 20px; } .item_portada h4 a{font-size: 15px; } .necesitas_ayuda{padding: 1.5rem 0 2.5rem;} .necesitas_ayuda h2{ font-size:1.5rem;} .necesitas_ayuda p{font-size: 13px;} .necesitas_ayuda .btn{ display: block;font-size: 12px;padding-left: 40px; padding-right: 40px;} .btn_recomendacion a div{font-size: 13px; padding: 0 1rem 0 5rem; } /* BTN INICIO VER */ .btn_inicio_ver{ width: 100%;} .btn_inicio_ver a{ width: 80%; margin: 0 10%;} /* BTN INICIO PUBLICA */ .btn_inicio_publica{ width: 100%} .btn_inicio_publica a{ width: 80%; margin: 0 10%;} .btn_inicio_publica a div{ padding: 0 2rem 0 1rem; } .box_comunidad{ padding: 1em 0em;} .box_comunidad p{ margin: 0 0 20px 0; } /* BTN INICIO TECNICO */ .btn_tecnico a div{ padding: 0 2rem 0 4rem; font-size:14px;} .btn_tecnico_3 a div{ line-height: 13px; font-size: 13px; margin-left: 10px;padding: 0 2rem 0 5rem; } /* SOLUCIONAR CON MEDIA QUERY */ .tarjeta_servicios{ box-shadow: 1px 8px 5px rgba(0, 0, 0, 0.29);border-radius: 20px; color: #0080BB;overflow: hidden; margin-bottom: 30px;} .tarjeta_servicios img{float: left; margin-right: 10px; width: 100px} .tarjeta_servicios h5{font-size: 12px; margin-top: 10px;} .tarjeta_servicios h6{font-size: 12px;} .tarjeta_servicios i{} .tarjeta_servicios a{font-size: 12px; display: block;} .tarjeta_servicios p {color: #06EDCF; } .tarjeta_servicios p i{} .tarjeta_servicios img.ico{float: right; margin-right: 10px;margin-bottom: 10px;width: 10%;} .tarjeta_servicios .match{ float: right; color: #06EDCF; } .tarjeta_servicios .match span{ font-weight: 500;overflow: hidden;} .tarjeta_servicios .match sup{ float: left; color: #06EDCF;top: 0em; } .tarjeta_servicios i.match{ color: #06EDCF; } /* SOLUCIONAR CON MEDIA QUERY */ .servicios a.btn{display: block;} /* PORTADA CARACTERISTICAS */ .caract img{ max-width: 60px;} .caract p, .caract h6{ text-align: left;} .caract a{ float: left;} /* FORMULARIOS */ form.publicar{ margin-bottom: 1em; } .upload_btn_wrapper {margin-top: 0.5rem !important; } /* PASOS FORMULARIO */ .stept{ text-align: left;width: 300px; font-weight: 400;} .steptpasado{ color: #06EDCF;width: 300px } .steptactual{ color: #2B3A39} .upload_btn_wrapper p{ display: :none; color: #BABABA;margin: 10px 0 80px 0; font-style: italic; } /* TABLA FACTURA */ table.factura tbody td span{font-size: 18px;} /* CAJAS PLAN */ .box_plan_1,.box_plan_2,.box_plan_3,.box_plan_4{ margin-bottom: 30px;} /* CAJAS PLAN PROVEEDOR */ .box_proveedor_1,.box_proveedor_2,.box_proveedor_3{margin-bottom: 30px;} /* CAJAS PLAN PROVEEDOR */ .box_gratis{margin-bottom: 30px;} /* CAJAS PRODUCTOS */ .box_producto a.btn{font-size: 12px;} .box_producto h6{} /* CARRUSEL DESTACADOS */ .carousel_destacados h4{ margin-left: 15px;} .carousel_destacados h6{ margin-top: 0px; margin-left: 15px;} .carousel_destacados p{ margin-bottom: 20px; margin-left: 15px; } .carousel_destacados .btn_primario{ font-size: 12px;padding-right: 10px; padding-left: 10px; margin-left: 15px; } .carousel-control-prev, .carousel-control-next{width: 30%;top: -70%;} .galeria_productos_miniatura .lista_miniaturas li {width: 50px;} .galeria_productos_actual img{border-radius: 20px 20px 0 0 ;} .mb_sticky_dosbotones{margin-bottom: 13rem;} .nav-tabs .nav-link{ padding: 0.5rem 0.3rem; font-size: 11px; } .box_mantencion .texto span.prox{ font-size: 16px;} .box_mantencion .texto span.fech{ font-size: 18px;} p.descuento{ margin-top: 1rem } .box_misiones{width:48%; min-height: 253px; margin-bottom: 20px;} .box_misiones_check {left: 80px;} /* CAJAS ATRIBUTOS */ .box_atributo{width: 23%;} .box_atributo span.gr, .box_atributo span.ch{ font-size: 16px; margin-bottom: 0px;} .box_atributo p{font-size: 10px;} /* CAJAS ASPECTOS AUTOS */ .box_aspectos{ overflow: hidden; } .box_aspectos img{float: left; margin-right: 5px; width: 40px;} .box_aspectos .texto{text-align: left;} .box_aspectos .texto span.prox{ font-size: 13px; color: #0080BB; font-weight: 500; display: block; } .box_aspectos .texto span.fech{ font-size: 14px; color: #00BCF1; font-weight: 700; display: block; } .box_mantencion img{ margin: 0 6px 0 0px; } .box_mantencion .texto{ margin-top:15px; } /* CAJAS TALLERES */ .box_talleres h6{ font-size: 15px;margin-bottom: 3px; margin-top: 60px;} .box_talleres a{ font-size: 12px; } .box_talleres i{color: #00BCF1;} .box_talleres p{ margin-bottom: 3px; } .box_talleres div.certificado img{width: 30px;} /* CAJAS VENDE */ .box_vende h4{ font-size: 18px; margin-top: 7px;} table.horario{ font-size: 11px; } /* BTN SERVICIOS */ .btn_servicios{ width: 100%; margin-bottom: 20px;} .btn_servicios:hover{color: #fff;background-color: #164184;border-color: #164184;} .btn_servicios img{ height: 25px; margin-right: 10px; } .caja_ayuda{padding:10px;overflow: hidden;} /* BOTONES SELECCIONADORES */ .btn_selec{margin-bottom: 10px; padding: 10px 15px; height: 50px;} .btn_selec:hover { margin-bottom: 10px;padding: 10px 15px; height: 50px;} .btn_selec2, .btn_selec2:hover{ line-height: inherit; padding: 15px 15px; } .btn_deselec{margin-bottom: 10px; padding: 10px 15px; height: 50px;} .btn_deselec:hover {margin-bottom: 10px;padding: 10px 15px; height: 50px;} .btn_deselec, .btn_selec{ font-size: 12px; line-height: 24px;} .espacio{ padding: 20px 15px; } .espacio a, .espacio a:hover {margin-bottom: 10px;padding: 10px 15px; height: 50px; } a.p1{ position: absolute;top: -40px; left: -10px; } a.p2{ position: absolute;top: -20px; left: -80px; } a.p3{ position: absolute;top: 20px; left: -150px; } a.p4{ position: absolute;top: 70px; left: -190px; } /* COLORES ---------------------- */ /* The container */.seleccion_colores {width: 66px; height: 66px;} /* The container */.seleccion_colores2 {width: 72px; height: 72px;} /* FOOTER */ footer img.logo{ width: 100%; } footer img.ausp_foot{ width: 25%;display: inline-block; } } /* background: #008 -------------------------------------------------------------------------------------------------------------------------------- ---------------------------------------------------------------- SM B4 Extra small devices (portrait phones, less than 576px) */ @media (min-width: 576px) and (max-width: 767px){ .container {max-width: 540px; } /* PORTADA CARACTERISTICAS */ .caract p, .caract h6{ text-align: left;} .caract img{ max-width: 80px;} .caract a{ float: left;} /* CAJAS PLAN */ .box_plan_1,.box_plan_2,.box_plan_3,.box_plan_4{ margin-bottom: 30px;} /* CAJAS PLAN PROVEEDOR */ .box_proveedor_1,.box_proveedor_2,.box_proveedor_3{margin-bottom: 30px;} /* CAJAS PLAN PROVEEDOR */ .box_gratis{margin-bottom: 30px;} /* CARRUSEL DESTACADOS */ .carousel_destacados h4{ margin-top: 20px; margin-left: 15px; } .carousel_destacados h6{ margin-top: 0px; margin-left: 15px;} .carousel_destacados p{ font-size: 12px; margin-right: 15px; margin-bottom: 40px; margin-left: 15px;} .carousel_destacados .btn_primario{ padding-right: 30px; padding-left: 30px;margin-left: 15px; } .carousel_destacados img{ } .carousel-control-prev, .carousel-control-next{width: 20%;top: -20%;} .galeria_productos_actual img{border-radius: 20px 20px 0 0 ;} .box_auto .match span, .box_auto .match_activo span{font-size: 16px;} .box_misiones{width:31%; min-height: 254px; margin-bottom: 20px;} .box_misiones_check {left: 100px;} /* FOOTER */ footer img.logo{ width: 100%; } footer img.ausp_foot{width: 31%;display: inline-block;} } /* background: #080 -------------------------------------------------------------------------------------------------------------------------------- ---------------------------------------------------------------- MD B4 Small devices (landscape phones, less than 768px) */ @media (min-width: 768px) and (max-width: 991px) { .container {max-width: 720px; } /* PORTADA CARACTERISTICAS */ .caract p, .caract h6{ text-align: center;} .caract a{ float: none;} /* TABLA FACTURA */ table.factura tbody td span{font-size: 20px;} /* CAJAS PLAN */ .box_plan_1,.box_plan_2{ margin-bottom: 30px; height: 450px;} .box_plan_3,.box_plan_4{ margin-bottom: 30px; height: 605px;} .box_plan_1 a.btn{ margin-top:43px; } .box_plan_2 a.btn{ } .box_plan_3 a.btn{ margin-top: 96px; } .box_plan_4 a.btn{} /* CAJAS PLAN PROVEEDOR */ .box_proveedor_1,.box_proveedor_2,.box_proveedor_3{ height: 595px ;} .box_proveedor_1 a.btn{margin-top:154px;} .box_proveedor_2 a.btn{} .box_proveedor_3 a.btn{margin-top:38px;} /* CAJAS PLAN PROVEEDOR */ .box_gratis{ height: 550px; } .box_gratis_1 {} .box_gratis_2 {} /* CAJAS PRODUCTOS */ .box_producto a.btn{font-size: 12px;} .box_producto h6{font-size: 15px;} /* CARRUSEL DESTACADOS */ .carousel_destacados h4{ margin-top: 20px;margin-left: 15px; } .carousel_destacados h6{ margin-top: 0px; margin-left: 15px;} .carousel_destacados p{ margin-left: 15px; } .carousel_destacados .btn_primario{ padding-right: 30px; padding-left: 30px;margin-left: 15px; } .galeria_productos_miniatura .lista_miniaturas li {width: 70px;} .galeria_productos_actual img{border-radius: 20px 20px 0 0 ;} .box_misiones{width:31%; min-height: 254px; margin-bottom: 20px;} .box_misiones_check {left: 100px;} .box_badges img{ margin: -80px 10px 0; width: 15%; } /* FOOTER */ footer img.logo{ width: 80%; } footer img.ausp_foot{ } } /* background: #f00 -------------------------------------------------------------------------------------------------------------------------------- ---------------------------------------------------------------- LG B4 Medium devices (tablets, less than 992px) */ @media (min-width: 992px) and (max-width: 1199px) { .container {max-width: 960px; } /* ITEM CAROUSEL */ .item_portada{ border: 1px solid #D0D0D0; overflow: hidden; border-radius: 20px; margin-top:2em; padding-right: 20px; } .item_portada img{ width: 54%; margin-right: 7px; } .item_portada h4{padding-top: 2px; font-size: 1rem;} .item_portada p{ font-size: 12px; margin-bottom: 5px; } .item_portada a{ font-size: 11px; } /* TABLA FACTURA */ table.factura tbody td span{font-size: 20px;} /* CAJAS PLAN */ .box_plan_1,.box_plan_2,.box_plan_3,.box_plan_4{height: 820px} .box_plan_1 a.btn{ margin-top: 392px; } .box_plan_2 a.btn{ margin-top: 343px; } .box_plan_3 a.btn{ margin-top: 227px; } .box_plan_4 a.btn{} /* CAJAS PLAN PROVEEDOR */ .box_proveedor_1,.box_proveedor_2,.box_proveedor_3{ height: 490px ;} .box_proveedor_1 a.btn{margin-top:69px;} .box_proveedor_2 a.btn{} .box_proveedor_3 a.btn{margin-top: 39px ;} /* CARRUSEL DESTACADOS */ .carousel_destacados h4{ margin-top: 30px; } .carousel_destacados p{ font-size: 12px; margin-right: 15px; margin-bottom: 40px; } .carousel-control-prev{left:-5%;} .carousel-control-next{right:-5%;} table.talleres tr td.texto{ padding:60px 20px 0;} .box_auto .badges { margin-top: -17px;} .box_auto .badges img{width: 34px;} .box_auto .match span, .box_auto .match_activo span{font-size: 13px;} /* FOOTER */ footer img.logo{ width: 80%; } footer img.ausp_foot{} } /* background: #ff0 -------------------------------------------------------------------------------------------------------------------------------- ---------------------------------------------------------------- XL B4 Large devices (desktops, less than 1200px) */ @media (min-width: 1200px) { .container {max-width: 1190px; } /* PORTADA CARACTERISTICAS */ .caract h6{ width: 300px; margin:0 auto 20px; } /* CAJAS PLAN */ .box_plan_1,.box_plan_2,.box_plan_3,.box_plan_4{max-height: 700px} .box_plan_1 a.btn{ margin-top: 287px; } .box_plan_2 a.btn{ margin-top: 245px; } .box_plan_3 a.btn{ margin-top: 163px; } /* CAJAS PLAN PROVEEDOR */ .box_proveedor_1,.box_proveedor_2,.box_proveedor_3{ height: 490px ;} .box_proveedor_1 ul{margin-top: 91px ;} .box_proveedor_2 a.btn{} .box_proveedor_3 ul{margin-top: 16px;} /* CARRUSEL DESTACADOS */ .carousel_destacados h4{ margin-top: 70px; } .carousel-control-prev{left:-7%;} .carousel-control-next{right:-7%;} table.talleres tr td.texto{ padding:60px 20px 0;} /* FOOTER */ footer img.ausp_foot{display: inline-block;} } .title-tooltip { display: flex; align-items: center; margin: 1.5em 0 0; } .title-tooltip-radio { display: block; } .title-tooltip-radio input[type=checkbox] { display: inline; } .btn-new-tool { background: none; padding: 0 .25em; margin: 0 0 .25em; color: #a0da00; } .btn-new-tool:active, .btn-new-tool:focus{ outline: none; box-shadow: none; } .form-group input[type=file] { visibility: hidden; } .form-group .audio-label{ display: flex; align-items: center; cursor: pointer; } .form-group .audio-label i { color: #a0da00; font-size: 1.75em; margin: 0 .5em .5em 0; } .form-group .audio-label p { font-size: 1.5em; margin: 0 .5em .5em 0; } /* Tooltip container */ .tooltip { position: relative; display: inline-block; } .pointer_custom { cursor: pointer; } .motivation { z-index:0; padding-bottom: 25px; padding-top: 60px; /*margin-top: -95px;*/ background-repeat: no-repeat; background-position: center; background-size: cover; } @media (max-width: 992px) { .motivation { /*background-size: cover; background-position: top center;*/ margin-top: -15px; height: 100%; } .tcol_cel { font-size: 1.4rem !important; } } .motivationidx { height: 100vh; /*padding-top: 267px; margin-top: -142px;*/ background-repeat: no-repeat; background-position: top right; background-size: 100%; } @media (max-width: 992px) { .motivationidx { margin-top: -50px; padding-top: 97px; } } .dedication { font-weight: 600; margin-top: -30px; color: #066391; margin-top: 0.25rem !important; } @media (max-width: 992px) { .dedication { margin-top: -20px; } } .producto { margin-bottom: 0.35rem; } .tit-preg { color: #066391 !important; padding-right: 1rem; font-size: 1.42rem; } .tit-diag { color: #066391; } .respuesta { font-size: 1.1rem; padding-left: 1rem; } .respuesta-tit { font-size: 1.2rem; padding-left: 1rem; } .bajada { font-size: 1.25rem; padding-left: 1rem; padding-right: 2rem; margin-top: -14px; /*color: #066391; font-weight: 500;*/ line-height: 1.5rem; } .impacto { padding: 15px; text-align: left; } .indicecv { border-radius: 50%; width: 150px; height: 150px; border: solid 5px; justify-content: center; align-items: center; text-align: center; margin: 20px; padding: 3%; display: flex; color: red; font-size: 2.5rem; font-weight: 600; } a.user-link { text-decoration: none; color: #0800FF; font-weight: bold;} a.user-link:hover { text-decoration: underline; color: #002089;} .respuestas-box { background: #E0DFFF; border-radius: 14px; box-shadow: 0 2px 7px #e3e6ed; padding: 35px; } .respuesta-item { margin-bottom: 18px; } .pregunta { font-weight: 600; color: #333; } .respuesta { color: #5342a4; margin-top: 4px; } .bloque-ai { background: #fff6e6; padding: 20px; border-radius: 12px; margin-top: 40px; border: 1px solid #ffe3b3; } .recap_box{ /* Frame 103 */ /* Auto layout */ display: flex; flex-direction: column; align-items: flex-start; padding: 14px 18px; gap: 14px; width: 50%; /*height: 150px;*/ /* Violet */ background: #7A76FF; border-radius: 10px; /* Inside auto layout */ flex: none; order: 0; flex-grow: 0; color: #fff; } .do-imgs { display: flex; align-items: center; justify-content: center; } .con-ticket { list-style-image: url('/templates/ticket.png'); /* Reemplaza con la ruta correcta de tu imagen */ /* También puedes agregar padding o márgenes si es necesario */ /*padding-left: 20px; /* Espacio a la izquierda de la imagen */ } textarea { width:100%; height:17em !important; margin-bottom:10px; } .section { margin-bottom:1.5em; }