@charset "UTF-8";
/*------------------------------------*\
  Estilos theme Sibibo
  2023
  Autor: Aguayo
\*------------------------------------*/
/**
 * Variable ruta imágenes incluidas en los CSS  | use: url(# {$path-img}/card-shadow.svg)
 * @nuclide Variables
 * @section Settings > Path
 */
/**
 * Variable ruta a la carpeta de fuentes | use: url('# {$path-font}/# {$font-family-ico}.woff?')
 * @nuclide Variables
 * @section Settings > Path
 */
/**
  * $c-neutro
  * @color
  * @section Neutro
*/
/**
  * $c-neutro-black
  * @color
  * @section Neutro
*/
/**
  * $c-primary-blue-80
  * @color
  * @section Primary
*/
/**
  * $c-primary-blue-70
  * @color
  * @section Primary
*/
/**
  * $c-primary-blue-60
  * @color
  * @section Primary
*/
/**
  * $c-primary-blue-55
  * @color
  * @section Primary
*/
/**
  * $c-primary-orange-80
  * @color
  * @section Primary
*/
/**
  * $c-primary-orange-70
  * @color
  * @section Primary
*/
/**
  * $c-primary-orange-65
  * @color
  * @section Primary
*/
/**
  * $c-primary-orange-60
  * @color
  * @section Primary
*/
/**
  * $c-gray-10
  * @color
  * @section Gray
*/
/**
  * $c-gray-30
  * @color
  * @section Gray
*/
/**
  * $c-primary-pink-70
  * @color
  * @section Primary
*/
/**
  * $c-primary-pink-65
  * @color
  * @section Primary
*/
/**
  * $c-primary-pink-55
  * @color
  * @section Primary
*/
/**
  * $c-primary-pink-40
  * @color
  * @section Primary
*/
/**
  * $c-secondary-blue-90
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-orange-20
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-orange-30
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-orange-80
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-orange-90
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-green-20
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-green-30
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-gray-70
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-violet-30
  * @color
  * @section Secondary
*/
/**
  * $c-secondary-violet-35
  * @color
  * @section Secondary
*/
/**
  * $c-gray-20
  * @color
  * @section Gray
*/
/**
  * $c-gray-40
  * @color
  * @section Gray
*/
/**
  * $c-secondary-black-80
  * @color
  * @section Secondary
*/
/**
* Base HTML: 16px
* @nuclide Variables
* @section Settings > Font size
*/
/**
* Font family: 'Montserrat'
* @nuclide Variables
* @section Settings > Font family
*/
/**
* Font family: 'Montserrat'
* @nuclide Variables
* @section Settings > Font family
*/
/**
* font-weight: Thin | Font family: Outfit
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Light | Font family: Montserrat
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Regular | Font family: Montserrat
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Medium | Font family: Montserrat
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Bold | Font family: Montserrat
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Bold | Font family: Montserrat
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* font-weight: Italic
* @nuclide Variables
* @section Settings > Font weight
*/
/**
* Font family: fuentes de ícono
* @nuclide Variables
* @section Settings > Font family
*/
/**
* Unidad mínima la retícula digital es 8, 
* el sistema de reticula se basa en incrementos verticales y horizontales de 8 píxeles.
* Uso: multiplicar la variable por el número del incremento deseado. Ejemplo: $gutter * 2
* @nuclide Variables
* @section Settings > Gutter 
*/
/**
* $canvas-with: Ancho del canvas en porcentajes
* @nuclide Variables
* @section Settings > Canvas
*/
/**
* $canvas-max-with: Máximo Ancho del canvas en pixeles, 
* Grid 4 columnas: 240px, 
* Grid 3 columnas: 320px, 
* Grid 2 columnas: 480px 
* @nuclide Variables
* @section Settings > Canvas
*/
/**
* Small
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* small-m
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* medium
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* wide
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* large
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* big
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
* huge
* @nuclide Variables
* @section Settings > Breakpoint predefinidos
*/
/**
 * Flexbox Containers display: flex. Utiliza el soporte nativo de los navegadores.
 * The 'flex' value causes an element to generate a block-level flex container box.
 * http://w3.org/tr/css3-flexbox/#flex-containers
 * @mixin
 * @section Flexbox prefix
 * @example
 *  .foo {
 *    @include flexbox;
 *  }
 */
/**
 * Flexbox Containers display: inline-flex. Utiliza el soporte nativo de los navegadores.
 * The 'inline-flex' value causes an element to generate a inline-level flex container box.
 * http://w3.org/tr/css3-flexbox/#flex-containers
 * @mixin
 * @section Flexbox prefix
 * @example
 *  .foo {
 *    @include inline-flex;
 *  }
 */
/**
 * Flexbox Direction.
 * The 'flex-direction' property specifies how flex items are placed in
 * the flex container, by setting the direction of the flex container's main axis. 
 * This determines the direction that flex items are laid out in.
 * http://w3.org/tr/css3-flexbox/#flex-direction-property
 * @mixin
 * @section Flexbox prefix
 * @param $value
 *	Default: row ♣ 
 * 	Values: row | row-reverse | column | column-reverse
 * @example
 *  .foo {
 *    @include flex-direction(column);
 *  }
 */
/**
 * Flexbox Wrap.
 * The 'flex-wrap' property controls whether the flex container is single-line
 * or multi-line, and the direction of the cross-axis, which determines
 * the direction new lines are stacked in.
 * No Webkit Box fallback.
 * http://w3.org/tr/css3-flexbox/#flex-wrap-property
 * @mixin
 * @section Flexbox prefix
 * @param $value
 *	Default: nowrap ♣  
 * 	Values: nowrap | wrap | wrap-reverse
 * @example
 *  .foo {
 *    @include flex-wrap(wrap);
 *  }
 */
/**
 * Flexbox Flow (shorthand).
 * The 'flex-flow' property is a shorthand for setting the 'flex-direction'
 * and 'flex-wrap' properties, which together define the flex container's
 * main and cross axes.
 * No Webkit Box fallback.
 * http://w3.org/tr/css3-flexbox/#flex-flow-property
 * @mixin
 * @section Flexbox prefix
 * @param $values
 *	Default: row nowrap ♣  
 * 	Values: [flex-direction: row | row-reverse | column | column-reverse] | [flex-wrap: nowrap | wrap | wrap-reverse]
 * @example
 *  .foo {
 *    @include flex-flow(column nowrap);
 *  }
 */
/**
 * Flexbox Order.
 * The 'order' property controls the order in which flex items appear within
 * their flex container, by assigning them to ordinal groups.
 * http://w3.org/tr/css3-flexbox/#order-property
 * @mixin
 * @section Flexbox prefix
 * @param $int
 *	Default: 0
 * @example
 *  .foo {
 *    @include order(1);
 *  }
 */
/**
 * Flexbox Grow.
 * The 'flex-grow' property sets the flex grow factor. Negative numbers are invalid.
 * http://w3.org/tr/css3-flexbox/#flex-grow-property
 * @mixin
 * @section Flexbox prefix
 * @param $int
 *	Default: 0
 * @example
 *  .foo {
 *    @include flex-grow(1);
 *  }
 */
/**
 * Flexbox Shrink.
 * The 'flex-shrink' property sets the flex shrink factor. Negative numbers are invalid.
 * http://w3.org/tr/css3-flexbox/#flex-shrink-property
 * @mixin
 * @section Flexbox prefix
 * @param $int
 *	Default: 1
 * @example
 *  .foo {
 *    @include flex-grow(1);
 *  }
 */
/**
 * Flexbox Basis.
 * The 'flex-basis' property sets the flex basis. Negative lengths are invalid.
 * http://www.w3.org/TR/css3-flexbox/#flex-basis-property
 * @mixin
 * @section Flexbox prefix
 * @param $value
 *	Default: auto ♣
 *	Values: Like "width"
 * @example
 *  .foo {
 *    @include flex-basis(50%);
 *  }
 */
/**
 * Flexbox "Flex" (shorthand).
 * The 'flex' property specifies the components of a flexible length: the
 * flex grow factor and flex shrink factor, and the flex basis. When an
 * element is a flex item, 'flex' is consulted instead of the main size
 * property to determine the main size of the element. If an element is
 * not a flex item, 'flex' has no effect.
 * http://w3.org/tr/css3-flexbox/#flex-property
 * @mixin
 * @section Flexbox prefix
 * @param $fg
 *	Default: See individual properties (1 1 0). ♣
 *	Values: none | <flex-grow>
 * @param $fs
 *	Default: See individual properties (1 1 0). ♣
 *	Values: none | <flex-shrink>
 * @param $fb
 *	Default: See individual properties (1 1 0). ♣
 *	Values: none | <flex-basis>
 * @example
 *  .foo {
 *    @include flex( 1 1 50%);
 *  }
 */
/**
 * Flexbox Justify Content.
 * The 'justify-content' property aligns flex items along the main axis
 * of the current line of the flex container. This is done after any flexible
 * lengths and any auto margins have been resolved. Typically it helps distribute
 * extra free space leftover when either all the flex items on a line are
 * inflexible, or are flexible but have reached their maximum size. It also
 * exerts some control over the alignment of items when they overflow the line.
 * Note: 'space-*' values not supported in older syntaxes.
 * http://w3.org/tr/css3-flexbox/#justify-content-property
 * @mixin
 * @section Flexbox prefix
 * @param $value
 *	Default: flex-start ♣
 *	Values: flex-start | flex-end | center | space-between | space-around
 * @example
 *  .foo {
 *    @include justify-content(space-between);
 *  }
 */
/**
 * Flexbox Align Items.
 * Flex items can be aligned in the cross axis of the current line of the
 * flex container, similar to 'justify-content' but in the perpendicular
 * direction. 'align-items' sets the default alignment for all of the flex
 * container's items, including anonymous flex items. 'align-self' allows
 * this default alignment to be overridden for individual flex items. (For
 * anonymous flex items, 'align-self' always matches the value of 'align-items'
 * on their associated flex container.)
 * http://w3.org/tr/css3-flexbox/#align-items-property
 * @mixin
 * @section Flexbox prefix
 * @param $value
 *	Default: stretch ♣
 *	Values: flex-start | flex-end | center | baseline | stretch
 * @example
 *  .foo {
 *    @include align-items(space-between);
 *  }
 */
/**
 * Flexbox Align Self.
 * https://www.w3.org/TR/css-flexbox-1/#propdef-align-self
 * @mixin
 * @section Flexbox prefix
 * @param $value
 *	Default: auto ♣
 *	Values: auto | flex-start | flex-end | center | baseline | stretch
 * @example
 *  .foo {
 *    @include align-self(flex-end);
 *  }
 */
/**
 * Flexbox Align Content.
 * The 'align-content' property aligns a flex container's lines within the
 * flex container when there is extra space in the cross-axis, similar to
 * how 'justify-content' aligns individual items within the main-axis. Note,
 * this property has no effect when the flexbox has only a single line.
 * http://w3.org/tr/css3-flexbox/#align-content-property
 * @mixin
 * @section Flexbox prefix
 * @param $value
 *	Default: stretch ♣
 *	Values: flex-start | flex-end | center | space-between | space-around | stretch
 * @example
 *  .foo {
 *    @include align-content(flex-end);
 *  }
 */
/**
 * Convertir valor de (px) a (rem) de cualquier propiedad, agrega fallback en px para navegadores antiguos.
 *
 * @mixin
 * @section Utils
 * @param $property Propiedad css, ej. margin, max-width, etc..
 * @param $values Valor en px
 * @example
 *  .foo {
 *    @include px-to-rem(padding, 20px 10px);
 *  }
 */
/**
 * Incluye Font-family propiedades fuente de iconos para pseudo elementos.
 * @mixin
 * @section Utils
 * @param $font-family Variable Font-family
 * @example
 *  .foo {
 *		Propiedades...
 *		&:before {
 *    	@include font-family-ico($font-family-ico);
 *		}
 *  }
 */
/**
 * keyframes mixin para animaciones CSS
 *
 * @mixin
 * @section Utils
 * @param $animation-name Nombre que indica un @keyframes, esta regla define los valores de las propiedades de la secuencia de animación.
 * @param animation-name Propiedad CSS que especifica las animaciones aplicadas al elemento seleccionado. Cada nombre indica un @keyframes.
 * @example
 *  @include keyframes(slideIn) {
 *    from {
 *      margin-left: 100%;
 *      width: 300%
 *    }
 *    to {
 *      margin-left: 0%;
 *      width: 100%;
 *    }
 *  }
 *  //- La propiedad CSS animation-name especifica una lista de animaciones que se deben aplicar al elemento seleccionado.
 *  .ag-animation-slidein {
 *    animation-name: slideIn;
 *    animation-duration: 3s;
 *    animation-iteration-count: 3;
 *    animation-direction: alternate;
 *    ....
 *  }
 */
/**
 * Full query: Mediaquerys predefinidos, para el proyecto.
 * Disponibles para 10 screen sizes diferentes.
 * Para modificarlos, editar las variables definidas en los breakpoints.
 *
 * @mixin
 * @section Utils
 * @param $breakpoint-value
 *    ♣ Breakpoint min-width  
 *      small: 375px | small-m: 480px | medium: 768px | wide: 1024px | big: 1280px | huge: 1440px | large: 1180px 
 *    ♣ Breakpoint max-width  
 *      medium-max: 0 - 767px  |  wide-max  : 0 - 1023px  |  large-max : 0 - 1179px
 *
 * @example
 *  || small: breakpoint min-width: 375px --> $bp-small
 *     @include media-query(small) {
 *       PROPERTIES...
 *     }
 *  || small-m: breakpoint min-width 540px --> $bp-small-m
 *     @include media-query(small-m) {
 *        PROPERTIES...
 *     }
 *  || medium: breakpoint min-width 768px --> $bp-medium
 *     @include media-query(medium) {
 *        PROPERTIES...
 *     }
 *  || medium-max: breakpoint max-width 0 - 767px
 *     @include media-query(medium-max) {
 *        PROPERTIES...
 *     }
 *  || wide: breakpoint min-width 1024px --> $bp-wide
 *     @include media-query(wide) {
 *        PROPERTIES...
 *     }
 *  || wide-max: breakpoint max-width 0 - 1023px
 *     @include media-query(wide-max) {
 *        PROPERTIES...
 *     }
 *  || large: breakpoint min-width 1180px --> $bp-large
 *     @include media-query(large) {
 *        PROPERTIES...
 *     }
 *  || huge: breakpoint min-width 1440px --> $bp-huge
 *     @include media-query(huge) {
 *        PROPERTIES...
 *     } 
*  || huge-max: breakpoint max-width 0 - 1440px --> $bp-huge
 *     @include media-query(huge-max) {
 *        PROPERTIES...
 *     } 
 *  || large-max: breakpoint max-width 0 - 1179px
 *     @include media-query(large-max) {
 *        PROPERTIES...
 *     }
 *  || big: breakpoint min-width 1280px --> $bp-big
 *     @include media-query(big) {
 *        PROPERTIES...
 *     }
 */
/**
 * Helper para insertar fácilmente mediaquery a un selector específico.
 *
 * @mixin
 * @section Helpers
 * @param $breakpoint-value
 *    ♣ Breakpoint min-width  
 *    【 small: 375px | small-m: 480px | medium: 768px | wide: 1024px | big: 1280px | huge: 1440px | large: 1180px 】 
 *    ♣ Breakpoint max-width
 *    【 medium-max: 0 - 767px  |  wide-max  : 0 - 1023px  |  large-max : 0 - 1179px 】
 * @example
 *  .foo {
 *    PROPERTIES...
 *    @include media-query-help(small) {
 *      PROPERTIES...
 *    }
 *  }
 *  || Variables
 *  ♣ small     : breakpoint min-width 375px
 *  ♣ medium    : breakpoint min-width 768px
 *  ♣ medium-max: breakpoint max-width 0 - 767px
 *  ♣ wide      : breakpoint min-width 1024px
 *  ♣ wide-max  : breakpoint max-width 0 - 1023px
 *  ♣ large     : breakpoint min-width 1180px
 *  ♣ huge      : breakpoint min-width 1440px
 *  ♣ large-max : breakpoint max-width 0 - 1179px
 *  ♣ big       : breakpoint min-width 1280px
 */
/**
 * Center-translate: Centra horizontalmente o verticalmente un elemento en su contexto. Translación en un solo eje.
 *
 * @mixin
 * @section Helpers
 * @param $axis 
 *  Valor eje translate
 *	♣ Default: translateX
 *	♣ Values: translateX | translateY 
 * @example
 *  .foo {
 *    @include center-translate(translateY)
 *  }
 *  || El @include se traducirá en:
 *     .foo {
 *         display: block;
 *         position: relative;
 *         top: 50%;
 *         -ms-transform 	  : translateY(-50%);
 *         -moz-transform   : translateY(-50%);
 *         -o-transform  	  : translateY(-50%);
 *         -webkit-transform: translateY(-50%);
 *         transform        : translateY(-50%);
 *     }
 */
/**
 * Centra horizontalmente o verticalmente un elemento en su contexto. Translación en un solo eje.
 *
 * @mixin
 * @section Helpers
 * @param $justify
 *	Default: center ♣
 *	Values: center | flex-start | flex-end | space-between | space-around
 * @param $align
 *	Default: center ♣
 *	Values: center | flex-start | flex-end | baseline | stretch
 * @example
 *  .foo {
 *    @include center-flexbox;
 *  }
 *  || El @include se traducirá en:
 *     .foo {
 *         display: flex;
 *         justify-content: center;
 *         align-items    : center;
 *     }
 *  .foo {
 *    @include center-flexbox(space-between)
 *  }
 *  || El @include se traducirá en:
 *     .foo {
 *         display: flex;
 *         justify-content: space-between;
 *         align-items    : center;
 *     }
 *  .foo {
 *    @include center-flexbox(center, flex-start)
 *  }
 *  || El @include se traducirá en:
 *     .foo {
 *         display: flex;
 *         justify-content: center;
 *         align-items    : flex-start;
 *     }
 */
/**
 * Borra la flotación de los elementos.
 *
 * @mixin
 * @section Helpers
 * @example
 *  .foo {
 *    @include clearfix;
 *  }
 *  || El @include se traducirá en:
 *     .foo:after {
 *        content: '';
 *        display: table;
 *        clear: both;
 *     }
 */
/**
 * Aplica overflow ellipsis multiples lineas de texto.
 * Adición de CSS a un elemento que limitará la visibilidad del texto después de cierto punto. 
 * La altura máxima en rem se calcula multiplicando:  
 * (font-size) * (line-heigth) * (número de líneas que se quiera mostrar)
 *
 * @mixin
 * @section Helpers
 * @param $font-size Valor tamaño de fuente en px.
 * @param $line-height Valor Alto de linea.
 * @param $lines Número de lineas a mostrar.
 * @example
 *  .foo {
 *    @include truncatechars(16px, 1.4, 3)
 *  }
 *  || El @include se traducirá en:
 *     .foo {
 *        display: block;
 *        display: -webkit-box;
 *        max-height: 67.2px;
 *        max-height: 4.2rem;
 *        overflow: hidden;
 *        line-height: 1.4;
 *        -webkit-line-clamp: 3;
 *        -webkit-box-orient: vertical;
 *        text-overflow: ellipsis;
 *        font-size: 16px;
 *        font-size: 1rem;
 *     }
 */
/**
 * Aplica overflow ellipsis multiples lineas de texto.
 * Adición de CSS a un elemento que limitará la visibilidad del texto después de cierto punto. 
 * La altura máxima en rem se calcula multiplicando:  
 * (font-size) * (line-heigth) * (número de líneas que se quiera mostrar)
 *
 * @mixin
 * @section Helpers
 * @param $font-size Valor tamaño de fuente en px.
 * @param $line-height Valor Alto de linea.
 * @param $lines Número de lineas a mostrar.
 * @example
 *  .foo {
 *    @include truncatechars-change(16px, 1.4, 3)
 *  }
 *  || Debe agregar font-size y line-height. El @include se traducirá en:
 *     .foo {
 *        max-height: 67.2px;
 *        max-height: 4.2rem;
 *     }
 */
/**
 * Offset: compensa el ancho de su contenedor para que el elemento ocupe el 100% del ancho del viewport
 * ♣ Resta al 100% el ancho del canvas,
 * ♣ el padding se puede ajustar a la necesidad del diseño
 * ♣ Se recomienda usar las variables:  _var-canvas
 *
 * @mixin
 * @section Helpers
 * @param $canvasWidth Valor ancho del canvas.
 * @param $elementPadding Valor del padding left y right
 * @example
 *  || Si usa variables prestablecidad para el ancho del canvas.
 *  || para este ejemplo $canvas-with equivale a 90%.
 *  .foo {
 *    @include offset-full('$canvas-with', 4%);
 *  }
 *  || Si usa un valor en prcentajes no registrado: debe ser igual al valor del ancho de su contenedor
 *  .foo {
 *    @include offset-full(90%, 4%);
 *  }
 *  || El @include se traducirá en:
 *     .foo {
 *        margin-left: -5%;
 *        margin-right: -5%;
 *        padding-left: 4%;
 *        padding-right: 4%;
 *     }
 */
@import url("https://fonts.googleapis.com/css2?family=Geologica:wght@100;300;400;500;600;700&family=Onest:wght@300;400;500;600;800&family=Wix+Madefor+Text:wght@400;600&display=swap");
body,
h1, h2, h3, h4, h5, h6,
dl, dd, ol, ul {
  margin: 0;
  padding: 0; }

html {
  font-size: 16px;
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body * {
  box-sizing: border-box; }

article,
aside,
footer,
header,
nav,
section {
  display: block; }

h1 {
  font-size: 2em; }

figcaption,
figure,
main {
  display: block; }

figure,
p {
  margin: 0; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects; }
  a:active, a:hover {
    outline-width: 0; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }

abbr[title],
dfn[title] {
  cursor: help; }

b,
strong {
  font-weight: inherit;
  font-weight: bolder; }

code,
pre,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

dfn {
  font-style: italic; }

mark {
  background-color: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

blockquote {
  margin: 0; }

audio,
video {
  display: inline-block;
  vertical-align: baseline; }

audio:not([controls]) {
  display: none;
  height: 0; }

img {
  border-style: none;
  vertical-align: bottom;
  max-width: 100%;
  height: auto; }

svg:not(:root) {
  overflow: hidden; }

input {
  line-height: normal; }

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button {
  background-color: transparent; }

optgroup {
  font-weight: bold; }

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

fieldset {
  margin: 0 2px;
  padding: 0.35em 0.75em 0.625em; }

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
  border: 0; }

progress {
  display: inline-block;
  vertical-align: baseline; }

textarea {
  overflow: auto; }

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td, th {
  padding: 0; }

details,
menu {
  display: block; }

summary {
  display: list-item; }

canvas {
  display: inline-block; }

template {
  display: none; }

[hidden] {
  display: none; }

/*---------------------------------------------*\
  #font-face
  $font-family-ico: "ico-fun-sib" !default;
  URL custom fonts: https://fonts.googleapis.com/css2?family=Geologica:wght@100;300;400;500;600;700&family=Roboto:wght@300
\*---------------------------------------------*/
@font-face {
  font-family: "ico-fun-sib";
  src: url("../fonts/ico-fun-sib.eot?qqnr5");
  src: url("../fonts/ico-fun-sib.eot?#iefix") format("embedded-opentype"), url("../fonts/ico-fun-sib.ttf?qqnr5") format("truetype"), url("../fonts/ico-fun-sib.woff?qqnr5") format("woff"), url("../fonts/ico-fun-sib.svg?qqnr5#ico-fun-sib") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block; }

.i-::before,
[class^="i-"]::before,
[class*=" i-"]::before,
.o-ico::before {
  font-family: "ico-fun-sib" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.i-after-:after,
[class^="i-after-"]:after,
[class*="i-after-"]:after {
  font-family: "ico-fun-sib" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.i-book:before {
  content: ""; }

.i-chevron-down-outline:before {
  content: ""; }

.i-after-chevron-down-outline:after {
  content: ""; }

.i-check:before {
  content: ""; }

.i-info:before {
  content: ""; }

.i-external:before {
  content: ""; }

.i-link:before {
  content: ""; }

.i-after-link::after {
  content: ""; }

.i-plus:before {
  content: ""; }

.i-after-plus:after {
  content: ""; }

.i-quote:before {
  content: ""; }

.i-services:before {
  content: ""; }

.i-share:before {
  content: ""; }

.i-after-share:after {
  content: ""; }

.i-sort:before {
  content: ""; }

.i-after-sort:after {
  content: ""; }

.i-trash:before {
  content: ""; }

.i-after-trash:after {
  content: ""; }

.i-ubication:before {
  content: ""; }

.i-arrow-down:before {
  content: ""; }

.i-after-arrow-down:after {
  content: ""; }

.i-arrow-left:before {
  content: ""; }

.i-arrow-right:before {
  content: ""; }

.i-after-arrow-right:after {
  content: ""; }

.i-calendar:before {
  content: ""; }

.i-chevron-down:before {
  content: ""; }

.i-after-chevron-down:after {
  content: ""; }

.i-close:before {
  content: ""; }

.i-after-close:after {
  content: ""; }

.i-equis:before {
  content: ""; }

.i-facebook:before {
  content: ""; }

.i-filter:before {
  content: ""; }

.i-after-filter:after {
  content: ""; }

.i-front-hand:before {
  content: ""; }

.i-after-front-hand:after {
  content: ""; }

.i-instagram:before {
  content: ""; }

.i-location:before {
  content: ""; }

.i-menu:before {
  content: ""; }

.i-search:before {
  content: ""; }

.i-after-search::after {
  content: ""; }

.i-youtube:before {
  content: ""; }

.i-student:before {
  content: ""; }

.i-activities:before {
  content: ""; }

.i-asesor:before {
  content: ""; }

.i-az:before {
  content: ""; }

.i-bibliography:before {
  content: ""; }

.i-desktop:before {
  content: ""; }

.i-docment-scan:before {
  content: ""; }

.i-fisic-space:before {
  content: ""; }

.i-loan:before {
  content: ""; }

.i-local-information:before {
  content: ""; }

.i-quimica:before {
  content: ""; }

.i-read-club:before {
  content: ""; }

.i-room-consult:before {
  content: ""; }

.i-user-form:before {
  content: ""; }

.i-virtual-consult:before {
  content: ""; }

.i-calendar1:before {
  content: ""; }

.i-clock:before {
  content: ""; }

.i-download:before {
  content: ""; }

.i-after-download:after {
  content: ""; }

.i-group-persons:before {
  content: ""; }

.i-whatsapp:before {
  content: ""; }

.i-point:before {
  content: ""; }

.o-canvas,
.o-canvas-inner {
  width: 90%; }

.o-canvas {
  max-width: 1300px;
  max-width: 81.25rem;
  margin-left: auto;
  margin-right: auto; }

.o-canvas-inner {
  max-width: 866px;
  max-width: 54.125rem;
  margin-left: auto;
  margin-right: auto; }

.o-surface_violet {
  background-color: #CDC7E0; }

.o-surface_primary,
.o-surface_dark {
  color: #fff; }

.o-surface_primary {
  background-color: #02B3A0; }

.o-surface_secondary {
  color: #171719;
  background-color: #CDC7E0; }

.o-surface_gray {
  background-color: #F7F9FA; }

.o-surface_dark {
  background-color: #333333; }

.o-surface_border-bottom {
  border-bottom: 1px solid #fff; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
@media only screen and (max-width: 767px) {
  .o-section {
    margin-top: 24px;
    margin-top: 1.5rem;
    margin-bottom: 24px;
    margin-bottom: 1.5rem; }
  .o-surface {
    padding-top: 32px;
    padding-top: 2rem;
    padding-bottom: 32px;
    padding-bottom: 2rem; }
  .o-section_top80 {
    margin-top: 0; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .o-section {
    margin-top: 80px;
    margin-top: 5rem;
    margin-bottom: 80px;
    margin-bottom: 5rem; }
  .o-section__small {
    margin-top: 40px;
    margin-top: 2.5rem; }
  .o-section_top80 {
    margin-top: 80px;
    margin-top: 5rem; }
  .o-surface {
    padding-top: 88px;
    padding-top: 5.5rem;
    padding-bottom: 88px;
    padding-bottom: 5.5rem; }
  .o-surface_decorated {
    position: relative; }
    .o-surface_decorated::before, .o-surface_decorated::after {
      width: 100%;
      display: block;
      height: 120px;
      position: absolute;
      background-size: contain;
      background-repeat: no-repeat; }
    .o-surface_decorated::before {
      content: "";
      top: 0;
      bottom: auto;
      background-image: url("/static/images/overlay-section-top.png");
      background-position: top left; }
    .o-surface_decorated::after {
      content: "";
      top: auto;
      bottom: 0;
      background-image: url("/static/images/overlay-section-bottom.png");
      background-position: bottom right; } }

.l-container-radius-white {
  border-radius: 16px;
  background-color: #fff; }

.l-cta-section {
  text-align: center; }

.o-layout:not(.o-layout_aside) .o-layout__main {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto; }

.o-layout_aside {
  display: flex;
  flex-direction: column; }

@media only screen and (max-width: 767px) {
  .l-cta-section {
    margin-top: 32px; } }

@media only screen and (min-width: 768px) {
  .l-cta-section {
    margin-top: 64px; } }

@media only screen and (min-width: 1024px) {
  .o-layout_aside {
    display: grid;
    grid-template-rows: auto auto;
    grid-template-areas: "sidebar main-content";
    justify-content: space-between;
    align-items: flex-start;
    grid-template-columns: minmax(310px, 20%) minmax(50%, 80%); }
  .o-layout_aside-right {
    grid-template-areas: 'main sidebar';
    grid-column-gap: 24px;
    grid-template-columns: minmax(57%, 827px) minmax(29%, 421px); }
  .o-layout__main {
    grid-area: main-content; }
    .o-layout_aside-right .o-layout__main {
      grid-area: main; }
  .o-layout__sidebar {
    position: sticky;
    top: 0;
    grid-area: sidebar; }
  .o-layout_aside {
    grid-column-gap: 24px; } }

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Geologica", sans-serif;
  font-weight: 500;
  line-height: 1.2; }

.o-headline {
  font-weight: 500; }

.o-subtitle__max-width {
  max-width: 980px;
  max-width: 61.25rem;
  margin: auto; }

/**
 * Class: .o-hgroup
 * @description  grupo para el encabezado de una sección con guiño.
 *	Contenedor para título con diseño mixto.
 * 	♣ Propiedades: Inline-block | Uppercase
 * @atom Hgroup wink
 * @modifiers  
 *  .o-hgroup_center Centra el encabezado de la sección
 * @section 02. Títulos
 * @markup
 *	<header class="o-hgroup">
 *		<p class="o-kicker o-hgroup__space"> Parrafo de sección</p>
 *		<h2 class="o-headline"> Titular de sección</h2>
 *		<h3 class="o-subheadline o-hgroup__space"> SubTitular de sección</h3>
 *		<p class="o-kicker"> Parrafo de sección</p>
 *	</header>
 */
.o-hgroup {
  margin-right: auto;
  margin-left: auto;
  text-align: center; }
  .o-hgroup .o-subtitle {
    margin-top: 16px; }

/*------------------------------------*\
  Media Querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
@media only screen and (max-width: 767px) {
  .o-hgroup_space {
    margin-top: 32px;
    margin-top: 2rem; }
  .o-hgroup {
    margin-bottom: 32px;
    margin-bottom: 2rem; }
  .o-headline {
    font-size: 32px;
    font-size: 2rem; }
  .o-subheadline {
    font-size: 24px;
    font-size: 1.5rem; }
  .o-title {
    font-size: 20px;
    font-size: 1.25rem; }
  .o-subtitle {
    font-size: 18px;
    font-size: 1.125rem; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .o-hgroup_space {
    margin-top: 64px;
    margin-top: 4rem; }
  .o-hgroup {
    margin-bottom: 64px;
    margin-bottom: 4rem; }
  .o-headline {
    font-size: 56px;
    font-size: 3.5rem; }
  .o-subheadline {
    font-size: 40px;
    font-size: 2.5rem; }
  .o-title {
    font-size: 24px;
    font-size: 1.5rem; }
  .o-subtitle {
    font-size: 20px;
    font-size: 1.25rem; } }

/*------------------------------------*\
  Patterns Elements
  #Styles for text
\*------------------------------------*/
/**
 * Class: ag-theme
 * @description  font-size base para el HTML
 *  ♣ Propiedades: 16px/100%
 * @atom Base: HTML
 * @section 03. Estilos textos
 * @markup
 *  <html class="ag-theme">
 *     <p>@{lipsum:quantity:type}</p>
 *  </html>
 */
html,
.o-theme {
  font-size: 100%;
  color: #171719;
  scroll-behavior: smooth; }

/**
 * Class: ag-o-text | body
 * @description  estilos de texto generales para el body
 *  ♣ Propiedades: Ubuntu | 16px | 1.75
 * @atom Body copy
 * @section 03. Estilos textos
 * @markup
 *  <p class="ag-o-text">@{lipsum:1:paragraphs}</p>
 */
body,
.o-text {
  line-height: 1.75;
  font-size: 16px;
  font-size: 1rem;
  font-family: "Onest", sans-serif; }

/**
 * Class: .ag-o-copy  
 * @description  estilos párrafos
 *  ♣ Propiedades: margin: 32px 0 | 1.75
 * @atom Paragraph
 * @section 03. Estilos textos
 * @markup
 *  <p class="ag-o-copy">
 *     @{lipsum:quantity:type}
 *  </p>
 */
p {
  line-height: 1.75; }

/**
 * Class: .ag-o-italic | richtext <em> | <i>
 * @description  define estilo italica para el texto.
 *  ♣ Propiedades: italic | Ubuntu
 * @atom Texto cursiva
 * @section 03. Estilos textos
 * @markup
 *  <p class="ag-o-copy">
 *	  Ad ea velit nisi aliquip <span class="ag-o-italic">nostrud laboris laborum</span> aliquip laborum.
 *  </p>
 *  <p class="ag-o-copy">
 *	  Ad ea velit <em>nisi aliquip nostrud laboris</em> laborum aliquip laborum.
 *  </p>
 */
.o-italic,
em,
i {
  font-style: italic;
  font-family: "Onest", sans-serif; }

/**
 * Class: .ag-o-bold | richtext <strong>, <b>
 * @description  define estilo negrilla para el texto.
 *  ♣ Propiedades: bold
 * @atom Texto negrilla
 * @section 03. Estilos textos
 * @markup
 *  <p class="ag-o-copy">
 *	  Ad ea velit nisi <span class="ag-o-bold">aliquip nostrud laboris</span> laborum aliquip laborum.
 *  </p>
 *  <p class="ag-o-copy">
 *	  <strong>Ad ea velit nisi aliquip nostrud laboris laborum aliquip laborum</strong>
 *  </p>
 */
.o-bold,
strong,
b {
  font-weight: 700; }

.o-light {
  font-weight: 300; }

.o-semi-bold {
  font-weight: 600; }

.o-neutro {
  color: #fff; }

.o-gray-40 {
  color: #72727C; }

.o-primary {
  color: #02B3A0; }

.o-default {
  color: #171719; }
  .is-box-disabled .o-default {
    color: #9F9FA6; }

.o-size-12 {
  font-size: 12px; }

.o-size-14 {
  font-size: 14px; }

.o-center {
  text-align: center; }

.o-right {
  text-align: right; }

.o-uppercase {
  text-transform: uppercase; }

input,
select,
textarea {
  outline: none; }

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

fieldset {
  border: none;
  padding: 0;
  margin: 0; }

.o-form_box {
  border-radius: 8px;
  padding: 16px 24px;
  background: #fff; }

.o-form__label,
.o-form__field {
  display: block; }

.o-form__label {
  margin-bottom: 8px;
  font-weight: 700; }

.o-form__set {
  text-align: left; }
  .o-form__set:not(.o-form__set:last-of-type) {
    margin-bottom: 24px; }

.o-form__set_top {
  margin-top: 24px; }

.o-form__field {
  width: 100%;
  border-radius: 8px;
  border: 2px solid #E5EBEE;
  padding: 10px 24px; }
  .o-form__field input,
  .o-form__field select {
    width: 100%;
    border: none;
    color: #72727C;
    background-color: transparent; }

.o-form__field_ico {
  position: relative; }
  .o-form__field_ico#title::before {
    content: "";
    position: absolute;
    top: 15px;
    right: 24px;
    font-size: 18px;
    line-height: 1;
    font-family: "ico-fun-sib"; }

.o-form__field_neutro {
  border-color: #fff;
  color: #171719;
  background-color: #fff; }

.o-form__select {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  padding-bottom: 12px;
  color: #72727C; }
  .o-form__select::after {
    font-size: 12px; }

.o-form__multiselect {
  position: relative;
  margin: 16px 0; }
  .o-form__multiselect.is-dropdown-active-inner .o-form__field {
    width: 97%;
    margin: auto;
    border-radius: 16px 16px 0 0;
    border: 2px solid transparent;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.12);
    transition: all .2s ease; }
    .o-form__multiselect.is-dropdown-active-inner .o-form__field::after {
      display: block;
      transform: rotate(180deg); }

.o-form__multiselect-list {
  position: absolute;
  width: 97%;
  padding: 0 16px 16px;
  background: #fff;
  z-index: 2;
  max-height: 0;
  transition: all 0.2s ease;
  overflow-y: hidden;
  opacity: 0; }
  .is-dropdown-active-inner .o-form__multiselect-list {
    max-height: 250px;
    opacity: 1;
    overflow-y: auto;
    box-shadow: 0px 6px 8px 0px rgba(0, 0, 0, 0.12);
    border-radius: 0 0 16px 16px;
    display: block;
    right: 0;
    left: 0;
    margin: auto; }

.o-form__multiselect-item:first-of-type {
  border-top: 2px solid #E5EBEE;
  padding-top: 16px; }

.o-form__multiselect-item:not(.o-form__multiselect-item:last-of-type) {
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #E5EBEE; }

.o-form__multiselect-title {
  display: block;
  margin-bottom: 8px;
  font-size: 18px; }

.o-form__multiselect-field {
  position: relative;
  font-weight: 300; }
  .o-form__multiselect-field:not(.o-form__multiselect-field:last-of-type) {
    margin-bottom: 16px; }
  .o-form__multiselect-field label {
    display: flex;
    align-items: center;
    margin-left: 32px; }
    .o-form__multiselect-field label::after {
      content: "";
      position: absolute;
      width: 18px;
      height: 18px;
      border: 2px solid #C3C7C9;
      background-color: transparent;
      border-radius: 4px;
      left: 0;
      top: 4px; }
    .o-form__multiselect-field label::before {
      content: "";
      font-family: "ico-fun-sib";
      position: absolute;
      top: 5px;
      left: 5px;
      font-size: 12px;
      color: #fff;
      z-index: 8; }
  .o-form__multiselect-field input {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer; }
    .o-form__multiselect-field input:checked + label::after {
      border-color: #02B3A0;
      background-color: #02B3A0; }

.o-form__actions {
  margin-top: 24px; }
  .o-form__actions .o-btn:not(.o-form__actions .o-btn:last-of-type) {
    margin-bottom: 16px; }

.o-form__actions_border {
  padding-top: 24px;
  border-top: 2px solid #E5EBEE; }

.o-form__help-txt {
  display: inline-block;
  margin-top: 8px; }

.o-form__option-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  column-gap: 24px;
  column-gap: 1.5rem;
  row-gap: 16px;
  row-gap: 1rem;
  list-style: none;
  margin-bottom: 96px;
  margin-bottom: 6rem; }

.o-form__option-item {
  position: relative;
  color: #fff;
  cursor: pointer; }
  .o-form__option-item:hover .o-form__option-label {
    color: #02B3A0;
    border-color: #02B3A0; }
    .o-form__option-item:hover .o-form__option-label::before {
      border-color: #02B3A0; }

.o-form__option-input[type="checkbox"], .o-form__option-input[type="radio"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 1; }
  .o-form__option-input[type="checkbox"] + label, .o-form__option-input[type="radio"] + label {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
    .o-form__option-input[type="checkbox"] + label:before, .o-form__option-input[type="radio"] + label:before {
      content: "";
      cursor: pointer;
      display: block;
      min-width: 16px;
      min-width: 1rem;
      max-width: 16px;
      max-width: 1rem;
      height: 16px;
      height: 1rem;
      margin-right: 16px;
      margin-right: 1rem;
      border: 2px solid #fff;
      line-height: 18px;
      line-height: 1.125rem;
      font-size: 12px;
      font-size: 0.75rem;
      text-align: center;
      pointer-events: none;
      transition: all 0.2s ease; }
    .o-form__option-input[type="checkbox"] + label::after, .o-form__option-input[type="radio"] + label::after {
      content: "";
      position: absolute;
      min-width: 10px;
      min-width: 0.625rem;
      max-width: 10px;
      max-width: 0.625rem;
      height: 10px;
      height: 0.625rem;
      border-radius: 50%;
      background-color: transparent;
      transform: translateX(5px);
      transition: all 0.2s ease; }

.o-form__option-input[type="checkbox"] + label::before {
  content: "";
  border-radius: 4px;
  border-radius: 0.25rem;
  font-family: ico-fun-sib;
  color: transparent; }

.o-form__option-input[type="radio"] + label:before {
  border-radius: 50px;
  border-radius: 3.125rem; }

.o-form__option-input[type="radio"]:checked + label {
  color: #fff;
  border: 2px solid #fff; }
  .o-form__option-input[type="radio"]:checked + label:before {
    border: 2px solid #fff;
    background-color: #02B3A0; }
  .o-form__option-input[type="radio"]:checked + label::after {
    background-color: #fff; }

.o-form__option-input[type="radio"]:checked + .o-form__option-label {
  background-color: #02B3A0; }

.is-checked-radio:checked + label:before {
  background-color: #02B3A0; }

.is-checked-radio:checked + label::after {
  background-color: #fff; }

.is-checked-radio:checked + .o-form__option-label {
  background-color: #02B3A0; }

.o-form__option-label {
  font-weight: 700;
  border: 2px solid #fff;
  padding-top: 8px;
  padding-top: 0.5rem;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
  padding-left: 24px;
  padding-left: 1.5rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  border-radius: 8px;
  border-radius: 0.5rem; }

.o-form__option-label_thin {
  font-weight: 400;
  text-transform: uppercase;
  margin-left: 16px;
  margin-left: 1rem; }

@media only screen and (min-width: 768px) {
  .o-form__set_size200 {
    min-width: 200px; } }

/**
 * Class: o-list
 * @modifiers
 * @description  Agrupan un conjunto de elementos relacionados.
 * @atom Lista
 * @section 05. Listas
 * @markup
 *   <div class="sg-modifires">
 *      <ul class="o-list" type="button">
 *        <li>Texto lista</li>
 *      </ul>
 *   </div>
 */
.o-list {
  list-style: none; }

@media only screen and (min-width: 768px) {
  .o-list-indent {
    margin-top: 8px;
    margin-left: 50px; } }

*:focus {
  outline: 0; }

button {
  padding: 0;
  line-height: inherit;
  font-family: "Onest", sans-serif;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline: none;
  outline-width: 0;
  border: none;
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: all 0.6s; }
  button:focus {
    outline-width: 0; }
  button:disabled {
    cursor: default; }

/**
 * Class: o-btn
 * @modifiers
 *  .o-btn_secondary Botón para acciones secundarias 
 *  .o-btn_outline Botón para acciones secundarias 
 * @description  Botón acciones primarias y secundarias
 * ♣ Estados: hover, focus
 * @atom Botón
 * @section 05. Botones
 * @markup
 *   <div class="sg-modifires">
 *      <button class="o-btn" type="button">
 *        Texto botón
 *      </button>
 *   </div>
 *   <div class="sg-modifires">
 *      <button class="o-btn o-btn_secondary" type="button">
 *        Texto botón
 *      </button>
 *   </div>
 *   <div class="sg-modifires">
 *      <button class="o-btn i-chat" type="button">
 *        Texto botón
 *      </button>
 *   </div>
 *   <div class="sg-modifires">
 *      <button class="o-btn o-btn_outline" type="button">
 *        Texto botón
 *      </button>
 *   </div>
 */
.o-btn {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  border: 2px solid transparent;
  border-radius: 8px;
  min-width: 165px;
  min-width: 10.3125rem;
  padding: 14px 16px;
  padding: 0.875rem 1rem;
  font-weight: 700;
  font-family: "Onest", sans-serif;
  line-height: 1;
  transition: all 0.4s; }
  .o-btn:after, .o-btn::before {
    font-size: 16px;
    font-size: 1rem;
    transform: translateX(0);
    transition: all 0.2s; }
  .o-btn::before {
    padding-right: 8px; }
  .o-btn:after {
    padding-left: 8px; }
  .o-btn:hover {
    color: #02B3A0;
    border-color: rgba(2, 179, 160, 0.2);
    text-decoration: none;
    background-color: rgba(2, 179, 160, 0.2); }
  .o-btn:focus, .o-btn:active {
    border-color: #02B3A0;
    color: #fff;
    background-color: #02B3A0; }
  .o-btn:hover:after, .o-btn:focus:after, .o-btn:active:after {
    transform: translateX(4px); }
  .o-btn:disabled {
    border-color: #E5EBEE;
    color: #9F9FA6;
    background-color: #E5EBEE;
    cursor: not-allowed; }

.o-btn_primary {
  color: #fff;
  background-color: #02B3A0; }

.o-btn_full {
  min-width: 100%; }

.o-btn_secondary {
  color: #02B3A0;
  background-color: #fff; }
  .o-btn_secondary:hover {
    border-color: #fff;
    color: #fff; }

.o-btn_outline {
  color: #171719;
  border-color: #E5EBEE; }
  .o-btn_outline:hover {
    border-color: rgba(2, 179, 160, 0.5);
    text-decoration: none;
    color: #fff;
    background-color: rgba(2, 179, 160, 0.5); }
  .o-btn_outline:focus, .o-btn_outline:active {
    border-color: #8AE5DC;
    text-decoration: none;
    color: #8AE5DC;
    background-color: inherit; }
  .o-btn_outline:disabled {
    border-color: #E5EBEE;
    color: #9F9FA6;
    background-color: transparent; }

.o-btn_outline-primary {
  color: #02B3A0;
  border-color: #02B3A0; }

.o-btn_dark {
  color: #8AE5DC;
  background-color: #333333; }
  .o-btn_dark:hover {
    border-color: #333333;
    color: #333333;
    background-color: rgba(51, 51, 51, 0.8); }

.o-btn_neutro {
  background-color: #fff; }

.o-btn_green {
  background-color: #31D84E; }

.o-btn_blue-dark {
  background-color: #0672E7; }

.o-btn_blue {
  background-color: #1D9BF0; }

.o-btn_sm {
  max-width: 110px;
  min-width: 110px; }

.o-btn_primary_tag {
  font-size: 16px;
  font-size: 1rem;
  padding: 4px 16px;
  padding: 0.25rem 1rem;
  min-width: auto;
  line-height: 1.75; }

@media only screen and (max-width: 767px) {
  .o-btn {
    width: 100%;
    justify-content: center; }
  .o-btn_primary_tag {
    width: auto; } }

@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .o-btn__sidebar {
    display: flex;
    margin-left: auto;
    margin-right: auto; } }

a {
  text-decoration: none;
  color: inherit;
  outline-width: 0;
  cursor: pointer;
  transition: all 0.6s; }

/**
 * Class: o-link
 * @modifiers
 *  .o-link_ico Enlace con icono 
 *  .o-link_primary Enlace de color primario 
 *  .o-link_dark Enlace de color oscuro
 *  .o-link_neutro Enlace de color blanco
 * @atom Link
 * @section 06.Enlaces
 * @markup
 *   <div class="sg-modifires">
 *      <a class="o-link" href="#">Texto enlace</a>
 *   </div>
 *   <div class="sg-modifires">
 *      <a class="o-link o-link_ico i-chat" href="#">Texto enlace</a>
 *   </div>
 *   <div class="sg-modifires">
 *      <a class="o-link o-link_primary" href="#">Texto enlace</a>
 *   </div>
 *   <div class="sg-modifires">
 *      <a class="o-link o-link_dark" href="#">Texto enlace</a>
 *   </div>
 *   <div class="sg-modifires">
 *      <a class="o-link o-link_neutro" href="#">Texto enlace</a>
 *   </div>
 */
.o-link {
  padding: 0;
  font-size: 16px;
  font-size: 1rem; }
  .o-link:hover, .o-link:focus, .o-link:active {
    text-underline-position: initial;
    text-decoration: underline; }
  .o-link::after {
    display: inline-block;
    margin-left: 16px;
    margin-left: 1rem;
    font-size: 12px;
    font-size: 0.75rem;
    font-weight: 700;
    transform: translateX(0);
    transition: all 0.2s; }
  .o-link:hover:after, .o-link:focus:after, .o-link:active:after {
    transform: translateX(4px); }

.o-link_primary {
  color: #02B3A0; }
  .o-link_primary:hover, .o-link_primary:focus, .o-link_primary:active {
    color: #02FFE5; }
  .is-box-disabled .o-link_primary {
    color: #9F9FA6; }

.o-link_neutro {
  color: #fff; }
  .o-link_neutro:hover, .o-link_neutro:focus, .o-link_neutro:active {
    color: #363642; }

.o-dropdown__title::after {
  transition: all .2s ease-in; }

.is-dropdown-active .o-dropdown__title::after {
  transform: rotate(180deg); }

.o-dropdown__list {
  padding: 0 16px;
  padding: 0 1rem;
  list-style: none; }

.o-dropdown__list {
  max-height: 0;
  transition: all 0.2s ease;
  overflow-y: hidden;
  opacity: 0; }
  .is-dropdown-active .o-dropdown__list {
    max-height: 1000px;
    opacity: 1;
    overflow-y: auto; }

.o-dropdown__list_absolute {
  position: absolute; }

.o-dropdown__item {
  display: block; }
  .o-dropdown__item:not(.o-dropdown__item:last-of-type) {
    margin-bottom: 10px;
    margin-bottom: 0.625rem; }

@media only screen and (min-width: 768px) {
  .has-only-mb .o-dropdown__list {
    max-height: 1000px;
    opacity: 1;
    overflow-y: auto; }
  .o-dropdown__list_shadow {
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.12); } }

.o-brands {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  gap: 16px;
  gap: 1rem; }

.o-box__content.is-box-disabled {
  display: none; }

.o-box {
  display: block;
  text-align: center;
  height: auto; }
  .o-box:hover {
    text-decoration: underline; }
    .o-box:hover .o-box__image {
      transform: scale(0.95); }
  .is-box-disabled .o-box {
    pointer-events: none;
    opacity: 0.8; }

.o-box_padding {
  display: flex;
  flex-direction: column;
  justify-content: space-between; }

.o-box__image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: all .2s ease-in; }

.o-box__figure {
  width: 80px;
  height: 80px;
  margin: 0 auto 20px auto; }

.o-box-gap {
  margin-top: 8px; }

@media only screen and (max-width: 767px) {
  .o-box {
    padding: 0 16px; }
  .o-box_padding {
    padding: 24px; } }

@media only screen and (min-width: 768px) {
  .o-box {
    max-width: 234px; }
  .o-box_padding {
    padding: 28px;
    max-width: 100%; } }

.o-img {
  width: 100%; }

.o-img-cover,
.o-img-scale-down {
  width: 100%;
  height: 100%; }

.o-img-cover {
  object-fit: cover;
  object-position: center; }

.o-img-scale-down {
  object-fit: scale-down; }

.o-bg-cover {
  background-repeat: no-repeat;
  background-size: cover;
  transition: all .2s ease-in; }

.o-grid {
  display: flex;
  justify-content: space-evenly;
  gap: 24px; }

.o-grid_center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center; }

.o-grid__col {
  display: flex; }

@media only screen and (max-width: 767px) {
  .o-grid {
    flex-direction: column; } }

@media only screen and (min-width: 768px) {
  .o-grid {
    flex-wrap: wrap; }
  .o-grid-dk {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    gap: 1.5rem;
    transform: none !important; }
  .o-grid-dk__column {
    flex: 0 0 calc(23.333% - 10px);
    max-width: calc(23.333% - 10px); }
  .o-grid_2 .o-grid__col {
    flex: 0 0 calc(49.333% - 16px);
    max-width: calc(49.333% - 16px); }
  .o-grid_3 .o-grid__col {
    flex: 0 0 calc(33.333% - 16px);
    max-width: calc(33.333% - 16px); }
  .o-grid_4 .o-grid__col {
    flex: 0 0 calc(23.333% - 10px);
    max-width: calc(23.333% - 10px); } }

@media (min-width: 769px) and (max-width: 1200px) {
  .o-grid_3 .o-grid__col {
    flex: 0 0 calc(48.333% - 10px);
    max-width: calc(48.333% - 10px); }
  .o-grid_4 .o-grid__col {
    flex: 0 0 calc(45.333% - 10px);
    max-width: calc(45.333% - 10px); } }

.swipper-content {
  position: relative; }

.o-tags {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  width: 86%;
  min-height: 28px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase; }

.o-tags__tag {
  min-width: max-content;
  max-width: max-content;
  border-radius: 8px 8px 0 0;
  padding: 8px 10px;
  line-height: 1; }

.o-tags__slide {
  max-width: max-content;
  cursor: pointer; }

.o-tags__tag_grey {
  color: #72727C;
  background-color: #F7F9FA; }

.o-tags__controls {
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .o-tags__controls .swiper-button-disabled {
    opacity: 0; }

.o-tags__btn-slider {
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: fit-content; }
  .o-tags__btn-slider::after {
    font-size: 10px;
    color: var(--color-arrows-slider); }

.o-tags__btn-slider_w100::after {
  font-size: 16px;
  color: #02B3A0; }

.o-tag-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px; }

.o-tag {
  display: inline-block;
  border-radius: 8px;
  border: 2px solid transparent;
  padding: 8px;
  word-break: break-all;
  line-height: 1; }

.o-tag_min-width {
  min-width: max-content;
  max-width: max-content; }

.o-tag_flex {
  display: flex;
  align-items: center;
  gap: 8px; }

.o-tag_primary {
  background-color: #D4F3F0; }

.o-tag_primary-dark {
  background-color: #02B3A0; }

.o-tag_gray {
  background-color: #F7F9FA; }

.o-tag_dark {
  color: #02B3A0;
  background-color: #171719; }

.o-tag_neutro {
  background-color: #fff; }

.o-tag_outline {
  color: #02B3A0;
  border-color: #02B3A0;
  transition: all .2s ease-in; }
  .o-tag_outline:hover {
    color: #fff;
    background-color: #02B3A0; }
  .o-tag_outline:focus {
    transform: scale(0.9); }

.o-tag__close::before {
  font-weight: 700;
  font-size: 10px; }

@media only screen and (min-width: 768px) {
  .o-tag-wrap_center {
    width: 95%;
    justify-content: center; } }

.o-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
  z-index: -100;
  opacity: 0;
  overflow: hidden;
  transition: all .2s ease-in; }
  .o-overlay.is-overlay-show {
    opacity: 1;
    overflow: visible;
    z-index: 7000; }

.o-overlay_dark {
  background: rgba(0, 0, 0, 0.7); }

.o-overlay_fixed {
  position: fixed; }

.o-spinner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 96px;
  aspect-ratio: 1/1; }

.o-spinner__svg {
  --_circle-radius: 45px;
  --_svg-width: 96px;
  --_stroke-width: 10px;
  width: var(--_svg-width);
  height: var(--_svg-width);
  stroke-width: var(--_stroke-width);
  stroke: #fff;
  stroke-dashoffset: 1;
  stroke-dasharray: 1 1000;
  animation: loader 1000ms infinite linear, spin 1500ms infinite linear; }

@keyframes loader {
  0% {
    stroke-dashoffset: 1;
    stroke-dasharray: 1 1000; }
  100% {
    stroke-dashoffset: calc(var(--_circle-radius) * -2 * 3.1415);
    stroke-dasharray: calc(var(--_circle-radius) * 2 * 3.1415) 1000; } }

@keyframes spin {
  0% {
    rotate: 0deg; }
  100% {
    rotate: 360deg; } }

.o-ico {
  --_size: 56px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: var(--_size);
  min-width: var(--_size);
  height: var(--_size);
  margin: auto;
  border: 1px solid;
  border-radius: 8px;
  font-size: 24px; }

.o-ico_primary {
  border-color: #02B3A0;
  color: #fff;
  background-color: #02B3A0; }
  .is-box-disabled .o-ico_primary {
    background-color: #9F9FA6;
    border-color: #9F9FA6; }

.o-ico_neutro {
  border-color: #fff;
  color: #02B3A0;
  background-color: #fff; }

.o-ico_error {
  color: #fff;
  background-color: #C31F39; }

.o-ico-scroll {
  position: absolute;
  right: 0;
  bottom: -26px;
  left: 0;
  z-index: 7000;
  transition: all .2s; }
  .o-ico-scroll:active, .o-ico-scroll:focus, .o-ico-scroll:hover {
    transform: scale(0.9); }

.o-ico-inline::before {
  color: #02B3A0;
  margin-right: 8px; }

.o-slider-controls {
  position: relative;
  display: flex;
  width: 250px;
  height: 50px;
  margin-right: auto;
  margin-left: auto; }
  .is-only .o-slider-controls {
    display: none; }

.o-slider-pagination {
  top: 0 !important;
  right: 0;
  bottom: 0 !important;
  left: 0 !important;
  margin: auto;
  transform: translateX(0) !important;
  z-index: -1; }
  .o-slider-pagination:not(.swiper-pagination-lock) {
    display: flex;
    align-items: center; }
  .o-slider-pagination .swiper-pagination-bullet {
    width: 10px;
    min-width: 10px;
    height: 10px;
    background-color: #02B3A0; }
    .is-hero-bg .o-slider-pagination .swiper-pagination-bullet {
      background-color: #fff; }
  .o-paginator-fraction .o-slider-pagination {
    justify-content: center; }

.o-slider-pagination-bottom {
  height: max-content;
  bottom: 0 !important;
  top: auto !important; }

.o-slider-controls__control {
  width: 44px;
  border-radius: 8px;
  border: 2px solid #02B3A0;
  transition: all .2s ease-in; }
  .o-slider-controls__control:hover {
    background-color: rgba(2, 179, 160, 0.5); }
    .o-slider-controls__control:hover::after {
      color: #fff; }
  .o-slider-controls__control::after {
    font-family: "ico-fun-sib";
    font-size: 14px;
    color: #02B3A0; }
  .is-hero-bg .o-slider-controls__control {
    border-color: #fff; }
    .is-hero-bg .o-slider-controls__control::after {
      color: #fff; }
  .o-slider-controls__control.swiper-button-prev::after {
    content: ""; }
  .o-slider-controls__control.swiper-button-next::after {
    content: ""; }

.o-paginator-fraction {
  align-self: flex-end;
  width: 100%;
  max-width: 600px;
  margin-right: auto;
  margin-left: auto;
  text-align: center; }
  .o-paginator-fraction .o-slider-pagination-bottom {
    display: flex;
    align-items: center;
    gap: 8px; }

@media only screen and (min-width: 768px) {
  .o-slider-controls {
    margin-top: 64px; } }

@media only screen and (max-width: 767px) {
  .o-slider-controls {
    margin-top: 32px; }
  .o-slider-pagination {
    height: 50px;
    bottom: 0 !important;
    z-index: -1; }
  .o-slider-controls__control.swiper-button-next {
    right: 0; }
  .o-slider-controls__control.swiper-button-prev {
    left: 0; } }

/*----------------------------------------------*\
  ID: b24
  Arrow breadcrumbs
  Type: block list
  Description: Description: List with anchor links, seen with a breadcrumb
\*----------------------------------------------*/
.c-arrow-breadcrumb {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  overflow: hidden; }

.c-arrow-breadcrumb__item {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 auto;
  -moz-box-flex: 0;
  -moz-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  background-color: #F7F9FA;
  padding: 10px 32px 9px 10px;
  padding: 0.625rem 2rem 0.5625rem 0.625rem;
  overflow: hidden; }
  .c-arrow-breadcrumb__item:first-child {
    border-top-left-radius: 8px;
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 8px;
    border-bottom-left-radius: 0.5rem; }
  .c-arrow-breadcrumb__item:after, .c-arrow-breadcrumb__item:before {
    content: "";
    position: absolute;
    top: 50%;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 42px 0 42px 40px;
    border-width: 2.625rem 0 2.625rem 2.5rem;
    -webkit-transform: rotate(360deg);
    transform: translateY(-50%); }
  .c-arrow-breadcrumb__item:after {
    right: 6px;
    right: 0.375rem;
    border-color: transparent transparent transparent #F7F9FA; }
  .c-arrow-breadcrumb__item:before {
    right: 0;
    border-color: transparent transparent transparent #fff; }
  .c-arrow-breadcrumb__item:last-child:before {
    border-width: 40px;
    border-width: 2.5rem;
    border-color: #fff;
    right: -34px;
    right: -2.125rem; }

.c-arrow-breadcrumb__link {
  z-index: 1;
  display: block;
  display: -webkit-box;
  max-height: 18px;
  max-height: 1.125rem;
  overflow: hidden;
  line-height: 1.8;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  font-size: 10px;
  font-size: 0.625rem; }

@media all and (min-width: 520px) {
  .c-arrow-breadcrumb__link {
    z-index: 1;
    display: block;
    display: -webkit-box;
    max-height: 28.8px;
    max-height: 1.8rem;
    overflow: hidden;
    line-height: 1.8;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    font-size: 16px;
    font-size: 1rem; } }

@media only screen and (min-width: 768px) {
  .c-arrow-breadcrumb {
    margin-bottom: 64px; } }

@media only screen and (max-width: 767px) {
  .c-arrow-breadcrumb {
    margin-bottom: 24px; } }

.o-social__lead {
  position: relative;
  display: block;
  margin-bottom: 32px;
  text-align: center; }
  .o-social__lead::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    display: block;
    width: 100%;
    height: 2px;
    margin: auto;
    background-color: #E5EBEE; }

.o-social__lead-copy {
  position: relative;
  background-color: #fff;
  z-index: 2; }

.o-social__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; }

.o-social__action {
  flex: 1 45%;
  text-align: center; }

.o-social__button-txt {
  display: block;
  width: max-content;
  font-size: 0;
  opacity: 0; }

.is-ico-list_show {
  opacity: 0;
  animation-name: blink;
  animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  animation-duration: 2s;
  font-size: 16px;
  font-size: 1rem; }

@keyframes blink {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@media only screen and (min-width: 768px) {
  .o-social__lead-copy {
    padding: 0 24px; } }

@media only screen and (max-width: 767px) {
  .o-social__lead-copy {
    width: 90%;
    display: block;
    margin: 0 auto; } }

.o-results__header-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px 80px;
  margin-bottom: 32px; }

.o-results__select {
  cursor: pointer; }
  .o-results__select select {
    color: #171719; }
  .o-results__select::after {
    font-size: 18px;
    color: #171719; }

@media screen and (max-width: 680px) {
  .o-results__header {
    margin-bottom: 32px; }
  .o-results__cta {
    max-width: 100%; } }

@media screen and (min-width: 681px) {
  .o-results__header {
    margin-bottom: 64px; }
  .o-results__select {
    max-width: 180px;
    margin-right: 0;
    margin-left: auto; } }

.o-paginator {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center; }

.o-paginator__box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  border-radius: 8px; }
  .o-paginator__box:not(.o-paginator__box.o-paginator__elipsis):hover {
    border-color: #02B3A0; }

.o-paginator__control {
  border-color: #02B3A0;
  color: #02B3A0; }
  .o-paginator__control:hover {
    color: #fff;
    background-color: rgba(2, 179, 160, 0.9); }

.o-paginator__box_current {
  color: #fff;
  background-color: #02B3A0; }

@media only screen and (min-width: 768px) {
  .o-paginator {
    gap: 16px;
    margin-top: 64px; }
  .o-paginator__box {
    width: 48px;
    height: 48px; } }

@media only screen and (max-width: 767px) {
  .o-paginator {
    gap: 8px;
    margin-top: 32px; }
  .o-paginator__box {
    width: 40px;
    height: 40px; } }

.o-message {
  width: 90%;
  max-width: 600px;
  min-height: 50vh;
  display: flex;
  align-items: center;
  margin: auto;
  text-align: center; }

.o-intro-page {
  text-align: center; }

.o-intro-page__top,
.o-intro-page__tags,
.o-intro-page__chips,
.o-intro-page__chip {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center; }

.o-intro-page__top {
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  gap: 1.5rem;
  margin-top: 64px;
  margin-top: 4rem;
  margin-bottom: 64px;
  margin-bottom: 4rem;
  margin-left: 64px;
  margin-left: 4rem;
  margin-right: 64px;
  margin-right: 4rem; }

.o-intro-page__tags {
  flex-wrap: wrap;
  gap: 8px;
  gap: 0.5rem; }
  .o-intro-page__tags .o-btn:first-child {
    background-color: #018072; }

.o-intro-page__chips {
  max-width: 840px;
  flex-wrap: wrap;
  column-gap: 8px;
  column-gap: 0.5rem;
  row-gap: 16px;
  row-gap: 1rem; }

.o-intro-page__chip {
  padding-left: 8px;
  padding-left: 0.5rem;
  padding-right: 16px;
  padding-right: 1rem;
  gap: 8px;
  gap: 0.5rem;
  color: #72727C;
  background-color: #F7F9FA;
  border-radius: 4px;
  border-radius: 0.25rem; }
  .o-intro-page__chip:before {
    font-weight: 700; }

.o-intro-page__description {
  padding-top: 88px;
  padding-top: 5.5rem;
  padding-bottom: 88px;
  padding-bottom: 5.5rem;
  background-color: #F7F9FA;
  color: #363642;
  text-align: center;
  font-size: 20px;
  line-height: calc(32/20); }

.o-intro-page__span {
  max-width: 866px;
  margin: 0 auto; }

.o-intro-page__img {
  width: 100%;
  max-height: 660px;
  object-fit: cover; }

@media only screen and (max-width: 1023px) {
  .o-intro-page__span {
    width: 90%; } }

.c-sidebar {
  height: 100%; }

.c-sidebar__nav {
  max-width: 430px;
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  margin-left: auto;
  margin-right: auto; }

.c-sidebar__list,
.c-sidebar__sublist {
  list-style-type: none; }

.c-sidebar__item {
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  padding: 32px;
  padding: 2rem;
  border-radius: 16px;
  border-radius: 1rem;
  background-color: #02B3A0; }

.c-sidebar__title {
  margin-bottom: 32px;
  margin-bottom: 2rem;
  font-family: "Geologica", sans-serif;
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: 600;
  color: #8AE5DC; }

.c-sidebar__subitem {
  margin-bottom: 16px;
  margin-bottom: 1rem; }

@media only screen and (min-width: 1024px) {
  .c-sidebar {
    padding-right: 64px;
    padding-right: 4rem; }
  .c-sidebar__nav {
    position: sticky;
    top: 0;
    max-width: 350px;
    margin-bottom: 96px;
    margin-bottom: 6rem; } }

.l-header__top,
.l-header__box,
.l-header__actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }

.l-header__top {
  position: relative;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  gap: 16px;
  gap: 1rem;
  background-color: #333333; }

.l-header__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  border: none;
  padding: 0;
  font-size: 32px;
  font-size: 2rem;
  line-height: 1;
  color: #02B3A0; }

.l-header__nav-link {
  display: block;
  border-radius: 8px;
  border-radius: 0.5rem;
  font-weight: 700;
  color: #fff;
  border: 1px solid #02B3A0;
  transition: all .2s ease-in; }
  .l-header__nav-link:hover, .l-header__nav-link.is-current-menu {
    background-color: #018072;
    text-decoration: none;
    border: 1px solid #8AE5DC; }

.o-dropdown__title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  margin: 10px 0;
  margin: 0.625rem 0; }
  .o-dropdown__title::after {
    margin-left: 16px;
    margin-left: 1rem;
    font-size: 16px;
    font-size: 1rem; }

.l-header-search__ico {
  border-radius: 8px;
  border-radius: 0.5rem;
  color: #02B3A0;
  background-color: #fff; }
  .is-show-search .l-header-search__ico::before {
    content: ""; }

@media only screen and (min-width: 768px) {
  .l-header__top {
    padding: 24px 40px;
    padding: 1.5rem 2.5rem; }
  .l-header__box,
  .l-header__actions,
  .l-header-search__ico,
  .l-header__nav {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
  .l-header__box,
  .l-header__actions {
    gap: 24px;
    gap: 1.5rem; }
  .l-header__actions {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end; }
  .l-header__icons {
    display: none; }
  .l-header-search__ico,
  .l-header__nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center; }
  .l-header-search {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-left: 40px;
    margin-left: 2.5rem; }
    .l-header-search::after {
      content: "";
      position: absolute;
      top: 0;
      left: -32px;
      bottom: 0;
      width: 1px;
      width: 0.0625rem;
      height: 100%;
      background: #E5EBEE; }
  .l-header-search__ico {
    position: relative;
    width: 48px;
    width: 3rem;
    height: 48px;
    height: 3rem; }
    .l-header-search__ico::before {
      font-size: 18px;
      font-size: 1.125rem; }
  .l-header__dropdown {
    position: relative; }
    .l-header__dropdown .o-dropdown__title {
      color: #8AE5DC; }
    .l-header__dropdown .o-dropdown__list {
      width: 100%;
      border-radius: 8px;
      border-radius: 0.5rem;
      padding: 8px;
      padding: 0.5rem;
      z-index: 10;
      background: #fff; }
  .l-header__title {
    display: none; }
  .l-header__nav {
    gap: 8px;
    gap: 0.5rem;
    padding: 40px;
    padding: 2.5rem;
    background: #02B3A0; }
  .l-header__nav-link {
    padding: 10px 24px;
    padding: 0.625rem 1.5rem; } }

@media (min-width: 768px) and (max-width: 1083px) {
  .l-header__actions {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;
    flex: 0 1 100%; }
    .l-header__actions .o-btn {
      margin-left: auto; }
  .l-header__nav-link {
    text-align: center; } }

@media only screen and (max-width: 767px) {
  .l-header__top {
    padding: 24px 16px;
    padding: 1.5rem 1rem; }
  .l-header__box {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px;
    gap: 1rem;
    width: 100%; }
    .l-header__box .o-brand {
      order: 1;
      flex: 1 45%; }
  .l-header__actions {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 32px;
    gap: 2rem;
    width: 100%; }
  .l-header__icons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    flex: 1 45%;
    order: 2; }
  .l-header__lead {
    flex: 1 100%;
    padding: 32px 0;
    padding: 2rem 0;
    border-top: 2px solid #8AE5DC;
    border-bottom: 2px solid #8AE5DC;
    text-align: center;
    color: #fff;
    order: 3;
    display: none; }
  .l-header__dropdown .o-dropdown__title {
    width: 100%;
    color: #fff; }
  .l-header__dropdown .o-dropdown__list {
    position: static; }
  .l-header__dropdown .o-link {
    color: #fff; }
  .l-header__menu {
    padding: 32px 16px;
    padding: 2rem 1rem;
    border-top: 1px solid #fff;
    text-align: center;
    background-color: #333333; }
  .l-header__title {
    margin-bottom: 32px;
    margin-bottom: 2rem;
    font-size: 24px;
    font-size: 1.5rem; }
  .l-header__nav-link {
    margin-bottom: 8px;
    margin-bottom: 0.5rem;
    padding: 8px;
    padding: 0.5rem; }
  .l-header-search__ico {
    width: 32px;
    height: 32px;
    margin-right: 16px;
    margin-right: 1rem;
    font-size: 18px; }
  .l-header-search {
    display: none; }
  .l-header {
    z-index: 10;
    transition: all .1s ease; }
    .l-header.is-show {
      position: fixed;
      top: 0;
      width: 100%;
      height: 100vh;
      overflow: auto;
      z-index: 100000;
      background-color: #02B3A0; }
      .l-header.is-show .l-header__top,
      .l-header.is-show .l-header__menu {
        background-color: inherit; }
      .l-header.is-show .l-header__icon:not(.l-header-search__ico) {
        color: #fff; }
        .l-header.is-show .l-header__icon:not(.l-header-search__ico)::before {
          content: "";
          font-size: 24px; }
  .is-show .l-header__lead {
    display: block; }
  .l-header__lead,
  .l-header__actions,
  .l-header__menu {
    opacity: 0;
    z-index: -10;
    position: absolute;
    width: 100%;
    top: -1000px;
    right: 0;
    transition: all .1s ease; }
    .is-show .l-header__lead, .is-show .l-header__actions, .is-show .l-header__menu {
      position: static;
      opacity: 1;
      z-index: 10; } }

.l-footer__top {
  background: #E5EBEE; }

.l-footer__actions,
.l-footer__grid,
.l-footer__bottom {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }

.l-footer__bottom {
  background-color: #F7F9FA; }

.l-footer__col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column; }

.l-footer__title {
  width: 100%;
  font-weight: 700; }

.l-footer__box a {
  font-size: 14px;
  font-size: 0.875rem; }

.l-footer__social-item {
  font-size: 40px;
  font-size: 2.5rem;
  line-height: 1; }
  .l-footer__social-item:not(.l-footer__social-item:last-of-type) {
    margin-right: 24px;
    margin-right: 1.5rem; }

@media only screen and (min-width: 768px) {
  .l-footer__top {
    padding: 80px 64px;
    padding: 5rem 4rem; }
  .l-footer__actions,
  .l-footer__grid,
  .l-footer__bottom {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between; }
  .l-footer__actions {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    margin-bottom: 64px;
    margin-bottom: 4rem; }
  .l-footer__grid {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    align-items: flex-start;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none; }
  .l-footer__col {
    flex: 0 1 23%;
    gap: 32px;
    gap: 2rem;
    margin-right: 17px;
    margin-right: 1.0625rem; }
  .l-footer__col_order .l-footer__box:nth-child(2) {
    order: 3; }
  .l-footer__box .o-dropdown__list {
    padding: 0; }
  .l-footer__title {
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    font-size: 16px;
    font-size: 1rem; }
    .l-footer__title::after {
      content: ""; }
  .l-footer__link {
    font-size: 14px;
    font-size: 0.875rem; }
  .l-footer__social {
    order: 2; }
  .l-footer__bottom {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    padding: 40px;
    padding: 2.5rem; }
  .l-footer__img {
    max-width: 345px;
    max-width: 21.5625rem; } }

@media only screen and (max-width: 767px) {
  .l-footer__top {
    padding: 32px 16px;
    padding: 2rem 1rem; }
  .l-footer__actions {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: 32px;
    margin-bottom: 2rem; }
    .l-footer__actions .o-btn {
      max-width: 180px;
      max-width: 11.25rem; }
  .l-footer__grid,
  .l-footer__bottom {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column; }
  .l-footer__grid {
    list-style: none; }
    .l-footer__grid .o-dropdown {
      padding-bottom: 4px;
      padding-bottom: 0.25rem; }
  .l-footer__col {
    gap: 24px;
    gap: 1.5rem;
    margin-bottom: 24px;
    margin-bottom: 1.5rem; }
    .l-footer__col:first-of-type {
      order: 2; }
    .l-footer__col .o-dropdown {
      padding: 0 24px; }
  .l-footer__contact {
    order: 2; }
  .l-footer__social {
    order: 3;
    padding: 32px 0;
    padding: 2rem 0;
    margin: 32px 0 0;
    margin: 2rem 0 0;
    border-top: 1px solid #9F9FA6;
    border-bottom: 1px solid #9F9FA6; }
  .l-footer__social-nav {
    margin-top: 8px;
    margin-top: 0.5rem; }
  .l-footer__bottom {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    gap: 32px;
    gap: 2rem;
    padding: 32px 16px;
    padding: 2rem 1rem; } }

.c-breadcrumbs {
  padding: 32px 0; }

.c-breadcrumbs__list {
  display: flex;
  align-items: center;
  gap: 20px;
  overflow: auto; }

.c-breadcrumbs__item {
  min-width: max-content; }
  .c-breadcrumbs__item:not(.c-breadcrumbs__item:last-of-type)::after {
    content: "/";
    padding-left: 20px; }

.c-breadcrumbs__link:hover {
  text-decoration: underline; }

.l-cookies.is-overlay-show {
  z-index: 90000000; }

.l-cookies .s-richtext {
  margin-bottom: 0 !important; }

.l-cookies .c-modal__close {
  display: none; }

.l-cookies__wrap {
  -webkit-align-self: flex-end;
  -moz-align-self: flex-end;
  -ms-flex-item-align: end;
  align-self: flex-end;
  width: 90%;
  max-width: 1300px;
  margin-bottom: 32px;
  margin-bottom: 2rem; }

.l-cookies__cta {
  text-align: center; }

@media only screen and (max-width: 767px) {
  .l-cookie__ico {
    width: 80px;
    height: 80px;
    aspect-ratio: 1/1;
    margin-bottom: 40px; }
  .l-cookies__wrap {
    text-align: center; }
  .l-cookies__cta {
    margin-top: 40px; }
    .l-cookies__cta .o-btn:first-of-type {
      margin-bottom: 16px; } }

@media only screen and (min-width: 768px) {
  .l-cookies__wrap .c-modal__wrap {
    display: flex;
    align-items: center;
    gap: 54px; }
  .l-cookies__cta {
    margin-right: 0;
    margin-left: auto; } }

.l-search-advanced {
  margin-top: calc(40px - 24px);
  margin-bottom: calc(40px - 16px);
  padding-top: 40px;
  padding-bottom: 40px;
  border-top: 2px solid #E5EBEE;
  border-bottom: 2px solid #E5EBEE; }

.l-search-advanced__header,
.l-search-advanced__wrapper {
  display: flex;
  justify-content: space-between; }

.l-search-advanced__header {
  align-items: center; }

.l-search-advanced__caption {
  margin: 16px 0; }

.is-dropdown-active .l-search-advanced__action {
  display: none; }

.l-search-advanced__group:not(.l-search-advanced__group:last-of-type) {
  margin-bottom: 16px; }

.l-search-advanced__wrapper {
  align-items: baseline;
  flex-wrap: wrap;
  column-gap: 8px; }

.l-search-advanced__group_border {
  border: 2px solid #E5EBEE;
  border-radius: 16px;
  padding: 16px; }

.l-search-advanced__group_border-top {
  margin-top: 8px;
  padding-top: 24px;
  border-top: 2px solid #E5EBEE; }

.l-search-advanced_set-20 {
  flex: 1 20%; }

.l-search-advanced_set-50 {
  flex: 1 45%; }

.l-search-advanced_set-100 {
  flex: 1 100%; }

.l-search-advanced__cta {
  margin-top: 24px;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 2px solid #E5EBEE; }

.l-search-advanced__separator {
  position: relative;
  display: block;
  margin-top: 24px;
  margin-bottom: 24px; }
  .l-search-advanced__separator::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    margin: auto;
    background: #E5EBEE; }

.l-search-advanced__separator-txt {
  position: relative;
  padding: 0 10px;
  z-index: 10;
  background-color: #fff; }

/*----------------------------------------------*\
  ID: C36
  Hero
  Type: Banner
  Description: Banner principal con imagen
\*----------------------------------------------*/
/**
 * Class: .c-hero
 * @description  Título principal, contenido descriptivo, logos corporativos y componente de búsqueda c01_search.
 * @structure c36_hero
 * @flag full-width
 * @section Banner
 * @markup
 *   <div class="c-hero swiper-container js-slider-hero swiper-container-initialized swiper-container-horizontal" style="">
 *     <div class="swiper-wrapper">
 *       <div class="swiper-slide js-slider-hero-slide swiper-slide-active" style="width: 1254px;">
 *         <div class="c-hero__slide">
 *           <div class="c-hero__wrap">
 *             <div class="c-hero__top">
 *               <figure class="c-hero__figure">
 *               <div>
 *               <iframe width="200" height="113" src="https://www.youtube.com/embed/tE8WVKc-coY?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" title="Pielroja - Arriba (Prod Unloged ,DJhosky)"></iframe>
 *               </div>
 *               </figure>
 *               <header class="c-hero__header">
 *                 <span class="c-hero__text c-hero__text_uppercase ag-o-text_bold">del 19 al 28 de agosto</span>
 *                 <h2 class="c-hero__title ag-js-booleanHeadline"><p><b><i>Festival Internacional de</i></b> Cine Ambient</p></h2>
 *                 <span class="ag-js-booleanHeadlineTexts" style="display: none;"><div class="rich-text"><p><b><i>Festival Internacional de</i></b> Cine Ambiental</p></div></span>
 *                 <div class="c-hero__text c-hero__lead">
 *                 <div class="rich-text"><p>Descubre la<b> Selección Oficial</b> 2022 de películas que abordan problemáticas ambientales alrededor del mundo.</p></div></div>
 *                 <a href="/wagtail/pages/" title="Ir a Ver Programación" class="c-hero__btn ag-o-btn">Ver Programación</a>
 *               </header>
 *             </div>
 *           </div>
 *         </div>
 *       </div>
 *     </div>
 *   </div>
 */
.c-hero:not(.is-hero-bg .c-hero) .ag-c-slider__control_outline {
  color: #02B3A0; }

.is-hero-bg .c-hero {
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover; }

.c-hero .o-slider-pagination {
  top: auto !important; }

.c-hero__title {
  font-family: "Geologica", sans-serif;
  line-height: calc(60/48); }

.c-hero__description {
  line-height: calc(32/20); }

.is-hero-bg .c-hero__header {
  color: #fff; }

.c-hero__figure div {
  height: 100%; }

.c-hero__figure iframe {
  width: 100%; }

.c-hero__img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover; }

.is-only .c-hero__controls {
  display: none; }

.c-hero__scroll-down {
  display: flex;
  -webkit-box-direction: reverse;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column-reverse;
  -moz-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  row-gap: 16px;
  row-gap: 1rem;
  margin-top: 40px;
  margin-top: 2.5rem;
  margin-right: auto;
  margin-left: auto;
  color: #02B3A0; }
  .c-hero__scroll-down::before {
    --_size: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: var(--_size);
    height: var(--_size);
    margin: auto;
    border: 1px solid;
    border-radius: 8px;
    font-size: 24px;
    color: #fff;
    background-color: #02B3A0; }
  .c-hero__scroll-down:hover {
    transform: translateY(8px); }
  .is-hero-bg .c-hero__scroll-down {
    color: #fff; }
    .is-hero-bg .c-hero__scroll-down::before {
      border-color: #fff;
      color: #02B3A0;
      background-color: #fff; }

/*------------------------------------*\
  Media Querys
\*------------------------------------*/
/**
* Mobile | VP: max-width 768px
*/
@media only screen and (max-width: 767px) {
  .c-hero__top {
    min-height: 250px;
    min-height: 15.625rem; }
    .is-hero-bg .c-hero__top {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      -moz-align-items: center;
      align-items: center; }
  .c-hero__header {
    max-width: 560px;
    max-width: 35rem;
    padding: 32px 24px;
    padding: 2rem 1.5rem;
    margin: 0 auto;
    text-align: center; }
  .c-hero__text {
    font-size: 14px;
    font-size: 0.875rem; }
  .c-hero__title {
    font-size: 36px;
    margin: 16px 0; }
  .c-hero__btn {
    display: block;
    width: 100%;
    max-width: 190px;
    max-width: 11.875rem;
    margin-top: 32px;
    margin-top: 2rem;
    margin-right: auto;
    margin-left: auto; }
  .c-hero__figure {
    height: 212px;
    height: 13.25rem; }
    .c-hero__figure iframe {
      height: 100%; }
  .c-hero__img {
    height: 100%; }
  .c-hero__controls {
    position: relative;
    max-width: 256px;
    height: 50px;
    height: 3.125rem;
    margin: auto; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .c-hero:not(.c-hero.is-only) .swiper-wrapper {
    padding-bottom: 40px; }
  .c-hero__wrap {
    width: 90%;
    max-width: 1080px;
    max-width: 67.5rem;
    margin: 0 auto;
    border: 1px solid #E5EBEE;
    border-radius: 16px;
    padding: 32px; }
  .c-hero__top {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    column-gap: 80px;
    column-gap: 5rem;
    min-height: 315px;
    min-height: 19.6875rem; }
  .c-hero__figure {
    order: 2;
    border-radius: 16px;
    overflow: hidden; }
    .c-hero__figure iframe {
      height: 270px;
      height: 16.875rem; }
  .c-hero__header {
    max-width: 500px;
    max-width: 31.25rem; }
    .is-hero-bg .c-hero__header {
      max-width: 480px;
      max-width: 30rem; }
  .c-hero__title {
    font-size: 48px;
    margin: 24px 0; }
  .c-hero__figure {
    width: 480px;
    width: 30rem;
    max-width: 480px;
    max-width: 30rem; }
  .c-hero__controls {
    width: 100%;
    max-width: 1320px;
    max-width: 82.5rem;
    margin-right: auto;
    margin-left: auto; }
  .c-hero__controls {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    height: 100%;
    margin: auto; } }

.c-map,
.c-map__panel,
.c-map__form-label {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }

.c-map {
  position: relative;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center; }
  .c-map .o-overlay.is-results-null .o-spinner {
    display: none; }

.c-map__content {
  position: absolute;
  top: 0;
  display: block;
  z-index: 8000; }

.c-map__panel {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  margin-bottom: 8px;
  margin-bottom: 0.5rem; }

.c-map__form {
  border-radius: 8px;
  border-radius: 0.5rem;
  padding: 16px 24px;
  padding: 1rem 1.5rem;
  background: #fff; }

.c-map__form-label {
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  gap: 8px;
  gap: 0.5rem; }
  .c-map__form-label::before {
    font-family: "ico-fun-sib";
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 1;
    color: #02B3A0; }
  .c-map__form-label#area_locality::before {
    content: ""; }
  .c-map__form-label#services::before {
    content: ""; }
  .c-map__form-label#type::before {
    content: ""; }

.c-map__btn {
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
  border-radius: 4px;
  border-radius: 0.25rem;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1;
  color: #fff;
  background-color: #02B3A0; }
  .is-dropdown-active .c-map__btn::before {
    content: "";
    font-size: 12px;
    font-size: 0.75rem; }

.c-map__modal .leaflet-popup-content {
  width: auto !important;
  font-size: 16px !important; }
  .c-map__modal .leaflet-popup-content p {
    margin: 0 0 8px 0; }
    .c-map__modal .leaflet-popup-content p.o-ico-inline {
      margin: 0; }

.leaflet-container .c-map__modal a {
  color: #fff; }
  .leaflet-container .c-map__modal a.o-btn_outline {
    color: #171719; }
  .leaflet-container .c-map__modal a.leaflet-popup-close-button {
    --_size: 8px;
    margin-right: var(--_size);
    margin-top: var(--_size);
    font-size: 32px;
    font-size: 2rem;
    color: #02B3A0; }

.c-map__modal-header {
  padding-right: 8px;
  padding-right: 0.5rem; }

.c-map__modal-btn {
  width: 100%;
  margin-top: 16px;
  margin-top: 1rem;
  color: #fff; }

@media only screen and (max-width: 767px) {
  .c-map__frame {
    min-height: 500px;
    min-height: 31.25rem; }
  .c-map__form {
    width: 90%;
    margin: auto; }
  .c-map__content {
    align-self: center;
    margin-top: 16px;
    margin-top: 1rem; }
  .c-map__alert {
    bottom: 0;
    margin-bottom: 60px;
    margin-bottom: 3.75rem; }
  .c-map__modal {
    min-width: 300px;
    min-width: 18.75rem; } }

@media only screen and (min-width: 768px) {
  .c-map__content {
    margin-top: 56px;
    margin-top: 3.5rem;
    margin-left: 56px;
    margin-left: 3.5rem; }
  .c-map__form {
    min-width: 390px;
    min-width: 24.375rem;
    max-width: 390px;
    max-width: 24.375rem; }
  .c-map__modal {
    min-width: 390px;
    min-width: 24.375rem; }
  .c-map__modal-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 8px; }
  .c-map__modal-btn {
    flex: 1; }
  .c-map__frame {
    min-height: 660px;
    min-height: 41.25rem; } }

.s-richtext {
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 64px;
  margin-bottom: 4rem; }
  .o-layout__main .s-richtext {
    margin-top: 0; }
  .s-richtext br {
    content: "";
    display: block;
    padding-bottom: 8px;
    padding-bottom: 0.5rem; }
  .s-richtext a {
    position: relative;
    padding: 0;
    text-decoration: underline;
    text-underline-position: under;
    word-break: break-word;
    color: #02B3A0;
    font-weight: 700; }
    .s-richtext a:hover {
      color: #02FFE5; }
  .s-richtext ul,
  .s-richtext ol {
    margin-top: 16px;
    margin-top: 1rem;
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    margin-left: 64px;
    margin-left: 4rem; }
  .s-richtext li,
  .s-richtext p {
    font-weight: 300;
    font-size: 18px;
    font-size: 1.125rem; }
  .s-richtext li:not(:last-of-type) {
    margin-bottom: 8px;
    margin-bottom: 0.5rem; }
  .s-richtext p:not(.s-richtext p:last-of-type) {
    margin-top: 40px;
    margin-top: 2.5rem; }
  .s-richtext p:not(.s-richtext p:first-of-type) {
    margin-bottom: 40px;
    margin-bottom: 2.5rem; }
  .s-richtext h2 {
    margin-bottom: 32px;
    margin-bottom: 2rem;
    font-size: 48px;
    font-size: 3rem; }
  .s-richtext h3,
  .s-richtext h4,
  .s-richtext h5 {
    margin-bottom: 32px;
    margin-bottom: 2rem; }
  .s-richtext h3 {
    font-size: 36px;
    font-size: 2.25rem; }
  .s-richtext h4,
  .s-richtext h5 {
    font-size: 24px;
    font-size: 1.5rem; }
  .s-richtext figure,
  .s-richtext img,
  .s-richtext iframe {
    display: block;
    width: 100%;
    max-width: 827px;
    max-width: 51.6875rem;
    height: auto;
    margin-top: 32px;
    margin-top: 2rem;
    margin-right: auto;
    margin-left: auto;
    object-fit: cover; }
  .s-richtext figure {
    margin-bottom: 64px;
    margin-bottom: 4rem; }
  .s-richtext img,
  .s-richtext iframe {
    border-radius: 16px;
    border-radius: 1rem;
    overflow: hidden; }
  .s-richtext iframe {
    min-height: 460px;
    min-height: 28.75rem; }
    .s-richtext iframe[src*="soundcloud"], .s-richtext iframe[src*="spotiy"], .s-richtext iframe[src*="spreaker"] {
      min-height: 260px;
      min-height: 16.25rem; }
  .s-richtext blockquote {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;
    gap: 64px;
    gap: 4rem;
    margin-top: 64px;
    margin-top: 4rem;
    margin-bottom: 64px;
    margin-bottom: 4rem;
    border-radius: 16px;
    border-radius: 1rem;
    padding: 64px;
    padding: 4rem;
    background-color: #D4F3F0; }
    .s-richtext blockquote::before {
      content: "";
      font-family: "ico-fun-sib";
      font-size: 70px;
      line-height: 1;
      color: #02B3A0; }
    .s-richtext blockquote p {
      color: #333333; }
  .s-richtext img {
    aspect-ratio: 16/9; }
  .s-richtext .left {
    float: left;
    margin-right: 24px;
    margin-right: 1.5rem; }
  .s-richtext .right {
    float: right;
    margin-left: 24px;
    margin-left: 1.5rem; }
  .s-richtext .left,
  .s-richtext .right {
    object-fit: cover;
    aspect-ratio: 1/1;
    max-width: 345px;
    margin-top: 0;
    margin-bottom: 40px;
    margin-bottom: 2.5rem; }

.s-richtext_list p:not(:last-of-type),
.s-richtext_inline p:not(:last-of-type) {
  margin-bottom: 8px;
  margin-bottom: 0.5rem; }

.s-richtext_list a,
.s-richtext_inline a {
  position: relative;
  padding: 0;
  text-decoration: underline;
  text-underline-position: under;
  word-break: break-word;
  color: #02B3A0;
  font-weight: 700; }
  .s-richtext_list a:hover,
  .s-richtext_inline a:hover {
    color: #02FFE5; }

.s-richtext_inline ul {
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem; }

.s-richtext_inline li:not(:last-of-type) {
  margin-bottom: 8px;
  margin-bottom: 0.5rem; }

.s-richtext_list ul ul,
.s-richtext_list ul ol,
.s-richtext_list ol ul,
.s-richtext_list ol ol {
  margin-top: 0;
  margin-bottom: 0; }

.s-richtext-caption-credit {
  display: block;
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  text-align: right; }

.s-richtext-caption-lead {
  position: relative;
  padding-left: 16px;
  padding-left: 1rem;
  line-height: 1.2; }
  .s-richtext-caption-lead::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 2px;
    width: 0.125rem;
    height: 100%;
    border-radius: 50%;
    background: #333333; }

/*------------------------------------*\
  Media querys
\*------------------------------------*/
@media only screen and (max-width: 767px) {
  .s-richtext ul,
  .s-richtext ol {
    margin-top: 24px;
    margin-top: 1.5rem;
    margin-bottom: 24px;
    margin-bottom: 1.5rem; }
  .s-richtext li:not(:last-of-type),
  .s-richtext p:not(:last-of-type) {
    margin-bottom: 32px;
    margin-bottom: 2rem; }
  .s-richtext h2 {
    margin-top: 32px;
    margin-top: 2rem;
    margin-bottom: 32px;
    margin-bottom: 2rem;
    font-size: 32px;
    font-size: 2rem; }
  .s-richtext h3 {
    font-size: 24px;
    font-size: 1.5rem; }
  .s-richtext figure,
  .s-richtext img,
  .s-richtext iframe {
    margin-top: 32px;
    margin-top: 2rem; }
  .s-richtext figure {
    margin-bottom: 32px;
    margin-bottom: 2rem; }
  .s-richtext iframe {
    min-height: 200px;
    min-height: 12.5rem; }
    .s-richtext iframe[src*="soundcloud"], .s-richtext iframe[src*="spotiy"], .s-richtext iframe[src*="spreaker"] {
      min-height: 120px;
      min-height: 7.5rem; }
  .s-richtext blockquote {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    align-items: flex-start;
    gap: 16px;
    gap: 1rem;
    margin-top: 32px;
    margin-top: 2rem;
    margin-bottom: 32px;
    margin-bottom: 2rem;
    padding: 32px;
    padding: 2rem; }
    .s-richtext blockquote::before {
      font-size: 48px; } }

@media only screen and (min-width: 768px) {
  .s-richtext blockquote {
    padding: 56px;
    padding: 3.5rem; }
    .s-richtext blockquote p {
      font-size: 18px;
      font-size: 1.125rem; }
      .s-richtext blockquote p::before, .s-richtext blockquote p::after {
        content: '"'; } }

.c-collapsible__subtitle {
  display: flex;
  align-items: center;
  gap: 16px; }

.c-collapsible__item {
  border: 2px solid #E5EBEE;
  border-radius: 16px; }

.c-collapsible__item-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid transparent;
  cursor: pointer; }
  .c-collapsible__item-header::after {
    font-weight: 700;
    font-size: 20px;
    color: #02B3A0;
    transition: all .3s ease-in; }
  .c-collapsible__item-header:hover::after {
    transform: rotate(180deg); }
  .c-collapsible__item-header.is-dropdown-show {
    border-color: #E5EBEE; }
    .c-collapsible__item-header.is-dropdown-show::after {
      transform: rotate(180deg); }
    .c-collapsible__item-header.is-dropdown-show + .c-collapsible__item-content {
      overflow: visible;
      visibility: visible;
      opacity: 1; }

.c-collapsible__document {
  display: flex;
  justify-content: space-between; }

.c-collapsible__document_column {
  flex-direction: column; }

.c-collapsible__document__link {
  height: fit-content;
  margin-top: calc($gutter/2); }
  .c-collapsible__document__link::after {
    color: #02B3A0;
    transition: all .2s ease-in; }
  .c-collapsible__document__link:hover {
    transform: scale(1.1); }

.c-collapsible__item-content {
  transition: all .3s ease-in;
  max-height: 0;
  overflow: hidden;
  visibility: hidden;
  opacity: 0; }

.c-collapsible__rich-text {
  margin-bottom: 0; }

@media only screen and (max-width: 767px) {
  .c-collapsible {
    margin-top: 32px; }
  .c-collapsible__item {
    padding: 16px; }
    .c-collapsible__item:not(.c-collapsible__item:last-of-type) {
      margin-bottom: 16px; }
  .c-collapsible__item-header.is-dropdown-show {
    margin-bottom: 16px;
    padding-bottom: 16px; }
  .c-collapsible__document::after {
    font-size: 16px; }
  .c-collapsible__document:not(.c-collapsible__document:last-of-type) {
    margin-bottom: 16px; } }

@media only screen and (min-width: 768px) {
  .c-collapsible {
    margin-top: 64px; }
  .c-collapsible__item {
    padding: 32px; }
    .c-collapsible__item:not(.c-collapsible__item:last-of-type) {
      margin-bottom: 24px; }
  .c-collapsible__item-header.is-dropdown-show {
    margin-bottom: 32px;
    padding-bottom: 32px; }
  .c-collapsible__document {
    padding: 0 16px; }
    .c-collapsible__document::after {
      font-size: 24px; }
    .c-collapsible__document:not(.c-collapsible__document:last-of-type) {
      margin-bottom: 32px; } }

.c-gallery__figure,
.c-gallery__figure-modal {
  margin: auto;
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 1/1; }

.c-gallery__figure {
  max-width: 400px;
  max-height: 400px;
  cursor: pointer; }
  .c-gallery__figure iframe {
    width: 100%;
    height: 100%; }
  .c-gallery__figure:hover .c-gallery__caption {
    transform: translateY(0); }

.c-gallery__caption {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-end;
  padding: 16px 24px;
  color: #fff;
  transform: translateY(100%);
  transition: all .2s ease;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.1) 100%); }

.c-gallery__caption-txt {
  display: block;
  display: -webkit-box;
  max-height: 67.2px;
  max-height: 4.2rem;
  overflow: hidden;
  line-height: 1.4;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  font-size: 16px;
  font-size: 1rem; }

.c-gallery__figure-modal {
  max-width: 600px;
  max-height: 600px;
  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.12); }
  .c-gallery__figure-modal iframe {
    width: 100%;
    height: 100%; }

.c-gallery__info {
  width: 600px;
  width: 37.5rem;
  margin-left: auto;
  margin-right: auto; }

.c-gallery__info-credits {
  margin-top: 16px;
  margin-top: 1rem;
  text-align: right; }

.c-gallery__info-description {
  margin-bottom: 0;
  margin-top: 16px;
  margin-top: 1rem; }

.c-gallery__img-modal {
  padding: 8px;
  border-radius: 16px;
  overflow: hidden; }

.c-gallery__caption-modal {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 16px;
  text-align: center;
  background: #fff; }

.c-gallery__title-modal {
  width: 100%;
  max-width: 600px;
  margin: auto;
  border-left: 2px solid #02B3A0;
  padding-left: 16px; }

@media only screen and (max-width: 767px) {
  .c-gallery__wrap-modal {
    padding-bottom: 24px; }
  .c-gallery__title-modal {
    margin-bottom: 16px;
    font-size: 16px; }
  .swiper-modal-gallery {
    padding-bottom: 24px; } }

@media only screen and (min-width: 768px) {
  .c-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    transform: none !important; }
  .c-gallery__col {
    flex: 0 0 calc(32.333% - 10px);
    max-width: calc(32.333% - 10px);
    transition-property: none; }
  .c-gallery__wrap-modal {
    padding-bottom: 80px; }
  .c-gallery__title-modal {
    margin-bottom: 24px; } }

@media (min-width: 769px) and (max-width: 1024px) {
  .c-gallery__col {
    flex: 0 0 calc(48.333% - 10px);
    max-width: calc(48.333% - 10px); } }

.c-links-list {
  width: 100%;
  max-width: 840px; }

.c-links-list_center .o-slider-controls {
  display: none; }

@media only screen and (min-width: 768px) {
  .c-links-list_center .swiper-wrapper {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center; } }

.c-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  color: #171719; }

.c-card_resource {
  max-width: 310px;
  margin: 0 auto; }
  .c-card_resource .c-card__figure {
    height: 200px;
    background-color: #F7F9FA; }
  .c-card_resource .c-card__content {
    padding-right: 0;
    padding-left: 0; }
  .c-card_resource .c-detail__list {
    gap: 16px; }

.c-card_results:not(.c-card_results:last-of-type) {
  margin-bottom: 24px; }

.c-card_results .c-card__wrap {
  justify-content: flex-start;
  border: 1px solid #E5EBEE; }

.c-card_results .c-card__content {
  flex: 1;
  gap: 8px;
  padding: 0; }

.c-card_results .c-card__description {
  display: block;
  display: -webkit-box;
  max-height: 67.2px;
  max-height: 4.2rem;
  overflow: hidden;
  line-height: 1.4;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  font-size: 16px;
  font-size: 1rem; }

.c-card_results .c-card__figure {
  height: 200px;
  aspect-ratio: 1/1;
  background-color: #F7F9FA; }

.c-card_results .c-detail__footer-flex {
  flex: 1; }

.c-card_results .c-detail__share {
  align-self: center;
  font-size: 14px; }

.c-card_results_content .c-card__wrap {
  align-items: center; }

.c-card_results_list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px; }
  .c-card_results_list .u-margin-bottom-8 {
    margin-bottom: 0; }

.c-card__wrap {
  display: flex;
  justify-content: center;
  gap: 16px;
  border-radius: 16px;
  padding: 16px;
  height: 100%; }
  .o-surface_neutro .c-card__wrap {
    border: 2px solid #E5EBEE; }
  .c-card__wrap:not(.c-card_results .c-card__wrap) {
    flex-direction: column; }

.c-card__figure {
  border-radius: 8px; }

.c-card__img {
  border-radius: 8px; }
  .c-card_results .c-card__img {
    display: block;
    margin: auto;
    max-width: 90px; }

.c-card__content,
.c-card__caption-txt {
  display: flex; }

.c-card__content {
  flex-direction: column;
  justify-content: space-between;
  gap: 16px; }

.c-card__caption-txt {
  align-items: center;
  font-weight: 600;
  text-transform: uppercase; }
  .c-card__caption-txt:not(.c-card__caption-txt:last-child) {
    margin-bottom: 10px; }
  .c-card__caption-txt::before {
    margin-right: 8px;
    font-size: 20px; }

.c-card__title {
  font-size: 18px;
  line-height: 1.4; }

.c-card__description {
  display: block;
  display: -webkit-box;
  max-height: 58.8px;
  max-height: 3.675rem;
  overflow: hidden;
  line-height: 1.4;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  font-size: 14px;
  font-size: 0.875rem; }
  .c-card__description p {
    display: block;
    display: -webkit-box;
    max-height: 58.8px;
    max-height: 3.675rem;
    overflow: hidden;
    line-height: 1.4;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    font-size: 14px;
    font-size: 0.875rem; }

.c-card__link {
  display: flex;
  flex-direction: column; }

@media only screen and (max-width: 1023px) {
  .c-card__img {
    display: none; }
    .c-card_resource .c-card__img, .c-card_results .c-card__img {
      display: block; }
  .c-card_resource .c-card__content {
    margin-top: 16px; }
  .c-card_results_content .c-card__figure {
    height: 104px; } }

@media only screen and (min-width: 1024px) {
  .c-card_results_content .c-card__figure {
    height: 130px;
    min-height: 130px; }
  .c-card__figure {
    position: relative;
    min-height: 194px; }
  .c-card__caption {
    position: absolute;
    bottom: 0;
    width: 100%;
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 32.29%, rgba(0, 0, 0, 0.8) 100%), #d3d3d300;
    z-index: 8;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 16px;
    color: #fff; }
  .c-card__content {
    padding: 0 16px; } }

@media screen and (min-width: 680px) {
  .c-card_results_list_border > :nth-child(2) {
    border-left: 2px solid #E5EBEE;
    padding-left: 16px; } }

@media screen and (max-width: 680px) {
  .c-card_results:not(.c-card_results.c-card_results_content) .c-card__wrap {
    flex-direction: column; } }

/* VP: max-width 0 - 767px */
@media only screen and (max-width: 767px) {
  .c-card__caption-txt::before {
    color: #02B3A0; } }

/**
* Desktop | VP: min-width 768px
*/
@media only screen and (min-width: 768px) {
  .c-card__title {
    display: block;
    display: -webkit-box;
    max-height: 48px;
    max-height: 3rem;
    overflow: hidden;
    line-height: 1.2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    font-size: 20px;
    font-size: 1.25rem; } }

.c-modal {
  position: absolute;
  padding: 32px;
  opacity: 0;
  visibility: hidden;
  transition: all 200ms; }
  .c-modal.is-modal-show {
    visibility: visible;
    opacity: 1; }

.c-modal_full {
  width: 98%;
  height: 95vh;
  padding: 16px; }

.c-modal__wrap {
  overflow: hidden; }

.c-modal__close {
  position: absolute;
  right: 0;
  top: 0;
  padding: 24px;
  font-size: 24px;
  color: #02B3A0; }

.c-modal__header {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%; }
  .c-modal__header .o-ico {
    margin: 0;
    font-size: 32px; }

.c-modal__header_border {
  border-bottom: 2px solid #E5EBEE;
  padding-bottom: 16px; }

.c-modal__content {
  overflow: auto;
  max-height: 360px; }

.c-modal__content_scroll {
  max-height: calc(82vh - 82px); }

.c-modal__content_bullet {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  margin-top: 24px;
  margin-top: 1.5rem; }
  .c-modal__content_bullet::before {
    content: "";
    min-height: 10px;
    min-width: 10px;
    background-color: #02B3A0;
    border-radius: 100%;
    margin-right: 8px;
    margin-right: 0.5rem; }

.c-modal__footer {
  padding: 10px 0;
  padding: 0.625rem 0; }

@media only screen and (max-width: 767px) {
  .c-modal {
    width: 90%; }
  .c-modal__header {
    flex-wrap: wrap;
    margin-bottom: 16px; }
  .c-modal__wrap {
    max-height: 90vh; } }

@media only screen and (min-width: 768px) {
  .c-modal_full .c-modal__wrap {
    max-height: 90vh; }
  .c-modal__header {
    margin-bottom: 32px;
    padding-right: 40px; }
  .c-modal_size320 {
    --_size: 320px;
    min-width: var(--_size);
    max-width: var(--_size); }
  .c-modal_size422 {
    --_size: 422px;
    min-width: var(--_size);
    max-width: var(--_size); }
  .c-modal_size800 {
    --_size: 800px;
    min-width: var(--_size);
    max-width: var(--_size); } }

.c-search {
  text-align: center; }
  .c-search.is-absolute {
    position: absolute;
    top: -1000%;
    left: 0;
    right: 0;
    border-top: 1px solid #fff;
    transition: all .2s ease-in; }
    .is-show-search .c-search.is-absolute, .is-show-search-mb .c-search.is-absolute {
      top: 100%;
      z-index: 100000000000; }

.c-search__form {
  width: 90%;
  max-width: 866px;
  margin: 0 auto; }

.c-search__wrap {
  display: flex;
  align-items: flex-start;
  gap: 16px; }
  .c-search__wrap .o-form__set {
    flex: 1; }

.c-search__close {
  position: absolute;
  top: 0;
  bottom: 0;
  font-size: 12px;
  color: #171719; }

.c-search__btn {
  width: max-content;
  min-width: max-content; }
  .c-search__btn::after {
    font-size: 14px; }

@media only screen and (min-width: 768px) {
  .c-search {
    padding: 64px 0; }
  .c-search_border {
    border-top: 1px solid #fff; }
  .c-search__btn {
    min-width: 130px; } }

@media only screen and (max-width: 767px) {
  .c-search {
    padding: 32px 0; }
  .c-search__btn {
    font-size: 0; }
    .c-search__btn::after {
      padding-left: 0;
      font-size: 16px; } }

.c-cover__wrap {
  padding: 0 8px; }

.c-cover__figure {
  background-color: #D4F3F0; }

@media only screen and (max-width: 767px) {
  .c-cover .o-canvas-inner {
    width: 100%; }
  .c-cover__detail {
    position: static;
    width: 100%; }
  .c-cover__footer .o-btn:not(.c-cover__footer .o-btn:last-of-type) {
    margin-bottom: 16px; } }

@media only screen and (min-width: 768px) {
  .c-cover {
    position: relative;
    padding-bottom: 50px; }
  .c-cover__figure {
    max-height: 660px;
    height: 660px; }
  .c-cover__detail {
    position: absolute;
    bottom: 0; }
  .c-cover__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px; }
    .c-cover__footer .o-btn {
      flex: 1; } }

.c-detail,
.c-detail__list,
.c-detail__figure,
.c-detail__footer,
.c-detail__footer-copy {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }

.c-detail__list {
  flex-wrap: wrap;
  gap: 24px; }

.c-detail__figure {
  align-items: center;
  justify-content: center;
  background-color: #F7F9FA; }

.c-detail__img {
  position: relative;
  width: 100%;
  object-fit: scale-down; }
  .c-detail__img:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: block;
    margin: auto;
    width: 100%;
    height: 100%;
    background: url("https://bibliotecadigitaldebogota.gov.co/static/biblored/img/resource/no-image.2a07a301bf19.svg");
    background-size: cover;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center; }

.c-detail__cta {
  padding: 16px;
  border: 2px solid #E5EBEE;
  margin-bottom: 24px; }

.c-detail__footer {
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  list-style: none;
  gap: 32px 24px; }

.c-detail__footer-full {
  min-width: 100%; }

.c-detail__footer-flex {
  display: flex;
  align-items: center;
  justify-content: space-between; }

.c-detail__footer-copy {
  align-items: center; }
  .c-detail__footer-copy::after {
    margin-left: 16px;
    font-size: 18px;
    color: #02B3A0; }

.c-detail__share {
  display: flex;
  align-items: center;
  gap: 8px;
  align-self: flex-end; }
  .c-detail__share::after {
    color: #02B3A0;
    font-size: 24px; }
  .c-detail__share.has-only-icon {
    font-size: 0; }

@media only screen and (max-width: 767px) {
  .c-detail {
    flex-direction: column; }
  .c-detail__aside,
  .c-detail-header-gap {
    margin-bottom: 24px; }
  .c-detail__aside {
    order: 2; }
  .c-detail__content {
    order: 3; }
  .c-detail__figure,
  .c-detail__img {
    max-height: 420px;
    min-height: 420px; }
  .c-detail__cta {
    margin-top: 24px; }
  .c-detail__footer-tags {
    padding-right: 16px; } }

@media only screen and (min-width: 768px) {
  .c-detail {
    justify-content: space-between;
    align-items: flex-start;
    gap: 40px; }
  .c-detail__figure,
  .c-detail__img {
    min-height: 480px;
    max-height: 480px; }
  .c-detail-header-gap {
    margin-bottom: 32px; }
  .c-detail__aside {
    max-width: 301px;
    min-width: 301px; } }

@media (min-width: 768px) and (max-width: 1280px) {
  .c-detail {
    flex-wrap: wrap; }
  .c-detail__figure,
  .c-detail__aside {
    flex: 1 45%; }
  .c-detail__content {
    order: 3; }
  .c-detail__footer-item {
    flex: 1 auto; } }

@media only screen and (min-width: 1280px) {
  .c-detail__content {
    max-width: 550px; }
  .c-detail__aside,
  .c-detail__img {
    position: sticky;
    top: 0; }
  .c-detail__footer {
    column-gap: 0; }
  .c-detail__footer-item {
    position: relative;
    padding-right: 32px;
    padding-left: 32px;
    border-right: 2px solid #E5EBEE; }
    .c-detail__footer-item:nth-child(2) {
      padding-left: 0; }
    .c-detail__footer-item:last-of-type {
      border: none; }
  .c-detail__aside {
    margin-right: 0;
    margin-left: auto; }
  .c-detail__list-item {
    flex: 1 45%; }
  .c-detail__figure {
    max-width: 310px;
    min-width: 310px; } }

.ts-dropdown {
  margin-top: 0;
  border: none;
  border-radius: 0 0 16px 16px;
  padding: 16px; }

.c-filter__custom-box {
  position: relative;
  padding-top: 16px;
  padding-bottom: 16px; }
  .c-filter__custom-box:first-of-type {
    border-top: 2px solid #E5EBEE; }
  .c-filter__custom-box:not(.c-filter__custom-box:last-of-type) {
    border-bottom: 1px solid #E5EBEE; }
  .c-filter__custom-box span {
    display: flex;
    align-items: center;
    margin-left: 32px;
    font-size: 16px; }
    .c-filter__custom-box span::after {
      content: "";
      position: absolute;
      width: 18px;
      height: 18px;
      border: 2px solid #C3C7C9;
      background-color: transparent;
      border-radius: 4px;
      left: 0; }
    .c-filter__custom-box span::before {
      content: "";
      font-family: "ico-fun-sib";
      position: absolute;
      left: 5px;
      font-size: 12px;
      color: #fff;
      z-index: 8; }
  .c-filter__custom-box input {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer; }
    .c-filter__custom-box input:checked + span::after {
      border-color: #02B3A0;
      background-color: #02B3A0; }

.c-filter__inline {
  display: flex;
  align-items: center;
  justify-content: space-between; }

.o-form__set .ts-control {
  position: relative;
  width: 100%;
  border-radius: 8px;
  border: 2px solid #E5EBEE;
  padding: 17px 24px !important; }
  .o-form__set .ts-control input,
  .o-form__set .ts-control select {
    font-size: 16px;
    border: none;
    color: #72727C;
    background-color: transparent; }
  .o-form__set .ts-control::after {
    content: "";
    font-family: "ico-fun-sib";
    position: absolute;
    right: 0;
    margin-right: 24px;
    font-size: 12px;
    color: #72727C;
    transition: all .2s ease-in; }
  .o-form__set .ts-control .o-tag {
    background-color: #D4F3F0 !important; }

.o-form__set .focus .ts-control {
  border: none;
  border-radius: 8px 8px 0 0;
  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.12); }
  .o-form__set .focus .ts-control::after {
    transform: rotate(180deg); }

.c-filter__chip-input {
  position: absolute;
  right: 0;
  margin-right: 6px;
  opacity: 0; }

@media only screen and (min-width: 768px) {
  .c-filter__form {
    margin-right: 0;
    margin-left: auto; } }

@media only screen and (max-width: 767px) {
  .c-filter__form {
    width: 100%;
    margin-top: 16px; } }

@media only screen and (max-width: 1023px) {
  .c-filter__wrap {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.7);
    transition: all .2s ease-in;
    visibility: hidden;
    opacity: 0;
    z-index: -10; }
    .is-filter-active .c-filter__wrap {
      visibility: visible;
      opacity: 1;
      z-index: 100000000; }
  .c-filter__box {
    width: 90%;
    max-height: 90vh;
    overflow: auto; }
  .c-filter__inline {
    flex-wrap: wrap;
    margin-bottom: 32px; } }

@media only screen and (min-width: 1024px) {
  .c-filter__box .c-modal__close {
    display: none; }
  .c-filter__wrap .o-form_box {
    padding: 0; }
  .c-filter__btn {
    display: none; }
  .c-filter__inline {
    margin-bottom: 120px; } }

.c-caption-error-page {
  margin-top: 96px;
  margin-top: 6rem;
  margin-bottom: 96px;
  margin-bottom: 6rem;
  margin-left: auto;
  margin-right: auto;
  max-width: 560px;
  max-width: 35rem; }

.c-caption-error-page,
.c-caption-error-page__texts {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  gap: 32px;
  gap: 2rem; }

.c-caption-error-page__texts {
  text-align: center;
  gap: 16px;
  gap: 1rem; }

.c-caption-error-page__img,
.c-caption-error-page__divider {
  width: 100%;
  max-width: 470px;
  max-width: 29.375rem;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0; }

.c-caption-error-page__title {
  margin: 0;
  font-family: "Geologica", sans-serif;
  font-size: 36px;
  font-size: 2.25rem;
  font-weight: 600;
  line-height: calc(48 / 36);
  color: #171719; }

.c-caption-error-page__description {
  margin: 0;
  max-width: 560px;
  max-width: 35rem;
  font-family: "Onest", sans-serif;
  font-size: 16px;
  font-size: 1rem;
  line-height: calc(28 / 16);
  color: #72727C; }

.c-caption-error-page__footer {
  text-align: center; }

.c-caption-error-page__divider {
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 32px;
  margin-bottom: 2rem; }

.c-caption-error-page__timer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  margin: 0 auto;
  margin-top: 16px;
  margin-top: 1rem;
  font-size: 36px;
  font-size: 2.25rem;
  line-height: calc(48/36);
  border-radius: 100%;
  border: 4px solid #02B3A0;
  width: 112px;
  width: 7rem;
  height: 112px;
  height: 7rem; }

.c-container-form__box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  margin-bottom: 176px;
  margin-bottom: 11rem; }

/**
 * Class: u-hidden, display none
 * @atom Ocultar elemento
 * @section Utils
 * @markup
 *  <a href="#" class="i-twitter">
 *    <span class="u-hidden">Twitter</span>
 *  </a>
 */
.u-hidden {
  position: absolute;
  opacity: 0;
  z-index: -10;
  visibility: hidden;
  top: -1000px; }

.u-none {
  display: none; }

.u-full-width {
  width: 100%; }

.u-block {
  display: block; }

.u-relative {
  position: relative; }

.u-overflow_hidden {
  overflow: hidden; }

.u-border-radius {
  border-radius: 8px;
  overflow: hidden; }

.u-margin-all-0 {
  margin: 0; }

.u-margin-top-16 {
  margin-top: 16px; }

.u-margin-top-24 {
  margin-top: 24px; }

.u-margin-bottom-8 {
  margin-bottom: 8px; }

.u-margin-bottom-16 {
  margin-bottom: 16px; }

.u-margin-bottom-24 {
  margin-bottom: 24px; }

.u-margin-bottom-32 {
  margin-bottom: 32px; }

.u-margin-top-64 {
  margin-top: 64px; }

.u-margin-bottom-64 {
  margin-bottom: 64px; }

.u-padding-all-0 {
  padding: 0; }

.u-padding-both-64 {
  padding: 64px; }

.u-text-white {
  color: #fff; }

.u-text-bold {
  font-weight: 700; }

.u-text-lower {
  text-transform: lowercase; }

/**
 * Class: u-hidden-mb, display none
 * @atom Ocultar elemento en Mobile
 * @section Utils
 * @markup
 *  <a href="#" class="i-twitter">
 *    <span class="u-hidden-mb">Twitter</span>
 *  </a>
 */
@media only screen and (max-width: 768px) {
  .u-hidden-mb {
    display: none;
    opacity: 0;
    visibility: hidden; }
  .u-padding-both-64 {
    padding: 24px 16px; }
  .u-margin-top-64 {
    margin-top: 32px; }
  .u-margin-bottom-64 {
    margin-bottom: 32px; } }

/**
 * Class: u-inherit, Color de texto heredado del color especificado para el texto del bloque padre.
 * @atom Color heredado
 * @section Utils
 * @markup
 *  <p href="#" class="u-inherit">
 *    Color de texto heredado
 *  </p>
 */
.u-inherit {
  color: inherit; }

/**
 * Class: u-inline, Elemento display inline-block
 * @atom Elemento Inline block
 * @section Utils
 * @markup
 *  <p href="#" class="u-inline">
 *    Elemento inline Block
 *  </p>
 */
.u-inline {
  display: inline-block; }

.u-height-full {
  height: 100%; }

.u-reverse {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: reverse;
  -webkit-box-orient: horizontal;
  -webkit-flex-direction: row-reverse;
  -moz-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center; }

.u-uppercase {
  text-transform: uppercase; }

/*# sourceMappingURL=theme_fun_sib.css.map */