/*
Theme Name: Vantage Child
Author: MadeWordPress
Author URI: http://madewordpress.com/
Theme URI: http://madewordpress.com/
Description:
Template: vantage
Version: 1.0.0
License:
Tags:
Text Domain: vantage-child
*/
/******************************************* 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 ****************************************/
/* Marrón Oscuro: AB5903 rgb(171, 89, 3) */
/* Gris: 999999 rgb(153,153,153) */
/* Marrón Medio: E1C186 rgb(225,193,134) */
/* Marrón Claro: EEDDCC rgb(238,221,204) */
/* Marrón Muy Claro: F6EDE5 rgb(246,237,229) */
/* Verde oscuro: 9D812D rgb(157,129, 45) */
/* Verde medio: CBBA58 rgb(203,186, 88) */
/* Verde claro: C8BE9A rgb(200,190,154) */
/******************************************** Z-INDEX ********************************************/
/*
10001 -> #rowHeaderInfoSticky (360px)
9999 -> .main-navigation
998 -> <nav>
901 -> #rowHeaderInfoSticky
90000 -> .tos-wrapper.tos-fixed (Responsive Lightbox)
100001 -> #divMascaraAjax
*/
/******************************************* INCLUDES ********************************************/
@import url("../vantage/style.css?q=20240401");
@import url("style-header.css?q=20240401");
@import url("style-home.css?q=20240401");
@import url("style-footer.css?q=20240401");
@import url("style-pages.css?q=20240401");
@import url("style-blog.css?q=20240401");
@import url("style-animate.css?q=20240401");
@import url("style-popup-maker.css?q=20240401");
@import url('https://fonts.googleapis.com/css?family=Fira+Sans:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Fira+Sans+Condensed:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Fira+Sans+Extra+Condensed:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
:root {
--color1-hex: #AB5903;
--color2-hex: #999999;
--color3-hex: #E1C186;
--color4-hex: #EEDDCC;
--color5-hex: #F6EDE5;
--colorVer1-hex: #9D812D;
--colorVer2-hex: #CBBA58;
--colorVer3-hex: #C8BE9A;
--color1-rgb: 171, 89, 3;
--color2-rgb: 153,153,153;
--color3-rgb: 225,193,134;
--color4-rgb: 238,221,204;
--color5-rgb: 246,237,229;
--colorVer1-rgb: 157,129, 45;
--colorVer2-rgb: 203,186, 88;
--colorVer3-rgb: 200,190,154;
--font-family-normal: "Fira Sans", sans-serif;
--font-family-narrow: "Fira Sans Condensed", sans-serif;
--font-family-extra-narrow: "Fira Sans Extra 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) !important; }
/******************************************** GENERAL ********************************************/
#main { padding: 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" */
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; }
/************************************** RESPONSIVE LIGHTBOX **************************************/
.tos-wrapper.tos-fixed { z-index: 90000 !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; }
.ExtraNarrow { font-family: var(--font-family-extra-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; }
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 {
padding: 10px;
font-size: 16px;
font-weight: 400;
color: #FFFFFF !important;
border: solid 1px #FFFFFF;
border-radius: 10px;
background-color: var(--color1-hex);
text-align: center;
display: inline-block;
-webkit-transition: all 0.5s ease !important;
transition: all 0.5s ease !important;
}
.aButton:hover { color: var(--color1-hex) !important; background-color: var(--color4-hex); }