/*
Theme Name: Pirineos Rent a Car
Author: MadeWordPress
Author URI: http://madewordpress.com/
Theme URI: http://madewordpress.com/
Description:
Template: vantage
Version: 1.0.0
License:
Tags:
Text Domain: pirineosrac
*/
/******************************************* SELECTORES ******************************************/
/*
:root -> Para "document"
TAGS:
-----
* -> Todos los elementos
div p -> Todos los "p" dentro de un "div"
div > p -> Todos los "p" cuyo padre es un "div"
div + p -> Todos los "p" que van inmediatamente después de un "div"
div ~ p -> Cada "p" que va precedido de un "div"
:not(p) -> Cada elemento que NO es un "p"
:before -> Antes
:after -> Después
:empty -> VacÃo
:selection -> Lo que está seleccionado
:target -> El elemento en el que se ha hecho click
:first-letter -> La primera letra
:first-line -> La primera lÃnea
:lang(es) -> Con atributo "lang" = "es"
ATRIBUTOS:
----------
[title] -> Elemento/s que tienen "title"
[title = "flower"] -> Elemento/s cuyo "title" es igual a "flower"
[title ~= "flower"] -> Elemento/s cuyo "title" contiene la palabra "flower"
[title |= "flower"] -> Elemento/s cuyo "title" empieza por la palabra "flower"
[title ^= "flower"] -> Elemento/s cuyo "title" empieza por la cadena "flower"
[title $= "flower"] -> Elemento/s cuyo "title" acaba por la cadena "flower"
[title *= "flower"] -> Elemento/s cuyo "title" contiene la cadena "flower"
ENLACES:
--------
:active -> Activo
:hover -> Enfoque
:visited -> Visitado
:link -> No visitado
INPUTS:
-------
:checked -> Checked
:disabled -> Disabled
:enabled -> NO disabled
:focus -> Con foco
:in-range -> Con valor dentro de un rango
:out-range -> Con valor fuera de un rango
:invalid -> Con valor válido
:invalid -> Con valor no válido
:required -> Con "required" (sólo para "input")
:optional -> Sin "required" (sólo para "input")
:read-only -> Con "readonly" (sólo para "input")
:read-write -> Sin "readonly" (sólo para "input")
NODES:
------
p:first-of-type -> Cada "p" que es el primer "p" de su padre
p:last-of-type -> Cada "p" que es el último "p" de su padre
p:nth-of-type(n) -> Cada "p" que es el "n" "p" de su padre
p:nth-last-child(n) -> Cada "p" que es el "n" "p" de su padre, contanto desde el final
p:first-child -> Cada "p" que es el primer hijo de su padre
p:last-child -> Cada "p" que es el último hijo de su padre
p:nth-child(n) -> Cada "p" que es el "n" hijo de su padre
p:nth-last-child(n) -> Cada "p" que es el "n" hijo de su padre, contanto desde el final
p:only-child -> Cada "p" que es el único hijo de su padre
p:only-of-type -> Cada "p" que es el único "p" de su padre
*/
/**************************************** GAMA DE COLORES ****************************************/
/* Azul Oscuro: 005376 rgb( 0, 83,118) */
/* Gris: 999999 rgb(153,153,153) */
/* Azul Medio: 8CA8C2 rgb(140,168,194) */
/* Azul Claro: C8D8E8 rgb(200,216,232) */
/* Azul Muy Claro: E0F3FC rgb(224,243,252) */
/* Verde 1: 90C254 rgb(144,194, 84) */
/* Verde 2: C8DDAB rgb(200,221,171) */
/* Verde 3: E6F0D7 rgb(230,240,215) */
/* Naranja 1: FF7711 rgb(255,119, 17) */
/* Naranja 2: FFEEDD rgb(255,238,221) */
/******************************************** Z-INDEX ********************************************/
/*
9999 -> .main-navigation
998 -> <nav>
10000 -> lightbox
*/
/******************************************* INCLUDES ********************************************/
@import url("../vantage/style.css?q=20240901");
@import url("style-header.css?q=20240901");
@import url("style-home.css?q=20240901");
@import url("style-footer.css?q=20240901");
@import url("style-pages.css?q=20240901");
@import url("style-blog.css?q=20240901");
@import url("style-icons.css?q=20240901");
@import url("style-animate.css?q=20240901");
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i');
:root {
--color1-hex: #005376;
--color2-hex: #999999;
--color3-hex: #8CA8C2;
--color4-hex: #C8D8E8;
--color5-hex: #E0F3FC;
--color-ver1-hex: #90C254;
--color-ver2-hex: #C8DDAB;
--color-ver3-hex: #E6F0D7;
--color-nar1-hex: #FF7711;
--color-nar2-hex: #FFEEDD;
--color-star-hex: #F8B805;
--color1-rgb: 0, 83,118;
--color2-rgb: 153,153,153;
--color3-rgb: 140,168,194;
--color4-rgb: 200,216,232;
--color5-rgb: 224,243,252;
--color-ver1-rgb: 144,194, 84;
--color-ver2-rgb: 200,221,171;
--color-ver3-rgb: 230,240,215;
--color-nar1-rgb: 255,119, 17;
--color-nar2-rgb: 255,238,221;
--color-star-rgb: 248,184,5;
--font-family-normal: "Roboto", sans-serif;
--font-family-narrow: "Roboto Condensed", sans-serif;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong,
sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td { font-family: var(--font-family-normal); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-family-normal); }
/******************************************** GENERAL ********************************************/
#main { padding: 20px; } /* No afecta a header ni a footer porque no son "main" */
/*#main div[id^="row"] { padding: 0px 20px; } No afecta a header ni a footer porque no son "main" */
#main div[id^="row"] * { box-sizing: border-box; } /* No afecta a header ni a footer porque no son "main" */
a, a:active, a:hover, a:focus, a:visited { outline: 0; }
h1,h2,h3,h4,h5,h6 { margin: 0px !important; line-height: 120%; }
* { line-height: 140%; }
br { line-height: inherit; }
.ow-button-base a { line-height: 120%; } /* Para widgets "Botón de SiteOrigin" */
img { line-height: 0px; }
MWP-COMMENT { display:none; }
/*************************************** ASESOR DE COOKIES ***************************************/
.cdp-cookies-alerta .cdp-cookies-texto { left: 10px !important; padding: 10px !important; width: 340px !important; }
.cdp-cookies-alerta .cdp-cookies-texto { background-color: var(--color1-hex) !important; }
.cdp-cookies-alerta .cdp-cookies-texto { border: solid 1px #FFFFFF !important; border-radius: 10px; text-align: center; }
.cdp-cookies-alerta .cdp-cookies-texto h4 { color: #CCCCCC !important; text-align: center !important; }
.cdp-cookies-alerta .cdp-cookies-texto p { font-size: 12px; color: #CCCCCC !important; line-height: 120%; text-align: justify !important; }
.cdp-cookies-alerta .cdp-cookies-texto a { font-size: 12px; color: #AAAAAA !important; }
.cdp-cookies-alerta.cdp-cookies-tema-gris .cdp-cookies-texto a { color: #AAAAAA !important; }
.cdp-cookies-boton-cerrar { margin-top: 10px; background-color: #666666 !important; border-radius: 5px; }
/************************************* JOIN.CHAT (WhatsApp) **************************************/
.joinchat__button { bottom: 65px !important; right: -15px !important; }
.joinchat__tooltip { border-radius: 8px !important; display: flex; align-items: center; }
.joinchat__box { max-width: 350px !important; border-radius: 16px !important; }
.joinchat__header a.joinchat__powered { display: none !important; }
.joinchat__header:before { content: "\f232"; margin-right: 10px; font-family: "FontAwesome"; font-size: 40px; color: #B8DCD8; }
.joinchat__header:after { content: "WhatsApp"; font-family: var(--font-family-normal); font-size: 24px; font-weight: 500; color: #B8DCD8; }
.joinchat__box__scroll { background: none; background-color: #E6DDD4 !important; background-image: url("https://cdn.join.chat/app/uploads/2020/05/whatsapp-bg.png") !important; }
.joinchat__message { border-radius: 12px !important; }
@media (max-width: 980px) {
.joinchat { --header: 50px !important; --btn: 50px !important; }
.joinchat__tooltip { padding: 0px 10px !important; font-size: 14px; height: 28px !important; }
.joinchat__box { max-width: 305px !important; border-radius: 14px !important; }
.joinchat__header { padding: 0px 20px !important; }
.joinchat__header:before { font-size: 30px; }
.joinchat__header:after { font-size: 20px; }
.joinchat__close { margin-top: 4px !important; width: 24px !important; height: 24px !important; right: 15px !important; }
.joinchat__message { padding: 12px 15px !important; font-size: 14px; border-radius: 10px !important; }
}
@media (max-width: 780px) {
.joinchat { --header: 40px !important; }
.joinchat__box { border-radius: 12px !important; }
.joinchat__header { padding: 0px 15px !important; }
.joinchat__header:before { margin-right: 5px; font-size: 24px; }
.joinchat__header:after { font-size: 18px; }
.joinchat__close { margin-top: 6px !important; width: 20px !important; height: 20px !important; right: 12px !important; background-size: 10px !important; }
.joinchat__message { padding: 10px 12px !important; min-height: auto !important; font-size: 14px; border-radius: 8px !important; }
}
@media (max-width: 580px) {
.joinchat { --header: 32px !important; --btn: 40px !important; }
.joinchat__tooltip { font-size: 13px; }
.joinchat__box { border-radius: 10px !important; }
.joinchat__header { padding: 0px 10px !important; }
.joinchat__header:before { font-size: 22px; }
.joinchat__header:after { font-size: 16px; }
.joinchat__message { margin: 0px 15px 15px 20px !important; padding: 8px 10px !important; font-size: 13px; }
}
@media (max-width: 480px) { .joinchat__button { bottom: 79px !important; right: -1px !important; } .joinchat__message { line-height: 140% !important; } }
@media (max-width: 380px) { .joinchat--chatbox .joinchat__button__sendtext { padding: 0px 2px 0px 15px !important; font-size: 14px; } }
@media (max-width: 360px) { .joinchat__agents--collapsed .joinchat__agent { margin: 0 0 0 30px !important; } }
/******************************************* LIGHTBOX ********************************************/
.tos-wrapper.tos-fixed { z-index: 10000 !important; }
/******************************************** TEXTOS *********************************************/
.pJustify { text-align: justify; }
.pFirstLetter:first-letter { float: left; margin-right: 10px; color: var(--color3-hex); font-size: 74px; font-weight: 600; line-height: 90%; }
.Ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.Narrow { font-family: var(--font-family-narrow) !important; }
.two-columns { column-count: 2; column-gap: 60px; column-rule: solid 1px var(--color4-hex); } /* Texto a 2 columnas */
.three-columns { column-count: 3; column-gap: 40px; column-rule: solid 1px var(--color4-hex); } /* Texto a 3 columnas */
.four-columns { column-count: 4; column-gap: 35px; column-rule: solid 1px var(--color4-hex); } /* Texto a 4 columnas */
.five-columns { column-count: 5; column-gap: 30px; column-rule: solid 1px var(--color4-hex); } /* Texto a 5 columnas */
@media (max-width: 780px) {
.two-columns { column-count: 1; column-gap: 0px; column-rule: none; }
.three-columns { column-count: 1; column-gap: 0px; column-rule: none; }
.four-columns { column-count: 1; column-gap: 0px; column-rule: none; }
.five-columns { column-count: 1; column-gap: 0px; column-rule: none; }
}
br300, br400, br500, br600, br700, br800, br900, br1000, br1100, br1200, br1300, br1400, br1500, br1600, br1700, br1800, br1900, br5000 { line-height: inherit !important; }
br300:before { content: " "; } @media (max-width: 300px) { br300:before { content: "\A"; white-space: pre-line; } }
br400:before { content: " "; } @media (max-width: 400px) { br400:before { content: "\A"; white-space: pre-line; } }
br500:before { content: " "; } @media (max-width: 500px) { br500:before { content: "\A"; white-space: pre-line; } }
br600:before { content: " "; } @media (max-width: 600px) { br600:before { content: "\A"; white-space: pre-line; } }
br700:before { content: " "; } @media (max-width: 700px) { br700:before { content: "\A"; white-space: pre-line; } }
br800:before { content: " "; } @media (max-width: 800px) { br800:before { content: "\A"; white-space: pre-line; } }
br900:before { content: " "; } @media (max-width: 900px) { br900:before { content: "\A"; white-space: pre-line; } }
br1000:before { content: " "; } @media (max-width: 1000px) { br1000:before { content: "\A"; white-space: pre-line; } }
br1100:before { content: " "; } @media (max-width: 1100px) { br1100:before { content: "\A"; white-space: pre-line; } }
br1200:before { content: " "; } @media (max-width: 1200px) { br1200:before { content: "\A"; white-space: pre-line; } }
br1300:before { content: " "; } @media (max-width: 1300px) { br1300:before { content: "\A"; white-space: pre-line; } }
br1400:before { content: " "; } @media (max-width: 1400px) { br1400:before { content: "\A"; white-space: pre-line; } }
br1500:before { content: " "; } @media (max-width: 1500px) { br1500:before { content: "\A"; white-space: pre-line; } }
br1600:before { content: " "; } @media (max-width: 1600px) { br1600:before { content: "\A"; white-space: pre-line; } }
br1700:before { content: " "; } @media (max-width: 1700px) { br1700:before { content: "\A"; white-space: pre-line; } }
br1800:before { content: " "; } @media (max-width: 1800px) { br1800:before { content: "\A"; white-space: pre-line; } }
br1900:before { content: " "; } @media (max-width: 1900px) { br1900:before { content: "\A"; white-space: pre-line; } }
br5000:before { content: " "; } @media (max-width: 5000px) { br5000:before { content: "\A"; white-space: pre-line; } }
.blink { -webkit-animation: blink-animation 1s steps(5, start) infinite; animation: blink-animation 1s steps(5, start) infinite; } /* Parpadeo */
@-webkit-keyframes blink-animation { to { visibility: hidden; } }
@keyframes blink-animation { to { visibility: hidden; } }
/***************************************** EFECTOS HOVER *****************************************/
.hoverCursorZoom:hover { cursor: zoom-in; }
.hoverScale11, .hoverScale12, .hoverScale16, .hoverOpacity10, .hoverShadowYellow, hoverShadowOrange, hoverShadowGreen {
-webkit-transition: all 0.5s ease; transition: all 0.5s ease;
}
.hoverScale11:hover { -webkit-transform: scale(1.1); transform: scale(1.1); }
.hoverScale12:hover { -webkit-transform: scale(1.2); transform: scale(1.2); }
.hoverScale16:hover { -webkit-transform: scale(1.6); transform: scale(1.6); }
.hoverShadowYellow:hover {
-webkit-box-shadow: 0px 0px 5px 0px rgba(253,240,26,1);
-moz-box-shadow: 0px 0px 5px 0px rgba(253,240,26,1);
box-shadow: 0px 0px 5px 0px rgba(253,240,26,1);
}
.hoverShadowOrange:hover {
-webkit-box-shadow: 0px 0px 5px 0px rgba(244,126,60,1);
-moz-box-shadow: 0px 0px 5px 0px rgba(244,126,60,1);
box-shadow: 0px 0px 5px 0px rgba(244,126,60,1);
}
.hoverShadowGreen:hover {
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,102,85,1);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,102,85,1);
box-shadow: 0px 0px 5px 0px rgba(0,102,85,1);
}
.hoverShadowRed:hover {
-webkit-box-shadow: 0px 0px 5px 0px rgba(255,0,0,1);
-moz-box-shadow: 0px 0px 5px 0px rgba(255,0,0,1);
box-shadow: 0px 0px 5px 0px rgba(255,0,0,1);
}
.hoverOpacity05:hover { opacity: 0.5 !important; }
.hoverOpacity08:hover { opacity: 0.8 !important; }
.hoverOpacity10:hover { opacity: 1.0 !important; }
/****************************************** SEPARADORES ******************************************/
.divSeparadorV10 { clear: both; width: 100%; height: 10px; }
.divSeparadorV15 { clear: both; width: 100%; height: 15px; }
.divSeparadorV20 { clear: both; width: 100%; height: 20px; }
.divSeparadorV30 { clear: both; width: 100%; height: 30px; }
.divSeparadorV40 { clear: both; width: 100%; height: 40px; }
.divSeparadorH10 { width: 10px; }
.divSeparadorH15 { width: 15px; }
.divSeparadorH20 { width: 20px; }
.divSeparadorH30 { width: 30px; }
.divSeparadorH40 { width: 40px; }
/******************************************* BOTONES ********************************************/
.aButton {
margin: auto;
padding: 10px 20px;
min-width: 120px;
font-size: 18px;
font-weight: 400;
color: #FFFFFF !important;
border: none;
border-radius: 0px;
background-color: var(--color-nar1-hex);
text-align: center;
text-decoration: none;
display: block;
-webkit-transition: all 0.5s ease !important;
transition: all 0.5s ease !important;
}
.aButton:hover { color: var(--color-nar1-hex) !important; background-color: var(--color-nar2-hex); }