@charset "UTF-8"; /** * $c-primary * @color * @section Primary */ /** * $c-on-primary-gray * @color * @section On */ /** * $c-gray * @color * @section Surface */ /** * $c-neutro * @color * @section Color Less */ /** * $c-gray-0 * @color * @section Neutro */ /** * $c-gray-2 * @color * @section Neutro */ /** * $c-gray-3 * @color * @section Neutro */ /** * $c-gray-4 * @color * @section Neutro */ /** * $c-gray-5 * @color * @section Neutro */ /** * $c-gray-6 * @color * @section Neutro */ /** * $c-gray-7 * @color * @section Neutro */ /** * $c-gray-8 * @color * @section Neutro */ /** * $c-gray-9 * @color * @section Neutro */ /** * $c-gray-10 * @color * @section Neutro */ /** * $c-yellow * @color * @section Yellow */ /** * $c-blue-inactive * @color * @section Neutro */ /** * $c-blue-normal * @color * @section Neutro */ /** * $c-blue-dark * @color * @section Neutro */ /** * $c-blue-dark * @color * @section Neutro */ /** * $c-green-inactive * @color * @section Neutro */ /** * $c-green-normal * @color * @section Neutro */ /** * $c-green-selected * @color * @section Neutro */ /** * $c-orange-10 * @color * @section Neutro */ /** * $c-orange-10 * @color * @section Neutro */ /** * $c-red-error * @color * @section Neutro */ /** * $c-bg-label-dcto * @color * @section Neutro */ /** * $c-bg-label * @color * @section Neutro */ /** * $c-txt-label * @color * @section Neutro */ /** * $c-elevation-primary * @color * @section Neutro */ /** * 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 */ /** * Base HTML: 16px * @nuclide Variables * @section Settings > Font size */ /** * Font family: 'Telefonica' * @nuclide Variables * @section Settings > Font family */ /** * font-weight: Regular | Font family: Telefonica * @nuclide Variables * @section Settings > Font weight */ /** * font-weight: Regular | Font family: Telefonica * @nuclide Variables * @section Settings > Font weight */ /** * font-weight: Regular | Font family: Telefonica * @nuclide Variables * @section Settings > Font weight */ /** * font-weight: Bold | Font family: Telefonica * @nuclide Variables * @section Settings > Font weight */ /** * font-weight: Black | Font family: Telefonica * @nuclide Variables * @section Settings > Font weight */ /** * font-weight: Black | Font family: Telefonica * @nuclide Variables * @section Settings > Font weight */ /** * Font family: fuentes de ícono Escuela * @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 * @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 | * @param $fs * Default: See individual properties (1 1 0). ♣ * Values: none | * @param $fb * Default: See individual properties (1 1 0). ♣ * Values: none | * @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 fuentes iconos para before en los elementos * que no tienen selector i- * @mixin * @section Utils * @param $ico Variable icono * @example * .foo { * Propiedades... * &:before { * @include font-family-ico($i-checked); * } * } */ /** * 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: 1210px | 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 480px --> $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... * } * // 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; * } */ /** * Caja con aspect ratio amigable con el responsive. * calcula (alto/ancho) * 100% * Si el ancho cambia, también lo hace la altura, y el elemento mantiene el aspect ratio. * * @mixin * @section Helpers * @param $width * @param $height * @example * .foo { * @include aspect-ratio-box(16, 9); * } * // El @include se traducirá en: * .foo { * content: ''; * position: relative; * overflow: hidden; * } * .foo:after { * content: ''; * display: block; * width: 100%; * padding-top: 56,25%; * } */ /** * Use para cambiar el valor del aspect radio en un breakpoint específco. * * @mixin * @section Helpers * @param $width * @param $height * @example * .foo { * @include aspect-ratio-change(16, 9); * } * // El @include se traducirá en: * .foo:before { * padding-top: 56,25%; * } */ /** * 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 ellipsis-multiline(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 ellipsis-change-font-size(16px, 1.4, 3) * } * // El @include se traducirá en: * .foo { * max-height: 67.2px; * max-height: 4.2rem; * font-size: 16px; * font-size: 1rem; * } */ /** * 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%; * } */ /** * 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; * } */ 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%; scroll-behavior: smooth; } 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%; } 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: "movistar-ico" !default; \*---------------------------------------------*/ @font-face { font-family: "Telefonica"; src: url("../fonts/fonts_movistar/Telefonica-ExtraLight.eot"); src: url("../fonts/fonts_movistar/Telefonica-ExtraLight.eot?#iefix") format("embedded-opentype"), url("../fonts/fonts_movistar/Telefonica-ExtraLight.woff2") format("woff2"), url("../fonts/fonts_movistar/Telefonica-ExtraLight.woff") format("woff"), url("../fonts/fonts_movistar/Telefonica-ExtraLight.ttf") format("truetype"), url("../fonts/fonts_movistar/Telefonica-ExtraLight.svg#Telefonica-ExtraLight") format("svg"); font-weight: 200; font-style: normal; font-display: swap; } @font-face { font-family: "Telefonica"; src: url("../fonts/fonts_movistar/Telefonica-Light.eot"); src: url("../fonts/fonts_movistar/Telefonica-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/fonts_movistar/Telefonica-Light.woff2") format("woff2"), url("../fonts/fonts_movistar/Telefonica-Light.woff") format("woff"), url("../fonts/fonts_movistar/Telefonica-Light.ttf") format("truetype"), url("../fonts/fonts_movistar/Telefonica-Light.svg#Telefonica-Light") format("svg"); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: "Telefonica"; src: url("../fonts/fonts_movistar/Telefonica-Regular.eot"); src: url("../fonts/fonts_movistar/Telefonica-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/fonts_movistar/Telefonica-Regular.woff2") format("woff2"), url("../fonts/fonts_movistar/Telefonica-Regular.woff") format("woff"), url("../fonts/fonts_movistar/Telefonica-Regular.ttf") format("truetype"), url("../fonts/fonts_movistar/Telefonica-Regular.svg#Telefonica-Regular") format("svg"); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: "Telefonica"; src: url("../fonts/fonts_movistar/TelefonicaCap-Regular.eot"); src: url("../fonts/fonts_movistar/TelefonicaCap-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/fonts_movistar/TelefonicaCap-Regular.woff2") format("woff2"), url("../fonts/fonts_movistar/TelefonicaCap-Regular.woff") format("woff"), url("../fonts/fonts_movistar/TelefonicaCap-Regular.ttf") format("truetype"), url("../fonts/fonts_movistar/TelefonicaCap-Regular.svg#TelefonicaCap-Regular") format("svg"); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: "Telefonica"; src: url("../fonts/fonts_movistar/Telefonica-RegularItalic.eot"); src: url("../fonts/fonts_movistar/Telefonica-RegularItalic.eot?#iefix") format("embedded-opentype"), url("../fonts/fonts_movistar/Telefonica-RegularItalic.woff2") format("woff2"), url("../fonts/fonts_movistar/Telefonica-RegularItalic.woff") format("woff"), url("../fonts/fonts_movistar/Telefonica-RegularItalic.ttf") format("truetype"), url("../fonts/fonts_movistar/Telefonica-RegularItalic.svg#Telefonica-RegularItalic") format("svg"); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: "Telefonica"; src: url("../fonts/fonts_movistar/Telefonica-Bold.eot"); src: url("../fonts/fonts_movistar/Telefonica-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/fonts_movistar/Telefonica-Bold.woff2") format("woff2"), url("../fonts/fonts_movistar/Telefonica-Bold.woff") format("woff"), url("../fonts/fonts_movistar/Telefonica-Bold.ttf") format("truetype"), url("../fonts/fonts_movistar/Telefonica-Bold.svg#Telefonica-Bold") format("svg"); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: "ico-movistar"; src: url("../fonts/ico-movistar.eot?9m8kyr"); src: url("../fonts/ico-movistar.eot?9m8kyr#iefix") format("embedded-opentype"), url("../fonts/ico-movistar.ttf?9m8kyr") format("truetype"), url("../fonts/ico-movistar.woff?9m8kyr") format("woff"), url("../fonts/ico-movistar.svg?9m8kyr#ico-movistar") format("svg"); font-weight: normal; font-style: normal; font-display: block; } .i-:before, [class^=i-]:before, [class*=" i-"]:before, .ag-o-ico:before { /* use !important to prevent issues with browser extensions that change fonts */ font-family: "ico-movistar" !important; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .i-after-:after, [class^=i-after-]:after, [class*=i-after-]:after { /* use !important to prevent issues with browser extensions that change fonts */ font-family: "ico-movistar" !important; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ico-:before, [class^=ico-]:before, [class*=" ico-"]:before { content: ""; position: relative; top: -1px; display: inline-block; vertical-align: middle; width: 18px; height: 18px; margin-right: 8px; background-color: transparent; background-position: center center; background-repeat: no-repeat; background-size: cover; } /** * @icon .i-arrow-down * @markup * */ .i-arrow-down:before { content: ""; } .i-after-arrow-down::after { content: ""; } /** * @icon .i-arrow-left * @markup * */ .i-arrow-left:before { content: ""; } /** * @icon .i-arrow-right * @markup * */ .i-arrow-right:before { content: ""; } /** * @icon .i-arrow-up * @markup * */ .i-arrow-up:before { content: ""; } /** * @icon .i-camera * @markup * */ .i-camera:before { content: ""; } /** * @icon .i-card * @markup * */ .i-card:before { content: ""; } /** * @icon .i-chevron-down * @markup * */ .i-chevron-down:before { content: ""; } /** * @icon .i-after-chevron-down * @markup * */ .i-after-chevron-down:after { content: ""; } /** * @icon .i-chevron-left * @markup * */ .i-chevron-left:before { content: ""; } /** * @icon .i-chevron-right * @markup * */ .i-chevron-right:before { content: ""; } /** * @icon .i-after-chevron-right * @markup * */ .i-after-chevron-right:after { content: ""; } /** * @icon .i-chevron-up * @markup * */ .i-chevron-up:before { content: ""; } /** * @icon .i-close * @markup * */ .i-close:before { content: ""; } /** * @icon .i-after-close * @markup * */ .i-after-close:after { content: ""; } /** * @icon .i-electronics * @markup * */ .i-electronics:before { content: ""; } /** * @icon .i-facebook * @markup * */ .i-facebook:before { content: ""; } /** * @icon .i-gamepad * @markup * */ .i-gamepad:before { content: ""; } /** * @icon .i-headphones * @markup * */ .i-headphones:before { content: ""; } /** * @icon .i-home * @markup * */ .i-home:before { content: ""; } /** * @icon .i-instagram * @markup * */ .i-instagram:before { content: ""; } /** * @icon .i-laptop * @markup * */ .i-laptop:before { content: ""; } /** * @icon .i-lock * @markup * */ .i-lock:before { content: ""; } /** * @icon .i-menu * @markup * */ .i-menu:before { content: ""; } /** * @icon .i-microphone * @markup * */ .i-microphone:before { content: ""; } /** * @icon .i-mouse * @markup * */ .i-mouse:before { content: ""; } /** * @icon .i-optical-fiber * @markup * */ .i-optical-fiber:before { content: ""; } /** * @icon .i-paper-value * @markup * */ .i-paper-value:before { content: ""; } /** * @icon .i-pc * @markup * */ .i-pc:before { content: ""; } /** * @icon .i-phone-arrow-up * @markup * */ .i-phone-arrow-up:before { content: ""; } /** * @icon .i-phone-dollar-center * @markup * */ .i-phone-dollar-center:before { content: ""; } /** * @icon .i-phone-dollar * @markup * */ .i-phone-dollar:before { content: ""; } /** * @icon .i-phone * @markup * */ .i-phone:before { content: ""; } /** * @icon .i-plane * @markup * */ .i-plane:before { content: ""; } /** * @icon .i-play-square * @markup * */ .i-play-square:before { content: ""; } /** * @icon .i-plus-circle * @markup * */ .i-plus-circle:before { content: ""; } /** * @icon .i-shopping-cart * @markup * */ .i-shopping-cart:before { content: ""; } /** * @icon .i-twitter * @markup * */ .i-twitter:before { content: ""; } /** * @icon .i-user * @markup * */ .i-user:before { content: ""; } /** * @icon .i-whatsapp * @markup * */ .i-whatsapp:before { content: ""; } /** * @icon .i-bullhorn * @markup * */ .i-bullhorn:before { content: ""; } /** * @icon .i-covid * @markup * */ .i-covid:before { content: ""; } /** * @icon .i-comment-lines * @markup * */ .i-comment-lines:before { content: ""; } /** * @icon .i-support * @markup * */ .i-support:before { content: ""; } /** * @icon .i-headset * @markup * */ .i-headset:before { content: ""; } /** * @icon .i-cloud * @markup * */ .i-cloud:before { content: ""; } /** * @icon .i-play-circle * @markup * */ .i-play-circle:before { content: ""; } /** * @icon .i-building * @markup * */ .i-building:before { content: ""; } /** * @icon .i-paper-dollar * @markup * */ .i-paper-dollar:before { content: ""; } /** * @icon .i-search * @markup * */ .i-search:before { content: ""; } /** * @icon .i-bars-triangle * @markup * */ .i-bars-triangle:before { content: ""; } /** * @icon .i-sorter * @markup * */ .i-sorter:before { content: ""; } .i-after-sorter::after { content: ""; } /** * @icon .i-credit-card * @markup * */ .i-credit-card:before { content: ""; } /** * @icon .i-truck * @markup * */ .i-truck:before { content: ""; } /** * @icon .i-badge-percent * @markup * */ .i-badge-percent:before { content: ""; } /** * @icon .i-lock-fill * @markup * */ .i-lock-fill:before { content: ""; } .i-truck-stroke::before { content: ""; } .i-home-stroke::before { content: ""; } .i-information::before { content: ""; } .i-after-information::after { content: ""; } .i-paper::before { content: ""; } .i-movistar-money::before { content: ""; } .i-processor::before { content: ""; } .i-batery::before { content: ""; } .i-ram::before { content: ""; } .i-dimensions::before { content: ""; } .i-frontal-camera::before { content: ""; } .i-rear-camera::before { content: ""; } .i-phone-key:before { content: ""; } .i-download:before { content: ""; } .i-mail:before { content: ""; } .i-paper-movistar:before { content: ""; } .i-car:before { content: ""; } .i-credential:before { content: ""; } .i-credit-card-stroke:before { content: ""; } .i-eye:before { content: ""; } .i-eye-slash:before { content: ""; } .i-check-square:before { content: ""; } .i-calendar:before { content: ""; } .i-pin:before { content: ""; } .i-pencil:before { content: ""; } .i-after-pencil:after { content: ""; } .i-check:before { content: ""; } .i-inverted-triangle:before { content: ""; } .i-after-inverted-triangle::after { content: ""; } .i-user-plus::before { content: ""; } .i-after-user-plus::after { content: ""; } .i-telephone::before { content: ""; } .i-close-square::before { content: ""; } .i-phone-message:before { content: ""; } .i-pin-way:before { content: ""; } .i-lock-code:before { content: ""; } .i-load-arrow:before { content: ""; } .i-pencil-strong:before { content: ""; } .i-paper-movistar-dollar:before { content: ""; } .i-paperclip:before { content: ""; } .i-paperclip:before { content: ""; } .i-calendar-strong:before { content: ""; } .i-clip:before { content: ""; } .i-double-arrow-right:before { content: ""; } .i-after-double-arrow-right:after { content: ""; } .i-phone-paper:before { content: ""; } /** * Swiper 6.7.0 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2021 Vladimir Kharlampidi * * Released under the MIT License * * Released on: May 31, 2021 */ @font-face { font-family: "swiper-icons"; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff"); font-weight: 400; font-style: normal; } /* Auto Height */ /* 3D Effects */ /* CSS Mode */ /* Common Styles */ /* Bullets */ /* Progress */ /* Scrollbar */ /* Preloader */ @keyframes "swiper-preloader-spin" { 100% { transform: rotate(360deg); } } .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; } .swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; } .swiper-container-vertical > .swiper-wrapper { flex-direction: column; } .swiper-container-vertical > .swiper-pagination-bullets { right: 10px; top: 50%; transform: translate3d(0px, -50%, 0); } .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 6px 0; display: block; } .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; transform: translateY(-50%); width: 8px; } .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; transition: 200ms transform, 200ms top; } .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 100%; height: 4px; left: 0; top: 0; } .swiper-container-vertical > .swiper-pagination-progressbar { width: 4px; height: 100%; left: 0; top: 0; } .swiper-container-vertical > .swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98%; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; transform: translate3d(0px, 0, 0); } .swiper-wrapper__height { height: auto !important; } .swiper-container-android .swiper-slide { transform: translate3d(0px, 0, 0); } .swiper-container-multirow > .swiper-wrapper { flex-wrap: wrap; } .swiper-container-multirow-column > .swiper-wrapper { flex-wrap: wrap; flex-direction: column; } .swiper-container-free-mode > .swiper-wrapper { transition-timing-function: ease-out; margin: 0 auto; } .swiper-container-pointer-events { touch-action: pan-y; } .swiper-container-pointer-events.swiper-container-vertical { touch-action: pan-x; } .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; } .swiper-slide-invisible-blank { visibility: hidden; } .swiper-container-autoheight { height: auto; } .swiper-container-autoheight .swiper-slide { height: auto; } .swiper-container-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height; } .swiper-container-3d { perspective: 1200px; } .swiper-container-3d .swiper-wrapper { transform-style: preserve-3d; } .swiper-container-3d .swiper-slide { transform-style: preserve-3d; } .swiper-container-3d .swiper-slide-shadow-left { transform-style: preserve-3d; position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-right { transform-style: preserve-3d; position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-top { transform-style: preserve-3d; position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-bottom { transform-style: preserve-3d; position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-cube-shadow { transform-style: preserve-3d; } .swiper-container-css-mode > .swiper-wrapper { overflow: auto; scrollbar-width: none; -ms-overflow-style: none; } .swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar { display: none; } .swiper-container-css-mode > .swiper-wrapper > .swiper-slide { scroll-snap-align: start start; } .swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper { scroll-snap-type: x mandatory; } .swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper { scroll-snap-type: y mandatory; } .swiper-button-prev { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size) / 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size) / 2)); z-index: 2; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)); left: 10px; right: auto; } .swiper-button-prev:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "prev"; } .swiper-button-next { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size) / 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size) / 2)); z-index: 2; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)); right: 10px; left: auto; } .swiper-button-next:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "next"; } .swiper-button-prev.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; } .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; } .swiper-container-rtl .swiper-button-next { left: 10px; right: auto; } .swiper-container-rtl .swiper-button-next:after { content: "prev"; } .swiper-container-rtl .swiper-button-prev { right: 10px; left: auto; } .swiper-container-rtl .swiper-button-prev:after { content: "next"; } .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { transform-origin: right top; } .swiper-button-prev.swiper-button-white { --swiper-navigation-color: #ffffff; } .swiper-button-next.swiper-button-white { --swiper-navigation-color: #ffffff; } .swiper-button-prev.swiper-button-black { --swiper-navigation-color: #000000; } .swiper-button-next.swiper-button-black { --swiper-navigation-color: #000000; } .swiper-button-lock { display: none; } .swiper-pagination { position: absolute; text-align: center; transition: 300ms opacity; transform: translate3d(0, 0, 0); z-index: 10; } .swiper-pagination.swiper-pagination-hidden { opacity: 0; } .swiper-pagination-fraction { bottom: 10px; left: 0; width: 100%; } .swiper-pagination-custom { bottom: 10px; left: 0; width: 100%; } .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 10px; left: 0; width: 100%; } .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 4px; } .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; transform: translateX(-50%); white-space: nowrap; } .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms left; } .swiper-container-horizontal > .swiper-pagination-progressbar { width: 100%; height: 4px; left: 0; top: 0; } .swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 4px; height: 100%; left: 0; top: 0; } .swiper-container-horizontal > .swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98%; } .swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transform: scale(0.33); position: relative; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active { transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { transform: scale(0.33); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { transform: scale(0.33); } .swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; border-radius: 50%; background: #000; opacity: 0.2; } button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; box-shadow: none; -webkit-appearance: none; appearance: none; } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; } .swiper-pagination-bullet-active { opacity: 1; background: var(--swiper-pagination-color, var(--swiper-theme-color)); } .swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms right; } .swiper-pagination-progressbar { background: rgba(0, 0, 0, 0.25); position: absolute; } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color, var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); transform-origin: left top; } .swiper-pagination-white { --swiper-pagination-color: #ffffff; } .swiper-pagination-black { --swiper-pagination-color: #000000; } .swiper-pagination-lock { display: none; } .swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1); } .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0; } .swiper-scrollbar-cursor-drag { cursor: move; } .swiper-scrollbar-lock { display: none; } .swiper-zoom-container { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; text-align: center; } .swiper-zoom-container > img { max-width: 100%; max-height: 100%; object-fit: contain; } .swiper-zoom-container > svg { max-width: 100%; max-height: 100%; object-fit: contain; } .swiper-zoom-container > canvas { max-width: 100%; max-height: 100%; object-fit: contain; } .swiper-slide-zoomed { cursor: move; } .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; transform-origin: 50%; animation: swiper-preloader-spin 1s infinite linear; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent; } .swiper-lazy-preloader-white { --swiper-preloader-color: #fff; } .swiper-lazy-preloader-black { --swiper-preloader-color: #000; } .swiper-container-fade.swiper-container-free-mode .swiper-slide { transition-timing-function: ease-out; } .swiper-container-fade .swiper-slide { pointer-events: none; transition-property: opacity; } .swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-fade .swiper-slide-active { pointer-events: auto; } .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-container-cube { overflow: visible; } .swiper-container-cube .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; transform-origin: 0 0; width: 100%; height: 100%; } .swiper-container-cube .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-cube .swiper-slide-active { pointer-events: auto; pointer-events: auto; visibility: visible; } .swiper-container-cube .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-container-cube .swiper-slide-next { pointer-events: auto; visibility: visible; } .swiper-container-cube .swiper-slide-next + .swiper-slide { pointer-events: auto; visibility: visible; } .swiper-container-cube .swiper-slide-prev { pointer-events: auto; visibility: visible; } .swiper-container-cube .swiper-slide-shadow-top { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-cube .swiper-slide-shadow-bottom { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-cube .swiper-slide-shadow-left { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-cube .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0px; width: 100%; height: 100%; opacity: 0.6; z-index: 0; } .swiper-container-cube .swiper-cube-shadow:before { content: ""; background: #000; position: absolute; left: 0; top: 0; bottom: 0; right: 0; filter: blur(50px); } .swiper-container-cube.swiper-container-rtl .swiper-slide { transform-origin: 100% 0; } .swiper-container-flip { overflow: visible; } .swiper-container-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; } .swiper-container-flip .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-flip .swiper-slide-active { pointer-events: auto; } .swiper-container-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-container-flip .swiper-slide-shadow-top { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-flip .swiper-slide-shadow-bottom { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-flip .swiper-slide-shadow-left { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-flip .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper { width: 100%; height: auto; overflow: hidden; } /* TODO: PASAR A SCSS */ body:not(.hogar-index-index) { background-color: #EEEEEE; } .scroll { overflow-x: hidden; overflow-y: hidden; } /* overwrite default styles */ .page-layout-2columns-left #maincontent .column.main, .page-layout-2columns-left .sidebar-main.sidebar { width: auto; float: none; padding: 0; min-height: auto; } .product-image-wrapper { padding: 0 !important; } .o-layout-noresults { width: 100%; } .o-layout-2-columns { 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } /* LAYOUT */ @media (max-width: 740px) { .o-layout__aside { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .o-layout-2-columns { width: 90%; max-width: 1125px; margin: 0 auto; } } @media (min-width: 740px) { .o-layout__aside { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 80px; /* 9 */ margin-bottom: 5rem; /* 9 */ } .o-layout__detail-product { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 30px; /* 9 */ column-gap: 1.875rem; /* 9 */ } } @media (max-width: 1023px) { .o-layout-2-columns { -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-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; } .catalogsearch-result-index .o-layout__aside { 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; } .catalogsearch-result-index .o-layout__aside .column.main { order: 2; } } @media (min-width: 1024px) { .o-layout__aside { 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-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ } .o-layout__aside .banner { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -moz-box-flex: 1; -moz-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; } .o-layout__aside .sidebar.sidebar-main { -webkit-box-flex: 1; -webkit-flex: 1 1 20%; -moz-box-flex: 1; -moz-flex: 1 1 20%; -ms-flex: 1 1 20%; flex: 1 1 20%; } .o-layout__aside .column.main { -webkit-box-flex: 1; -webkit-flex: 1 1 70%; -moz-box-flex: 1; -moz-flex: 1 1 70%; -ms-flex: 1 1 70%; flex: 1 1 70%; } .o-layout__aside .information { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -moz-box-flex: 1; -moz-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; order: 4; } .o-layout-2-columns { width: 90% !important; max-width: 1141px; margin: 0 auto; } } /* END LAYOUT */ .o-canvas { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin-left: auto; margin-right: auto; } .o-canvas_max-width918 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 918px; /* 9 */ max-width: 57.375rem; /* 9 */ } @media only screen and (min-width: 1024px) { .o-canvas-dk { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin-left: auto; margin-right: auto; } } .o-section { margin-top: 40px; margin-bottom: 80px; } .o-section__bg-withe { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 40px; /* 9 */ padding-top: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 80px; /* 9 */ padding-bottom: 5rem; /* 9 */ margin-bottom: 0; background-color: #fff; } .o-bg-gray { background-color: #EEEEEE; } .o-section-double-elements { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } .o-section-double-elements_spacebetween { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .o-section-double-elements_flex-start { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } @media only screen and (max-width: 768px) { .o-section-double-elements { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 32px; /* 9 */ row-gap: 2rem; /* 9 */ } .o-section-double-elements_row-gap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 48px; /* 9 */ row-gap: 3rem; /* 9 */ } } /** * Class: o-text | body * @description estilos de texto generales para el body * ♣ Propiedades: Lato | 16px | 1.6 * @atom Body copy * @section 03. Estilos textos * @markup *

@{lipsum:1:paragraphs}

*/ body, .o-text { line-height: 1.6; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-family: "Telefonica", sans-serif; color: #50535A; } .o-text_primary { color: #019DF4; } .o-bold { font-weight: 700; } .o-light { font-weight: 300; } .o-text-ico { display: inline-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; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 8px; /* 9 */ row-gap: 0.5rem; /* 9 */ } .o-text-ico::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ color: #019DF4; } .o-text_gray4 { color: #86888C; } .o-text_gray5 { color: #50535A; } .o-text_fs14 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } a { text-decoration: none; color: inherit; outline-width: 0; cursor: pointer; transition: all 0.6s; } .o-link { position: relative; padding: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ text-decoration: underline; text-underline-position: under; line-height: 1; color: #019DF4; } .o-link:hover, .o-link:focus, .o-link:active { text-decoration: none; } .o-link_fs14 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .o-link_block { display: block; } .o-link_gray { text-align: right; color: #999999; text-decoration: none; } .o-link_gray:hover { text-decoration: underline; } *:focus { outline: 0; } button { line-height: inherit; -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.4s; } button:focus { outline-width: 0; } button:disabled { cursor: default; } a { outline-width: 0; cursor: pointer; transition: all 0.2s; } /** * Class: o-btn * @modifiers * .o-btn Botón para acciones primarias * .o-btn_secondary Botón para acciones secundarias * @description Botón acciones primarias y secundarias * ♣ Estados: hover, focus * @atom Botón * @section 04. Botones y enlaces > Botones **/ .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; padding: 13px 24px; text-align: center; text-decoration: none; line-height: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: 700; border-radius: 60px; color: #fff; background-color: #019DF4; transition: all 0.4s ease-in; } .o-btn:after { padding-left: 8px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .o-btn:hover, .o-btn:focus, .o-btn:active { text-decoration: none; background-color: #008EDD; } .o-btn:disabled { background-color: #80CEF9; } .o-btn_primary_dark-blue { color: #fff; background-color: #0B2739; border: 1px solid #0B2739; transition: all 0.4s ease-in; } .o-btn_primary_dark-blue:hover, .o-btn_primary_dark-blue:focus, .o-btn_primary_dark-blue:active { color: #fff; border-color: #0B2739; background-color: #0B2739; } .o-btn_primary_dark-blue:disabled { border-color: #B6B7B7; background-color: #B6B7B7; } .o-btn_primary_dark-blue_light { border: 1px solid #0B2739; color: #0B2739; background-color: #fff; } .o-btn_primary_dark-blue_light:hover, .o-btn_primary_dark-blue_light:focus, .o-btn_primary_dark-blue_light:active { color: #0B2739; border-color: #0B2739; background-color: #fff; } .o-btn_secondary { color: #019DF4; background-color: transparent; border: 1px solid #019DF4; transition: all 0.4s ease-in; } .o-btn_secondary:hover, .o-btn_secondary:focus, .o-btn_secondary:active { color: #fff; background-color: #008EDD; } .o-btn_secondary:disabled { color: #80CEF9; border: 1px solid #80CEF9; } .o-btn_light { border: 1px solid #019DF4; color: #019DF4; background-color: #fff; } .o-btn_light:hover, .o-btn_light:focus, .o-btn_light:active { color: #fff; border-color: #fff; background-color: transparent; } .o-circle-cta { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ } .o-circle-cta__btn { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 32px; /* 9 */ height: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 32px; /* 9 */ width: 2rem; /* 9 */ background-color: #019DF4; border-radius: 60px; } .o-circle-cta__btn::before { color: #fff; } .o-circle-cta__btn_with-txt { color: transparent; } .o-btn-icon { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ } .o-btn-icon.is-loading::before { animation: spin 1s ease-in-out infinite; -webkit-animation: spin 1s ease-in-out infinite; } .o-btn-icon_font26::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 26px; /* 9 */ font-size: 1.625rem; /* 9 */ } .o-btn_sm { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ } .o-btn_margin { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .o-btn_full { width: 100%; } .o-btn_w225 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 225px; /* 9 */ max-width: 14.0625rem; /* 9 */ } .o-btn_w270 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 270px; /* 9 */ max-width: 16.875rem; /* 9 */ } .o-btn_w290 { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 290px; /* 9 */ max-width: 18.125rem; /* 9 */ } .o-btn_w160 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 160px; /* 9 */ min-width: 10rem; /* 9 */ } .o-btn_w255 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 255px; /* 9 */ min-width: 15.9375rem; /* 9 */ } .o-btn_w287 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 287px; /* 9 */ min-width: 17.9375rem; /* 9 */ } .o-btn_w392 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 392px; /* 9 */ max-width: 24.5rem; /* 9 */ } .o-btn_w350 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 350px; /* 9 */ max-width: 21.875rem; /* 9 */ } .o-btn_w208 { min-width: 13rem; min-width: 208px; } .o-btn_height50 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 50px; /* 9 */ min-height: 3.125rem; /* 9 */ } .o-btn_height56 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 56px; /* 9 */ min-height: 3.5rem; /* 9 */ } .o-btn_height60 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 60px; /* 9 */ min-height: 3.75rem; /* 9 */ } .o-btn_height34 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 34px; /* 9 */ max-height: 2.125rem; /* 9 */ } .o-btn-float { position: fixed; right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ bottom: 160px; /* 9 */ bottom: 10rem; /* 9 */ 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 56px; /* 9 */ margin-right: 3.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 56px; /* 9 */ margin-bottom: 3.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 50px; /* 9 */ border-radius: 3.125rem; /* 9 */ background: #019DF4; } .o-btn-float::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .register-index-index .o-btn-float { display: none; } @media only screen and (min-width: 450px) { .o-btn_w270_media { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 270px; /* 9 */ max-width: 16.875rem; /* 9 */ } } @media only screen and (min-width: 600px) { .o-circle-cta__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 41px; /* 9 */ height: 2.5625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 41px; /* 9 */ width: 2.5625rem; /* 9 */ } } @media screen and (max-width: 600px) { .o-btn_w208 { min-width: 13rem; min-width: 100%; } } @media only screen and (max-width: 601px) { .o-circle-cta__btn_with-txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 300px; /* 9 */ max-width: 18.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 41px; /* 9 */ min-height: 2.5625rem; /* 9 */ margin: 0 auto; color: #fff; } } @media only screen and (min-width: 601px) { .o-circle-cta { /* 3 */ /* 3 */ /* 5 */ /* 5 */ margin-top: 0; /* 8 */ } .o-circle-cta__text { display: none; } } @media only screen and (max-width: 739px) { .o-btn_height40_mb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 40px; /* 9 */ min-height: 2.5rem; /* 9 */ } .o-btn_w170_mb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 170px; /* 9 */ min-width: 10.625rem; /* 9 */ } } .o-tag { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ border-radius: 10px; background-color: #0B2739; color: #fff; font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 2px 8px; /* 9 */ padding: 0.125rem 0.5rem; /* 9 */ } .o-tag_success { color: #499110; background-color: rgba(92, 182, 21, 0.3); } .o-tag_warning { color: #815028; background-color: #FFC076; } .o-dropdown__btn { cursor: pointer; } .o-dropdown__btn::after { display: inline-block; transition: all 0.2s ease-in-out; } .is-dropdown-active .o-dropdown__btn::after { transform: rotate(180deg); } .o-dropdown__btn_border { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .o-dropdown__content { max-height: 0; transition: all 0.2s ease; overflow-y: hidden; } .is-dropdown-active .o-dropdown__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 2000px; /* 9 */ max-height: 125rem; /* 9 */ } .is-dropdown-active .o-dropdown__content_border { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 24px 0; /* 9 */ padding: 1.5rem 0; /* 9 */ } .o-swatch { 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-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; gap: 6px; } .o-swatch-brand { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 56px; /* 9 */ width: 3.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 56px; /* 9 */ height: 3.5rem; /* 9 */ border-radius: 8px; background-color: #EEEEEE; transition: all 0.2s ease-in-out; color: #50535a; } .o-swatch-brand::before { font-size: 2.6rem; } .o-swatch-brand:hover { color: white; background-color: #019DF4; } @media screen and (max-width: 552px) { .o-swatch-brand { background-color: white; } } .o-swatch-brand_memory { display: inline-block; padding: 6px 11px; border: 2px solid #019DF4; color: #019DF4; border-radius: 25px; font-size: 11px !important; text-align: center; cursor: pointer; background-color: white; transition: background-color 0.3s, color 0.3s; } .o-swatch-brand_memory:hover { color: white; background-color: #019DF4; } @media (max-width: 552px) { .o-swatch-brand_memory { background-color: transparent !important; } } .o-swatch-brand_category { display: table !important; padding: 6px 11px; border: 2px solid #019DF4; color: #019DF4 !important; border-radius: 25px; font-size: 11px !important; text-align: center; cursor: pointer; background-color: white; text-decoration: none !important; } .o-swatch-brand_category:hover { color: white !important; background-color: #019DF4; } @media (max-width: 552px) { .o-swatch-brand_category { background-color: transparent !important; } } .swatch-input { position: absolute; top: 0; right: 0; left: 0; height: 0; opacity: 0; overflow: hidden; } .metricas-size { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .pages { width: 100%; float: none; } .pages .label.pages-label { display: none; } .pages .items.pages-items { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 32px 0; /* 9 */ padding: 2rem 0; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ list-style: none; } .item.pages-item-previous, .item.pages-item-next { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 24px; /* 9 */ width: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 24px; /* 9 */ height: 1.5rem; /* 9 */ border-radius: 50%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ line-height: 1; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); color: #019DF4; background: #fff; } .item.pages-item-previous .action, .item.pages-item-next .action { display: block; } .item.pages-item-previous .action::before, .item.pages-item-next .action::before { font-family: "ico-movistar"; } .item.pages-item-previous .action span, .item.pages-item-next .action span { display: none; } .item.pages-item-previous .action::before { content: ""; } .item.pages-item-next .action::before { content: ""; } .items.pages-items .item .page { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 24px; /* 9 */ width: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 24px; /* 9 */ height: 1.5rem; /* 9 */ border: 1px solid #D3D4D3; border-radius: 50%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; transition: all 0.2s ease-in-out; } .items.pages-items .item .page .label { display: none; } .items.pages-items .item .page:hover { color: #019DF4; border-color: #019DF4; } .items.pages-items .item.current .page { color: #019DF4; border-color: #019DF4; } @media screen and (max-width: 720px) { .item.pages-item-next { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ } .item.pages-item-previous { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } } @media screen and (min-width: 720px) { .item.pages-item-next { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 24px; /* 9 */ margin-left: 1.5rem; /* 9 */ } .item.pages-item-previous { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 24px; /* 9 */ margin-right: 1.5rem; /* 9 */ } } .o-title, .o-headline { font-weight: 100; } .o-title.o-light, .o-headline.o-light { font-weight: 300; } .o-hgroup { text-align: center; } .o-hgroup__title { font-weight: 300; color: #000; } .o-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ text-align: center; color: #313235; } .o-title-small { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ text-align: center; color: #313235; } .o-title__light { font-weight: 300; } .o-title__bold { color: #50535A; font-weight: 700; } .o-layout__aside .title { -webkit-box-flex: 1; -webkit-flex: 1 100%; -moz-box-flex: 1; -moz-flex: 1 100%; -ms-flex: 1 100%; flex: 1 100%; text-align: center; } .o-headline { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ color: #313235; } .o-headline_margin-bottom { margin-bottom: 0; } .o-headline__line-height { line-height: 1.3; } .o-headline_blue { font-weight: 300; color: #0B2739; } .o-subheadline { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .o-header-img { text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .o-header-img__brand { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 48px; /* 9 */ max-height: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .o-header-img__brand_w255 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 255px; /* 9 */ width: 15.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 148px; /* 9 */ max-height: 9.25rem; /* 9 */ } .o-header-img__brand_w207 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 207px; /* 9 */ width: 12.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 294px; /* 9 */ max-height: 18.375rem; /* 9 */ } .o-header-img__brand_w66 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 66px; /* 9 */ width: 4.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 66px; /* 9 */ max-height: 4.125rem; /* 9 */ } .o-header-img__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ font-weight: 300; color: #313235; } .o-header-img__intro { font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .o-header-img__intro_strong { font-weight: 700; display: block; } .o-header-img__intro_dark-blue { color: #0B2739; } .o-title-ico { 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-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ font-weight: 300; } .o-title-ico::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 58px; /* 9 */ font-size: 3.625rem; /* 9 */ } .o-title-ico__red::before { color: #FF374A; transform: rotate(180deg); } @media (max-width: 739px) { .o-headline { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 38px; /* 9 */ line-height: 2.375rem; /* 9 */ } } @media (min-width: 740px) { .o-headline { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 48px; /* 9 */ line-height: 3rem; /* 9 */ } } @media only screen and (max-width: 767px) { .o-hgroup__title { font-size: 32px; } .o-hgroup__lead { font-size: 14px; } } @media only screen and (min-width: 768px) { .o-header-img__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } .o-header-img__text_font40 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ } .o-header-img__intro { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .o-hgroup__title { font-size: 40px; } } body._has-modal { height: 100%; overflow: hidden; width: 100%; } .modals-overlay { z-index: 899; } .modal-slide, .modal-popup { bottom: 0; left: 0; min-width: 0; position: fixed; right: 0; top: 0; visibility: hidden; opacity: 0; -webkit-transition: visibility 0s 0.3s, opacity 0.3s ease; transition: visibility 0s 0.3s, opacity 0.3s ease; } .modal-slide._show, .modal-popup._show { visibility: visible; opacity: 1; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .modal-slide._show .modal-inner-wrap, .modal-popup._show .modal-inner-wrap { -webkit-transform: translate(0, 0); transform: translate(0, 0); margin-top: 5%; } .modal-slide .modal-inner-wrap, .modal-popup .modal-inner-wrap { opacity: 1; pointer-events: auto; } .modal-slide { left: 44px; z-index: 900; } .modal-slide._show .modal-inner-wrap { -webkit-transform: translateX(0); transform: translateX(0); } .modal-slide .modal-inner-wrap { overflow: hidden; position: static; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; } .modal-slide._inner-scroll .modal-inner-wrap { overflow-y: visible; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .modal-slide._inner-scroll .modal-header, .modal-slide._inner-scroll .modal-footer { -webkit-flex-grow: 0; flex-grow: 0; -webkit-flex-shrink: 0; flex-shrink: 0; } .modal-slide._inner-scroll .modal-content { overflow-y: auto; } .modal-slide._inner-scroll .modal-footer { margin-top: auto; } .modal-popup { z-index: 900; left: 0; } .modal-popup.confirm .modal-inner-wrap { max-width: 50rem; } .modal-popup._show .modal-inner-wrap { -webkit-transform: translateY(0); transform: translateY(0); margin-top: 5%; } .modal-popup._inner-scroll { overflow-y: visible; } .ie11 .modal-popup._inner-scroll { overflow-y: auto; } .modal-popup._inner-scroll .modal-inner-wrap { max-height: 90%; } .ie11 .modal-popup._inner-scroll .modal-inner-wrap { max-height: none; } .modal-popup._inner-scroll .modal-content { overflow-y: auto; } .modal-content { max-height: 100%; } .modal-popup .modal-header, .modal-popup .modal-footer { -webkit-flex-grow: 0; flex-grow: 0; -webkit-flex-shrink: 0; flex-shrink: 0; } .modal-popup .modal-footer { margin-top: auto; padding-bottom: 3rem; padding-top: 3rem; } .modal-popup .modal-footer-actions { text-align: right; } .modal-custom .action-close, .modal-popup .action-close, .modal-slide .action-close { background-image: none; background: none; -moz-box-sizing: content-box; border: 0; box-shadow: none; line-height: inherit; margin: 0; padding: 0; text-shadow: none; font-weight: 400; display: inline-block; text-decoration: none; position: absolute; right: 0; top: 0; } .modal-custom .action-close:focus, .modal-popup .action-close:focus, .modal-slide .action-close:focus, .modal-custom .action-close:active, .modal-popup .action-close:active, .modal-slide .action-close:active { background: none; border: none; } .modal-custom .action-close:hover, .modal-popup .action-close:hover, .modal-slide .action-close:hover { background: none; border: none; } .modal-custom .action-close.disabled, .modal-popup .action-close.disabled, .modal-slide .action-close.disabled, .modal-custom .action-close[disabled], .modal-popup .action-close[disabled], .modal-slide .action-close[disabled], fieldset[disabled] .modal-custom .action-close, fieldset[disabled] .modal-popup .action-close, fieldset[disabled] .modal-slide .action-close { pointer-events: none; opacity: 0.5; } .modal-custom .action-close > span, .modal-popup .action-close > span, .modal-slide .action-close > span { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .modal-custom .action-close:before, .modal-popup .action-close:before, .modal-slide .action-close:before { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 14px; line-height: 14px; color: #757575; content: ""; font-family: "luma-icons"; margin: 0; vertical-align: top; display: inline-block; font-weight: normal; overflow: hidden; speak: none; text-align: center; } .modal-custom .action-close:hover:before, .modal-popup .action-close:hover:before, .modal-slide .action-close:hover:before { color: inherit; } .modal-custom .action-close:active:before, .modal-popup .action-close:active:before, .modal-slide .action-close:active:before { color: inherit; } .modal-custom .action-close:hover:before, .modal-popup .action-close:hover:before, .modal-slide .action-close:hover:before { color: #1a1a1a; } .modal-custom .action-close { margin: 15px; } .modal-popup { pointer-events: none; } .modal-popup .modal-title { border-bottom: 1px solid #c1c1c1; font-weight: 300; padding-bottom: 10px; font-size: 26px; margin-bottom: 0; min-height: 1em; word-wrap: break-word; } .modal-popup .action-close { padding: 20px; } .modal-slide .action-close { margin: 15px; padding: 0; } .action-close { display: none !important; } .modal-slide .page-main-actions { margin-bottom: -12.9rem; margin-top: 2.1rem; } .modals-overlay { background-color: rgba(11, 39, 57, 0.7); bottom: 0; left: 0; position: fixed; right: 0; top: 0; } body._has-modal-custom .modal-custom-overlay { height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; z-index: 899; } .modal-popup .modal-inner-wrap { margin: auto; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; box-sizing: border-box; max-width: 90%; height: 95%; top: 0; left: 0; bottom: 0; position: absolute; right: 0; -webkit-transform: translateY(-200%); transform: translateY(-200%); -webkit-transition: -webkit-transform 0.2s ease; transition: transform 0.2s ease; } .modal-large .modal-inner-wrap { width: 90% !important; max-width: 620px; height: auto; max-height: 95%; } .modal-small .modal-inner-wrap, .modal-large .modal-inner-wrap { border-radius: 12px; } .checkout-index-index .modal-popup .modal-inner-wrap { margin-left: auto !important; left: 0 !important; } .o-swiper-chevron { transition: all 0.2s ease-in; } .o-swiper-chevron::after { color: #fff; } .o-swiper-chevron.swiper-button-disabled { opacity: 0; } .o-swiper-chevron_bg { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 28px; /* 9 */ width: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 28px; /* 9 */ height: 1.75rem; /* 9 */ border-radius: 50%; background-color: #fff; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); } .o-swiper-chevron_bg::after { color: #019DF4; } .o-swiper-chevron_bg.swiper-button-prev { left: 0; } .o-swiper-chevron_bg.swiper-button-next { right: 0; } .js-slider-product-wrap .o-swiper-chevron_bg.swiper-button-prev { left: -20px; } @media screen and (max-width: 739px) { .js-slider-product-wrap .o-swiper-chevron_bg.swiper-button-prev { left: 0; } } .js-slider-product-wrap .o-swiper-chevron_bg.swiper-button-next { right: -20px; } @media screen and (max-width: 739px) { .js-slider-product-wrap .o-swiper-chevron_bg.swiper-button-next { right: 0; } } .o-swiper-bullets { right: 0; left: 0; } .o-swiper-bullets:not(.swiper-pagination-lock) { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ } .o-swiper-bullets .swiper-pagination-bullet { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 12px; /* 9 */ width: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 12px; /* 9 */ height: 0.75rem; /* 9 */ border: 1px solid transparent; opacity: 1; background-color: #C4C4C4; transition: all 0.2s ease-in; } .o-swiper-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active, .o-swiper-bullets .swiper-pagination-bullet:hover, .o-swiper-bullets .swiper-pagination-bullet:active { border-color: #313235; } .o-swiper-bullets_primary .swiper-pagination-bullet.swiper-pagination-bullet-active, .o-swiper-bullets_primary .swiper-pagination-bullet:hover, .o-swiper-bullets_primary .swiper-pagination-bullet:active { background-color: #019DF4; border-color: transparent; } @media screen and (min-width: 740px) { .o-swiper-bullets { bottom: 0; } } .o-result-search { 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; } .o-tooltip { position: relative; } .o-tooltip__btn:hover + .o-tooltip__text { opacity: 1; visibility: visible; } .o-tooltip_bottom .o-tooltip__btn:hover + .o-tooltip__text { right: 0; bottom: 30px; } .o-tooltip__text { position: absolute; top: 100%; right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 180px; /* 9 */ min-width: 11.25rem; /* 9 */ display: block; border: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #86888C; background: #EEEEEE; z-index: 5; opacity: 0; visibility: hidden; transition: all 0.2s ease-in-out; } .o-tooltip_bottom .o-tooltip__text { top: auto; bottom: 0; left: auto; right: 100%; } @media (max-width: 768px) { .o-tooltip__text_right { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ right: -30px; /* 9 */ right: -1.875rem; /* 9 */ } } @media screen and (max-width: 1023px) { .o-tooltip_bottom .o-tooltip__btn:hover + .o-tooltip__text { right: 0; bottom: -15px; } } .checkout-envio-index .page-wrapper, .checkout-index-index .page-wrapper, .checkout-lineas-index .page-wrapper, .checkout-opcionpago-index .page-wrapper, .checkout-contrato-index .page-wrapper, .checkout-recogerpagoacuotas-index .page-wrapper, .checkout-recogerpagounico-index .page-wrapper, .checkout-enviopagounico-index .page-wrapper, .checkout-enviopagoacuotas-index .page-wrapper, .checkout-cuestionario-index .page-wrapper { height: 100vh; 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .checkout-envio-index .page-wrapper .c-footer, .checkout-index-index .page-wrapper .c-footer, .checkout-lineas-index .page-wrapper .c-footer, .checkout-opcionpago-index .page-wrapper .c-footer, .checkout-contrato-index .page-wrapper .c-footer, .checkout-recogerpagoacuotas-index .page-wrapper .c-footer, .checkout-recogerpagounico-index .page-wrapper .c-footer, .checkout-enviopagounico-index .page-wrapper .c-footer, .checkout-enviopagoacuotas-index .page-wrapper .c-footer, .checkout-cuestionario-index .page-wrapper .c-footer { margin-top: auto; margin-bottom: 0; } .checkout-envio-index .page-wrapper .c-header-wrap, .checkout-index-index .page-wrapper .c-header-wrap, .checkout-lineas-index .page-wrapper .c-header-wrap, .checkout-opcionpago-index .page-wrapper .c-header-wrap, .checkout-contrato-index .page-wrapper .c-header-wrap, .checkout-recogerpagoacuotas-index .page-wrapper .c-header-wrap, .checkout-recogerpagounico-index .page-wrapper .c-header-wrap, .checkout-enviopagounico-index .page-wrapper .c-header-wrap, .checkout-enviopagoacuotas-index .page-wrapper .c-header-wrap, .checkout-cuestionario-index .page-wrapper .c-header-wrap { position: relative; z-index: 9 !important; } .checkout-envio-index .column.main, .checkout-index-index .column.main, .checkout-lineas-index .column.main, .checkout-opcionpago-index .column.main, .checkout-contrato-index .column.main, .checkout-recogerpagoacuotas-index .column.main, .checkout-recogerpagounico-index .column.main, .checkout-enviopagounico-index .column.main, .checkout-enviopagoacuotas-index .column.main, .checkout-cuestionario-index .column.main { 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 48px; /* 9 */ padding-bottom: 3rem; /* 9 */ } .checkout-cart-index .c-header-wrap { position: relative; z-index: 9 !important; } .page-with-filter .c-header-wrap { position: relative; z-index: 9 !important; } @media only screen and (max-width: 740px) { .checkout-envio-index .column.main, .checkout-index-index .column.main, .checkout-lineas-index .column.main, .checkout-opcionpago-index .column.main, .checkout-contrato-index .column.main, .checkout-recogerpagoacuotas-index .column.main, .checkout-recogerpagounico-index .column.main, .checkout-enviopagounico-index .column.main, .checkout-enviopagoacuotas-index .column.main, .checkout-cuestionario-index .column.main { width: 90%; max-width: 1125px; margin: 0 auto; } } @media only screen and (max-width: 1023px) { .checkout-envio-index .column.main, .checkout-index-index .column.main, .checkout-lineas-index .column.main, .checkout-opcionpago-index .column.main, .checkout-contrato-index .column.main, .checkout-recogerpagoacuotas-index .column.main, .checkout-recogerpagounico-index .column.main, .checkout-enviopagounico-index .column.main, .checkout-enviopagoacuotas-index .column.main, .checkout-cuestionario-index .column.main { -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-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; } } @media only screen and (min-width: 1024px) { .checkout-envio-index .column.main, .checkout-index-index .column.main, .checkout-lineas-index .column.main, .checkout-opcionpago-index .column.main, .checkout-contrato-index .column.main, .checkout-recogerpagoacuotas-index .column.main, .checkout-recogerpagounico-index .column.main, .checkout-enviopagounico-index .column.main, .checkout-enviopagoacuotas-index .column.main, .checkout-cuestionario-index .column.main { width: 90% !important; max-width: 1125px; margin: 0 auto; } .checkout-enviopagounico-index .column.main, .checkout-contrato-index .column.main { flex-direction: row; } .checkout-index-index .column.main { padding-top: 24px; } } .o-timer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 16px 0; /* 9 */ margin: 1rem 0; /* 9 */ color: #50535A; } .o-timer__txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 16px 0; /* 9 */ margin: 1rem 0; /* 9 */ color: #FF374A; } .o-timer_margin { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 8px 0; /* 9 */ margin: 0.5rem 0; /* 9 */ } .o-message { 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; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; -webkit-align-self: center; -moz-align-self: center; -ms-flex-item-align: center; align-self: center; text-align: center; height: 100%; margin: auto; } .o-message_w340 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 350px; /* 9 */ max-width: 21.875rem; /* 9 */ margin: 0 auto; } .o-message__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ } .o-message__header::before { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 56px; /* 9 */ font-size: 3.5rem; /* 9 */ } .o-message_success .o-message__header::before { color: #5CB615; } .o-message_error .o-message__header::before { color: #FF374A; } .o-message__title, .o-message__txt { font-weight: 300; } .o-message__txt_lh { line-height: 16px; } .o-message__txt_regular { font-weight: 400; } .o-message_w340 .o-message__txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ } .o-message__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ font-weight: 300; line-height: 1; } .o-message__title_bold { font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } .o-message__btn { width: 100%; } .o-message__actions { 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; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ width: 100%; } @media screen and (max-width: 940px) { .o-message__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ } .o-message__title_fs18 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .o-message__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .o-message__header::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .o-message__txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } @media screen and (min-width: 502px) { .o-message__actions .o-message__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 194px; /* 9 */ max-width: 12.125rem; /* 9 */ } } @media only screen and (min-width: 768px) { .o-message_height450 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 450px; /* 9 */ min-height: 28.125rem; /* 9 */ } } .o-modal { position: relative; height: 100%; max-width: 890px; margin: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 44px; /* 9 */ padding-top: 2.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 44px; /* 9 */ padding-bottom: 2.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 12px; /* 9 */ border-radius: 0.75rem; /* 9 */ background-color: #fff; overflow: hidden; } .o-modal_w500 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 500px; /* 9 */ max-width: 31.25rem; /* 9 */ margin: auto; } .o-modal_w711 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 711px; /* 9 */ max-width: 44.4375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px; /* 9 */ padding: 0.75rem; /* 9 */ } .o-modal__btn-close { position: absolute; top: 0; right: 0; padding: 24px 20px 0 0; } .o-modal__btn-close::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #86888C; } .o-modal_pr16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ } .o-modal__content { max-height: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ overflow-y: auto; /* width */ /* Track */ /* Handle */ } .o-modal__content::-webkit-scrollbar { width: 5px; height: 5px; } .o-modal__content::-webkit-scrollbar-track { background-color: transparent; border-radius: 10px; } .o-modal__content::-webkit-scrollbar-thumb { background-color: #B6B7B7; border-radius: 10px; } .o-modal__content_p0 { padding: 0; } .o-modal__content_center { text-align: center; } .o-modal__content_w400 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 400px; /* 9 */ max-width: 25rem; /* 9 */ margin: auto; } .o-modal__content_w572 { margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 572px; /* 9 */ max-width: 35.75rem; /* 9 */ } .o-modal__content_w735 { margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 735px; /* 9 */ max-width: 45.9375rem; /* 9 */ } .o-modal__header-marginb { margin-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .o-modal__header_w455 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 455px; /* 9 */ max-width: 28.4375rem; /* 9 */ margin-left: auto; margin-right: auto; } .o-modal__img { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 287px; /* 9 */ max-width: 17.9375rem; /* 9 */ } .o-modal__img-small { width: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 56px; /* 9 */ min-width: 3.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .o-modal__img-ico::before { display: block; color: #FF374A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 50px; /* 9 */ font-size: 3.125rem; /* 9 */ transform: rotate(180deg); } .o-modal__text-box { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 324px; /* 9 */ max-height: 20.25rem; /* 9 */ overflow-x: hidden; } .o-modal__text-box::-webkit-scrollbar { -webkit-appearance: none; width: 5px; } .o-modal__text-box::-webkit-scrollbar-button, .o-modal__text-box::-webkit-scrollbar-button:increment { display: none; } .o-modal__text-box::-webkit-scrollbar-track { background-color: #EEEEEE; } .o-modal__text-box::-webkit-scrollbar-thumb { background-color: #B6B7B7; border-radius: 4px; border: 1px solid #B6B7B7; } .o-modal__text-box_marginb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .o-modal__text-box_text-left { text-align: left; color: #313235; line-height: 1.1; } .o-modal__txt { color: #50535A; } .o-modal__subcontent { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 400px; /* 9 */ max-width: 25rem; /* 9 */ margin: 0 auto; } .o-modal__footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ } .o-modal__footer_margin-top32 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .o-modal__footer_flex { 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-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: stretch; -ms-flex-align: stretch; -webkit-align-items: stretch; -moz-align-items: stretch; align-items: stretch; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 270px; /* 9 */ max-width: 16.875rem; /* 9 */ margin: 0 auto; } .o-modal__footer_inline { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ } .o-modal__btn-lh { line-height: 1.4; } .o-modal__btn_w260 { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 260px; /* 9 */ max-width: 16.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .o-modal__btn_margin0 { margin-top: 0; } .o-modal__header .o-headline { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 32px; /* 9 */ line-height: 2rem; /* 9 */ } @media only screen and (min-width: 520px) { .o-modal__footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ } .o-modal__footer_margin-top32 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } } @media only screen and (max-width: 450px) { .o-modal__footer_inline { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } } .o-layout-form__wrap-header, .o-layout-form__body { display: grid; grid-template-columns: 11% 78% 11%; justify-content: space-between; align-items: center; grid-template-areas: ". element ."; } .o-layout-form__wrap-header { background-color: #0B2739; } .o-layout-form__header { grid-area: element; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 940px; /* 9 */ max-width: 58.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 64px; /* 9 */ margin-top: 4rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 312px; /* 9 */ margin-bottom: 19.5rem; /* 9 */ margin-left: auto; margin-right: auto; text-align: center; color: #fff; } .o-layout-form__body { grid-area: element; } .o-layout-form__form { grid-column-start: 2; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 50px 84px; /* 9 */ padding: 3.125rem 5.25rem; /* 9 */ margin-top: -273px; background-color: #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 17px; /* 9 */ border-radius: 1.0625rem; /* 9 */ } .o-layout-form__title { font-weight: 700; transition: all 0.4s ease-in; } .o-layout-form__paragraph { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ transition: all 0.4s ease-in; } .o-layout-form__box { position: relative; 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: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; height: 100%; width: 100%; overflow: hidden; } .o-layout-form__box_center { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .o-layout-form__element { display: block; } .o-layout-form__element_left { transition: all 0.4s ease-in; } .o-layout-form__element_right { position: relative; right: -8px; height: 85%; } .o-layout-form__footer { grid-row-start: 2; grid-column-start: 2; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 56px; /* 9 */ margin-bottom: 3.5rem; /* 9 */ text-align: center; } @media only screen and (max-width: 767px) { .o-layout-form__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .o-layout-form__paragraph { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .o-layout-form__form { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 25px 19px; /* 9 */ padding: 1.5625rem 1.1875rem; /* 9 */ } } @media only screen and (max-width: 934px) { .o-layout-form__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 128px; /* 9 */ margin-bottom: 8rem; /* 9 */ } .o-layout-form__form { margin-top: -60px; } .o-layout-form__element_left { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 54px; /* 9 */ height: 3.375rem; /* 9 */ } } @media only screen and (max-width: 480px) { .o-layout-form__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .o-layout-form__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .o-layout-form__paragraph { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .o-layout-form__form { margin-top: -30px; } .o-layout-form__element_left { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 29px; /* 9 */ height: 1.8125rem; /* 9 */ } } .o-alert { position: fixed; background-color: rgba(11, 39, 57, 0.7); top: 0; right: 0; bottom: 0; left: 0; z-index: 999; visibility: hidden; opacity: 0; pointer-events: none; transition: all 0.3s; } .is-visible .o-alert { opacity: 1; visibility: visible; pointer-events: all; } .o-alert__close-btn { position: relative; top: -44px; left: 20px; width: fit-content; margin-left: auto; } .o-alert__close-btn::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #86888C; } .o-alert__wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 412px; /* 9 */ min-height: 25.75rem; /* 9 */ max-height: 80%; width: 80%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 620px; /* 9 */ max-width: 38.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 48px; /* 9 */ padding: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 12px; /* 9 */ border-radius: 0.75rem; /* 9 */ background-color: #fff; } .o-alert__content { overflow: auto; height: inherit; } .o-alert__footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .o-alert__text, .o-alert__footer { text-align: center; } .o-identification-card { display: grid; grid-template-columns: repeat(1, auto); grid-auto-rows: minmax(218px, auto); transition: all 1s; transform-style: preserve-3d; } .o-identification-card.is-change-side { transform: rotateY(180deg); } .o-identification-card__side { position: relative; backface-visibility: hidden; grid-column: 1/3; grid-row: 1; } .o-identification-card__side_back { transform: rotateY(180deg); } .o-identification-card__img { display: block; border-radius: 12px; } .o-identification-card__number, .o-identification-card__date, .o-identification-card__birth, .text-img-lastnames, .text-img-names { position: absolute; } .text-img-lastnames { top: 35%; left: 10%; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 11px; /* 9 */ font-size: 0.6875rem; /* 9 */ font-weight: 700; padding: 0 8px; line-height: 1.2; /*width: 46%;*/ width: auto; height: auto; text-align: justify; text-transform: uppercase; } .text-img-names { top: 48%; left: 10%; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 11px; /* 9 */ font-size: 0.6875rem; /* 9 */ font-weight: 700; padding: 0 8px; line-height: 1.2; /*width: 46%;*/ width: auto; height: auto; text-align: justify; text-transform: uppercase; } .text-img-idnumber { width: 35%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 20px; /* 9 */ height: 1.25rem; /* 9 */ } .text-img-expdate { bottom: 41% !important; width: 35%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 35px; /* 9 */ height: 2.1875rem; /* 9 */ left: 32% !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ text-align: left; } .text-img-bthdate { width: 20%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 20px; /* 9 */ height: 1.25rem; /* 9 */ top: 6%; right: 20%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 10px; /* 9 */ font-size: 0.625rem; /* 9 */ } .focus-card-input { /*background: $c-neutro;*/ border: 2px solid #5CB615; border-radius: 5px; padding: 0 5px; } .o-identification-card__number { top: 24%; left: 21%; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ font-weight: 700; padding: 0 8px; line-height: 1.2; } .o-identification-card__date { right: 0; bottom: 45%; left: -44px; font-size: 12px; text-transform: uppercase; } /*------------------------------------*\ Media querys Mobile \*------------------------------------*/ @media (min-width: 375px) and (max-width: 390px) { .o-identification-card__date { bottom: 46%; } } /*------------------------------------*\ Media querys Tablet \*------------------------------------*/ @media (min-width: 1024px) and (max-width: 1080px) { .text-img-lastnames { top: 25%; width: 46%; height: 1.2vh; font-size: 9px !important; } .text-img-names { top: 35%; display: block; width: 46%; height: 1.2vh; font-size: 9px !important; } .text-img-idnumber { top: 18%; } .text-img-bthdate { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 16px; /* 9 */ height: 1rem; /* 9 */ top: 4%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 8px; /* 9 */ font-size: 0.5rem; /* 9 */ padding: 0 !important; } .o-identification-card__number { top: 40px; } .o-identification-card__date { bottom: 56%; font-size: 9px !important; } .text-img-expdate { bottom: 54% !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 28px; /* 9 */ height: 1.75rem; /* 9 */ } } @media (min-width: 1080px) and (max-width: 1120px) { .o-identification-card__date { bottom: 54%; } .text-img-expdate { bottom: 51% !important; } } @media (min-width: 1080px) and (max-width: 1160px) { .text-img-lastnames { top: 29%; width: 46%; height: 1.2vh; } .text-img-names { top: 40%; display: block; width: 46%; height: 1.2vh; } .o-identification-card__number { top: 22%; } .text-img-expdate { bottom: 47% !important; } .text-img-bthdate { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 16px; /* 9 */ height: 1rem; /* 9 */ top: 4%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 8px; /* 9 */ font-size: 0.5rem; /* 9 */ padding: 0 !important; } } @media (min-width: 1120px) and (max-width: 1200px) { .text-img-lastnames { top: 30%; width: 46%; height: 1.2vh; } .text-img-names { top: 42%; display: block; width: 46%; height: 1.2vh; } .text-img-idnumber { top: 20%; } .o-identification-card__date { bottom: 51%; } } @media (min-width: 1161px) and (max-width: 1200px) { .text-img-lastnames { top: 25%; width: 46%; height: 1.2vh; } .text-img-names { top: 35%; display: block; width: 46%; height: 1.2vh; } .o-identification-card__number { top: 52px; } .text-img-expdate { bottom: 47% !important; } .text-img-bthdate { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 18px; /* 9 */ height: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 9px; /* 9 */ font-size: 0.5625rem; /* 9 */ } } @media (min-width: 1024px) and (max-width: 1200px) { .o-identification-card__number { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .o-identification-card__date { left: -22px; } } @media (min-width: 768px) and (max-width: 1023px) { .o-identification-card__number { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .o-identification-card__date { left: -22px; } .text-img-lastnames { top: 35%; width: 46%; height: 1.2vh; } .text-img-names { top: 50%; display: block; width: 46%; height: 1.2vh; } } .o-list-steps { 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; list-style: none; counter-reset: my-sec-counter; } .o-list-steps__step { position: relative; 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-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .o-list-steps__step::before { content: counter(my-sec-counter); counter-increment: my-sec-counter; 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 32px; /* 9 */ min-width: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 32px; /* 9 */ min-height: 2rem; /* 9 */ border-radius: 50%; font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #86888C; } .o-list-steps__step::after { content: ""; position: absolute; bottom: 0; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 4px; /* 9 */ height: 0.25rem; /* 9 */ margin: auto 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 2px; /* 9 */ border-radius: 0.125rem; /* 9 */ background: #D3D4D3; } .o-list-steps__step:last-of-type::after { display: none; } .o-list-steps__step.is-current::before { border-color: #019DF4; color: #fff; background-color: #019DF4; } .o-list-steps__step.is-check::before { content: ""; border-color: transparent; font-family: ico-movistar; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 34px; /* 9 */ font-size: 2.125rem; /* 9 */ line-height: 1; color: #019DF4; background-color: transparent; } .o-list-steps__step.is-check::after { background-color: #019DF4; } .o-list-steps__txt { color: #424B5A; } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media screen and (max-width: 739px) { .o-list-steps { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 40px; /* 9 */ column-gap: 2.5rem; /* 9 */ } .o-list-steps__step { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .o-list-steps__step::after { top: 0; right: -100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 34px; /* 9 */ width: 2.125rem; /* 9 */ } .o-list-steps__txt { display: none; } } /*------------------------------------*\ Media querys Desktop \*------------------------------------*/ @media screen and (min-width: 740px) { .o-list-steps { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 62px; /* 9 */ column-gap: 3.875rem; /* 9 */ } .o-list-steps__step { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 62px; /* 9 */ max-width: 3.875rem; /* 9 */ } .o-list-steps__step::after { top: -40px; left: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 60px; /* 9 */ width: 3.75rem; /* 9 */ } .o-list-steps__step { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 4px; /* 9 */ row-gap: 0.25rem; /* 9 */ text-align: center; } } .u-download-link-ico { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ } .u-download-link-ico__ico { 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: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 44px; /* 9 */ font-size: 2.75rem; /* 9 */ color: #86888C; background: #fff; } .u-download-link-ico__link { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ text-decoration: none; color: #019DF4; } .u-download-link-ico__txt { text-decoration: underline; } .u-download-link-ico__txt:hover { text-decoration: none; } .o-item-selected { 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; } .o-item-selected:not(:last-child) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .o-item-selected__close { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ padding: 0 12px 0 0; /* 9 */ padding: 0 0.75rem 0 0; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ line-height: 1; color: #86888C; transition: all 0.2 ease-in; } .o-item-selected__close:hover { transform: scale(0.9); } .o-item-selected__figure { 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; width: 100%; } .o-item-selected__img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 23px; /* 9 */ max-height: 1.4375rem; /* 9 */ } .legales-index-index .page-wrapper { height: 100vh; 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .legales-index-index .container { flex: 2; } @media only screen and (min-width: 1024px) { .legales-index-index .column.main { display: grid; grid-template-columns: 1fr 2fr; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ width: 90% !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin-left: auto; margin-right: auto; } } .o-list-file { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; -webkit-justify-content: space-evenly; -moz-justify-content: space-evenly; justify-content: space-evenly; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 24px; /* 9 */ row-gap: 1.5rem; /* 9 */ list-style: none; } .o-list-file__item { transition: all 0.2 ease-in; } .o-list-file__item:hover { opacity: 0.5; } .o-list-file__img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 60px; /* 9 */ width: 3.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 60px; /* 9 */ min-width: 3.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 60px; /* 9 */ max-width: 3.75rem; /* 9 */ } .o-list-file__caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 130px; /* 9 */ max-width: 8.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ line-height: 1.2; color: #50535A; } /** * Class: u-hidden, display none * @atom Ocultar elemento * @section Utils * @markup * * Twitter * */ .u-hidden { display: none; opacity: 0; visibility: hidden; } .u-position-relative { position: relative; transition: all 0.2s ease; } .u-position-absolute { position: absolute !important; } .u-display-block { display: block; } .u-display-inline { display: inline; } .u-width-100 { width: 100% !important; } .u-width-108 { width: 108% !important; } .u-width-50 { width: 50%; } .u-text-left { text-align: left; } .u-text-right { text-align: right; } .u-text-center { text-align: center; } .u-text-light { font-weight: 300; } .u-text_light100 { font-weight: 100; } .u-text-regular { font-weight: 400; } .u-text-bold { font-weight: 700; } .u-text-blue { color: #019DF4; } .u-box-align-center { margin-right: auto; margin-left: auto; } .u-margin-both-0 { margin: 0; } .u-margin-top-0 { margin-top: 0; } .u-margin-both-24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .u-margin-top-8 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .u-margin-top-16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .u-margin-top-24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } .u-margin-top-32 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .u-margin-top-40 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ } .u-margin-top-56 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 56px; /* 9 */ margin-top: 3.5rem; /* 9 */ } .u-margin-bottom-0 { margin-bottom: 0; } .u-margin-bottom-8 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .u-margin-bottom-16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .u-margin-bottom-24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .u-margin-bottom-32 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .u-margin-bottom-40 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .u-margin-bottom-56 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 56px; /* 9 */ margin-bottom: 3.5rem; /* 9 */ } .u-margin-left-8 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ } .u-margin-left-16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ } .u-margin-right-8 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .u-margin-right-16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ } .u-margin-both-lr-24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 24px; /* 9 */ margin-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 24px; /* 9 */ margin-left: 1.5rem; /* 9 */ } .u-padding-both-0 { padding: 0; } .u-padding-top-16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ } .u-padding-both-24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 24px; /* 9 */ padding-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 24px; /* 9 */ padding-bottom: 1.5rem; /* 9 */ } .u-padding-both-40 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 40px 0; /* 9 */ padding: 2.5rem 0; /* 9 */ } .u-padding-bottom-32 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ } .u-skeleton { position: relative; font-size: 0; } .u-skeleton::before, .u-skeleton::after { content: ""; position: absolute; left: 8px; bottom: 0; right: 0; width: 100%; min-width: 104px; max-width: 184px; border-radius: 50px; background: #D3D4D3; height: 10px; margin: auto 0; } .u-skeleton::before { top: 0; } .u-skeleton::after { display: none; } .u-skeleton_double::before { top: -16px; } .u-skeleton_double::after { display: block; top: 16px; width: 104px; } .u-border-top { border-top: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ } .u-row-gap { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } .u-list-style-none { list-style: none; } /** * Class: u-hidden-mb, display none * @atom Ocultar elemento en Mobile * @section Utils * @markup * * Twitter * */ @media only screen and (max-width: 768px) { .u-hidden-mb { display: none; opacity: 0; visibility: hidden; } } /** * Class: u-inherit, Color de texto heredado del color especificado para el texto del bloque padre. * @atom Color heredado * @section Utils * @markup *

* Color de texto heredado *

*/ .u-inherit { color: inherit; } /** * Class: u-inline, Elemento display inline-block * @atom Elemento Inline block * @section Utils * @markup *

* Elemento inline Block *

*/ .u-inline { display: inline-block; } .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; } .error_border { border: 1px solid #db5b5b !important; } .error_input { font-size: 0.8rem !important; margin-top: 7px; color: #e02b27; } /** * Class: modals-wrapper, Elemento modal default magento * */ .img_mini_offer { padding: 0.5rem; } .text_mini_offert { padding: 0.5rem; } @media screen and (max-width: 600px) { .one-flex-sm { flex: 1; } .two-flex-sm { flex: 2; } } @media screen and (min-width: 501px) { .u-text-right-md { text-align: right; } } .c-form__text-list_confronta { margin-left: 1rem !important; } .p_1_1 { padding: 1.4rem !important; } .sumary_confronta { display: none !important; } @media screen and (max-width: 600px) { .sumary_confronta { display: block !important; } } .red::after { color: #e02b27 !important; } .red_before::before { color: #e02b27 !important; } .i-after-close_before::before { content: ""; } .title_18 { font-size: 1.8rem !important; } @media screen and (min-width: 600px) { .dnone_desktop { display: none !important; } } @media screen and (max-width: 600px) { .dnone_mobile { display: none !important; } } .s-richtext { color: #86888C; } .s-richtext h1, .s-richtext h2, .s-richtext h3 { font-weight: 400; } .s-richtext h1 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ line-height: calc(40/32); } .s-richtext h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ line-height: calc(32/24); } .s-richtext h3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ line-height: calc(28/18); } .s-richtext a { position: relative; padding: 0; color: #019DF4; text-decoration: none; } .s-richtext a:hover, .s-richtext a:focus, .s-richtext a:active { color: rgba(1, 157, 244, 0.9); } .s-richtext mark { padding: 2px 8px; border-radius: 40px; color: inherit; background-color: rgba(1, 157, 244, 0.2); } .s-richtext hr { margin-top: 32px; margin-bottom: 32px; border: 0; height: 1px; background-color: #86888C; } .s-richtext p:not(:first-child), .s-richtext p:not(:last-child) { margin-top: 24px; margin-bottom: 24px; } .s-richtext ul, .s-richtext ol { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 32px; /* 9 */ margin-left: 2rem; /* 9 */ } .s-richtext ul li, .s-richtext ol li { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 8px; /* 9 */ padding-left: 0.5rem; /* 9 */ } .s-richtext ul li::marker, .s-richtext ol li::marker { color: #019DF4; } .s-richtext ul li::marker { content: ""; font-family: "ico-movistar"; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .s-richtext img { display: block; max-width: 100%; height: auto; margin: 32px auto; } .s-richtext img.left { float: left; margin-left: 0; max-width: 45%; margin-right: 40px; } .s-richtext img.right { float: right; margin-right: 0; max-width: 45%; margin-left: 40px; } .s-richtext iframe { aspect-ratio: 16/9; width: 100%; height: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .s-richtext table { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ margin-left: auto; margin-right: auto; border: 1px solid rgba(205, 211, 221, 0.5); /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ border-collapse: inherit; overflow: hidden; text-align: left; } .s-richtext tbody tr:not(:nth-child(2n)) { background-color: rgba(205, 211, 221, 0.5); } .s-richtext td, .s-richtext th { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ line-height: 1.2; } tbody .s-richtext td, tbody .s-richtext th { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 240px; /* 9 */ max-width: 15rem; /* 9 */ } .s-richtext th { color: #fff; background-color: #019DF4; } .s-richtext th:nth-child(2n) { background-color: rgba(1, 157, 244, 0.7); } @media only screen and (max-width: 767px) { .s-richtext table { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .s-richtext thead, .s-richtext tr, .s-richtext td, .s-richtext th { display: block; } .s-richtext thead { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 100px; /* 9 */ min-width: 6.25rem; /* 9 */ } .s-richtext td, .s-richtext th { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 120px; /* 9 */ max-height: 7.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 120px; /* 9 */ min-height: 7.5rem; /* 9 */ } .s-richtext tbody { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; overflow-x: auto; } .s-richtext td, .s-richtext th { overflow-x: hidden; overflow-y: auto; } tbody .s-richtext tr { -webkit-box-flex: 1; -webkit-flex: 1 0 auto; -moz-box-flex: 1; -moz-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: 1 0 auto; } } @media screen and (max-width: 340px) { .s-richtext table { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 290px; /* 9 */ max-width: 18.125rem; /* 9 */ } } @media only screen and (min-width: 768px) { .s-richtext h1 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ line-height: calc(40/40); } .s-richtext h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ line-height: calc(40/32); } .s-richtext h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ line-height: calc(32/24); } } .s-richtext-modals a { color: #019DF4; } .s-richtext-modals ol, .s-richtext-modals ul { padding: 15px; } .s-richtext-modals ol li, .s-richtext-modals ul li { margin-bottom: 8px; } .c-menu-bg { position: relative; z-index: 99; } .c-menu-bg::before { content: ""; position: absolute; top: 100%; right: 0; bottom: 0; left: 0; z-index: -15; background-color: #0B273998; height: 100vh; transition: 0.4s; opacity: 0; visibility: hidden; } .c-header-bg { position: relative; } .c-header-bg::before { content: ""; position: absolute; background-color: #0B273998; height: 100vh; width: 100vw; transition: 0.4s; opacity: 0; visibility: hidden; } .is-open-menu-top .c-header-bg { overflow: hidden; } .is-open-menu-top .c-header-bg::before { opacity: 1; visibility: visible; } .c-header-wrap { position: relative; top: 0; z-index: 900; } .c-menu-top-bg { background-color: #0B2739; transition: 0.4s; } .c-menu-top-bg::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; height: 100vh; background-color: #0B273998; opacity: 0; visibility: hidden; } .c-menu-top-bg.is-open-menu-top, .c-menu-top-bg.is-open-main-menu { overflow: hidden; opacity: 1; visibility: visible; } .c-menu-top { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 6px; /* 9 */ padding-top: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 6px; /* 9 */ padding-bottom: 0.375rem; /* 9 */ color: #D3D4D3; } .c-menu-top__list_display { display: flex; align-items: center; } .c-menu-top__dropdown { position: relative; } .c-menu-top__dropdown-content.c-megamenu { right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 400px; /* 9 */ min-width: 25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px; /* 9 */ padding: 1.5rem; /* 9 */ color: #50535A; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); transform: translatex(0); top: 36px; opacity: 0; transition: all 0.3s ease-in-out; } .is-dropdown-active .c-menu-top__dropdown-content.c-megamenu { z-index: 5; opacity: 1; } .c-menu-top__link { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 32px; /* 9 */ margin-left: 2rem; /* 9 */ font-family: "Telefonica", sans-serif; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ font-weight: normal; transition: all 0.4s ease-in; color: inherit; } .c-menu-top__link:first-child { margin-left: 0; } .c-menu-top__link:hover, .c-menu-top__link:active, .c-menu-top__link:visited { text-decoration: underline; } .c-menu-top__link::after { display: none; } .c-menu-top__dropdown .c-menu-top__link { display: block; } .c-menu-top__dropdown .c-menu-top__link::after { display: inline-block; vertical-align: middle; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ color: #019DF4; } .c-menu-top__link.is-active { font-weight: 700; } .c-main-menu__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 134px; /* 9 */ min-width: 8.375rem; /* 9 */ padding-top: 12px; padding-bottom: 12px; } .c-menu-top-burger { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ width: fit-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 163px; /* 9 */ min-width: 10.1875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 30px; /* 9 */ border-radius: 1.875rem; /* 9 */ border: 1px solid #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px 16px; /* 9 */ padding: 0.5rem 1rem; /* 9 */ font-family: "Telefonica", sans-serif; font-weight: 400; color: #fff; background-color: #019DF4; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); line-height: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 25px; /* 9 */ margin-top: 1.5625rem; /* 9 */ } .c-menu-top-burger::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ transform: rotate(0deg); transition: all 0.2s ease-in; } .is-open-menu-top .c-menu-top-burger { color: #019DF4; background-color: #fff; } .is-open-menu-top .c-menu-top-burger::after { transform: rotate(180deg); } @media only screen and (min-width: 1251px) { .is-open .c-menu-bg::before { opacity: 1; visibility: visible; } } @media only screen and (max-width: 1250px) { body.is-open-main-menu { overflow: hidden; } .is-open-main-menu .c-menu-bg::before { opacity: 1; visibility: visible; z-index: 4; } .is-open-menu-top .c-menu-bg:before { z-index: 1; } .is-open-menu-top { height: 100%; } .c-menu-top { position: fixed; top: 62px; right: -1000px; z-index: 220; min-width: 345px; margin-left: auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; color: #50535A; background-color: #fff; opacity: 0; pointer-events: none; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .is-open-menu-top .c-menu-top { position: absolute; right: 0; opacity: 1; pointer-events: visible; } .c-menu-top__list { display: inherit; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 32px; /* 9 */ padding-left: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 32px; /* 9 */ padding-right: 2rem; /* 9 */ } .c-menu-top__list_display { display: none; } .c-menu-top__link { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 22px; /* 9 */ padding-top: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 22px; /* 9 */ padding-bottom: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 19px; /* 9 */ padding-left: 1.1875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 19px; /* 9 */ padding-right: 1.1875rem; /* 9 */ margin-left: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: #019DF4; border-bottom: 1px solid #D3D4D3; } .c-menu-top__link:last-child { border-bottom: none; } .c-menu-top__link::after { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 24px; /* 9 */ margin-left: 1.5rem; /* 9 */ color: #019DF4; } .c-menu-top__link:hover { text-decoration: none; } .c-menu-top__link.is-active { text-decoration: none; border-bottom: 1px solid #019DF4; } } .c-main-menu { background-color: #fff; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); } .c-main-menu__content { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ background-color: #fff; } .c-main-menu__img { min-width: 34px; } .c-main-menu__nav { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ height: fit-content; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ } .c-main-menu__wrap-list { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; width: 100%; } .c-main-menu__icons { 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; } .c-main-menu__search { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ border-radius: 50%; line-height: 1; color: #86888C; background-color: transparent; transition: all 0.3s ease-in-out; } .c-main-menu__search::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .c-main-menu__search:hover { background-color: rgba(211, 212, 211, 0.4); } .c-main-menu__header, .c-megamenu__header, .c-sumenu-third-level__header { display: none; background-color: #019DF4; } .c-main-menu__list { display: block; 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ margin-right: auto; line-height: 1.2; list-style: none; } .c-main-menu__link { display: block; position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; } .c-main-menu__link::after { position: absolute; right: 0; top: 41%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 10px; /* 9 */ font-size: 0.625rem; /* 9 */ color: #86888C; transform: rotate(0deg); transition: all 0.4s ease-in; } .c-main-menu__link::before { content: ""; position: absolute; bottom: 0; display: block; width: 0; height: 3px; border-radius: 5px; background-color: #019DF4; transition: all 0.4s; } .c-main-menu__link:hover::after, .c-main-menu__link:active::after { color: #019DF4; } .c-main-menu__link:hover::before, .c-main-menu__link:active::before { width: 100%; } .c-main-menu__link.is-active::after { color: #019DF4; transform: rotate(180deg); } .c-main-menu__link.is-active::before { width: 100%; } .c-main-menu__btn_display { display: none; } .c-main-menu-burger { display: none; border: none; right: 0; line-height: 0; } .c-main-menu-burger::before { content: ""; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 25px; /* 9 */ font-size: 1.5625rem; /* 9 */ color: #019DF4; transition: content 0.2s ease-in 1s, color 0.2s ease-in 1s; } .is-open-main-menu .c-main-menu-burger { position: absolute; right: 0; top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 32px; /* 9 */ padding-right: 2rem; /* 9 */ z-index: 200; } .is-open-main-menu .c-main-menu-burger::before { content: ""; color: #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } @media only screen and (min-width: 1251px) { .c-main-menu__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 8px; /* 9 */ padding-bottom: 0.5rem; /* 9 */ } } @media only screen and (max-width: 1250px) { .c-main-menu__nav { position: fixed; top: 0; right: -1000px; -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ width: auto; height: 100vh; margin-left: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ background-color: #fff; opacity: 0; pointer-events: none; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); z-index: 5; } .is-open-main-menu .c-main-menu__nav { right: 0; opacity: 1; pointer-events: visible; } .c-main-menu__header, .c-megamenu__header, .c-sumenu-third-level__header { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 14px; /* 9 */ padding-top: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 19px; /* 9 */ padding-bottom: 1.1875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 25px; /* 9 */ padding-left: 1.5625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: -16px; /* 9 */ margin-left: -1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: -16px; /* 9 */ margin-right: -1rem; /* 9 */ min-height: 62px; } .is-open-menu-top .c-main-menu__header { z-index: 10; } .c-main-menu__wrap-list { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ overflow-y: scroll; overflow-x: hidden; } .c-main-menu__list { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ margin-right: 0; } .c-main-menu__link { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 21px; /* 9 */ padding-top: 1.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 21px; /* 9 */ padding-bottom: 1.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .c-main-menu__link::after { content: ""; right: 16px; color: #019DF4; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-main-menu__link::before { display: none; } .c-main-menu__link:hover::after { transform: none; } .c-main-menu__link.is-active { color: #019DF4; border-bottom: 1px solid #019DF4; } .c-main-menu__link.is-active::after { transform: none; } .c-main-menu__link_display::after { display: none; } .c-main-menu__item { width: 100%; } .c-main-menu__btn { -webkit-align-self: center; -moz-align-self: center; -ms-flex-item-align: center; align-self: center; min-width: 313px; font-weight: 400; } .c-main-menu__btn_display { display: block; } .c-main-menu-burger { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ font-weight: 700; } } .c-megamenu { position: absolute; top: -1000%; z-index: -5; min-width: 290px; background-color: #fff; border-radius: 8px; transition: all 0.9s cubic-bezier(0.4, 0, 0.2, 1); } .is-open-megamenu .c-megamenu { top: 100%; } .is-open-third-menu .c-megamenu { min-width: 800px; } .c-megamenu { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 32px; /* 9 */ padding: 2rem; /* 9 */ background-color: #fff; transform: translatex(-30%); } .c-megamenu__header, .c-sumenu-third-level__header { display: none; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 20px; /* 9 */ padding-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 24px; /* 9 */ padding-bottom: 1.5rem; /* 9 */ } .c-submenu__list { list-style-type: none; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .c-menu-top__dropdown-content .c-submenu__list { margin-bottom: 0; } .c-menu-top__dropdown-content .c-submenu__item-wrap { padding: 0; } .c-menu-top__dropdown-content .c-submenu__item:not(:last-child) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 4px; /* 9 */ margin-bottom: 0.25rem; /* 9 */ } .c-submenu__item-wrap, .c-sumenu-third-level__item-wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 13px; /* 9 */ padding-top: 0.8125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 13px; /* 9 */ padding-bottom: 0.8125rem; /* 9 */ } .c-submenu__link { 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; position: relative; width: 100%; } .c-submenu__link::after { position: absolute; right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-submenu__link::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 17px; /* 9 */ font-size: 1.0625rem; /* 9 */ } .c-submenu__link:hover { color: #019DF4; } .c-submenu__link.is-active { color: #019DF4; } .c-submenu__link.is-active::before, .c-submenu__link.is-active::after { color: #019DF4; } .c-submenu__link_primary { color: #019DF4; } .c-submenu__link_primary:hover { color: #50535A; } .c-submenu__link_arrow::after { display: none; } .c-submenu__paragraph, .c-sumenu-third-level__paragraph { display: block; color: #86888C; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 34px; /* 9 */ margin-left: 2.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 24px; /* 9 */ margin-right: 1.5rem; /* 9 */ } .c-megamenu__content-brands { display: grid; grid-template-columns: repeat(3, 1fr); /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 4px; /* 9 */ row-gap: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 26px; /* 9 */ padding-top: 1.625rem; /* 9 */ border-top: 1px solid #D3D4D3; list-style: none; } .c-megamenu__brand { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 40px; /* 9 */ max-height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 40px; /* 9 */ min-height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 6px; /* 9 */ padding: 0.375rem; /* 9 */ border: 1px solid #D3D4D3; border-radius: 4px; transition: all 0.2s ease; } .c-megamenu__brand:hover { border-color: #019DF4; } .c-megamenu__brand:hover .c-megamenu__brand-img { opacity: 0; } .c-megamenu__brand:hover .c-megamenu__brand-img_hover { opacity: 1; } .c-megamenu__brand-link { 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; width: 100%; height: 100%; } .c-megamenu__brand-link::before { color: #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 25px; /* 9 */ font-size: 1.5625rem; /* 9 */ } .c-megamenu__brand-link:hover { color: #019DF4; } .c-megamenu__brand-link:hover::before { color: #019DF4; } .c-megamenu__brand-link.glyph-motorola::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 33px; /* 9 */ font-size: 2.0625rem; /* 9 */ } .c-megamenu__brand-link.glyph-huawei::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ } .c-megamenu__brand-link.glyph-samsung::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 50px; /* 9 */ font-size: 3.125rem; /* 9 */ } .c-megamenu__brand-link.glyph-xiaomi::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ } .c-megamenu__brand-link.glyph-nokia::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 47px; /* 9 */ font-size: 2.9375rem; /* 9 */ } .c-megamenu__brand-link.glyph-alcatel::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 47px; /* 9 */ font-size: 2.9375rem; /* 9 */ } .c-megamenu__brand_size::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ } .c-megamenu__link { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: right; -ms-flex-pack: right; -webkit-justify-content: right; -moz-justify-content: right; justify-content: right; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ line-height: 1; text-align: right; color: #019DF4; } .c-megamenu__link::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ } @media only screen and (max-width: 1250px) { .c-megamenu { top: 0; right: -1000px; z-index: 200; height: 100%; padding-top: 0; background-color: #fff; box-shadow: none; border-radius: 0; opacity: 0; transform: none; } .is-open-megamenu .c-megamenu { top: 0; right: 0; width: 100%; opacity: 1; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .c-megamenu__header, .c-sumenu-third-level__header { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: -32px; /* 9 */ margin-left: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: -32px; /* 9 */ margin-right: -2rem; /* 9 */ } .c-megamenu__header-btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ color: #fff; line-height: 1; } .c-megamenu__header-btn:before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-submenu__link:before { display: none; } .c-submenu__link_arrow { position: relative; } .c-submenu__link_arrow::after { display: block; position: absolute; right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-submenu__paragraph { margin-left: 0; } } .c-sumenu-third-level { position: absolute; top: 0; left: 342px; z-index: -4; min-height: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 32px; /* 9 */ padding: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 48px; /* 9 */ padding-left: 3rem; /* 9 */ background-color: #fff; border-bottom-right-radius: 8px; border-top-right-radius: 8px; border-bottom-left-radius: 8px; opacity: 0; pointer-events: none; } .c-sumenu-third-level:before { content: ""; position: absolute; top: 10%; left: 12px; display: block; height: 80%; width: 1px; background-color: #D3D4D3; } .c-sumenu-third-level::after { content: ""; position: absolute; top: 0; right: 9px; bottom: 0; left: -343px; z-index: -3; height: 100%; background-color: #fff; border-bottom-left-radius: 8px; border-top-left-radius: 8px; } .is-open-submenu-third .c-sumenu-third-level { opacity: 1; pointer-events: visible; } .c-sumenu-third-level__list { list-style: none; } .c-sumenu-third-level__item { position: relative; } .c-sumenu-third-level__list_grid { display: grid; grid-template-columns: repeat(3, 1fr); /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } .c-sumenu-third-level__link { 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; width: max-content; } .c-sumenu-third-level__link::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 17px; /* 9 */ font-size: 1.0625rem; /* 9 */ } .c-sumenu-third-level__link::after { display: none; } .c-sumenu-third-level__link:hover { color: #019DF4; } .c-sumenu-third-level__link.is-active { color: #019DF4; } .c-sumenu-third-level__link.is-active::before { color: #019DF4; } @media only screen and (min-width: 1250px) { .c-submenu { max-height: 70vh; overflow: scroll; } .c-submenu::-webkit-scrollbar { /* solo oculta su visualizacion */ display: none; } .c-sumenu-third-level__wrap { max-height: 60vh; overflow: scroll; } .c-sumenu-third-level__wrap::-webkit-scrollbar { /* solo oculta su visualizacion */ display: none; } .c-sumenu-third-level__item-wrap .o-dropdown__content { max-height: 1000px; } .c-sumenu-third-level { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 50px; /* 9 */ padding-right: 3.125rem; /* 9 */ } .c-sumenu-third-level__paragraph { width: max-content; } } @media only screen and (max-width: 1250px) { .c-sumenu-third-level { left: auto; right: -1000px; z-index: 10; width: 100%; padding-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 32px; /* 9 */ padding-left: 2rem; /* 9 */ opacity: 1; border-radius: 0; transition: all 0.9s cubic-bezier(0.4, 0, 0.2, 1); } .c-sumenu-third-level::before { display: none; } .c-sumenu-third-level::after { display: none; } .is-open-submenu-third .c-sumenu-third-level { left: auto; right: 0; } .c-sumenu-third-level__link { position: relative; cursor: pointer; width: 100%; } .c-sumenu-third-level__link::before { display: none; } .c-sumenu-third-level__link::after { display: block; position: absolute; right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-sumenu-third-level__paragraph { margin-left: 0; } } .c-submenu-fourth-level__list { list-style-type: none; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 32px; /* 9 */ margin-left: 2rem; /* 9 */ } .c-submenu-fourth-level__item { margin-top: 0; } .c-submenu-fourth-level__link { display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #86888C; } @media only screen and (max-width: 1250px) { .c-sumenu-third-level__list_grid { 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; } .c-submenu-fourth-level__item { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } } @media only screen and (max-width: 768px) { .c-menu-top { background-color: transparent; } } .catalog-product-view #maincontent .breadcrumbs { font-size: 12px; font-family: "Roboto-Regular"; } .catalog-product-view #maincontent .breadcrumbs .items { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ list-style: none; } .catalog-product-view #maincontent .breadcrumbs .items .item { 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; } .catalog-product-view #maincontent .breadcrumbs .items .item::after { content: ""; } .catalog-product-view #maincontent .breadcrumbs .items .item:not(:last-of-type) { color: #4E4E51; } .catalog-product-view #maincontent .breadcrumbs .items .item:not(:last-of-type)::after { content: "/"; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 4px; /* 9 */ margin-right: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 4px; /* 9 */ margin-left: 0.25rem; /* 9 */ line-height: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ font-size: 12px; font-family: "Roboto-Regular"; } .catalog-product-view #maincontent .breadcrumbs .items .item:last-of-type strong { font-weight: 400; font-size: 12px; font-family: "Roboto-Regular"; } #maincontent .breadcrumbs { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin: 0 auto; padding: 0; color: #313235; /* Add shopping cart */ display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 768px) { #maincontent .breadcrumbs.mb-breadcrumbs { flex-direction: column-reverse; align-items: flex-start; } } #maincontent .breadcrumbs .breadcrumbs-color-strong { color: #000000; } #maincontent .breadcrumbs .items { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ list-style: none; } #maincontent .breadcrumbs .items .item { 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; } #maincontent .breadcrumbs .items .item::after { content: ""; } #maincontent .breadcrumbs .items .item:not(:last-of-type) { color: #4E4E51; } #maincontent .breadcrumbs .items .item:not(:last-of-type)::after { content: "/"; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 4px; /* 9 */ margin-right: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 4px; /* 9 */ margin-left: 0.25rem; /* 9 */ line-height: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } #maincontent .breadcrumbs .items .item:last-of-type strong { font-weight: 400; } #maincontent .breadcrumbs .items .item a:hover { text-decoration: underline; } #maincontent .breadcrumbs .crumb-shopping-cart { color: #019DF4; position: relative; } @media screen and (max-width: 768px) { #maincontent .breadcrumbs .crumb-shopping-cart.mb-shopping-cart { align-self: flex-end; } } #maincontent .breadcrumbs .crumb-shopping-cart a { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } #maincontent .breadcrumbs .crumb-shopping-cart a:after { content: ""; position: absolute; top: 5px; right: -7px; width: 10px; height: 10px; border-radius: 50%; background-color: #0B2739; } .c-breadcrumb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-breadcrumb__list { 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; list-style-type: none; overflow-x: auto; } .c-breadcrumb__item { color: #86888C; white-space: nowrap; } .c-breadcrumb__item::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 9px; /* 9 */ font-size: 0.5625rem; /* 9 */ color: #019DF4; } .c-breadcrumb__list, .c-breadcrumb__item { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ } .is-current { color: rgba(11, 39, 57, 0.9); } .c-resultlist.search-autocomplete { display: none; width: 100% !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 32px; /* 9 */ padding: 1rem 2rem; /* 9 */ background: #fff; box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25); z-index: 2; } .c-resultlist ul { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 374px; /* 9 */ max-height: 23.375rem; /* 9 */ list-style: none; overflow: hidden auto; } .c-resultlist ul::-webkit-scrollbar { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 6px; /* 9 */ width: 0.375rem; /* 9 */ } .c-resultlist ul::-webkit-scrollbar-thumb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ background-color: #CDD3DD; } .c-resultlist ul::-webkit-scrollbar-track { background: #fff; } .c-resultlist li { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px 24px; /* 9 */ padding: 0.5rem 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ color: #50535A; background: transparent; transition: all 0.2s ease-in; cursor: pointer; } .c-resultlist li:not(.c-resultlist li:last-of-type) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-resultlist li:hover { color: #019DF4; background: #EEEEEE; } @media (min-width: 1024px) { .c-resultlist.search-autocomplete { width: 421px !important; } } .c-card { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ transition: all 0.2s ease-in; } .c-card-grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ list-style: none; } .c-card__link { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 324px; /* 9 */ max-width: 20.25rem; /* 9 */ height: 100%; margin: 0 auto; border: 1px solid transparent; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 12px; /* 9 */ padding-top: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 12px; /* 9 */ padding-bottom: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ color: #313235; background-color: #fff; } .c-card__link:hover { border-color: #B6B7B7; } .c-card__schema { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ list-style: none; } .c-card__schema-color { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 20px; /* 9 */ width: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 20px; /* 9 */ height: 1.25rem; /* 9 */ border-radius: 50%; border: 1px solid #D3D4D3; cursor: pointer; } .c-card__tag { display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 16px 0 8px 0; /* 9 */ margin: 1rem 0 0.5rem 0; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 2px; /* 9 */ border-radius: 0.125rem; /* 9 */ /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 10px; /* 9 */ padding: 0 0.625rem; /* 9 */ font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #fff; background-color: #F28D15; } .c-card__photo .product-image-photo { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 152px; /* 9 */ max-width: 9.5rem; /* 9 */ height: auto; } .c-card__text, .c-card__name { font-weight: 400; } .c-card__name { font-weight: 300; display: block; display: -webkit-box; max-height: 64.8px; max-height: 4.05rem; overflow: hidden; line-height: 1.2; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; font-size: 18px; font-size: 1.125rem; } .c-card__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-card__text_sm { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 10px; /* 9 */ font-size: 0.625rem; /* 9 */ color: #50535A; } .c-card__dues { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ font-weight: 700; line-height: 1.2; } .c-card__price { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ } .c-card__price-previous { text-decoration: line-through; color: #86888C; margin-left: 5px; } .c_price_previus { justify-content: flex-start; display: flex; color: #86888C; } @media (max-width: 768px) { .c_price_previus { justify-content: center; } } .c-card-detail__price_from { color: #86888C; font-size: 14px; } .c-card__content { position: relative; } .c-card-grid__banner { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -moz-box-flex: 1; -moz-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; } .c-slider-products { position: relative; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ overflow: hidden; } .c-card-slide { height: auto; text-align: left; } .c-card-slide .c-card { height: 100%; } #blockBannerMovil { display: none; } @media (max-width: 552px) { #blockBannerMovil { display: block; } #blockBannerMovil div { width: 100% !important; } } @media (max-width: 719px) { .c-card-grid { margin-top: 10px; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 50vh); gap: 9px; list-style: none; } .c-card-grid .c-card:nth-child(-n+4) { display: flex; /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 0 auto 16px auto; /* 9 */ margin: 0 auto 1rem auto; /* 9 */ } .c-card-grid .c-card:nth-child(-n+4) .cat-card__name { font-size: 14px; } .c-card-grid .c-card:nth-child(-n+4) .c-card__price_eq { font-size: 16px; } .c-card-grid .c-card:nth-child(-n+4) .cat-card__photo { margin: 0 auto; flex: 0 0 75%; } .c-card-grid .c-card:nth-child(-n+4) .cat-card__content { flex-basis: 100% !important; margin-top: 10px !important; } .c-card-grid .c-card:nth-child(-n+4) .cat-card__link { display: contents; } .c-card-grid .c-card:nth-child(-n+4) .cat-card__tagEquipos { column-gap: 5px !important; } .c-card-grid .c-card:nth-child(n+5) { grid-column: span 2; display: flex; width: 100% !important; max-width: 100% !important; } .c-card-grid .c-card:nth-child(n+5) .cat-card__link { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: 100% !important; } .c-card-grid .c-card:nth-child(n+5) .card_link { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: 100% !important; gap: 13px !important; } .c-card { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 324px; /* 9 */ max-width: 20.25rem; /* 9 */ /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 0 auto 16px auto; /* 9 */ margin: 0 auto 1rem auto; /* 9 */ } .c-card-grid__banner { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .c-card__link { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px 16px; /* 9 */ padding: 0.75rem 1rem; /* 9 */ } .c-card__photo { -webkit-box-flex: 1; -webkit-flex: 1 40%; -moz-box-flex: 1; -moz-flex: 1 40%; -ms-flex: 1 40%; flex: 1 40%; } .c-card__content { -webkit-box-flex: 1; -webkit-flex: 1 60%; -moz-box-flex: 1; -moz-flex: 1 60%; -ms-flex: 1 60%; flex: 1 60%; } .c-card__schema { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } } @media (min-width: 720px) { .c-card-grid { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 30px; /* 9 */ column-gap: 1.875rem; /* 9 */ width: 100%; } .c-card__name { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 4px; /* 9 */ margin-bottom: 0.25rem; /* 9 */ } } @media (min-width: 720px) and (max-width: 1023px) { .c-card { -webkit-box-flex: 0; -webkit-flex: 0 1 47%; -moz-box-flex: 0; -moz-flex: 0 1 47%; -ms-flex: 0 1 47%; flex: 0 1 47%; max-width: 47%; } .c-card-slide .c-card { max-width: initial; } } @media (min-width: 1024px) { .c-slider-products { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 33px; /* 9 */ padding: 0 2.0625rem; /* 9 */ } .c-card { -webkit-box-flex: 1; -webkit-flex: 1 1 25%; -moz-box-flex: 1; -moz-flex: 1 1 25%; -ms-flex: 1 1 25%; flex: 1 1 25%; } .c-card__link { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 255px; /* 9 */ max-width: 15.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 20px; /* 9 */ padding-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ } .c-card__content { width: 100%; 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; } .c-card__tag { width: max-content; max-width: 100%; } .c-card__schema { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 12px 0; /* 9 */ margin: 0.75rem 0; /* 9 */ order: -7; } .c-card__name { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } } .product-info-main { background: #fff; } .c-card-detail__header { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 8px; /* 9 */ row-gap: 0.5rem; /* 9 */ } .c-card-detail__figure { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 100%; -moz-box-flex: 1; -moz-flex: 1 100%; -ms-flex: 1 100%; flex: 1 100%; -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ } .c-card-detail__figure-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 32px; /* 9 */ min-width: 2rem; /* 9 */ } .c-card-detail__figure-caption { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 2px; /* 9 */ row-gap: 0.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ line-height: 1; } .c-card-detail__title { line-height: 1; font-weight: 400; color: #0B2739; } .product-info-main .swatch-opt { 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: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ } .product-info-main .swatch-attribute-label, .product-info-main .c-card-detail__label { display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 12px; /* 9 */ margin-bottom: 0.75rem; /* 9 */ font-weight: 700; color: #313235; font-size: 16px; } .product-info-main .swatch-attribute { -webkit-box-flex: 1; -webkit-flex: 1 1 50%; -moz-box-flex: 1; -moz-flex: 1 1 50%; -ms-flex: 1 1 50%; flex: 1 1 50%; } .product-info-main .swatch-attribute.color { order: 2; } .product-info-main .swatch-attribute.color .swatch-attribute-selected-option { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ color: #B6B7B7; font-size: 16px; } .product-info-main .swatch-attribute.capacidad { order: 1; } .product-info-main .c-card__schema { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; margin-top: 0; } .c-card__schema-color::before { transition: all 0.2s ease-in; } .product-info-main .c-card__schema-color.selected { position: relative; pointer-events: none; } .product-info-main .c-card__schema-color.selected::before { content: ""; position: absolute; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -6px; /* 9 */ top: -0.375rem; /* 9 */ right: 0; bottom: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ left: -6px; /* 9 */ left: -0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 28px; /* 9 */ width: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 28px; /* 9 */ height: 1.75rem; /* 9 */ border: 1px solid #019DF4; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 50px; /* 9 */ border-radius: 3.125rem; /* 9 */ } .c-card-detail__price { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-card-detail__number { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 35px; /* 9 */ font-size: 2.1875rem; /* 9 */ font-weight: 400; line-height: 1; color: #313235; } @media (max-width: 739px) { .c-card-detail__number { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 31px; /* 9 */ font-size: 1.9375rem; /* 9 */ } } .c-card-detail__price-inner { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ } .c-card-detail__credit-cards { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 12px; /* 9 */ column-gap: 0.75rem; /* 9 */ list-style: none; } .c-card-detail__credit-card { 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: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 28px; /* 9 */ max-width: 1.75rem; /* 9 */ } .c-card-detail__img-card { width: 100%; } .c-card-detail__dues, .c-card-detail__options, .c-card-detail__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .c-card-detail__btn.u-hidden { position: absolute; } .c-card-detail__btn_margin-bottom0 { margin-bottom: 0; } .c-card-detail__dues-number { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; } .c-card-detail__dues-price { color: #313235; } .c-card-detail__options { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ list-style: none; } .c-card-detail__option { 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: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ line-height: 1; } .c-card-detail__option::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .c-card-detail__option_success { color: #499110; } .c-card-detail__option_success .c-card-detail__option-tag { font-weight: 700; } .c-card-detail__option_disabled { color: #B6B7B7; } .c-card-detail__option_disabled .c-card-detail__option-tag { text-decoration: line-through; } .c-card-detail__option-text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 4px; /* 9 */ margin-bottom: 0.25rem; /* 9 */ } .c-card-detail__info { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ color: inherit; } .c-card-detail__btn { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 287px; /* 9 */ max-width: 17.9375rem; /* 9 */ margin-right: auto; margin-top: 0; margin-left: auto; } .o-layout__detail-product { flex-wrap: initial !important; } @media (max-width: 739px) { .row.o-layout__detail-product { display: flex !important; flex-direction: column !important; } .o-layout__detail-product .product-info_media { width: 90%; margin-left: auto; margin-right: auto; } .c-card-detail { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ background-color: white; } .product-add-form { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ } .c-card-detail__caption { font-size: 14px; } .c-card-detail__header { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .c-card-detail__figure { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 5px 0 2px 0; /* 9 */ margin: 0.3125rem 0 0.125rem 0; /* 9 */ } .c-card-detail__header { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 16px; /* 9 */ padding: 0 1rem; /* 9 */ display: flex; } } @media (min-width: 740px) { .o-layout__detail-product { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin: 0 auto; } .product-info-main { width: 100% !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 17px; /* 9 */ border-radius: 1.0625rem; /* 9 */ float: none !important; } .c-card-detail__header { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ } .c-card-detail__caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 295px; /* 9 */ max-width: 18.4375rem; /* 9 */ } .c-card-detail__figure { -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; } .o-layout__detail-product .c-card-detail__title { margin-bottom: 0; } } @media (max-width: 1023px) { .c-card-detail__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } .product-options-wrapper .swatch-attribute.capacidad { position: relative; order: 1; /*.swatch-attribute-options { position: absolute; top: 100%; bottom: auto; width: 100%; max-height: 0; @include px-to-rem(margin-top, $gutter); @include px-to-rem(padding, 0 10px 4px 10px); @include px-to-rem(border-radius, 4px); background: $c-neutro; box-shadow: 0px 4px 4px rgb(0 0 0 / 20%); transition: all 0.2s ease-in-out; opacity: 0; visibility: hidden; }*/ } .product-options-wrapper .swatch-attribute.capacidad .swatch-attribute-selected-option { position: relative; 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 2px 16px; /* 9 */ padding: 0.125rem 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 50px; /* 9 */ border-radius: 3.125rem; /* 9 */ border: 1px solid #D3D4D3; font-weight: 700; } .product-options-wrapper .swatch-attribute.capacidad .swatch-attribute-selected-option::before { content: ""; display: block; order: 1; font-family: "ico-movistar"; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #019DF4; line-height: 1; background-color: #fff; transition: all 0.2s ease-in-out; } .product-options-wrapper .swatch-attribute.capacidad .swatch-option.text { border-bottom: 1px solid #EEEEEE; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 8px 0; /* 9 */ padding: 0.5rem 0; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; transition: all 0.2s ease-in-out; } .product-options-wrapper .swatch-attribute.capacidad .swatch-option.text.selected { color: #019DF4; } .product-options-wrapper .swatch-attribute.capacidad.is-dropdown-capacity-active .swatch-attribute-selected-option::before { transform: rotate(180deg); } .product-options-wrapper .swatch-attribute.capacidad.is-dropdown-capacity-active .swatch-attribute-options { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 1000px; /* 9 */ max-height: 62.5rem; /* 9 */ opacity: 1; visibility: visible; } } @media (min-width: 740px) and (max-width: 1023px) { .product-info-main { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px 16px; /* 9 */ padding: 1.5rem 1rem; /* 9 */ } } @media (min-width: 1024px) { .product-info-main { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 40px 50px; /* 9 */ padding: 2.5rem 3.125rem; /* 9 */ } .c-card-detail__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ } .c-card-detail__shipping { 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: 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; } .c-card-detail__options { position: relative; } .c-card-detail__options::before { content: ""; position: absolute; top: 0; right: 32px; bottom: 0; left: 0; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 1px; /* 9 */ width: 0.0625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 44px; /* 9 */ height: 2.75rem; /* 9 */ margin: auto; background: #D3D4D3; } .c-card-detail__option { -webkit-box-flex: 1; -webkit-flex: 1 1 50%; -moz-box-flex: 1; -moz-flex: 1 1 50%; -ms-flex: 1 1 50%; flex: 1 1 50%; -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .product-options-wrapper .swatch-attribute.capacidad { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 125px; /* 9 */ max-width: 7.8125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ border-right: 1px solid #D3D4D3; } .product-options-wrapper .swatch-attribute.capacidad .swatch-attribute-selected-option { display: none; } .product-options-wrapper .swatch-attribute.capacidad .swatch-attribute-options { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 8px; /* 9 */ row-gap: 0.5rem; /* 9 */ } .product-options-wrapper .swatch-attribute.capacidad .swatch-option.text { border: 1px solid #86888C; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 50px; /* 9 */ border-radius: 3.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 4px 12px; /* 9 */ padding: 0.25rem 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ line-height: 1; color: #50535A; transition: all 0.2s ease-in-out; cursor: pointer; } .product-options-wrapper .swatch-attribute.capacidad .swatch-option.text.selected { border-color: #019DF4; color: #019DF4; pointer-events: none; } } .swatch-attribute:not(.product-options-wrapper .swatch-attribute).capacidad { display: none; background-color: red; } @media only screen and (max-width: 500px) { .c-card-detail__options { justify-content: center; } } .product-options-wrapper .swatch-attribute.capacidad .swatch-attribute-selected-option { display: none !important; } .product-options-wrapper .swatch-attribute.capacidad .swatch-option.text { border: 1px solid #86888C; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 50px; /* 9 */ border-radius: 3.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 4px 12px; /* 9 */ padding: 0.25rem 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ line-height: 1; color: #50535A; transition: all 0.2s ease-in-out; cursor: pointer; } .product-options-wrapper .swatch-attribute.capacidad .swatch-option.text.selected { border-color: #019DF4; color: #019DF4; pointer-events: none; max-width: 70px; text-align: center; } .c-card-zig-zag-wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 40px 0; /* 9 */ margin: 2.5rem 0; /* 9 */ list-style: none; } .c-card-zig-zag__img { width: 100%; height: 100%; aspect-ratio: 1/1; object-fit: cover; } .c-card-zig-zag__caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px 16px; /* 9 */ padding: 1.5rem 1rem; /* 9 */ text-align: center; } .c-card-zig-zag__title { font-weight: 100; line-height: 1; color: #0B2739; } .c-card-zig-zag__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media screen and (max-width: 739px) { .c-card-zig-zag { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-card-zig-zag__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 12px; /* 9 */ margin-bottom: 0.75rem; /* 9 */ } } /*------------------------------------*\ Media querys intermediates \*------------------------------------*/ @media screen and (min-width: 740px) { .c-card-zig-zag { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } .c-card-zig-zag:nth-child(even) { -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; } .c-card-zig-zag__figure { -webkit-box-flex: 1; -webkit-flex: 1 1 60%; -moz-box-flex: 1; -moz-flex: 1 1 60%; -ms-flex: 1 1 60%; flex: 1 1 60%; } .c-card-zig-zag__caption { -webkit-box-flex: flex; -webkit-flex: flex 1 1 40%; -moz-box-flex: flex; -moz-flex: flex 1 1 40%; -ms-flex: flex 1 1 40%; flex: flex 1 1 40%; } .c-card-zig-zag__caption { text-align: left; } .c-card-zig-zag__title, .c-card-zig-zag__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 210px; /* 9 */ max-width: 13.125rem; /* 9 */ } .c-card-zig-zag__title .c-card-zig-zag:nth-child(even) .c-card-zig-zag__title .c-card-zig-zag, .c-card-zig-zag__title .c-card-zig-zag:nth-child(even) .c-card-zig-zag__text .c-card-zig-zag, .c-card-zig-zag__text .c-card-zig-zag:nth-child(even) .c-card-zig-zag__title .c-card-zig-zag, .c-card-zig-zag__text .c-card-zig-zag:nth-child(even) .c-card-zig-zag__text .c-card-zig-zag { margin-left: auto; } .c-card-zig-zag__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 38px; /* 9 */ font-size: 2.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } } /*------------------------------------*\ Media querys desktop \*------------------------------------*/ @media screen and (min-width: 1024px) { .c-card-zig-zag { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 500px; /* 9 */ height: 31.25rem; /* 9 */ } .c-card-zig-zag__caption, .c-card-zig-zag__figure { -webkit-box-flex: 1; -webkit-flex: 1 1 50%; -moz-box-flex: 1; -moz-flex: 1 1 50%; -ms-flex: 1 1 50%; flex: 1 1 50%; } .c-card-zig-zag__figure { height: 100%; } .c-card-zig-zag__title, .c-card-zig-zag__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 340px; /* 9 */ max-width: 21.25rem; /* 9 */ margin-top: 0; margin-right: auto; margin-left: auto; } } .c-card-ico { height: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 200px; /* 9 */ max-width: 12.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 160px; /* 9 */ min-width: 10rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px 20px; /* 9 */ padding: 0.75rem 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 16px; /* 9 */ border-radius: 1rem; /* 9 */ background-color: #fff; } .c-card-ico__ico { display: block; } .c-card-ico__ico::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ color: #019DF4; } .c-card-ico__title { margin: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ font-weight: 400; line-height: 1; color: #0B2739; } .c-card-ico__value { color: #50535A; display: block; display: -webkit-box; max-height: 33.6px; max-height: 2.1rem; overflow: hidden; line-height: 1.2; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; font-size: 14px; font-size: 0.875rem; } @media screen and (max-width: 1023px) { .c-card-ico { 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; } } @media screen and (min-width: 1024px) { .c-card-ico-wrapper { -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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } .c-card-ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 160px; /* 9 */ max-width: 10rem; /* 9 */ margin-right: 0 !important; text-align: center; } .c-card-ico__ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-card-ico__value { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 160px; /* 9 */ max-width: 10rem; /* 9 */ } } .checkout-index-index .c-header-wrap, .checkout-lineas-index .c-header-wrap, .checkout-opcionpago-index .c-header-wrap { height: auto; position: relative; z-index: 9 !important; } .c-card-checkout-cta { 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: 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; -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -moz-box-flex: 1; -moz-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } .c-card-checkout-cta__link { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ text-decoration: underline; color: #50535A; } .c-card-checkout-cta__link::before { display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-card-checkout-cta__btn { 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; -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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px 16px; /* 9 */ padding: 0.5rem 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ font-weight: 300; color: #313235; background: #fff; } .c-card-checkout-cta__btn::before { color: #019DF4; transition: all 0.2s ease-in-out; } .c-card-checkout-cta__btn.is-summary-show { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-card-checkout-cta__btn.is-summary-show::before { transform: rotate(180deg); } .c-card-summary { max-height: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ opacity: 0; visibility: hidden; transition: all 0.2s ease-in-out; background: #fff; } .c-card-summary.is-summary-show { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 32px 40px 32px; /* 9 */ padding: 1rem 2rem 2.5rem 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 1000px; /* 9 */ max-height: 62.5rem; /* 9 */ opacity: 1; visibility: visible; } .c-card-summary .title { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ font-weight: 300; } .c-card-summary .items-in-cart .title { display: none; } .c-card-summary .minicart-items { list-style: none; } .c-card-summary .product-item .product { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ color: #313235; } .c-card-summary .product-item .product .product-image-container { width: auto !important; height: auto !important; } .c-card-summary .product-item .product .product-image-container img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 84px; /* 9 */ max-width: 5.25rem; /* 9 */ height: auto; aspect-ratio: 1/1; } .c-card-summary .product-item-details .product-item-name { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-card-summary .product-item-details .details-qty, .c-card-summary .product-item-details .subtotal { display: none; } .c-card-summary .product.options .toggle { display: none; } .c-card-summary .product.options .content { display: block !important; } .c-card-summary .product.options .content .subtitle { display: none; } .c-card-summary .product.options .content .item-options { color: #50535A; display: flex; flex-direction: column-reverse; } .c-card-summary .product.options .content .item-options .label { display: none; } .c-card-summary .product.options .content .item-options .values { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-card-summary_padding16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ } .c-card-summary_margin-top { margin-top: 0; } .c-card-summary_space-bottom { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 1px; /* 9 */ padding-bottom: 0.0625rem; /* 9 */ } .c-card-summary__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ font-weight: 300; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ color: #313235; } .c-card-summary__title_ico { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } .c-card-summary__title_ico::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-family: 17px; /* 9 */ font-family: 1.0625rem; /* 9 */ color: #019DF4; } .c-card-summary__title_border { border-bottom: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 24px; /* 9 */ padding-bottom: 1.5rem; /* 9 */ } .c-card-summary__box { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ border-bottom: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 24px; /* 9 */ padding-bottom: 1.5rem; /* 9 */ } .c-card-summary__box_border-bottom { border-bottom: none; } .c-card-summary__amount { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ color: #313235; } .c-card-summary__amount h4 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .c-card-summary__amount_before { font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .c-card-summary__amount_before h4 { font-weight: 400; } .c-card-summary__amount_blue { color: #019DF4; } .c-card-summary__amount_indent { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 24px; /* 9 */ margin-right: 1.5rem; /* 9 */ } .c-card-summary__amount-trough { text-decoration: line-through; } .c-card-summary__details { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ list-style: none; } .c-card-summary__total { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ text-transform: uppercase; } .c-card-summary__total_margin0 { margin: 0; } .c-card-summary__total_margin-bottom0 { margin-bottom: 0; } .c-card-summary__message { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 14px; /* 9 */ line-height: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ color: #313235; gap: 1rem; } .c-card-summary__message::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: #F28D15; } .c-card-summary__footer { 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-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 8px; /* 9 */ row-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } .c-card-summary__subtitle { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ font-weight: 400; } .c-card-summary__subtitle::after { color: #019DF4; } .c-card-summary__table { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-card-summary__table-head { font-weight: 700; } .c-card-summary__table-row { vertical-align: baseline; } .c-card-summary__table-cell { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 100px; /* 9 */ max-width: 6.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ } .content_total { width: 100%; } @media screen and (max-width: 599px) { .c-card-summary__wrap { width: 100%; } } @media screen and (max-width: 739px) { .c-card-checkout-cta { order: 1; width: 100%; } .c-card-checkout-cta__btn { flex: 1 1 100%; } } @media screen and (min-width: 600px) { .c-card-summary { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 350px; /* 9 */ max-width: 21.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 350px; /* 9 */ min-width: 21.875rem; /* 9 */ } .content_total .c-card-summary { max-width: 100%; width: 100%; } .content_total .c-card-summary.is-summary-show { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 56px; /* 9 */ max-height: 3.5rem; /* 9 */ } } @media screen and (min-width: 740px) { .c-card-checkout-cta { order: 1; width: 90%; max-width: 1125px; margin: 0 auto; } .c-card-checkout-cta__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 345px; /* 9 */ min-width: 21.5625rem; /* 9 */ } } @media screen and (max-width: 1023px) { .c-card-summary { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-card-summary.is-summary-show { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } } @media screen and (min-width: 1023px) { .c-card-checkout-cta { order: initial; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-card-checkout-cta__btn { display: none; } .c-card-summary { max-height: max-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 32px 40px 32px; /* 9 */ padding: 1rem 2rem 2.5rem 2rem; /* 9 */ visibility: visible; opacity: 1; } .c-card-summary_margin-top { margin-top: 0; } } .pospagov-portabilidad-identidad section#summaryBuys, .pospagov-portabilidad-sim section#summaryBuys, .pospagov-portabilidad-contrato section#summaryBuys { margin: 20px 0; } .pospagov-portabilidad-identidad .markResumen, .pospagov-portabilidad-sim .markResumen, .pospagov-portabilidad-contrato .markResumen { font-style: normal; font-weight: 700; font-size: 12px; line-height: 12px; color: #424B5A; } .pospagov-portabilidad-identidad .spanResumen, .pospagov-portabilidad-sim .spanResumen, .pospagov-portabilidad-contrato .spanResumen { font-size: 12px; color: #424B5A; } .pospagov-portabilidad-identidad .dflex-bteween, .pospagov-portabilidad-sim .dflex-bteween, .pospagov-portabilidad-contrato .dflex-bteween { display: flex; justify-content: space-between; } .pospagov-portabilidad-identidad #summaryBuys-movil, .pospagov-portabilidad-sim #summaryBuys-movil, .pospagov-portabilidad-contrato #summaryBuys-movil { display: none; } .pospagov-portabilidad-identidad .c-card-summary, .pospagov-portabilidad-sim .c-card-summary, .pospagov-portabilidad-contrato .c-card-summary { padding: 1rem 2rem 0.2rem; } @media only screen and (min-width: 740px) { .pospagov-portabilidad-identidad #summaryBuys-movil, .pospagov-portabilidad-sim #summaryBuys-movil, .pospagov-portabilidad-contrato #summaryBuys-movil { display: none; } } @media only screen and (max-width: 740px) { .pospagov-portabilidad-identidad #summaryBuys, .pospagov-portabilidad-sim #summaryBuys, .pospagov-portabilidad-contrato #summaryBuys { display: none; } .pospagov-portabilidad-identidad #summaryBuys-movil, .pospagov-portabilidad-sim #summaryBuys-movil, .pospagov-portabilidad-contrato #summaryBuys-movil { display: block; } .pospagov-portabilidad-identidad #checkout-summary > .c-card-summary, .pospagov-portabilidad-sim #checkout-summary > .c-card-summary, .pospagov-portabilidad-contrato #checkout-summary > .c-card-summary { position: fixed; top: 100%; left: 50%; transform: translate(-50%, -110%); width: 100%; z-index: 98; box-shadow: 0px 0px 100px #00000029; border-radius: 15px 15px 0 0; background-color: #019DF4; } .pospagov-portabilidad-identidad .c-card-checkout-cta > .c-card-checkout-cta__btn.js-summary-btn, .pospagov-portabilidad-sim .c-card-checkout-cta > .c-card-checkout-cta__btn.js-summary-btn, .pospagov-portabilidad-contrato .c-card-checkout-cta > .c-card-checkout-cta__btn.js-summary-btn { position: fixed; top: 100%; left: 0; transform: translateY(-100%); width: 100%; box-shadow: 0px 0px 20px #00000069; z-index: 99; border-radius: 4px 4px 0 0 !important; background-color: #019DF4; color: #fff; } .pospagov-portabilidad-identidad .c-card-checkout-cta > .c-card-checkout-cta__btn.js-summary-btn .c-form__icon_select::before, .pospagov-portabilidad-sim .c-card-checkout-cta > .c-card-checkout-cta__btn.js-summary-btn .c-form__icon_select::before, .pospagov-portabilidad-contrato .c-card-checkout-cta > .c-card-checkout-cta__btn.js-summary-btn .c-form__icon_select::before { position: static; background-color: #fff; color: #313235; border-radius: 100%; padding: 8px !important; } .pospagov-portabilidad-identidad .c-card-checkout-cta__btn.js-summary-btn.is-summary-show, .pospagov-portabilidad-sim .c-card-checkout-cta__btn.js-summary-btn.is-summary-show, .pospagov-portabilidad-contrato .c-card-checkout-cta__btn.js-summary-btn.is-summary-show { margin-bottom: 100%; } .pospagov-portabilidad-identidad .c-card-summary__amount, .pospagov-portabilidad-identidad .c-card-summary__free-shipping, .pospagov-portabilidad-identidad .c-card-summary__title, .pospagov-portabilidad-identidad .markResumen, .pospagov-portabilidad-identidad .spanResumen, .pospagov-portabilidad-identidad .c-card-summary__details .li-details, .pospagov-portabilidad-sim .c-card-summary__amount, .pospagov-portabilidad-sim .c-card-summary__free-shipping, .pospagov-portabilidad-sim .c-card-summary__title, .pospagov-portabilidad-sim .markResumen, .pospagov-portabilidad-sim .spanResumen, .pospagov-portabilidad-sim .c-card-summary__details .li-details, .pospagov-portabilidad-contrato .c-card-summary__amount, .pospagov-portabilidad-contrato .c-card-summary__free-shipping, .pospagov-portabilidad-contrato .c-card-summary__title, .pospagov-portabilidad-contrato .markResumen, .pospagov-portabilidad-contrato .spanResumen, .pospagov-portabilidad-contrato .c-card-summary__details .li-details { color: #fff !important; } } .c-filter.c-filter__category { color: #0B2739; background: #fff; padding: 1.5rem; border-radius: 6px; } .toolbar-container { width: 90% !important; max-width: 1141px; margin: 0 auto; margin-top: 1rem; align-items: center; } @media (max-width: 768px) { .toolbar-container { display: block !important; width: 100% !important; max-width: 100vw; margin-top: 1rem; } } .inverted-items { display: flex; flex-direction: row-reverse; } .toolbar.toolbar-products { 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: 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 30px; /* 9 */ column-gap: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 10px; /* 9 */ row-gap: 0.625rem; /* 9 */ } .c-toolbar__box { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 8px; /* 9 */ padding-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px 16px; /* 9 */ padding: 0.5rem 1rem; /* 9 */ border: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; background-color: #fff; } .c-toolbar__box_bg { background-color: transparent; border: none; } .c-toolbar__box_margin8 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ } .c-toolbar__cta-filter::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 20px; /* 9 */ margin-right: 1.25rem; /* 9 */ } .c-toolbar__sorter { position: relative; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ overflow: hidden; } .c-toolbar__sorter::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 47px; /* 9 */ width: 2.9375rem; /* 9 */ height: 100%; background: #fff; } .c-toolbar__sorter::after { z-index: 1; } .c-toolbar__sorter-options { width: 100%; border: 1px solid white; font-family: inherit; color: inherit; cursor: pointer; background: #fff; } .c-filter__list { border-top: 1px solid #EEEEEE; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 24px 0; /* 9 */ padding: 1.5rem 0; /* 9 */ } .c-filter__list-content { /* 3 */ /* 3 */ /* 5 */ /* 5 */ padding-left: 0; /* 8 */ } .c-filter__item { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ text-decoration: underline; color: #0B2739; } .c-filter__item:hover { color: #019DF4; text-decoration: underline; } .c-filter__current { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .c-filter__options { display: flex; flex-direction: column; } .c-filter__options > dl:nth-child(4) { order: 2; } .c-filter__options > dl:nth-child(5) { order: 3; } .c-filter__options > dl:nth-child(5) dd { padding: 0; } .c-filter__options > dl:nth-child(6) { order: 1; } @media screen and (max-width: 552px) { #blockBannerLateralFiltro { display: none; } .c-filter.c-filter__category { color: #0B2739; background: #EEEEEE; padding: 1rem; border-radius: 12px; } .c-filter__options > dl:nth-child(1) { order: 0; } .c-filter__options > dl:nth-child(3) { order: 2; } .c-filter__options > dl:nth-child(2) { order: 3; } .c-filter__options > dl:nth-child(4) { order: 4; } .c-filter__options > dl:nth-child(5) { order: 9; } .c-filter__options > div { order: 2; } .c-filter__options > dl:nth-child(6) { order: 5; } .c-filter__options > dl:nth-child(7) { order: 1; } } .c-filter__options-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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px 0px; /* 9 */ padding: 0.75rem 0rem; /* 9 */ transition: all 0.5s ease-in-out; } .c-filter__options-title::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #1c0d02; } .is-dropdown-active .c-filter__options-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ font-weight: bold; } .c-filter__items { list-style-type: none; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .c-filter__item-active { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-filter__item-active::last-of-type { margin-bottom: 0; } .c-filter__wrap-value { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ width: fit-content; padding: 3px 16px; border: 1px solid #019DF4; border-radius: 20px; } .c-filter__label { display: none; } .c-filter__value { color: #019DF4; font-weight: 700; } .c-filter__remove-btn::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ color: #019DF4; font-weight: 700; } .c-filter__clear-btn { padding: 8px 16px; background-color: #0B2739; color: #fff; border-radius: 60px; } .c-filter__clear-btn::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ color: #fff; font-weight: 700; } .c-filter__cta { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-toolbar__amount { color: #50535A; } .products.wrapper ~ .toolbar .limiter.u-hidden { display: none; } @media only screen and (max-width: 1023px) { .c-toolbar__box { -webkit-box-flex: 1; -webkit-flex: 1 1 30%; -moz-box-flex: 1; -moz-flex: 1 1 30%; -ms-flex: 1 1 30%; flex: 1 1 30%; } .c-toolbar__amount { -webkit-box-flex: flex; -webkit-flex: flex 1 1 100%; -moz-box-flex: flex; -moz-flex: flex 1 1 100%; -ms-flex: flex 1 1 100%; flex: flex 1 1 100%; order: 3; } .page-layout-2columns-left #maincontent .sidebar.sidebar-main.sidebar.sidebar-main { width: 100%; } .sidebar.sidebar-main { position: fixed; bottom: -100%; left: 0; right: 0; height: 100%; z-index: 9; transition: all 0.3s ease-in-out; } .is-filters-active .sidebar.sidebar-main { bottom: 0; background-color: #0B273998; } body.is-filters-active { overflow: hidden; } .c-filter { overflow: scroll; height: 70%; width: 95%; margin: 70px auto; background-color: #fff; } .c-filter__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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 14px 40px; /* 9 */ padding: 0.875rem 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ color: #fff; background-color: #019DF4; } .c-filter__close { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ font-weight: 400; line-height: 1; color: #000; } .c-filter__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px 40px; /* 9 */ padding: 1.5rem 2.5rem; /* 9 */ } } @media only screen and (min-width: 1024px) { .c-toolbar__cta-filter { display: none; } .c-toolbar__sorter { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 170px; /* 9 */ min-width: 10.625rem; /* 9 */ } .page-layout-2columns-left #maincontent .sidebar.sidebar-main.sidebar.sidebar-main { height: max-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ } .c-filter__title { display: none; } .c-filter__close { display: none; } .filter-options-content .items { list-style: none; } .c-filter__list:first-of-type { padding-top: 0; border-top-color: transparent; } .c-filter__list:last-of-type { padding-bottom: 0; } } .c-list-ico { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 70px; /* 9 */ row-gap: 4.375rem; /* 9 */ } .c-list-ico__item { 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; color: #6B6B6B; } .c-list-ico__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 230px; /* 9 */ max-width: 14.375rem; /* 9 */ text-align: center; } .c-list-ico__title { 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-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .c-list-ico__title::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 22px; /* 9 */ margin-bottom: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 55px; /* 9 */ font-size: 3.4375rem; /* 9 */ color: #019DF4; } .c-list-ico__text { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 16px; /* 9 */ padding: 0 1rem; /* 9 */ } .c-card-grid { width: 100%; } @media (max-width: 719px) { .c-list-ico { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 720px) { .c-list-ico { -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: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; text-align: center; list-style: none; } .c-list-ico__item { -webkit-box-flex: 1; -webkit-flex: 1 1 45%; -moz-box-flex: 1; -moz-flex: 1 1 45%; -ms-flex: 1 1 45%; flex: 1 1 45%; } } @media (min-width: 1023px) { .c-list-ico__item { -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; } } .c-list-links { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 80px; /* 9 */ margin-bottom: 5rem; /* 9 */ color: #50535A; } .c-list-links__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ line-height: 1; text-align: center; } .c-list-links__nav { 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-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .c-list-links__link { display: inline; } .c-list-links__link::before { display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media (max-width: 739px) { .c-list-links { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ } .c-list-links__nav { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 32px; /* 9 */ row-gap: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } .c-list-links__link { -webkit-box-flex: 1; -webkit-flex: 1 1 45%; -moz-box-flex: 1; -moz-flex: 1 1 45%; -ms-flex: 1 1 45%; flex: 1 1 45%; } } /*------------------------------------*\ Media querys tablet - desktop \*------------------------------------*/ @media (min-width: 740px) { .c-list-links__nav { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } } .c-tabs_new { background-color: white; border-radius: 8px; padding: 8px; margin-bottom: 1rem; } .is-open .search-tabs { position: relative; z-index: -99; } .c-tabs__search { position: relative; } .c-tabs__input { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px 12px 12px 48px; /* 9 */ padding: 0.75rem 0.75rem 0.75rem 3rem; /* 9 */ font-family: "Telefonica", sans-serif; } .c-tabs__input_new { width: 100%; border: 2px solid #737578; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px 12px 12px 48px; /* 9 */ padding: 0.75rem 0.75rem 0.75rem 3rem; /* 9 */ font-family: "Telefonica", sans-serif; color: #313235; background: white; } .c-tabs__input_new::placeholder { color: #313235; } #search::placeholder { color: #737578; opacity: 1; } .c-tabs__nav { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; text-align: center; flex: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 5px; /* 9 */ gap: 0.3125rem; /* 9 */ -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .c-tabs__field { position: relative; max-width: 421px; } .c-tabs__field::before { position: absolute; top: 0; bottom: 0; left: 0; height: max-content; /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: auto 0 auto 12px; /* 9 */ margin: auto 0 auto 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ color: #0B2739; } .c-tabs__link { 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: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-box-flex: 1; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 6px; /* 9 */ border-radius: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: 400; text-decoration: none; line-height: 1.2; color: #313235; transition: all 0.3s ease-in; background-color: white; list-style-type: none; padding: 0; height: 50px; border: 1px solid #dddddd; width: 160px; } .c-tabs__link > a { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; } .c-tabs__link.u-hidden { display: none; } .c-tabs__link::before { content: ""; position: absolute; display: block; margin: auto 0; border-right: 1px solid rgba(11, 39, 57, 0.3); } .c-tabs__link:last-of-type::before { border: none; } .c-tabs__link.no-hover:hover { background-color: transparent; color: #fff; } .c-tabs__link_active { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: white; background: #0b2739; height: 50px; border-radius: 6px; font-weight: 700; } .c-tabs__link_active::before { border: none; } .c-tabs__link_with { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 140px; /* 9 */ max-width: 8.75rem; /* 9 */ } .c-tabs__text { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } @media (max-width: 768px) { .c-tabs__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } } .c-tabs__subtitle { font-weight: 300; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ margin-top: 2%; } .c-tabs-content__actions { 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: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; line-height: 1; } .c-tabs-content__action { position: relative; -webkit-box-flex: 0; -webkit-flex: 0 1 50%; -moz-box-flex: 0; -moz-flex: 0 1 50%; -ms-flex: 0 1 50%; flex: 0 1 50%; display: block; border-bottom: 2px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 8px 0; /* 9 */ padding: 0.5rem 0; /* 9 */ font-weight: 700; color: #86888C; text-align: center; transition: all 0.2s ease-in-out; } .c-tabs-content__action.is-tab-active, .c-tabs-content__action.ui-state-active { border-color: #019DF4; color: #313235; } .c-tabs-content__wrap { background: #EEEEEE; } .c-tabs-content__inner { opacity: 1; } .is-content-tab-hide { position: absolute; top: 100%; opacity: 0; visibility: hidden; } .c-tabs-content__list { 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: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ list-style: none; line-height: 1.2; } .c-tabs-content__item { 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: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; -webkit-box-flex: 1; -webkit-flex: 1 50%; -moz-box-flex: 1; -moz-flex: 1 50%; -ms-flex: 1 50%; flex: 1 50%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ color: #50535A; } .c-tabs-content__ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ color: #019DF4; } .c-tabs-content__link { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ text-align: center; } .c-tabs-content__brands { text-align: center; } .c-tabs-content__brands-sm { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 243px; /* 9 */ max-width: 15.1875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 28px; /* 9 */ min-height: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-tabs-content__brands-xl { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 285px; /* 9 */ max-width: 17.8125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 37px; /* 9 */ min-height: 2.3125rem; /* 9 */ } @media (max-width: 739px) { .c-tabs-content__radio:checked + .c-tabs-content__action { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } @media (max-width: 1023px) { .c-tabs-content__actions { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .c-tabs-content__wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px 11px; /* 9 */ padding: 1.5rem 0.6875rem; /* 9 */ } .c-tabs-content__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } } @media (min-width: 1024px) { .c-tabs-content__action { top: 2px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 370px; /* 9 */ max-width: 23.125rem; /* 9 */ } .c-tabs-content__actions_border { justify-content: center; border-bottom: 2px solid #D3D4D3; } .c-tabs-content__wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px; /* 9 */ padding: 1.5rem; /* 9 */ } .c-tabs-content__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-tabs-content__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 4px; /* 9 */ margin-bottom: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-tabs-content__action_bottom { padding-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } } .banner { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .banner .swiper { width: 100%; position: relative; overflow: hidden; } .c-banner-intro { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ width: 100%; color: #fff; background: linear-gradient(43.34deg, #00a6f8 13.77%, #01acfc 41.86%, #01a5f8 51.33%, #019df4 56.48%); overflow: hidden; } .c-banner-intro__picture { -webkit-align-self: flex-end; -moz-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; } .c-banner-intro__img { width: 100%; height: 100%; } .c-banner-intro__title, .c-banner-intro__text { line-height: 1.2; } .c-banner-intro__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-banner-intro__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 208px; /* 9 */ min-width: 13rem; /* 9 */ transition: all 0.4s ease-in; } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media screen and (max-width: 460px) { .c-banner-intro__btn { min-width: fit-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } } @media screen and (max-width: 739px) { .c-banner-intro__picture { -webkit-box-flex: 1; -webkit-flex: 1 1 45%; -moz-box-flex: 1; -moz-flex: 1 1 45%; -ms-flex: 1 1 45%; flex: 1 1 45%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ height: auto; } .c-banner-intro__header { -webkit-box-flex: 1; -webkit-flex: 1 1 55%; -moz-box-flex: 1; -moz-flex: 1 1 55%; -ms-flex: 1 1 55%; flex: 1 1 55%; } .c-banner-intro__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .c-banner-intro__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 32px; /* 9 */ padding-right: 2rem; /* 9 */ font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } /*------------------------------------*\ Media querys intermediates \*------------------------------------*/ @media screen and (min-width: 739px) { .c-banner-intro { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 24px; /* 9 */ padding-left: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 18px; /* 9 */ column-gap: 1.125rem; /* 9 */ } .c-banner-intro__picture, .c-banner-intro__header { -webkit-box-flex: 1; -webkit-flex: 1 1 50%; -moz-box-flex: 1; -moz-flex: 1 1 50%; -ms-flex: 1 1 50%; flex: 1 1 50%; } .c-banner-intro__picture { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .c-banner-intro__title, .c-banner-intro__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-banner-intro__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } .c-banner-intro__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 266px; /* 9 */ max-width: 16.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } } /*------------------------------------*\ Media querys desktop \*------------------------------------*/ @media screen and (min-width: 1023px) { .c-banner-intro { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 40px; /* 9 */ padding-right: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 40px; /* 9 */ padding-left: 2.5rem; /* 9 */ } .c-banner-intro__picture { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 300px; /* 9 */ max-width: 18.75rem; /* 9 */ } .c-banner-intro__header { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; -webkit-justify-content: space-evenly; -moz-justify-content: space-evenly; justify-content: space-evenly; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 18px; /* 9 */ column-gap: 1.125rem; /* 9 */ } .c-banner-intro__title { margin-bottom: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } .c-banner-intro__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 400px; /* 9 */ max-width: 25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } } .c-banner-grid { display: block; min-width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ overflow: hidden; } .c-banner-grid_border-initial { border-radius: 0; } .c-banner-top { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ } .c-banner-top__picture { display: block; height: 100%; width: 100%; } .c-banner-top__file { width: inherit; height: inherit; object-fit: cover; aspect-ratio: 2.17/1; } .c-banner-top__caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin-left: auto; margin-right: auto; } .c-banner-top__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ font-weight: 400; color: #0B2739; } .c-banner-top__text { color: #50535A; } @media only screen and (max-width: 1023px) { .c-banner-top__header { text-align: center; } } @media only screen and (min-width: 1024px) { .c-banner-top { display: grid; grid-template-areas: "item"; } .c-banner-top__img { grid-area: item; } .c-banner-top__caption { grid-area: item; align-self: center; max-width: 25%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 96px; /* 9 */ margin-left: 6rem; /* 9 */ } } .c-banner-center { text-align: center; margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 72px; /* 9 */ margin-bottom: 4.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 730px; /* 9 */ max-width: 45.625rem; /* 9 */ } .c-banner-center__figure { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-banner-center__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ font-weight: 400; color: #0B2739; } .c-banner-center__paragraph { color: #50535A; } .c-banner-center__cta { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ color: #019DF4; } .c-banner-center__cta:hover { opacity: 0.9; } .action-skip-wrapper, .fotorama__thumb-border { display: none; } .o-layout__detail-product .fotorama__nav__frame--dot { display: none; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb { padding: 0 !important; } .o-layout__detail-product .fotorama__stage__frame { cursor: zoom-in; } .o-layout__detail-product .fotorama__arr:active::before { color: white !important; } .fotorama__arr:active, .fotorama__thumb__arr:active { background-color: #019DF4 !important; } .o-layout__detail-product .fotorama__thumb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 2px; /* 9 */ padding: 0.125rem; /* 9 */ background-color: white; border-radius: 11px; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb { transition: all 0.2s ease-in; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon { position: relative; 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; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::before { content: ""; width: 0; height: 0; border-left: 9px solid #fff; border-top: 6px solid #0000; border-bottom: 6px solid #0000; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::after { content: ""; position: absolute; top: auto; right: auto; bottom: auto; left: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 32px; /* 9 */ width: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 32px; /* 9 */ height: 2rem; /* 9 */ border-radius: 50%; background-color: #0B2739; z-index: -1; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon .fotorama__thumb.fotorama_vertical_ratio { position: absolute; opacity: 0; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.fotorama__active { border-color: #019DF4; } .o-layout__detail-product .fotorama__stage__frame .fotorama__img { aspect-ratio: 1/1; } .o-layout__detail-product .fotorama__nav-wrap .fotorama_vertical_ratio .fotorama__img { position: static; width: 100%; height: 100%; object-fit: contain; transform: none; aspect-ratio: 1/1; } .o-layout__detail-product .fotorama__stage__frame.fotorama-video-container.fotorama__product-video--loaded { 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-layout__detail-product .fotorama__arr__arr { background-color: transparent; } .o-layout__detail-product .fotorama-video-container.fotorama__product-video--loaded .fotorama__img { z-index: -1; } .o-layout__detail-product .fotorama-video-container.fotorama__product-video--loaded .product-video { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 428px; /* 9 */ width: 26.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 240px; /* 9 */ height: 15rem; /* 9 */ background: transparent; z-index: 10; } .is-video-load { position: relative; } .is-video-load::before { content: ""; position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 50px; /* 9 */ width: 3.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 50px; /* 9 */ height: 3.125rem; /* 9 */ margin: auto; border: 5px solid #D3D4D3; border-radius: 50%; border-top-color: #019DF4; animation: spin 1s ease-in-out infinite; -webkit-animation: spin 1s ease-in-out infinite; } @keyframes spin { to { -webkit-transform: rotate(360deg); } } @-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); } } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media screen and (max-width: 600px) { .fotorama { padding-bottom: 10px !important; } .o-layout__detail-product .fotorama__thumb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 2px; /* 9 */ padding: 0.125rem; /* 9 */ background-color: none !important; border-radius: 11px; } .fotorama__nav-wrap--vertical .fotorama__nav__shaft { background-color: transparent !important; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb { display: inline-block; width: 48px !important; height: 70px !important; margin-bottom: 12px; border: 2px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 11px; /* 9 */ border-radius: 0.6875rem; /* 9 */ } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::after { content: ""; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::before { border-left: 12px solid #fff; border-top: 8px solid #0000; border-bottom: 8px solid #0000; } .o-layout__detail-product .product-info_media { width: 95% !important; margin: 0; } .o-layout__detail-product .fotorama__stage__frame .fotorama__img { max-width: initial; } .product-reviews-summary.empty { padding-bottom: 1rem; padding-left: 1rem; } } /*------------------------------------*\ Media querys Tablet \*------------------------------------*/ @media screen and (max-width: 769px) { .fotorama__arr { display: none !important; } } /*------------------------------------*\ Media querys intermediates \*------------------------------------*/ @media (min-width: 601px) and (max-width: 1023px) { .fotorama__nav-wrap.fotorama__nav-wrap--horizontal { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .fotorama__nav.fotorama__nav--thumbs { width: inherit; height: auto !important; text-align: center; /* firefox scroll*/ scrollbar-color: rgba(0, 0, 0, 0.5) rgba(0, 0, 0, 0); scrollbar-width: thin; /* width */ /* Track */ /* Handle */ } .fotorama__nav.fotorama__nav--thumbs::-webkit-scrollbar { width: 5px; height: 5px; } .fotorama__nav.fotorama__nav--thumbs::-webkit-scrollbar-track { background-color: transparent; border-radius: 10px; } .fotorama__nav.fotorama__nav--thumbs::-webkit-scrollbar-thumb { background-color: transparent; border-radius: 10px; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb { display: inline-block; width: 48px !important; height: 48px !important; border: 2px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb:not(.o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb:last-of-type) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .o-layout__detail-product .fotorama__nav.fotorama__nav--dots, .o-layout__detail-product .fotorama__nav__shaft { width: 234px !important; overflow: auto; text-align: center; } .o-layout__detail-product .fotorama__nav.fotorama__nav--dots::-webkit-scrollbar-track, .o-layout__detail-product .fotorama__nav__shaft::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.3); border-radius: 1px; } .o-layout__detail-product .fotorama__nav.fotorama__nav--dots::-webkit-scrollbar, .o-layout__detail-product .fotorama__nav__shaft::-webkit-scrollbar { width: 1px; height: 0; } .o-layout__detail-product .fotorama__nav.fotorama__nav--dots::-webkit-scrollbar-thumb, .o-layout__detail-product .fotorama__nav__shaft::-webkit-scrollbar-thumb { border-radius: 1px; -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.3); } .fotorama__nav-wrap.fotorama__nav-wrap--horizontal { position: relative; z-index: -1; } .o-layout__detail-product .fotorama__stage { position: static; overflow: visible; } .o-layout__detail-product .fotorama__nav-wrap .fotorama_vertical_ratio .fotorama__img { object-fit: contain; } .o-layout__detail-product .fotorama__arr__arr { display: none; } } /*------------------------------------*\ Media querys desktop \*------------------------------------*/ @media screen and (min-width: 1024px) { .fotorama__nav__frame.fotorama__nav__frame--thumb:nth-child(n+6) { display: none !important; } .product-info_media, .product-info-main { -webkit-box-flex: 1; -webkit-flex: 1 50%; -moz-box-flex: 1; -moz-flex: 1 50%; -ms-flex: 1 50%; flex: 1 50%; } .product-info-main { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 540px; /* 9 */ max-width: 33.75rem; /* 9 */ } .o-layout__detail-product .fotorama-item { width: auto; } .fotorama__stage { order: 2; } .o-layout__detail-product .fotorama__stage { width: 480px !important; height: 528px !important; padding-bottom: 3rem; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 528px; /* 9 */ min-height: 33rem; /* 9 */ } .o-layout__detail-product .fotorama__stage__shaft, .o-layout__detail-product .fotorama__stage__shaft.fotorama__grab { width: 100% !important; } .o-layout__detail-product .fotorama__wrap, .o-layout__detail-product .fotorama__nav__shaft { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .fotorama__wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ order: 1; } .o-layout__detail-product .fotorama__nav__shaft { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } .fotorama__nav.fotorama__nav--thumbs { width: 100% !important; height: 100% !important; /* width */ /* Track */ /* Handle */ } .fotorama__nav.fotorama__nav--thumbs::-webkit-scrollbar { width: 5px; height: 5px; } .fotorama__nav.fotorama__nav--thumbs::-webkit-scrollbar-track { background-color: transparent; border-radius: 10px; } .fotorama__nav.fotorama__nav--thumbs::-webkit-scrollbar-thumb { background-color: transparent; border-radius: 10px; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb { display: inline-block; width: 5rem !important; height: 6.5rem !important; border: 2px solid white; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 11px; /* 9 */ border-radius: 0.6875rem; /* 9 */ } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::after { content: ""; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::before { border-left: 12px solid #fff; border-top: 8px solid #0000; border-bottom: 8px solid #0000; } .fotorama__arr { margin-right: 10px !important; } .o-layout__detail-product .fotorama__arr { top: 0; right: 1px; bottom: 0; left: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 28px; /* 9 */ width: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 28px; /* 9 */ height: 1.75rem; /* 9 */ margin: auto 0; border-radius: 50%; background: #fff; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); transition-property: none !important; transform: none !important; opacity: 1 !important; } .o-layout__detail-product .fotorama__arr::before { font-family: "ico-movistar"; color: #019DF4; } .o-layout__detail-product .fotorama__arr.fotorama__arr--next::before { content: ""; position: relative; right: -8px; top: 2px; } .o-layout__detail-product .fotorama__arr.fotorama__arr--prev { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -84px; /* 9 */ top: -5.25rem; /* 9 */ } .o-layout__detail-product .fotorama__arr.fotorama__arr--prev::before { content: ""; position: relative; right: -6px; top: 2px; } .o-layout__detail-product .fotorama__arr .fotorama__arr__arr { display: none; } } @media (min-width: 1024px) and (max-width: 1090px) { .fotorama__nav__frame.fotorama__nav__frame--thumb:nth-child(n+6) { display: none !important; } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb { display: inline-block; width: 60px !important; height: 70px !important; border: 2px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 11px; /* 9 */ border-radius: 0.6875rem; /* 9 */ } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::after { content: ""; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } .o-layout__detail-product .fotorama__nav__frame.fotorama__nav__frame--thumb.video-thumb-icon::before { border-left: 12px solid #fff; border-top: 8px solid #0000; border-bottom: 8px solid #0000; } .fotorama__stage { order: 2; } .o-layout__detail-product .fotorama__stage { height: 380px !important; padding-bottom: 3rem; min-height: 0px; } .o-layout__detail-product .fotorama__stage__shaft.fotorama__grab { width: 340px !important; } .o-layout__detail-product .fotorama__stage__frame .fotorama__img { max-width: 100%; } .o-layout__detail-product .fotorama__stage { width: 383px !important; } } .fotorama-video-container:after { background: url("../Magento_ProductVideo/img/gallery-sprite.png") bottom right; bottom: 0; content: ""; height: 100px; left: 0; margin: auto; position: absolute; right: 0; top: 12px; width: 100px; } .fotorama-video-container .magnify-lens { display: none !important; } .fotorama-video-container.video-unplayed:hover img { opacity: 0.6; } .fotorama-video-container.video-unplayed:hover:after { transform: scale(1.25); } .fotorama__stage__shaft:focus .fotorama__stage__frame.fotorama__active:after { bottom: 0; content: ""; height: 100px; left: 0; margin: auto; position: absolute; right: 0; top: 12px; width: 100px; } .fotorama__product-video--loading:after { visibility: hidden; } .c-especifications { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 730px; /* 9 */ max-width: 45.625rem; /* 9 */ margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 40px; /* 9 */ padding-bottom: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ } .c-especifications__intro { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ } .c-especifications__wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .c-especification__item { display: grid; grid-template-columns: 1fr 2fr; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-especification__attribute { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ color: #313235; font-weight: 700; } .c-especification__text { color: #50535A; max-width: 100%; word-break: break-all; overflow-wrap: break-word; text-overflow: ellipsis; overflow: hidden; white-space: normal; } .c-section-eco-bg { background-color: #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 48px; /* 9 */ padding-bottom: 3rem; /* 9 */ } .c-section-eco { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 104px; /* 9 */ margin-bottom: 6.5rem; /* 9 */ } .c-section-eco__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } .c-section-eco__paragraph { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ color: #86888C; } .c-section-eco__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 40px; /* 9 */ max-height: 2.5rem; /* 9 */ width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 350px; /* 9 */ max-width: 21.875rem; /* 9 */ } .c-section-eco__desc, .c-section-eco__num { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ font-weight: 700; } .c-section-eco__img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 90px; /* 9 */ min-height: 5.625rem; /* 9 */ } @media only screen and (min-width: 768px) { .c-section-eco { display: grid; grid-template-columns: 2fr 1fr; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 160px; /* 9 */ column-gap: 10rem; /* 9 */ } .c-section-eco__wrap { max-width: fit-content; margin-left: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 24px; /* 9 */ margin-right: 1.5rem; /* 9 */ } } @media only screen and (max-width: 767px) { .c-section-eco__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 64px; /* 9 */ margin-bottom: 4rem; /* 9 */ } .c-section-eco__percent { 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; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .c-section-eco__cta { text-align: center; } .c-section-eco__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 297px; /* 9 */ max-width: 18.5625rem; /* 9 */ } } .c-pay-methods__row { border-bottom: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 37px; /* 9 */ padding-bottom: 2.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 37px; /* 9 */ padding-top: 2.3125rem; /* 9 */ } .c-pay-methods__row:last-of-type { border-bottom: none; padding-bottom: 0; } .c-pay-methods__row:first-of-type { /* 3 */ /* 3 */ /* 5 */ /* 5 */ padding-top: 0; /* 8 */ } .c-pay-methods__title::after, .c-pay-methods__subtitle::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 15px; /* 9 */ font-size: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ } .c-pay-methods__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: 400; color: #50535A; } .c-pay-methods__slot { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 80px; /* 9 */ margin-left: 5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-pay-methods__slot::last-of-type { margin-bottom: 0; } .c-pay-methods__slot-margin { margin-left: 0; } .c-pay-methods__ico:before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 45px; /* 9 */ font-size: 2.8125rem; /* 9 */ color: #019DF4; } .c-pay-methods__ico_dark::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ color: #313235; } .c-pay-methods__subtitle { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ color: #50535A; } .c-pay-methods__description { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ color: #50535A; } .c-pay-methods__description-size { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-pay-methods__subtitle-size { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-pay-methods__brands { 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; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 24px; /* 9 */ row-gap: 1.5rem; /* 9 */ } .c-pay-methods__figure { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 135px; /* 9 */ width: 8.4375rem; /* 9 */ } .c-pay-methods__img { width: 100%; height: 100%; object-fit: contain; } @media only screen and (max-width: 560px) { .c-pay-methods__slot { margin-left: 0; } .c-pay-methods__slot_row { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; } } @media only screen and (min-width: 900px) { .c-pay-methods__slot-wrap { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .c-pay-methods__slot-wrap_line { position: relative; } .c-pay-methods__slot-wrap_line::before { content: ""; position: absolute; height: 80%; width: 1px; background-color: #D3D4D3; left: 53%; top: 0; } .c-pay-methods__slot-wrap-gap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 64px; /* 9 */ column-gap: 4rem; /* 9 */ } .c-pay-methods__figure { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 107px; /* 9 */ width: 6.6875rem; /* 9 */ } } .c-form { width: 100%; text-align: center; } .c-form_w365 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 365px; /* 9 */ max-width: 22.8125rem; /* 9 */ margin: 0 auto; } .c-form_w687 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 687px; /* 9 */ max-width: 42.9375rem; /* 9 */ align-self: center; } .c-form_w723 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 723px; /* 9 */ max-width: 45.1875rem; /* 9 */ } .c-form_w620 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 620px; /* 9 */ max-width: 38.75rem; /* 9 */ } .c-form_relative { position: relative; z-index: 1; } .c-form-content-white { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ background-color: #fff; } .c-form_transparent .c-form__field { background-color: transparent; } .c-form__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-form__header_w345 { max-width: 345px; margin-right: auto; margin-left: auto; } .c-form__header_margin-top0 { margin-top: 0; } .c-form__inner { 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; } .c-form__figure { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 240px; /* 9 */ max-width: 15rem; /* 9 */ } .c-form__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ font-weight: 300; color: #313235; line-height: 1.1; } .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 36px; /* 9 */ font-size: 2.25rem; /* 9 */ } .c-form__lead { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: 400; color: #0B2739; } .c-card-checkout-cta-view { display: block; } .is-summary-show-two { display: block; } .c-form__lead_17 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 17px; /* 9 */ font-size: 1.0625rem; /* 9 */ font-weight: 400; color: #0B2739; } .c-form__lead_gray { color: #50535A; } .c-form__lead_bold { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ font-weight: 700; } .c-form__lead_font { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 15px; /* 9 */ font-size: 0.9375rem; /* 9 */ } .c-form__lead_gray4 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ color: #86888C; text-align: left; } .c-form__headline { font-weight: 100; line-height: 1; color: #313235; } .c-form__headline_fw300 { font-weight: 300; } .c-form__fieldset { margin: 0; border: none; padding: 0; } .c-form__fieldset.c-form__fieldset_m48 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ } .c-form__fieldset_margin { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .c-form__fieldset_margin-top { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 60px; /* 9 */ margin-top: 3.75rem; /* 9 */ } .c-form__fieldset_fs16 .c-form__radio { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .c-form__field-canvas { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-form__fieldset_scrollbar { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 230px; /* 9 */ max-height: 14.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ overflow: auto; } .c-form__fieldset_scrollbar::-webkit-scrollbar { width: 6px; } .c-form__fieldset_scrollbar::-webkit-scrollbar-thumb { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ background-color: #B6B7B7; } .c-form__fieldset_scrollbar::-webkit-scrollbar-track { background: #E0E0E0; } .c-form__legend { position: relative; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ font-weight: 700; color: #0B2739; } .c-form__legend::after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; display: block; width: 100%; height: 1px; background-color: #D3D4D3; } .c-form__box { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-form__field-canvas .c-form__box { margin-bottom: 0; } .c-form__field-canvas .c-form__box.u-margin-bottom-24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-form__box_margin { width: 100%; margin: 0; } .c-form__box_flex70 { flex: 1 1 70%; } .c-form__box-address-detail .c-form__field { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ } .c-form__box-address-detail .c-form__icon::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .c-form__box_width100 { width: 100%; } .c-form__group-radios_w423 { width: calc(100% - 264px); } .c-form__group-radios_flex *.u-hidden { display: none; } .c-form__field { position: relative; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ border: 1px solid #B6B7B7; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 20px; /* 9 */ padding-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 48px; /* 9 */ padding-right: 3rem; /* 9 */ text-align: left; color: #50535A; background-color: #fff; overflow: hidden; } .c-form__field.is-email-check, .c-form__field.is-field-check { border-color: #019DF4; } .is-error .c-form__field { border: 1px solid #FF374A; } .c-form__field_padding { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 15px; /* 9 */ padding-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 15px; /* 9 */ padding-bottom: 0.9375rem; /* 9 */ } .c-form__field-white { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 20px; /* 9 */ padding-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ background-color: #fff; } .c-form__wrap-field { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 40px; /* 9 */ column-gap: 2.5rem; /* 9 */ } .c-form__wrap-field_margin { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ } .c-form__wrap-field_align { -webkit-box-align: stretch; -ms-flex-align: stretch; -webkit-align-items: stretch; -moz-align-items: stretch; align-items: stretch; } .c-form__field-container { 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ flex: 1 1 47%; } .c-form__field-container_relative { position: relative; } .c-form__label, .c-form__input { font-weight: 400; } .c-form__label { position: absolute; top: 0; bottom: 0; left: 0; height: max-content; margin: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ z-index: 2; transition: all 0.2s ease-in-out; cursor: text; } .c-form__label_hide { opacity: 0; } .c-form__label-icon { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 40px; /* 9 */ column-gap: 2.5rem; /* 9 */ } .c-form__label-icon::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .c-form__label-icon::after { content: ""; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 34px; /* 9 */ height: 2.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 1px; /* 9 */ width: 0.0625rem; /* 9 */ background-color: #B6B7B7; } .is-field-check .c-form__label-icon { color: #019DF4; } .is-field-check .c-form__label-icon::before { color: #019DF4; } .is-error .c-form__label-icon { color: #FF374A; } .c-form__text-box { width: 100%; text-align: left; } .c-form__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #86888C; } .c-form__text_gray { color: #50535A; } .c-form__radio, .c-form__radio-label { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 30px; /* 9 */ column-gap: 1.875rem; /* 9 */ } .c-form__radio-label_between { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .c-form__radio-label_between .c-form__radio-label-text { text-align: left; } .c-form__radio { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px; /* 9 */ padding: 0.75rem; /* 9 */ background: #fff; } .c-form__radio_border { margin-bottom: 0; border-bottom: 1px solid; border-radius: 0; border-color: #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 8px; /* 9 */ padding-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .c-form__radio_border:first-of-type { border-top: 1px solid #D3D4D3; } .c-form__radio_justify-end { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .c-form__radio_mb0 { margin-bottom: 0; } .c-form__radio_p0 { padding-right: 0; padding-left: 0; } .c-form__radio-input { position: relative; z-index: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 21px; /* 9 */ height: 1.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 21px; /* 9 */ width: 1.3125rem; /* 9 */ opacity: 0; cursor: pointer; } .c-form__radio_justify-end .c-form__radio-input { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; } .c-form__radio-input:checked + .c-form__radio-box .c-form__radio-label { color: #019DF4; } .c-form__radio-input:checked + .c-form__radio-box .c-form__radio-label .o-text_default { color: #B6B7B7; } .c-form__radio-input:checked + .c-form__radio-box .c-form__radio-label_color { color: #50535A; } .c-form__radio-input:checked + .c-form__radio-box::before { border-color: #019DF4; } .c-form__radio-input:checked + .c-form__radio-box::after { background-color: #019DF4; } .c-form__radio-box .c-form__radio-label .o-text_default { margin-right: 4px; color: #B6B7B7; } .c-form__radio-label { cursor: pointer; } .c-form__radio-label::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ color: #86888C; } .c-form__radio-box:not(.c-form__radio_justify-end .c-form__radio-box, .c-form__radio_justify-end .c-form__radio-label), .c-form__radio-label:not(.c-form__radio_justify-end .c-form__radio-box, .c-form__radio_justify-end .c-form__radio-label) { width: 100%; } .c-form__radio-box { 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; transition: all 0.2s ease-in-out; } .c-form__radio-box::before, .c-form__radio-box::after { position: absolute; left: 0; border-radius: 50%; transition: all 0.2s ease-in-out; cursor: pointer; } .c-form__radio-box::before { content: ""; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 18px; /* 9 */ width: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 18px; /* 9 */ height: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 12px; /* 9 */ margin-left: 0.75rem; /* 9 */ border: 2px solid #B6B7B7; } .c-form__radio-box::after { content: ""; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 12px; /* 9 */ width: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 12px; /* 9 */ height: 0.75rem; /* 9 */ margin: auto auto auto 17px; background-color: transparent; } .c-form__radio_p0 .c-form__radio-box::before { margin-left: 0; } .c-form__radio_p0 .c-form__radio-box::after { margin-left: 5px; } .c-form__radio-button-label { display: grid; grid-template-columns: 20px auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 24px; /* 9 */ gap: 1.5rem; /* 9 */ align-items: center; cursor: pointer; } .c-form__inputs-inline .c-form__radio-button-label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 8px; /* 9 */ gap: 0.5rem; /* 9 */ color: #86888C; } .c-form__radio-button-label_light { color: #86888C; } .c-form__radio-button[type=radio] { display: grid; place-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 20px; /* 9 */ height: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 20px; /* 9 */ width: 1.25rem; /* 9 */ margin: 0; -webkit-appearance: none; /* Remove most all native input styles */ appearance: none; background-color: #fff; border: 1px solid #B6B7B7; border-radius: 50%; cursor: pointer; transform: translateY(-0.075em); } .c-form__radio-button[type=radio]::before { content: ""; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 10px; /* 9 */ height: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 10px; /* 9 */ width: 0.625rem; /* 9 */ border-radius: 50%; transform: scale(0); transition: 120ms transform ease-in-out; box-shadow: inset 16px 16px #019DF4; } .c-form__radio-button[type=radio]:checked { border-color: #019DF4; } .c-form__radio-button[type=radio]:checked::before { transform: scale(1); } .c-form_transparent .c-form__field, .c-form_transparent .c-form__radio-button { background-color: transparent; } .c-form__checkbox-wrap { 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-form__checkbox { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 19px; /* 9 */ min-height: 1.1875rem; /* 9 */ } .c-form__checkbox_w292 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 292px; /* 9 */ max-width: 18.25rem; /* 9 */ } .c-form__checkbox-input[type=checkbox] { position: absolute; top: 0; left: 0; width: 56%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; z-index: 1; } .c-form__checkbox-input[type=checkbox] + .c-form__checkbox-label { display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .c-form__checkbox-input[type=checkbox] + .c-form__checkbox-label:before { content: ""; cursor: pointer; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 16px; /* 9 */ min-width: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 16px; /* 9 */ max-width: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 16px; /* 9 */ height: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ border: 1px solid #D3D4D3; line-height: 1.8; text-align: center; pointer-events: none; transition: all 0.2s ease; } .c-form__checkbox-input[type=checkbox] + .c-form__checkbox-label::after { content: ""; opacity: 0; transition: all 0.2s ease; } .c-form__checkbox-input[type=checkbox] + .c-form__checkbox-label:before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ color: transparent; } .c-form__checkbox-input[type=checkbox]:checked + .c-form__checkbox-label:before { border-color: #019DF4; background-color: #019DF4; } .c-form__checkbox-input[type=checkbox]:checked + .c-form__checkbox-label::after { opacity: 1; display: block; position: absolute; top: auto; bottom: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ left: 6px; /* 9 */ left: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 4px; /* 9 */ width: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 10px; /* 9 */ height: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 3px; /* 9 */ margin-bottom: 0.1875rem; /* 9 */ border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); } .is-disable .c-form__checkbox-input[type=checkbox]:checked + .c-form__checkbox-label { pointer-events: none; } .is-disable .c-form__checkbox-input[type=checkbox]:checked + .c-form__checkbox-label:before { border-color: #B6B7B7; background-color: #B6B7B7; } .c-form__checkbox-text { text-align: left; color: #313235; } .c-form__icon { position: absolute; top: 0; right: 0; bottom: 0; margin: auto; height: max-content; line-height: 1; color: inherit; } .c-form__icon::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ transition: all 0.2s ease-in-out; } .is-email-check .c-form__icon::before { content: ""; font-family: "ico-movistar"; color: #499110; } .is-password-show .c-form__icon::before { content: ""; } .is-error .c-form__icon::before { color: #86888C; } .c-form__icon_select::before { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 2px; /* 9 */ top: 0.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 13px; /* 9 */ padding-left: 0.8125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 7px; /* 9 */ padding-top: 0.4375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 13px; /* 9 */ padding-bottom: 0.8125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ background-color: #fff; color: #019DF4; pointer-events: none; z-index: 5; } .c-form_transparent .c-form__icon_select::before { background-color: transparent; } .c-form__icon_events { pointer-events: none; } .c-form__input[type=number]::-webkit-inner-spin-button, .c-form__input[type=number]::-webkit-outer-spin-button, .c-form__code-number[type=number]::-webkit-inner-spin-button, .c-form__code-number[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: textfield; margin: 0; } .c-form__input { width: 90%; border: none; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ transition: all 0.2s ease-in-out; color: #50535A; background: transparent; } .c-form__input.c-form__input_label-top, .c-form__input:valid, .c-form__input:focus { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 8px; /* 9 */ top: 0.5rem; /* 9 */ } .c-form__input.c-form__input_label-top + .c-form__label, .c-form__input.c-form__input_label-top + .select2 + .c-form__label, .c-form__input:valid + .c-form__label, .c-form__input:valid + .select2 + .c-form__label, .c-form__input:focus + .c-form__label, .c-form__input:focus + .select2 + .c-form__label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -32px; /* 9 */ top: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #019DF4; } .is-error .c-form__input.c-form__input_label-top + .c-form__label, .is-error .c-form__input.c-form__input_label-top + .select2 + .c-form__label, .is-error .c-form__input:valid + .c-form__label, .is-error .c-form__input:valid + .select2 + .c-form__label, .is-error .c-form__input:focus + .c-form__label, .is-error .c-form__input:focus + .select2 + .c-form__label { color: #FF374A; } .is-error .c-form__input[type=email]:invalid { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 8px; /* 9 */ top: 0.5rem; /* 9 */ } .is-error .c-form__input[type=email]:invalid + .c-form__label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -32px; /* 9 */ top: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #FF374A; } .c-form__input:-webkit-autofill, .c-form__input:-webkit-autofill:focus, .c-form__input:-webkit-autofill:active, .c-form__input:-internal-autofill-selected { transition: background-color 5000s ease-in-out 0s; -webkit-text-fill-color: #50535A; } .c-form__input_outline { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 110px; /* 9 */ max-width: 6.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 24px; /* 9 */ padding-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 24px; /* 9 */ padding-bottom: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ border: 1px solid #B6B7B7; color: #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ border-radius: 4px; } .c-form__input_outline.is-email-check, .c-form__input_outline.is-field-check { border-color: #019DF4; } .c-form__input[type=date] { width: 100%; } .c-form__input[type=date]::-webkit-calendar-picker-indicator { opacity: 0; cursor: pointer; } .c-form__input_top { text-align: left; } .c-form__input_top:valid, .c-form__input_top:focus { top: auto; } .is-error .c-form__input_top[type=email]:invalid { top: auto; } .c-form__input_color { color: #50535A; } .c-form__select { cursor: pointer; appearance: none; width: 140%; } .c-form__code { 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; } .c-form__code-number { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 60px; /* 9 */ width: 3.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 78px; /* 9 */ height: 4.875rem; /* 9 */ border: 1px solid #86888C; border-radius: 8px; font-family: "Telefonica", sans-serif; font-weight: 100; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 48px; /* 9 */ font-size: 3rem; /* 9 */ text-align: center; color: #313235; background-color: #EEEEEE; } .is-error .c-form__code-number { color: #FF374A; } .c-form__card { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 350px; /* 9 */ max-width: 21.875rem; /* 9 */ margin: 0 auto; overflow: hidden; } .c-form__address { width: 100%; border: 1px solid #B6B7B7; } .c-form__address-header { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ border-bottom: 1px solid #B6B7B7; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ line-height: 1; background-color: #EEEEEE; } .c-form__address-content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ text-align: left; line-height: 1; color: #B6B7B7; background: #fff; } .c-form__address-text { min-height: 40px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ border: 1px dashed #313235; font-weight: 300; } .c-form__address-label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ font-weight: 700; } .c-form__address-label span { font-weight: 300; } .c-form__address-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 22px; /* 9 */ width: 1.375rem; /* 9 */ filter: grayscale(1); } .c-form__field-address { 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: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } .c-form__field-address.u-hidden { display: none; } .c-form__field-address .c-form__box:nth-of-type(1) { margin-bottom: 0; } .c-form__field-address .c-form__field { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 8px; /* 9 */ padding-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 8px; /* 9 */ padding-left: 0.5rem; /* 9 */ } .c-form__field-address .c-form__field:nth-of-type(1) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 150px; /* 9 */ width: 9.375rem; /* 9 */ } .c-form__field-address .c-form__field:nth-of-type(2) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 75px; /* 9 */ width: 4.6875rem; /* 9 */ } .c-form__field-address .c-form__field:nth-of-type(3) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 65px; /* 9 */ width: 4.0625rem; /* 9 */ } .c-form__actions { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 64px; /* 9 */ margin-top: 4rem; /* 9 */ } .c-form__actions_margin-top16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .c-form__actions_margin-top40 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ } .c-form__actions_right { text-align: right; } .c-form__btn { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 255px; /* 9 */ max-width: 15.9375rem; /* 9 */ } .c-form__btn.is-form-load::before { content: ""; display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 16px; /* 9 */ width: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 16px; /* 9 */ height: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 12px; /* 9 */ margin-right: 0.75rem; /* 9 */ border: 2px solid #fff; border-radius: 50%; border-top-color: transparent; animation: spin 1s ease-in-out infinite; -webkit-animation: spin 1s ease-in-out infinite; } .c-form__btn.o-btn_w350 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 350px; /* 9 */ max-width: 21.875rem; /* 9 */ } .c-form__btn_w304 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 40px; /* 9 */ max-height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 304px; /* 9 */ max-width: 19rem; /* 9 */ width: 100%; } /* error text */ .c-form__error-text { width: fit-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 4px; /* 9 */ margin-top: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #FF374A; display: none; } .is-error .c-form__error-text { display: block; } .c-form__error-text_center { margin-left: auto; margin-right: auto; padding: 0px !important; } .c-form__help-text { display: inline-block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 4px; /* 9 */ margin-top: 0.25rem; /* 9 */ text-align: left; line-height: 1.2; color: #86888C; } .c-form__help-text_phone { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ } .c-form__txt { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 16px 0; /* 9 */ margin: 1rem 0; /* 9 */ color: #50535A; } .c-form__group { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .c-form__group_margin-both-0 { margin: 0; } .c-form__group_input { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ } .c-form__group_input_w100 { width: 100%; } .c-form__ordered-list { list-style: none; counter-reset: counter; } .c-form__item-list { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 40px; /* 9 */ padding-bottom: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ counter-increment: counter; } .c-form__item-list::before { position: absolute; top: 9px; content: counter(counter) ". "; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ font-weight: 700; } .c-form__ordered-list_num-sm .c-form__item-list::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 16px; /* 9 */ top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .c-form__item-list::after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; display: block; width: 100%; height: 1px; background-color: #D3D4D3; } .c-form__item-list:last-of-type::after { display: none; } .c-form__item-list.is-error::before { color: #FF374A; } .c-form__text-list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 24px; /* 9 */ margin-left: 1.5rem; /* 9 */ } .is-error .c-form__text-list { color: #FF374A; } .c-form__inputs-list { display: grid; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 26px; /* 9 */ margin-left: 1.625rem; /* 9 */ } .c-form__inputs-list_column { 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; } .c-form__required-txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ text-align: left; color: #50535A; } .c-form__captcha { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-form__captcha .field-recaptcha { display: inline-block; } .c-form__captcha .field .control .required-captcha.checkbox { display: none; } .c-form_wrap { flex-wrap: wrap; row-gap: 16px; } /*------------------------------------*\ Modal datos \*------------------------------------*/ .c-form-modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; padding: 1rem; cursor: pointer; z-index: 6; background: rgba(0, 0, 0, 0.8); display: none; } .c-form-modal .c-form-modal-dialog { position: relative; max-width: 489px; max-height: 80vh; border-radius: 5px; background: #FFF; overflow: auto; cursor: default; padding: 20px; display: flex; flex-direction: column; justify-content: center; } .c-form-modal .c-form-modal-dialog .c-form-modal-header { display: flex; justify-content: flex-end; } .c-form-modal .c-form-modal-dialog .c-form-modal-header .c-form_modal__btn-close { top: 0; } .c-form-modal .c-form-modal-dialog .c-form-modal-header .c-form_modal__btn-close::before { font-size: 0.875rem; color: #86888C; } .c-form-modal .c-form-modal-dialog .c-form-modal-content { display: flex; flex-direction: column; align-items: center; padding: 10px 50px; text-align: center; } .c-form-modal .c-form-modal-dialog .c-form-modal-content p { margin-bottom: 5%; } .c-form-modal .c-form-modal-dialog .c-form-modal-content h2 { margin-bottom: 5%; } .c-form-modal .c-form-modal-dialog .c-form-modal-content img { margin-bottom: 5%; } .c-form-modal .c-form-modal-dialog .c-form-modal-footer { display: flex; justify-content: space-around; flex-direction: row; } ._modal_form_close { display: none; } ._modal_form_open { display: flex; } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media only screen and (max-width: 400px) { .c-form__radio-input:checked { border: 2px solid #019DF4; } } @media screen and (max-width: 600px) { .c-card-checkout-cta-view { display: none; } .c-form__title_margin-bottom { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } .c-form__icon_blue { color: #019DF4; } .c-form__icon_before-relative::before { position: relative; top: -41px; } .c-form__wrap-field { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } .c-form__label_overflow { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 29px; /* 9 */ height: 1.8125rem; /* 9 */ width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .c-form__label-icon { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ } .c-form__label-icon::after { display: none; } .c-form__icon_margin-bott { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 45px; /* 9 */ margin-bottom: 2.8125rem; /* 9 */ } .c-form__icon_margin-top { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ } .c-form__actions_column .c-form__btn { max-width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .c-form__group_input-colum-grap8 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ } .c-form__inputs-list_column { /* 3 */ /* 3 */ /* 5 */ /* 5 */ margin-left: 0; /* 8 */ } .c-form__lead { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } /*------------------------------------*\ Modal datos \*------------------------------------*/ .c-form-modal .c-form-modal-dialog .c-form-modal-footer { flex-direction: column-reverse; } .c-form-modal .c-form-modal-dialog .c-form-modal-content { padding: 10px 0px; } } @media only screen and (min-width: 600px) { .c-form__actions_right { text-align: right; } .c-form__box_flexbox { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ margin-bottom: 0; } } @media screen and (max-width: 739px) { .c-form__actions { margin-top: 40px; } .c-form__actions_margin-top40 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ } .c-form-content-white { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px; /* 9 */ padding: 1.5rem; /* 9 */ } .c-form__box-address-detail:first-of-type { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 168px; /* 9 */ min-width: 10.5rem; /* 9 */ } .c-form__field-canvas { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 24px; /* 9 */ row-gap: 1.5rem; /* 9 */ } .c-form__figure { display: none; } .c-form__group-radios { width: 100%; } .c-form__header { margin-right: auto; margin-left: 0; text-align: left; } .c-bg-login__box .c-form__headline { text-align: center; } .c-form__radio-label_between { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .c-form__radio-label-text { text-align: left; } .c-form__radio-label-value { flex: 1 50%; } .c-form__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 36px; /* 9 */ font-size: 2.25rem; /* 9 */ } .c-form__group_input_column { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } .c-form__fieldset_margin-top { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 60px; /* 9 */ margin-top: 3.75rem; /* 9 */ } .c-form__field-canvas_row { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } .c-form__inputs-inline .c-form__radio-button-label { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .c-form__actions_right .c-form__btn_full { max-width: 100%; } } /*------------------------------------*\ Media querys tablet \*------------------------------------*/ @media only screen and (max-width: 768px) { .c-form__radio_card { flex-direction: column; row-gap: 32px; padding: 16px 24px; } .c-form__radio_card .c-form__radio-input { width: 100%; height: 100%; } .c-form__radio_card .c-form__radio-box::before { top: 16px; margin-left: 24px; } .c-form__radio_card .c-form__radio-box::after { top: 21px; margin-left: 29px; } .c-form__radio_card .c-form__radio-label { column-gap: 0; } .c-form__radio_card .c-form__radio-label::before { position: absolute; top: 17px; margin-left: 32px; font-size: 20px; } } @media only screen and (min-width: 768px) { .c-form__radio_card { column-gap: 40px; } .c-form__radio_card .c-form__radio-label { column-gap: 0; } .c-form__radio_card .c-form__radio-label::before { margin-right: 40px; } .c-form__header_w728 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 728px; /* 9 */ max-width: 45.5rem; /* 9 */ } .c-form__btn_w304 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 56px; /* 9 */ min-height: 3.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 255px; /* 9 */ max-width: 15.9375rem; /* 9 */ } .c-form__btn_h40 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 40px; /* 9 */ min-height: 2.5rem; /* 9 */ } } @media screen and (min-width: 601px) { .c-form__address { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 350px; /* 9 */ max-width: 21.875rem; /* 9 */ } .c-form__actions_column { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ } .c-form__actions_column .c-form__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 225px; /* 9 */ max-width: 14.0625rem; /* 9 */ } .c-form__label-icon { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 227px; /* 9 */ min-width: 14.1875rem; /* 9 */ } .c-form__label-icon:after { margin-left: auto; } } @media screen and (min-width: 739px) { .c-form__group-radios_flex { min-height: 380px; /* border: 1px solid #f00; */ display: flex; flex-direction: column; justify-content: space-between; } .c-form__group-radios_flex * { flex: 0 auto; } .c-form__group-radios_flex .c-form__actions { display: flex; align-items: flex-end; justify-content: flex-end; flex: 1; } .c-form__fieldset_grid { display: grid; grid-template-columns: repeat(2, 1fr); /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } .c-form__radio { margin-right: 0; margin-left: auto; } .c-form__group-radios_w423 .c-form__radio { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 352px; /* 9 */ max-width: 22rem; /* 9 */ } .c-form__header_w260 { max-width: 260px; margin-right: auto; margin-left: auto; } .c-form__lead { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .c-form__lead_bold { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-form__lead_font { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 15px; /* 9 */ font-size: 0.9375rem; /* 9 */ } .c-form__item-list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .c-form__item-list::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ } .c-form__text-list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 32px; /* 9 */ margin-left: 2rem; /* 9 */ } .c-form__inputs-list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 32px; /* 9 */ margin-left: 2rem; /* 9 */ } .c-form__inputs-inline { 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; } .c-form__actions_right { text-align: right; } } /*------------------------------------*\ Media querys desktop \*------------------------------------*/ @media screen and (min-width: 1024px) { .c-form-content-white { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 80px 72px; /* 9 */ padding: 5rem 4.5rem; /* 9 */ } .c-form__box-address-detail { flex: 1 1; } .c-form__fieldset_scrollbar { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ } .c-form__group-radios { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 24px; /* 9 */ margin-right: 1.5rem; /* 9 */ text-align: right; } .c-form__actions { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 64px; /* 9 */ margin-top: 4rem; /* 9 */ } .c-form__actions_margin-top16 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .c-form__actions_margin-top0 { margin-top: 0; } .checkout-sumary { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 24px; /* 9 */ margin-left: 1.5rem; /* 9 */ } } @media (min-width: 1024px) and (max-width: 1200px) { .c-form_w687 { width: 55%; } .c-form_w723 { width: 60%; } } @media only screen and (min-width: 1180px) { .c-form__inputs-list { grid-template-columns: 1fr 1fr; } } .c-simple-header_bg { background-color: #fff; } .c-simple-header { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 30px; /* 9 */ padding-top: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 30px; /* 9 */ padding-bottom: 1.875rem; /* 9 */ } @media only screen and (max-width: 768px) { .c-simple-header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ } } .c-simple-header__brand-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 48px; /* 9 */ min-width: 3rem; /* 9 */ } @media only screen and (max-width: 768px) { .c-simple-header__brand-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 34px; /* 9 */ min-width: 2.125rem; /* 9 */ } } .c-simple-header__menu { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ right: 16px; /* 9 */ right: 1rem; /* 9 */ } .c-simple-header__list { position: absolute; right: -15px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 155px; /* 9 */ min-width: 9.6875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 12px; /* 9 */ padding-bottom: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ background-color: #fff; list-style-type: none; border-radius: 4px; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); visibility: hidden; opacity: 0; transition: all 0.4s; } .active .c-simple-header__list { visibility: visible; opacity: 1; } .c-simple-header__button-user { position: relative; display: grid; place-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ background-color: #EEEEEE; border-radius: 50%; } .c-simple-header__button-user:before { color: #019DF4; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .c-simple-header__button-user::after { position: absolute; left: 48px; top: 45%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 6px; /* 9 */ font-size: 0.375rem; /* 9 */ color: #86888C; transition: all 0.4s; } .active .c-simple-header__button-user::after { color: #019DF4; transform: rotate(180deg); } .c-simple-header__button-user:hover::after { color: #019DF4; transform: rotate(180deg); } .c-simple-header__item { border-bottom: 1px solid #EEEEEE; } .c-simple-header__link { display: block; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: right; -ms-flex-pack: right; -webkit-justify-content: right; -moz-justify-content: right; justify-content: right; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 8px; /* 9 */ padding-bottom: 0.5rem; /* 9 */ color: #50535A; } .c-simple-header__link::after { color: #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .c-simple-header__link:hover { color: #019DF4; opacity: 0.9; } .c-simple-header__step-container { display: flex; align-items: center; justify-content: center; } .c-steps { width: 70%; } .c-steps_w100 { width: 100%; } .c-steps_w124 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 124px; /* 9 */ max-width: 7.75rem; /* 9 */ } .c-steps__list { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ list-style-type: none; } .c-steps__item { width: 100%; } .c-steps__item:nth-child(2) .c-steps__name { left: -40px; } .c-steps__item:last-child .c-steps__name { left: -105px; } .c-steps__item_variation:nth-child(2) .c-steps__name { left: -35px; } .c-steps__item_variation:last-child .c-steps__name { left: -10px; } .c-steps__wrap { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /*.is-checked & { &::after { background-color: $c-primary; } }*/ } .c-steps__wrap::after { content: ""; display: block; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 4px; /* 9 */ height: 0.25rem; /* 9 */ background-color: #D3D4D3; border-radius: 2px; } .c-steps__bullet { position: relative; } .c-steps__value { position: relative; display: grid; place-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 32px; /* 9 */ height: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 32px; /* 9 */ width: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 28px; /* 9 */ min-width: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: 700; border-radius: 100%; } .c-steps__value::before { position: absolute; content: "✓"; border-radius: 100%; } .is-checked .c-steps__value::before { color: #019DF4; opacity: 1; } .is-checked .c-steps__value { border: 2px solid #019DF4; color: transparent; } .c-steps__item:not(.is-checked) .c-steps__value { border: 2px solid #86888C; color: #86888C; } .c-steps__item:not(.is-checked) .c-steps__value::before { opacity: 0; } .c-steps__item:not(.is-checked):first-child .c-steps__value { border: 1px solid #019DF4; color: #fff; background-color: #019DF4; } .is-checked .c-steps__item:not(.is-checked):first-child .c-steps__value { background-color: transparent; } .c-steps__item:last-child { width: fit-content; } .c-steps__item:last-child .c-steps__wrap::after { display: none; } .c-steps__item.is-checked + .c-steps__item .c-steps__value { background-color: #019DF4; border-color: #019DF4; color: #fff; } .c-steps__item ~ .c-steps__item.is-checked .c-steps__value { border: 2px solid #019DF4; background-color: transparent; } .c-steps__item ~ .c-steps__item.is-checked .c-steps__value::before { color: #019DF4; opacity: 1; } .c-steps__name { position: absolute; top: 35px; left: -30px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 95px; /* 9 */ min-width: 5.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #0B2739; white-space: nowrap; } .c-steps__name.mb-only { display: none; } @media only screen and (max-width: 767px) { .c-steps__name { display: none; } .c-steps__name.mb-only { display: block; left: 0; } .c-steps__item_variation:nth-child(2) .c-steps__name { left: 0px; } .c-steps { width: 85%; } } .c-footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 40px 0; /* 9 */ padding: 2.5rem 0; /* 9 */ color: #fff; background-color: #0B2739; } .c-footer__link { display: block; border-bottom: 1px solid #D3D4D3; } .c-footer__link:hover { color: #019DF4; } .c-footer__link-text { 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-footer__link-text::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 96px; /* 9 */ font-size: 6rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 5px; /* 9 */ margin-left: 0.3125rem; /* 9 */ } .c-footer__brand { position: relative; border-bottom: 1px solid; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ } .c-footer__img { width: 188px; transition: all 0.2s ease; } .c-footer__img_hover { position: absolute; top: 3px; left: 0; opacity: 0; } .c-footer__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .c-footer__list { color: #B6B7B7; } .is-dropdown-active .c-footer__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .c-footer__item { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-footer__item:hover { color: #fff; } .c-footer__item_inline { display: inline-block; margin-bottom: 0; } .c-footer__item_inline::after { content: "|"; /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 6px; /* 9 */ padding: 0 0.375rem; /* 9 */ } .c-footer__bottom { color: #B6B7B7; } .c-footer__ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .c-footer__ico:hover { color: #fff; } @media only screen and (max-width: 767px) { .c-footer__dropdown { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 8px; /* 9 */ padding: 1rem 0.5rem; /* 9 */ border-bottom: 1px solid; } .c-footer__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; } .c-footer__title::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ color: #019DF4; } } @media only screen and (min-width: 768px) { .c-footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 56px 0 24px 0; /* 9 */ padding: 3.5rem 0 1.5rem 0; /* 9 */ } .register-index-index .c-footer, .checkout-index-index .c-footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 32px; /* 9 */ padding-top: 2rem; /* 9 */ } .c-footer__grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 32px; /* 9 */ padding-top: 2rem; /* 9 */ column-count: 3; } .c-footer__dropdown { display: grid; page-break-inside: avoid; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 200px; /* 9 */ width: 12.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-footer__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .c-footer__list:not(.c-footer__dropdown .c-footer__list) { 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-footer__list.o-dropdown__content { max-height: initial; } .c-footer__title::after { display: none; } } @media only screen and (max-width: 1210px) { .c-footer__item_inline:last-child::after { display: none; } .c-footer__bottom { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 40px; /* 9 */ padding-top: 2.5rem; /* 9 */ } .c-footer__copy { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } } @media (max-width: 900px) { .c-footer__list:not(.c-footer__dropdown .c-footer__list) { -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .c-footer__social { flex: 1 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } } @media only screen and (min-width: 1210px) { .c-footer__grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 56px; /* 9 */ padding-bottom: 3.5rem; /* 9 */ column-count: 4; } .c-footer__bottom { 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; -webkit-box-align: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ border-top: 1px solid; } .c-footer__copy { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-footer__social { display: inline; line-height: 1; } } .c-footer-simple { background-color: #0B2739; } .c-footer-simple__list-ico, .c-footer-simple__list { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .c-footer-simple__list-ico { list-style-type: none; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; -webkit-justify-content: space-evenly; -moz-justify-content: space-evenly; justify-content: space-evenly; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-footer-simple__ico-item { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #fff; } .c-footer-simple__ico-item::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 26px; /* 9 */ font-size: 1.625rem; /* 9 */ color: #019DF4; } .c-footer-simple__divider { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ border-top: 1px solid #D3D4D3; } .c-footer-simple__copy-right { text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ color: #B6B7B7; } .c-footer-simple__list { flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; list-style-type: none; } .c-footer-simple__item { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ color: #B6B7B7; } .c-footer-simple__link { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ } .c-footer-simple__link::after { content: ""; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 16px; /* 9 */ height: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 1px; /* 9 */ width: 0.0625rem; /* 9 */ background-color: #D3D4D3; } .c-footer-simple__item { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ } .c-footer-simple__item:last-of-type .c-footer-simple__link::after { display: none; } .c-footer-simple__item:first-of-type { margin-left: 0; } @media only screen and (max-width: 767px) { .c-footer-simple__ico-item { font-weight: 300; } } @media only screen and (min-width: 768px) { .c-footer-simple__list-ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 40px; /* 9 */ column-gap: 2.5rem; /* 9 */ } .c-footer-simple__ico-item { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; max-width: 138px; } } @media only screen and (max-width: 944px) { .c-footer-simple__divider { -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: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 8px; /* 9 */ row-gap: 0.5rem; /* 9 */ } } @media only screen and (max-width: 370px) { .c-footer-simple__list-ico { justify-content: center; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } .c-footer-simple__ico-item { width: 34%; } } .register-index-index div.page-wrapper { height: 100vh; 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .register-index-index #maincontent { flex: 2 1 auto; } .register-index-index .columns, .column.main { height: 100%; } .c-bg-login { height: 100%; background-color: #019DF4; } .c-bg-login__picture { height: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .c-bg-login__box { background-color: #fff; align-self: start; } .c-bg-login .o-canvas { height: 100%; } .c-bg-login__wrap { display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr auto; align-items: center; justify-content: center; } .c-bg-login__box { display: flex; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 492px; /* 9 */ max-width: 30.75rem; /* 9 */ margin: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 16px; /* 9 */ border-radius: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 32px 70px; /* 9 */ padding: 2rem 4.375rem; /* 9 */ background: #fff; } @media only screen and (max-width: 767px) { .c-bg-login__wrap { margin-bottom: 80px; } } @media only screen and (min-width: 768px) { .c-bg-login { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; } .c-bg-login__picture { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .c-bg-login__img { height: auto; } .c-bg-login__box { align-self: center; } .c-bg-login__wrap { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; height: 100%; } .c-bg-login__box { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 56px; /* 9 */ margin-top: 3.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 56px; /* 9 */ margin-bottom: 3.5rem; /* 9 */ } } @media screen and (max-width: 1023px) { .c-bg-login__box { min-height: 316px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ } } .c-horizontal-bars { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 24px 0; /* 9 */ margin: 1.5rem 0; /* 9 */ } .c-horizontal-bars__box { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ width: fit-content; margin: 0 auto; } .c-horizontal-bars__box .is-active { background-color: #019DF4; } .c-horizontal-bar__element { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 58px; /* 9 */ min-width: 3.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 6px; /* 9 */ height: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 5px; /* 9 */ border-radius: 0.3125rem; /* 9 */ background-color: #D3D4D3; } .c-float-button { display: grid; place-items: center; position: fixed; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ right: 32px; /* 9 */ right: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ bottom: 50px; /* 9 */ bottom: 3.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 41px; /* 9 */ height: 2.5625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 41px; /* 9 */ width: 2.5625rem; /* 9 */ background-color: #019DF4; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 60px; /* 9 */ border-radius: 3.75rem; /* 9 */ } .c-float-button:hover { opacity: 0.9; } .c-float-button__icon::before { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 25px; /* 9 */ font-size: 1.5625rem; /* 9 */ color: #fff; } @media only screen and (min-width: 768px) { .c-float-button { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ bottom: 250px; /* 9 */ bottom: 15.625rem; /* 9 */ } } @media only screen and (min-width: 1024px) { .c-float-button { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ bottom: 202px; /* 9 */ bottom: 12.625rem; /* 9 */ } } .c-error-modal__paragraph { margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 400px; /* 9 */ max-width: 25rem; /* 9 */ } @media only screen and (min-width: 520px) { .c-error-modal__paragraph { margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ } } .modal_email_validate_footer { display: flex; flex-direction: column; } .modal_email_validate_footer #modalbtnEdit, .modal_email_validate_footer #modalbtnOmit { margin: 5px auto; } @media only screen and (min-width: 520px) { .modal_email_validate_footer { flex-direction: initial; } .modal_email_validate_footer #modalbtnEdit { order: 1; width: 40%; margin: 0 auto; } .modal_email_validate_footer #modalbtnOmit { order: 2; width: 40%; margin: 0 auto; } } .c-callout { display: none; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ border: 1px solid #FF374A; background-color: rgba(255, 55, 74, 0.3); /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 20px 18px; /* 9 */ padding: 1.25rem 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ color: #313235; } .c-callout::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 9px; /* 9 */ font-size: 0.5625rem; /* 9 */ color: #FF374A; } .is-active .c-callout { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .message-error { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ border: 1px solid #FF374A; background-color: rgba(255, 55, 74, 0.3); /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ color: #313235; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; align-items: flex-start; } .message-error::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 9px; /* 9 */ font-size: 0.5625rem; /* 9 */ color: #FF374A; } .c-callout.is-callout-hidden { display: none; } .c-callout_w920 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 920px; /* 9 */ max-width: 57.5rem; /* 9 */ margin-left: auto; margin-right: auto; } .c-callout_w730 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 730px; /* 9 */ max-width: 45.625rem; /* 9 */ } .c-callout_white { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 20px 52px; /* 9 */ padding: 1.25rem 3.25rem; /* 9 */ border: none; background-color: #fff; color: #50535A; } .c-callout_white::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 33px; /* 9 */ font-size: 2.0625rem; /* 9 */ color: #F28D15; transform: rotate(180deg); } .c-callout_white-big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 20px 52px; /* 9 */ padding: 1.25rem 3.25rem; /* 9 */ border: none; background-color: #fff; color: #50535A; } .c-callout_white-big::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 52px; /* 9 */ font-size: 3.25rem; /* 9 */ color: #F28D15; transform: rotate(180deg); } .c-callout_sm { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ margin-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-callout_sm::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } .c-callout__green { border-color: #5CB615; background-color: rgba(92, 182, 21, 0.3); } .c-callout__green::before { color: #5CB615; } .c-callout__info { border-color: #E6F5FD; background-color: #E6F5FD; display: flex !important; justify-content: space-between; } .c-callout__info::before { color: #5CB615; } .c-callout__position { display: flex; align-items: center; gap: 0.5rem; } .c-callout__text { text-align: left; } .c-callout__btn { padding: 0; margin-left: auto; } .c-callout__btn::after { color: #5CB615; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } @media only screen and (max-width: 500px) { .c-callout_direction-column { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } } .c-callout-icon { display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 18px; /* 9 */ column-gap: 1.125rem; /* 9 */ border: 1px solid; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 13px 10px; /* 9 */ padding: 0.8125rem 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ color: #50535A; } .c-callout-icon::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 9px; /* 9 */ font-size: 0.5625rem; /* 9 */ } .is-active .c-callout-icon { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .c-callout-icon span { align-self: flex-start; } .c-callout-icon .c-callout__text.subtitle { color: #6B6C6F; } .c-callout-icon.isSmall { column-gap: 12px !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ font-size: 14px; } .c-callout__yellow { border-color: #F28D15; background-color: rgba(242, 141, 21, 0.1); } .c-callout__yellow::before { color: #F28D15; } .c-callout__yellow span { font-size: 20px; } .c-callout__yellow span.i-information::before { color: #F28D15; } .c-callout__blue { border-color: #019DF4; background-color: rgba(1, 157, 244, 0.1); } .c-callout__blue::before { color: #019DF4; } .c-callout__blue span { font-size: 20px; } .c-callout__blue span.i-badge-percent::before { color: #019DF4; } .c-callout__blue span.i-information::before { color: #019DF4; } .c-callout__red { border-color: #FF374A; background-color: rgba(255, 55, 74, 0.1); } .c-callout__red::before { color: #FF374A; } .c-callout__red span { font-size: 20px; } .c-callout__red span.i-information::before { color: #FF374A; } .c-card-info { flex: 1 1 38%; } .c-card-info__header { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 13px 24px; /* 9 */ padding: 0.8125rem 1.5rem; /* 9 */ background-color: #019DF4; color: #fff; font-weight: 700; } .c-card-info__header::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .c-card-info__list { list-style-type: none; background-color: #fff; text-align: left; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px; /* 9 */ padding: 1.5rem; /* 9 */ border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .c-card-info__item { border-bottom: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ } .c-card-info__item:last-of-type { border: none; padding-bottom: 0; } .c-card-info__item:first-of-type { padding-top: 0; } .c-card-info__item-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #86888C; } .c-card-info__item-text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; } @media screen and (max-width: 600px) { .c-card-info { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } } .c-chips { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ } .c-chips_border { margin-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ border-top: 1px solid #D3D4D3; border-bottom: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ } .c-chips__box { display: flex; flex-wrap: wrap; row-gap: 16px; max-width: 470px; margin: 0 auto; justify-content: space-evenly; } .c-chips__box_evenly { -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; -webkit-justify-content: space-evenly; -moz-justify-content: space-evenly; justify-content: space-evenly; } .c-chips__item { position: relative; display: grid; place-items: center; width: fit-content; border: 1px solid #019DF4; color: #019DF4; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 60px; /* 9 */ border-radius: 3.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 14px 40px; /* 9 */ padding: 0.875rem 2.5rem; /* 9 */ overflow: hidden; } .c-chips__item_sm { flex: 0 1 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 6px 16px; /* 9 */ padding: 0.375rem 1rem; /* 9 */ } .c-chips__input { position: absolute; display: block; width: 100%; height: 100%; appearance: none; background-color: transparent; cursor: pointer; transition: all 0.3s ease-in; } .c-chips__input:checked { background-color: #019DF4; } .c-chips__input:checked + .c-chips__label { color: #fff; } .c-chips__label { position: relative; z-index: 1; color: #019DF4; cursor: pointer; } @media screen and (max-width: 371px) { .c-chips__box { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 600px) { .c-chips__item:not(.c-chips__item.c-chips__item_sm) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 14px 18px; /* 9 */ padding: 0.875rem 1.125rem; /* 9 */ } } @media screen and (max-width: 739px) { .c-chips__item_sm { min-width: 80px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 4px 12px; /* 9 */ padding: 0.25rem 0.75rem; /* 9 */ } } @media screen and (min-width: 739px) { .c-chips__item_sm { min-width: 100px; } } .chips_deco-container { display: grid; gap: 1rem; grid-auto-rows: 53px; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); align-items: center; margin-top: -90px; } .chips_deco-label { border: 1px solid #d9d9d9; padding: 10px 15px; border-radius: 5px; display: flex; gap: 15px; align-items: center; position: relative; } .chips_deco-input { display: none; } .chips_deco-inputRadio { width: 24px; height: 24px; border-radius: 50%; border: 2px solid #b6b7b7; background-color: #f5f5f5; position: relative; } .chips_deco-input:checked + .chips_deco-inputRadio { border: 2px solid #019df4; } .chips_deco-input:checked + .chips_deco-inputRadio::after { content: ""; position: absolute; top: 50%; left: 50%; display: block; transform: translate(-50%, -50%); background-color: #019df4; width: 12px; height: 12px; border-radius: 50%; } .decos_card-error { background-color: #f8cccc; border: 1px solid #ff374a; border-radius: 4px; height: 50px; place-content: center; margin: 20px 0; } .c-resume { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 48px; /* 9 */ margin-bottom: 3rem; /* 9 */ } .c-resume__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px; /* 9 */ padding: 1.5rem; /* 9 */ background-color: #fff; border-radius: 4px; list-style-type: none; } .c-resume__item { text-align: left; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .c-resume__item:first-of-type { margin-top: 0; } .c-resume__item:last-of-type { margin-bottom: 0; } .c-resume__title { font-weight: 700; } @media only screen and (min-width: 600px) { .c-resume__list { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } .c-resume__item { flex: 1 1 auto; margin: 0; border-left: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 40px; /* 9 */ padding-left: 2.5rem; /* 9 */ } .c-resume__item:first-of-type { padding: 0; border: none; } } .c-btn-download { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } .c-btn-download__icon { display: grid; place-items: center; background-color: #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 66px; /* 9 */ min-height: 4.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 50px; /* 9 */ max-width: 3.125rem; /* 9 */ } .c-btn-download__icon::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 50px; /* 9 */ font-size: 3.125rem; /* 9 */ color: #019DF4; background-color: #fff; } @media only screen and (max-width: 500px) { .c-btn-download { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ } } .c-figures-columns { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 925px; /* 9 */ max-width: 57.8125rem; /* 9 */ margin-left: auto; margin-right: auto; text-align: left; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ list-style-type: none; } .c-figures-columns__figure { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .c-figures-columns__figure::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 48px; /* 9 */ font-size: 3rem; /* 9 */ color: #019DF4; } @media only screen and (min-width: 768px) { .c-figures-columns { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ } } @media only screen and (min-width: 1024px) { .c-figures-columns { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 64px; /* 9 */ column-gap: 4rem; /* 9 */ } .c-figures-columns__column { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ } .c-figures-columns__figure { margin-bottom: 0; } } @media only screen and (max-width: 1023px) { .c-figures-columns { text-align: center; } } .c-definition-list { width: fit-content; } .c-definition-list__box { display: grid; grid-template-columns: 1fr 2fr; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .c-definition-list__box:first-of-type { padding-top: 0; } .c-definition-list__box:last-of-type { padding-bottom: 0; border: none; } .c-definition-list__term { font-weight: 700; } @media only screen and (min-width: 480px) { .c-definition-list__box { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } } .c-input-email__title { font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-input-email__box { position: relative; 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 8px; /* 9 */ padding-bottom: 0.5rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .c-input-email__box::before { position: absolute; top: 14px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 21px; /* 9 */ font-size: 1.3125rem; /* 9 */ color: #019DF4; } .c-input-email__input { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 32px; /* 9 */ padding-left: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 32px; /* 9 */ padding-right: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ border: none; color: #50535A; } .c-input-email__box, .c-input-email__input { background-color: transparent; } .c-footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 40px 0; /* 9 */ padding: 2.5rem 0; /* 9 */ color: #fff; background-color: #0B2739; } .c-footer__link { display: block; border-bottom: 1px solid #D3D4D3; } .c-footer__link:hover { color: #019DF4; } .c-footer__link-text { 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-footer__link-text::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 96px; /* 9 */ font-size: 6rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 5px; /* 9 */ margin-left: 0.3125rem; /* 9 */ } .c-footer__brand { position: relative; border-bottom: 1px solid; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ } .c-footer__img { width: 188px; transition: all 0.2s ease; } .c-footer__img_hover { position: absolute; top: 3px; left: 0; opacity: 0; } .c-footer__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .c-footer__list { color: #B6B7B7; } .is-dropdown-active .c-footer__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .c-footer__item { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-footer__item:hover { color: #fff; } .c-footer__item_inline { display: inline-block; margin-bottom: 0; } .c-footer__item_inline::after { content: "|"; /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 6px; /* 9 */ padding: 0 0.375rem; /* 9 */ } .c-footer__bottom { color: #B6B7B7; } .c-footer__ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .c-footer__ico:hover { color: #fff; } @media only screen and (max-width: 767px) { .c-footer__dropdown { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 8px; /* 9 */ padding: 1rem 0.5rem; /* 9 */ border-bottom: 1px solid; } .c-footer__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; } .c-footer__title::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ color: #019DF4; } } @media only screen and (min-width: 768px) { .c-footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 56px 0 24px 0; /* 9 */ padding: 3.5rem 0 1.5rem 0; /* 9 */ } .register-index-index .c-footer, .checkout-index-index .c-footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 32px; /* 9 */ padding-top: 2rem; /* 9 */ } .c-footer__grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 32px; /* 9 */ padding-top: 2rem; /* 9 */ column-count: 3; } .c-footer__dropdown { display: grid; page-break-inside: avoid; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 200px; /* 9 */ width: 12.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .c-footer__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .c-footer__list:not(.c-footer__dropdown .c-footer__list) { 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-footer__list.o-dropdown__content { max-height: initial; } .c-footer__title::after { display: none; } } @media only screen and (max-width: 1210px) { .c-footer__item_inline:last-child::after { display: none; } .c-footer__bottom { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 40px; /* 9 */ padding-top: 2.5rem; /* 9 */ } .c-footer__copy { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } } @media (max-width: 900px) { .c-footer__list:not(.c-footer__dropdown .c-footer__list) { -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .c-footer__social { flex: 1 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } } @media only screen and (min-width: 1210px) { .c-footer__grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 56px; /* 9 */ padding-bottom: 3.5rem; /* 9 */ column-count: 4; } .c-footer__bottom { 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; -webkit-box-align: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ border-top: 1px solid; } .c-footer__copy { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-footer__social { display: inline; line-height: 1; } } .c-preloader { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 999; 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; height: 100%; background-color: #fff; opacity: 0; visibility: hidden; transition: all 0.4s ease-in; } .is-preload .c-preloader { opacity: 1; background-color: rgba(255, 255, 255, 0.9); visibility: visible; } .c-preloader_position { position: relative; z-index: 8; } .c-preloader__box { display: grid; place-items: center; row-gap: 0px; line-height: 25px; } .c-preloader_z-index { z-index: 1000; } .c-preloader__circle { box-sizing: border-box; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 100px; /* 9 */ height: 6.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 100px; /* 9 */ width: 6.25rem; /* 9 */ padding-left: 40px; background-image: url("../images/LoadingMovistar.gif"); background-repeat: no-repeat; background-size: contain; } .c-preloader__textFw { font-weight: 600; font-size: 22px; } .c-preloader__text { color: #019DF4; } .c-preloader_textSize-24 { font-size: 18px; font-weight: 300; } #status { background-image: url("../images/LoadingMovistar.gif") !important; } @keyframes loading { 0% { transform: rotate(0deg); } 0% { transform: rotate(360deg); } } .c-menu-aside__action { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ background-color: #019DF4; } .c-menu-aside__action-btn, .c-menu-aside__action-txt { width: auto; } .c-menu-aside__action-txt, .c-menu-aside__buttons { 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; } .c-menu-aside__action-txt::before, .c-menu-aside__buttons::before { color: #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ font-weight: initial; } .c-menu-aside__buttons { width: 90%; margin-left: auto; margin-right: auto; padding: 0; } .c-menu-aside__action-txt { color: #fff; font-weight: 700; flex-direction: row-reverse; transition: all 0.4s linear; } .c-menu-aside__action-txt::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ transform: rotate(180deg); } .is-open .c-menu-aside__action-txt { flex-direction: row; } .is-open .c-menu-aside__action-txt::before { display: block; transform: rotate(0); } .c-menu-aside__btn-close { padding: 0; } .c-menu-aside__btn-close::before { display: block; color: transparent; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ font-weight: initial; transition: 0.4s; transform-origin: center; } .is-open .c-menu-aside__btn-close::before { color: #fff; content: ""; transform: rotate(-180deg); } .c-menu-aside__box { left: -1000px; z-index: 1; opacity: 0; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .is-open .c-menu-aside__box { left: 0; opacity: 1; min-height: 60%; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .is-open + .c-menu-aside__content { height: 670px; overflow: hidden; } .c-menu-aside__canvas, .c-menu-aside__content { width: 90% !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin-left: auto; margin-right: auto; } .c-menu-aside__list { position: relative; } .is-open-submenu .c-menu-aside__list { color: #019DF4; } .c-menu-aside__box, .c-submenu-aside, .c-submenu-third-aside, .c-submenu-fourth-aside { position: absolute; width: 100%; min-height: 100%; background-color: #fff; } .c-menu-aside__list, .c-submenu-aside__list, .c-submenu-third-aside__list, .c-submenu-fourth-aside__list { list-style-type: none; } .c-menu-aside__link, .c-submenu-aside__link, .c-submenu-third-aside__link, .c-submenu-fourth-aside__link, .c-subsubmenu-fourth__link { 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; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 10px; /* 9 */ padding: 1rem 0.625rem; /* 9 */ cursor: pointer; transition: all 0.4s ease-in; } .c-menu-aside__link::after, .c-submenu-aside__link::after, .c-submenu-third-aside__link::after, .c-submenu-fourth-aside__link::after, .c-subsubmenu-fourth__link::after { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .c-menu-aside__link:hover, .c-submenu-aside__link:hover, .c-submenu-third-aside__link:hover, .c-submenu-fourth-aside__link:hover, .c-subsubmenu-fourth__link:hover { color: #019DF4; } @media only screen and (max-width: 1023px) { .c-menu-aside__action-btn, .c-menu-aside__action-txt { width: 100%; } .is-open .c-menu-aside__action-btn { width: auto; } .c-submenu-aside { top: 0; left: -900px; opacity: 0; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .is-open-submenu .c-submenu-aside { left: 0; opacity: 1; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .c-submenu-third-aside { top: 0; left: -900px; opacity: 0; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .is-open-submenu-third .c-submenu-third-aside { left: 0; opacity: 1; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .c-submenu-fourth-aside { top: 0; left: -900px; opacity: 0; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } .is-open-submenu-fourth .c-submenu-fourth-aside { left: 0; opacity: 1; transition: all 1s cubic-bezier(0.4, 0, 0.2, 1); } } @media only screen and (min-width: 1024px) { .c-menu-aside__action-btn { pointer-events: none; } .c-menu-aside__action-txt::before, .c-menu-aside__action-txt::after, .c-menu-aside__btn-close::before, .c-menu-aside__btn-close::after { display: none; } .c-menu-aside__box, .c-submenu-aside, .c-submenu-third-aside, .c-submenu-fourth-aside { position: initial; width: auto; } .c-menu-aside__link, .c-submenu-aside__link, .c-submenu-third-aside__link, .c-submenu-fourth-aside__link, .c-subsubmenu-fourth__link { transition: all 0.4 ease-in; } .c-menu-aside__link::after, .c-submenu-aside__link::after, .c-submenu-third-aside__link::after, .c-submenu-fourth-aside__link::after, .c-subsubmenu-fourth__link::after { transform: rotate(90deg); } .c-menu-aside__box { opacity: 1; } .is-open-submenu .c-menu-aside__link { color: #019DF4; } .is-open-submenu .c-menu-aside__link::after { transform: rotate(-90deg); } .c-submenu-aside { max-height: 0; padding: 0; opacity: 0; transition: all 0.4s ease-in; visibility: hidden; } .is-open-submenu .c-submenu-aside { max-height: fit-content; opacity: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 24px; /* 9 */ padding-bottom: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ border-bottom: 1px solid #D3D4D3; transition: all 0.4s ease-in; visibility: visible; } .is-open-submenu-third .c-submenu-aside__link { color: #019DF4; } .is-open-submenu-third .c-submenu-aside__link::after { transform: rotate(-90deg); } .is-open-submenu-fourth .c-submenu-fourth-aside__link { color: #019DF4; } .is-open-submenu-fourth .c-submenu-fourth-aside__link::after { transform: rotate(-90deg); } .c-submenu-third-aside { max-height: 0; padding: 0; opacity: 0; transition: all 0.4s ease-in; overflow: hidden; } .is-open-submenu-third .c-submenu-third-aside { max-height: 1000px; opacity: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ transition: all 0.4s ease-in; overflow: visible; } .c-submenu-fourth-aside { max-height: 0; padding: 0; opacity: 0; transition: all 0.4s ease-in; overflow: hidden; } .is-open-submenu-fourth .c-submenu-fourth-aside { max-height: 1000px; opacity: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ transition: all 0.4s ease-in; overflow: visible; } } @media only screen and (max-width: 739px) { .pagebuilder-banner-wrapper { background-attachment: scroll !important; background-clip: padding-box; border-radius: inherit; box-sizing: border-box; overflow-wrap: break-word; word-wrap: break-word; } .pagebuilder-banner-wrapper .pagebuilder-overlay { -moz-transition: background-color 500ms ease; -o-transition: background-color 500ms ease; -webkit-transition: background-color 500ms ease; box-sizing: border-box; padding: 30px; position: relative; transition: background-color 500ms ease; } .pagebuilder-banner-wrapper .pagebuilder-overlay:not(.pagebuilder-poster-overlay) { max-width: none; max-width: 540px; } .pagebuilder-banner-wrapper .pagebuilder-overlay.pagebuilder-poster-overlay { align-items: center; display: flex; justify-content: center; } .pagebuilder-banner-wrapper [data-element=content] { min-height: 50px; overflow: auto; } .pagebuilder-banner-wrapper .pagebuilder-banner-button { -moz-transition: opacity 500ms ease; -o-transition: opacity 500ms ease; -webkit-transition: opacity 500ms ease; margin: 20px 0 0 0; max-width: 100%; text-align: inherit; transition: opacity 500ms ease; word-break: break-word; } .pagebuilder-banner-wrapper .pagebuilder-poster-content { width: 100%; } .pagebuilder-column { background-attachment: scroll !important; flex-basis: 100%; max-width: 100%; } .pagebuilder-column-group { flex-wrap: wrap; } .pagebuilder-column-line { flex-wrap: wrap; } [data-content-type=row][data-appearance=contained] [data-element=inner] { background-attachment: scroll !important; } [data-content-type=row][data-appearance=full-bleed] { background-attachment: scroll !important; } [data-content-type=row][data-appearance=full-width] { background-attachment: scroll !important; } .pagebuilder-slide-wrapper .pagebuilder-overlay:not(.pagebuilder-poster-overlay) { max-width: none; } [data-content-type=tab-item] { background-attachment: scroll !important; } .pagebuilder-mobile-hidden { display: none !important; } .pagebuilder-banner-wrapper.jarallax .video-overlay { z-index: 0; } [data-appearance=collage-centered] .pagebuilder-banner-wrapper .pagebuilder-overlay { margin-left: auto; margin-right: auto; } [data-appearance=collage-left] .pagebuilder-banner-wrapper .pagebuilder-overlay { margin-right: auto; } [data-appearance=collage-right] .pagebuilder-banner-wrapper .pagebuilder-overlay { margin-left: auto; } } .progress-container { position: relative; display: flex; align-items: center; justify-content: center; } .progress-circle { width: 64px; height: 64px; } .progress-circle .progress-bg { fill: none; stroke: #DDDDDD; stroke-width: 4; } .progress-circle .progress-bar { fill: none; stroke: #019DF4; stroke-width: 4; stroke-linecap: round; stroke-dasharray: 0 100; transition: stroke-dasharray 0.5s ease; transform-origin: 50% 50%; transform: rotate(0deg); /* Rotate to start at the top */ } @media only screen and (max-width: 768px) { .progress-circle { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 48px; /* 9 */ width: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 48px; /* 9 */ height: 3rem; /* 9 */ } } .progress-value { position: absolute; font-weight: bold; color: #737578; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } @media only screen and (max-width: 768px) { .progress-value { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } .hogar-cobertura-index .c-form__header-flex, .hogar-datos-index .c-form__header-flex, .hogar-cobertura-index .c-form__header-flex, .hogar-agendar-index .c-form__header-flex, .hogar-servicios-index .c-form__header-flex, .hogar-contrato-index .c-form__header-flex, .hogar-confronta-index .c-form__header-flex, .movistartotal-pospago-index .c-form__header-flex, .movistartotal-contrato-index .c-form__header-flex, .idvision-confronta-index .c-form__header-flex, .portabilidadmovistar-portabilidad-identidad .c-form__header-flex { display: flex; justify-content: space-between; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 35px; /* 9 */ margin-bottom: 2.1875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ width: 100%; max-width: 620px; } .hogar-cobertura-index .c-form__header-flex .c-form__title, .hogar-datos-index .c-form__header-flex .c-form__title, .hogar-cobertura-index .c-form__header-flex .c-form__title, .hogar-agendar-index .c-form__header-flex .c-form__title, .hogar-servicios-index .c-form__header-flex .c-form__title, .hogar-contrato-index .c-form__header-flex .c-form__title, .hogar-confronta-index .c-form__header-flex .c-form__title, .movistartotal-pospago-index .c-form__header-flex .c-form__title, .movistartotal-contrato-index .c-form__header-flex .c-form__title, .idvision-confronta-index .c-form__header-flex .c-form__title, .portabilidadmovistar-portabilidad-identidad .c-form__header-flex .c-form__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } @media only screen and (max-width: 1023px) { .hogar-cobertura-index .c-form__header-flex, .hogar-datos-index .c-form__header-flex, .hogar-cobertura-index .c-form__header-flex, .hogar-agendar-index .c-form__header-flex, .hogar-servicios-index .c-form__header-flex, .hogar-contrato-index .c-form__header-flex, .hogar-confronta-index .c-form__header-flex, .movistartotal-pospago-index .c-form__header-flex, .movistartotal-contrato-index .c-form__header-flex, .idvision-confronta-index .c-form__header-flex, .portabilidadmovistar-portabilidad-identidad .c-form__header-flex { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } } .hogar-cobertura-index .title32, .hogar-datos-index .title32, .hogar-cobertura-index .title32, .hogar-agendar-index .title32, .hogar-servicios-index .title32, .hogar-contrato-index .title32, .hogar-confronta-index .title32, .movistartotal-pospago-index .title32, .movistartotal-contrato-index .title32, .idvision-confronta-index .title32, .portabilidadmovistar-portabilidad-identidad .title32 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ font-weight: 400; color: #313235; } @media only screen and (max-width: 1023px) { .hogar-cobertura-index .title32, .hogar-datos-index .title32, .hogar-cobertura-index .title32, .hogar-agendar-index .title32, .hogar-servicios-index .title32, .hogar-contrato-index .title32, .hogar-confronta-index .title32, .movistartotal-pospago-index .title32, .movistartotal-contrato-index .title32, .idvision-confronta-index .title32, .portabilidadmovistar-portabilidad-identidad .title32 { font-size: 22px !important; font-weight: 400; } } .hogar-cobertura-index .subtitle18, .hogar-datos-index .subtitle18, .hogar-cobertura-index .subtitle18, .hogar-agendar-index .subtitle18, .hogar-servicios-index .subtitle18, .hogar-contrato-index .subtitle18, .hogar-confronta-index .subtitle18, .movistartotal-pospago-index .subtitle18, .movistartotal-contrato-index .subtitle18, .idvision-confronta-index .subtitle18, .portabilidadmovistar-portabilidad-identidad .subtitle18 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ font-weight: 300; color: #737578; } @media only screen and (max-width: 1023px) { .hogar-cobertura-index .subtitle18, .hogar-datos-index .subtitle18, .hogar-cobertura-index .subtitle18, .hogar-agendar-index .subtitle18, .hogar-servicios-index .subtitle18, .hogar-contrato-index .subtitle18, .hogar-confronta-index .subtitle18, .movistartotal-pospago-index .subtitle18, .movistartotal-contrato-index .subtitle18, .idvision-confronta-index .subtitle18, .portabilidadmovistar-portabilidad-identidad .subtitle18 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } .f-c-tabs { position: relative; text-align: center; background-color: #EEEEEE; transition: all 0.2s ease-in-out; overflow: hidden; /*&::before { content: ""; position: absolute; top: 0; right: 0; bottom: auto; left: 0; width: 100%; @include px-to-rem(height, 68px); background-color: $c-neutro; }*/ } .f-c-tabs__control { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 6px; /* 9 */ padding: 0.375rem; /* 9 */ background: #fff; box-shadow: 0px 3.92795px 10.8019px rgba(56, 100, 166, 0.12); overflow: auto; } .f-c-tabs__tab { -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-box-flex: 1; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ line-height: 1; font-weight: 700; color: #0B2739; background: #EEEEEE; } .f-c-tabs__tab:hover, .f-c-tabs__tab.is-tab-active { color: #fff; background-color: #0B2739; } .f-c-tabs__tab_brand { display: inline-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; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 4px; /* 9 */ row-gap: 0.25rem; /* 9 */ } .f-c-tabs__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 56px; /* 9 */ padding-bottom: 3.5rem; /* 9 */ transition: all 0.2s ease-in-out; } .f-c-tabs__content_pb0 { padding-bottom: 0; } .f-c-tabs__ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 60px; /* 9 */ min-width: 3.75rem; /* 9 */ font-weight: 700; color: #0B2739; } .f-c-tabs__divider { display: inline-block; /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 0 16px; /* 9 */ margin: 0 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ transform: rotate(45deg); color: #019DF4; } .f-c-tabs__btn { border: none; color: #0B2739; background-color: #fff; } .f-c-tabs__btn:hover, .f-c-tabs__btn:focus, .f-c-tabs__btn:active, .f-c-tabs__btn.is-tab-active { color: #fff; background-color: #0B2739; } .f-c-tabs__btn:first-of-type { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .f-c-tabs__message { 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; } .f-c-tabs__message-caption { position: relative; text-align: left; } .f-c-tabs__message-title { font-weight: 100; } .f-c-tabs__message-txt { font-weight: 300; } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media screen and (max-width: 739px) { .f-c-tabs__control, .f-c-tabs__description { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .f-c-tabs__tab { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 118px; /* 9 */ max-width: 7.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 40px; /* 9 */ min-height: 2.5rem; /* 9 */ margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 3px 4px; /* 9 */ padding: 0.1875rem 0.25rem; /* 9 */ } .f-c-tabs__tab_brand { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .f-c-tabs__subtabs { display: none; flex-wrap: wrap; row-gap: 8px; align-items: center; justify-content: center; } } /*------------------------------------*\ Media querys Tablet a Desktop \*------------------------------------*/ @media screen and (min-width: 740px) { .f-c-tabs__control, .f-c-tabs__description { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .f-c-tabs__tab { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 13px 8px; /* 9 */ padding: 0.8125rem 0.5rem; /* 9 */ } .f-c-tabs__tab_brand { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 200px; /* 9 */ min-width: 12.5rem; /* 9 */ } } @media screen and (max-width: 990px) { .f-c-tabs__message { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 320px; /* 9 */ max-width: 20rem; /* 9 */ margin: 36px auto 0 auto; } .f-c-tabs__message-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 260px; /* 9 */ width: 16.25rem; /* 9 */ } .f-c-tabs__message-caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 16px; /* 9 */ top: 1rem; /* 9 */ left: -103px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 170px; /* 9 */ min-width: 10.625rem; /* 9 */ } .f-c-tabs__message-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ } .f-c-tabs__message-txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } @media screen and (min-width: 990px) { .f-c-tabs__message { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 720px; /* 9 */ max-width: 45rem; /* 9 */ margin: 72px 0 0 350px; } .f-c-tabs__message-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 480px; /* 9 */ max-width: 30rem; /* 9 */ } .f-c-tabs__message-caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 32px; /* 9 */ top: 2rem; /* 9 */ left: -180px; -webkit-align-self: center; -moz-align-self: center; -ms-flex-item-align: center; align-self: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 380px; /* 9 */ min-width: 23.75rem; /* 9 */ } .f-c-tabs__message-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 48px; /* 9 */ line-height: 3rem; /* 9 */ } .f-c-tabs__message-txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } } @media screen and (max-width: 1023px) { .f-c-tabs__control { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .f-c-tabs__img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 16px; /* 9 */ max-height: 1rem; /* 9 */ } } @media screen and (min-width: 1024px) { .f-c-tabs__control { display: inline-flex; margin-top: 0; margin-right: auto; margin-left: auto; } .f-c-tabs__tab { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 114px; /* 9 */ min-width: 7.125rem; /* 9 */ } .f-c-tabs__img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 26px; /* 9 */ max-height: 1.625rem; /* 9 */ } } .f-c-plan__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 14px; /* 9 */ padding: 1rem 0.875rem; /* 9 */ background: #fff; box-shadow: 0px 8px 8px rgba(11, 39, 57, 0.1); } .is-plan-recommended .f-c-plan__content { border: 2px solid #019DF4; } .is-plan-new .f-c-plan__content { border: 2px solid orange; } .f-c-plan__flag { display: none; } .is-plan-recommended .f-c-plan__flag { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #fff; background-color: #019DF4; } .f-c-plan__title, .f-c-plan__value, .f-c-plan__price { line-height: 1; } .f-c-plan__title { font-weight: 400; color: #0B2739; } .f-c-plan__value { display: block; color: #0B2739; } .f-c-plan__tag, .f-c-plan__benefit-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .f-c-plan__tag { display: inline-block; margin-left: 0; } .f-c-plan__price { color: #50535A; } .f-c-plan__price-wrap { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 2px; /* 9 */ column-gap: 0.125rem; /* 9 */ } .f-c-plan__price-normal { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ text-decoration: line-through; color: #86888C; } .f-c-plan__notify { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 6px; /* 9 */ border-radius: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 9px; /* 9 */ padding-top: 0.5625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 9px; /* 9 */ padding-bottom: 0.5625rem; /* 9 */ line-height: 1.2; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; background: #EEEEEE; } .f-c-plan__notify_brand { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ } .f-c-plan__notify-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 22px; /* 9 */ height: 1.375rem; /* 9 */ } .f-c-plan__notify-text_bold { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .f-c-plan__benefits { list-style: none; } .f-c-plan__benefit { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 16px; /* 9 */ column-gap: 1rem; /* 9 */ border-bottom: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 12px 0; /* 9 */ padding: 0.75rem 0; /* 9 */ line-height: 1.2; text-align: left; min-height: 55px; } .f-c-plan__benefit-img-wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 16px; /* 9 */ min-width: 1rem; /* 9 */ } .f-c-plan__benefit-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 16px; /* 9 */ max-height: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 16px; /* 9 */ max-width: 1rem; /* 9 */ } .f-c-plan__benefit-img_brand { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 40px; /* 9 */ max-width: 2.5rem; /* 9 */ } .f-c-plan__benefit-description, .f-c-plan__benefit-link { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .f-c-plan__benefit-link { text-decoration: none; } .f-c-plan__benefit-link:hover { text-decoration: underline; } .f-c-plan__toggle-btn { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ color: #019DF4; cursor: pointer; } .f-c-plan__toggle-btn::before { transition: 0.5s ease-in-out; } .f-c-plan__toggle-btn::after { content: attr(data-text-up); } .is-benefits-down .f-c-plan__toggle-btn::before { transform: rotate(180deg); } .is-benefits-down .f-c-plan__toggle-btn::after { content: attr(data-text-down); } .f-c-plan__toggle-btn.u-hidden { display: none; } .f-c-plan__toggle-content { overflow: hidden; transition: all 0.7s; } .is-benefits-down .f-c-plan__toggle-content { max-height: 1800px !important; } /*------------------------------------*\ Media querys Mobile \*------------------------------------*/ @media screen and (max-width: 739px) { .f-c-plan-wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ transform: none !important; } .f-c-plan-mb-0 { margin-bottom: 0; } .f-c-plan-wrap { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 32px; /* 9 */ row-gap: 2rem; /* 9 */ } .f-c-plan-arrow { display: none; } .f-c-plan { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 340px; /* 9 */ max-width: 21.25rem; /* 9 */ margin: 0 auto; } .f-c-plan__flag { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ border-radius: 8px 8px 0 0; /* 9 */ border-radius: 0.5rem 0.5rem 0 0; /* 9 */ } .is-plan-recommended .f-c-plan__content { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 0 0 8px 8px; /* 9 */ border-radius: 0 0 0.5rem 0.5rem; /* 9 */ } .f-c-plan__header { position: relative; 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: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .f-c-plan__header::before { content: ""; position: absolute; top: -32px; right: 0; bottom: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ left: -32px; /* 9 */ left: -2rem; /* 9 */ margin: auto; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 1px; /* 9 */ width: 0.0625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 44px; /* 9 */ height: 2.75rem; /* 9 */ background: #B6B7B7; } .f-c-plan__header-caption { -webkit-box-flex: 1; -webkit-flex: 1 1 45%; -moz-box-flex: 1; -moz-flex: 1 1 45%; -ms-flex: 1 1 45%; flex: 1 1 45%; } .f-c-plan__header-price { -webkit-box-flex: 1; -webkit-flex: 1 1 55%; -moz-box-flex: 1; -moz-flex: 1 1 55%; -ms-flex: 1 1 55%; flex: 1 1 55%; } .f-c-plan__title, .f-c-plan__value, .f-c-plan__price { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 12px; /* 9 */ margin-bottom: 0.75rem; /* 9 */ } .f-c-plan__title, .f-c-plan__price, .f-c-plan__price-dues { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .f-c-plan__value { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 38px; /* 9 */ font-size: 2.375rem; /* 9 */ } .f-c-plan__price-offer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 12px; /* 9 */ margin-bottom: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } .f-c-plan__notify { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 20px; /* 9 */ padding-right: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 20px; /* 9 */ padding-left: 1.25rem; /* 9 */ } .f-c-plan__notify_brand .f-c-plan__notify-text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ color: #0B2739; } .f-c-plan__benefit-header { 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-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 8px; /* 9 */ row-gap: 0.5rem; /* 9 */ } .f-c-plan__toggle-btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .is-benefits-down .f-c-plan__toggle-content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ margin: 24px 0 0; /* 9 */ margin: 1.5rem 0 0; /* 9 */ } .slashs-months { display: none; } } /*------------------------------------*\ Media querys Tablet y Desktop \*------------------------------------*/ @media screen and (min-width: 740px) { .f-c-plan-wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ } .f-c-plan-wrap.is-plans-centered { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .f-c-plan-arrow { right: -37px; left: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 30px; /* 9 */ width: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 30px; /* 9 */ height: 1.875rem; /* 9 */ border-radius: 50%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); background: #fff; color: #019DF4; } .f-c-plan-arrow.swiper-button-next { top: 43%; } .f-c-plan-arrow.swiper-button-disabled { color: #D3D4D3; } .f-c-plan-arrow::after { font-weight: 700; } .f-c-plan__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .f-c-plan-slide, .f-c-plan { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 204px; /* 9 */ max-width: 12.75rem; /* 9 */ } .f-c-plan { position: relative; } .is-plan-recommended .f-c-plan__flag { position: absolute; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -13px; /* 9 */ top: -0.8125rem; /* 9 */ right: 0; left: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 124px; /* 9 */ max-width: 7.75rem; /* 9 */ margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 2px; /* 9 */ border-radius: 0.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .f-c-plan__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 6px; /* 9 */ padding-right: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 6px; /* 9 */ padding-left: 0.375rem; /* 9 */ } .f-c-plan__header, .f-c-plan__notify { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .f-c-plan__notify { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } .f-c-plan__title, .f-c-plan__value, .f-c-plan__price { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .f-c-plan__value { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 56px; /* 9 */ font-size: 3.5rem; /* 9 */ } .f-c-plan__header-price { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } .f-c-plan__price { 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: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .f-c-plan__price-offer { margin-bottom: 0; font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } .f-c-plan__price-dues { font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ text-align: left; } .f-c-plan__notify { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 8px; /* 9 */ padding-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 8px; /* 9 */ padding-left: 0.5rem; /* 9 */ } .f-c-plan__notify-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 19px; /* 9 */ height: 1.1875rem; /* 9 */ } .f-c-plan__notify_brand .f-c-plan__notify-text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ color: #0B2739; } .f-c-plan__notify-text_bold { display: block; } .f-c-plan__benefits { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 12px; /* 9 */ padding-right: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 12px; /* 9 */ padding-left: 0.75rem; /* 9 */ } .f-c-plan__benefit:first-of-type { padding-top: 0; } .f-c-plan__benefit:last-of-type { border: none; } .is-list-hide .f-c-plan__benefit:nth-child(3) { border: none; } .f-c-plan__toggle-btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .f-c-plan__toggle-content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 5 */ /* 5 */ margin: 24px 0 0; /* 9 */ margin: 1.5rem 0 0; /* 9 */ } .f-c-plan__toggle-content.is-list-hide + .f-c-plan__toggle-btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 4px; /* 9 */ margin-top: 0.25rem; /* 9 */ } } .f-c-benefits .swiper-pagination-bullet.swiper-pagination-bullet-active { border-color: #019DF4; background-color: #019DF4; } .f-c-benefits__card-caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ line-height: 1.4; } /*------------------------------------*\ Media querys Mobile \*------------------------------------*/ @media screen and (max-width: 739px) { .f-c-benefits__card { max-height: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px 64px 16px; /* 9 */ padding: 1.5rem 4rem 1rem; /* 9 */ transition: all 0.2s ease-in; } .f-c-benefits__card.swiper-slide-active { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 2000px; /* 9 */ max-height: 125rem; /* 9 */ } .f-c-benefits__card-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 48px; /* 9 */ max-height: 3rem; /* 9 */ } .f-c-benefits__card-caption { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 210px; /* 9 */ max-width: 13.125rem; /* 9 */ margin-right: auto; margin-left: auto; } } /*------------------------------------*\ Media querys Desktop \*------------------------------------*/ @media screen and (min-width: 740px) { .f-c-benefits { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 16px; /* 9 */ padding: 0 1rem; /* 9 */ } .f-c-benefits.is-swiper { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ } .f-c-benefits__card { height: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px 8px; /* 9 */ padding: 1.5rem 0.5rem; /* 9 */ background: #fff; } .f-c-benefits__card-img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 102px; /* 9 */ max-width: 6.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 40px; /* 9 */ max-height: 2.5rem; /* 9 */ } } @media screen and (min-width: 1024px) { .is-centered .f-c-benefits__wrapper { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } } /*------------------------------------*\ Media querys Tablet \*------------------------------------*/ @media (min-width: 740px) and (max-width: 1024px) { .f-c-benefits { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 32px; /* 9 */ padding-bottom: 2rem; /* 9 */ } .f-c-benefits__card-slide, .f-c-benefits__card { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 202px; /* 9 */ min-width: 12.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 202px; /* 9 */ max-width: 12.625rem; /* 9 */ } } .f-c-service-card { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ background: #fff; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.12); transition: all 0.2s ease-in-out; } .f-c-service-card.is-card-active { border: 1px solid #019DF4; } .f-c-service-card-flag { position: relative; border: 1px solid #019DF4; } .f-c-service-card-flag::before { content: ""; position: absolute; top: -12px; left: -1px; right: -1px; bottom: -1px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ background: #EEEEEE; z-index: 2; opacity: 0.5; } .f-c-service-card__flag { position: absolute; top: -12px; right: 0; left: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 120px; /* 9 */ width: 7.5rem; /* 9 */ margin: 0 auto; border-radius: 4px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 2px 0; /* 9 */ padding: 0.125rem 0; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ font-weight: 700; color: #fff; background: #019DF4; } .f-c-service-card__img { width: auto; height: auto; } .f-c-service-card__footer { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 203px; /* 9 */ max-width: 12.6875rem; /* 9 */ } .f-c-service-card__txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .f-c-service-card__amount { line-height: 1; } .f-c-service-card__amount .f-c-plan__price-normal { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 11px; /* 9 */ font-size: 0.6875rem; /* 9 */ color: #D3D4D3; } .f-c-service-card__price-offert { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ font-weight: 300; } .f-c-service-card__btn { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px 16px; /* 9 */ padding: 0.5rem 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ z-index: 10; cursor: pointer; } @media screen and (max-width: 739px) { .f-c-service-wrap { -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: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 24px; /* 9 */ row-gap: 1.5rem; /* 9 */ } .f-c-service-card { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 340px; /* 9 */ max-width: 21.25rem; /* 9 */ } .f-c-service-card__inner { 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; } .f-c-service-card-flag .f-c-service-card__inner { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .f-c-service-card__figure:not(.f-c-service-card-flag .f-c-service-card__figure) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 68px; /* 9 */ max-width: 4.25rem; /* 9 */ } .f-c-service-card__header:not(.f-c-service-card-flag .f-c-service-card__header) { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 200px; /* 9 */ min-width: 12.5rem; /* 9 */ text-align: left; } .f-c-service-card__header:not(.f-c-service-card-flag .f-c-service-card__header)::before { content: ""; position: absolute; top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ right: 6px; /* 9 */ right: 0.375rem; /* 9 */ bottom: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 1px; /* 9 */ width: 0.0625rem; /* 9 */ height: 100%; margin: auto; background: #D3D4D3; } .f-c-service-card-flag .f-c-service-card__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ } .f-c-service-card__txt:not(.f-c-service-card-flag .f-c-service-card__txt) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 4px; /* 9 */ margin-top: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ } .f-c-service-card-flag .f-c-service-card__txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .f-c-service-swiper__btn, .f-c-service-swiper > .o-swiper-bullets { display: none; } } @media screen and (min-width: 740px) { .is-centered .f-c-service-wrap { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .f-c-service-card { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 148px; /* 9 */ max-width: 9.25rem; /* 9 */ height: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 250px; /* 9 */ min-height: 15.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 8px; /* 9 */ padding-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 8px; /* 9 */ padding-left: 0.5rem; /* 9 */ } .f-c-service-card__flag { width: max-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 1px 6px; /* 9 */ padding: 0.0625rem 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .f-c-service-card__inner:not(.f-c-service-card-flag .f-c-service-card__inner) { 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: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; height: 100%; } .f-c-service-card-flag .f-c-service-card__header { 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; height: 70px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .f-c-service-card__header-inner { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 70px; /* 9 */ height: 4.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .f-c-service-card__figure { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 78px; /* 9 */ max-width: 4.875rem; /* 9 */ } .f-c-service-card__txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .f-c-service-swiper { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ } .f-c-service-swiper__btn { top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 33px; /* 9 */ width: 2.0625rem; /* 9 */ height: 100%; background: #EEEEEE; z-index: 1; } .f-c-service-swiper__btn::after { position: absolute; 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 28px; /* 9 */ width: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 28px; /* 9 */ height: 1.75rem; /* 9 */ border-radius: 50%; color: #fff; background-color: #019DF4; } .f-c-service-swiper__btn.swiper-button-prev { left: -28px; } .f-c-service-swiper__btn.swiper-button-next { right: -16px; } } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media screen and (max-width: 739px) { .f-c-header-step__brand { background-color: #fff; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); } .f-c-header-step__content, .f-c-header-step__brand-inner { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin-left: auto; margin-right: auto; } .f-c-header-step__brand-inner { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ text-align: center; } .f-c-header-step__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 56px; /* 9 */ margin-top: 3.5rem; /* 9 */ } } /*------------------------------------*\ Media querys Desktop \*------------------------------------*/ @media screen and (min-width: 740px) { .f-c-header-step { background-color: #fff; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); } .f-c-header-step__wrap { 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; width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 40px; /* 9 */ column-gap: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 1125px; /* 9 */ max-width: 70.3125rem; /* 9 */ margin-left: auto; margin-right: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ } .f-c-header-step__content { margin: 0 auto; } } .f-c-calendar { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 24px; /* 9 */ padding: 1.5rem; /* 9 */ background-color: #fff; } .f-c-calendar__toolbar { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .f-c-calendar__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ font-weight: 400; color: #50535A; } .f-c-calendar__btn { line-height: 1; color: #019DF4; } .f-c-calendar__btn:hover, .f-c-calendar__btn:active { transform: scale(0.9); } .f-c-calendar__box { display: grid; grid-template-columns: repeat(7, 1fr); color: #019DF4; list-style: none; } .f-c-calendar__grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ border: 1px solid #D4D4D4; overflow: hidden; background-color: #FFFFFF; } .f-c-calendar__grid_day { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 16px 0; /* 9 */ padding: 1rem 0; /* 9 */ font-weight: 300; line-height: 1; cursor: pointer; transition: all 0.1s ease; } .f-c-calendar__grid_day:not(.f-c-calendar__grid_day:last-of-type) { border-right: 1px solid #D4D4D4; } .f-c-calendar__grid_day.is-invalid { background-color: #EEEEEE; cursor: not-allowed; pointer-events: none; color: #DDDDDD; } .f-c-calendar__grid_day.is-select { color: #fff; background-color: #019BEF; } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media screen and (max-width: 739px) { .f-c-calendar__header_day { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ padding: 8px 0; /* 9 */ padding: 0.5rem 0; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .f-c-calendar__grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } } /*------------------------------------*\ Media querys Desktop \*------------------------------------*/ @media screen and (min-width: 740px) { .f-c-calendar__header_day { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 16px 16px; /* 9 */ padding: 0 1rem 1rem; /* 9 */ } .f-c-calendar__grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } } .tab_region { display: flex; background-color: #FFFFFF; border-radius: 100px; align-items: center; justify-content: center; gap: 20px; height: 56px; width: max-content; padding: 0 10px; margin: 5px auto; box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.161); } .tab_region .tab_region-button { height: 40px; background-color: #F5F5F5; border-radius: 100px; padding: 0 20px; } .tab_region .active { background-color: #0b2739; color: #FFFFFF; } .pospago-portabilidad-identidad, .pospagov-portabilidad-identidad, .portabilidadmovistar-portabilidad-identidad { /*-----------------Rediseño-----------------*/ /*------------------------------------------*/ } .pospago-portabilidad-identidad .c-header-wrap, .pospagov-portabilidad-identidad .c-header-wrap, .portabilidadmovistar-portabilidad-identidad .c-header-wrap { z-index: 9 !important; } .pospago-portabilidad-identidad .modal-popup, .pospagov-portabilidad-identidad .modal-popup, .portabilidadmovistar-portabilidad-identidad .modal-popup { pointer-events: auto; } .pospago-portabilidad-identidad .c-form__field-canvas, .pospagov-portabilidad-identidad .c-form__field-canvas, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas { margin-bottom: 30px; } @media (max-width: 600px) { .pospago-portabilidad-identidad .c-form__field-canvas .lg-only, .pospagov-portabilidad-identidad .c-form__field-canvas .lg-only, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas .lg-only { display: none; } } .pospago-portabilidad-identidad .c-form__field-canvas.field-fechas, .pospagov-portabilidad-identidad .c-form__field-canvas.field-fechas, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas.field-fechas { -webkit-box-align: normal; -ms-flex-align: normal; -webkit-align-items: normal; -moz-align-items: normal; align-items: normal; margin-bottom: 15px; } @media (max-width: 600px) { .pospago-portabilidad-identidad .c-form__field-canvas.field-fechas, .pospagov-portabilidad-identidad .c-form__field-canvas.field-fechas, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas.field-fechas { margin-bottom: 0px; } } .pospago-portabilidad-identidad .c-form__field-canvas div#linea-portar, .pospago-portabilidad-identidad .c-form__field-canvas div#idNumberSpan, .pospagov-portabilidad-identidad .c-form__field-canvas div#linea-portar, .pospagov-portabilidad-identidad .c-form__field-canvas div#idNumberSpan, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas div#linea-portar, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas div#idNumberSpan { border: none !important; background: none !important; box-shadow: 0 4px 2px -2px #019DF4 !important; } @media (max-width: 600px) { .pospago-portabilidad-identidad .c-form__field-canvas div#linea-portar, .pospago-portabilidad-identidad .c-form__field-canvas div#idNumberSpan, .pospagov-portabilidad-identidad .c-form__field-canvas div#linea-portar, .pospagov-portabilidad-identidad .c-form__field-canvas div#idNumberSpan, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas div#linea-portar, .portabilidadmovistar-portabilidad-identidad .c-form__field-canvas div#idNumberSpan { margin-bottom: 20px; } } .pospago-portabilidad-identidad .c-form__actions_left, .pospagov-portabilidad-identidad .c-form__actions_left, .portabilidadmovistar-portabilidad-identidad .c-form__actions_left { text-align: left; } .pospago-portabilidad-identidad .text-tratamiento-datos, .pospagov-portabilidad-identidad .text-tratamiento-datos, .portabilidadmovistar-portabilidad-identidad .text-tratamiento-datos { justify-content: flex-start; } @media (max-width: 600px) { .pospago-portabilidad-identidad .text-tratamiento-datos, .pospagov-portabilidad-identidad .text-tratamiento-datos, .portabilidadmovistar-portabilidad-identidad .text-tratamiento-datos { justify-content: center; } } .pospago-portabilidad-identidad .sp-tratamiento-datos, .pospagov-portabilidad-identidad .sp-tratamiento-datos, .portabilidadmovistar-portabilidad-identidad .sp-tratamiento-datos { text-decoration: underline; cursor: pointer; color: #019df4; } .pospago-portabilidad-identidad .o-message__title_fs24, .pospagov-portabilidad-identidad .o-message__title_fs24, .portabilidadmovistar-portabilidad-identidad .o-message__title_fs24 { font-weight: 500; } @media screen and (max-width: 940px) { .pospago-portabilidad-identidad .o-message__title_fs24, .pospagov-portabilidad-identidad .o-message__title_fs24, .portabilidadmovistar-portabilidad-identidad .o-message__title_fs24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } } .pospago-portabilidad-identidad .c-form__field, .pospagov-portabilidad-identidad .c-form__field, .portabilidadmovistar-portabilidad-identidad .c-form__field { padding: 12px; background-color: #fff; } .pospago-portabilidad-identidad .c-form__field.is-error, .pospagov-portabilidad-identidad .c-form__field.is-error, .portabilidadmovistar-portabilidad-identidad .c-form__field.is-error { border: 1px solid red !important; } .pospago-portabilidad-identidad .c-form__field input, .pospagov-portabilidad-identidad .c-form__field input, .portabilidadmovistar-portabilidad-identidad .c-form__field input { font-size: 1em; line-height: 24px; } .pospago-portabilidad-identidad .c-form__field .c-form__select, .pospagov-portabilidad-identidad .c-form__field .c-form__select, .portabilidadmovistar-portabilidad-identidad .c-form__field .c-form__select { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 5px; /* 9 */ padding-left: 0.3125rem; /* 9 */ } .pospago-portabilidad-identidad .field-select .c-form__field, .pospagov-portabilidad-identidad .field-select .c-form__field, .portabilidadmovistar-portabilidad-identidad .field-select .c-form__field { padding: 12px 12px 0px; } .pospago-portabilidad-identidad .field-select .c-form__input:valid, .pospago-portabilidad-identidad .field-select .c-form__input:focus, .pospagov-portabilidad-identidad .field-select .c-form__input:valid, .pospagov-portabilidad-identidad .field-select .c-form__input:focus, .portabilidadmovistar-portabilidad-identidad .field-select .c-form__input:valid, .portabilidadmovistar-portabilidad-identidad .field-select .c-form__input:focus { position: relative; top: 0rem; } .pospago-portabilidad-identidad .field-select.form-select.documentype .c-form__field, .pospago-portabilidad-identidad .typeStreet.field-select .c-form__field, .pospagov-portabilidad-identidad .field-select.form-select.documentype .c-form__field, .pospagov-portabilidad-identidad .typeStreet.field-select .c-form__field, .portabilidadmovistar-portabilidad-identidad .field-select.form-select.documentype .c-form__field, .portabilidadmovistar-portabilidad-identidad .typeStreet.field-select .c-form__field { padding: 0px; } .pospago-portabilidad-identidad .field-select.form-select.documentype .c-form__field select, .pospago-portabilidad-identidad .typeStreet.field-select .c-form__field select, .pospagov-portabilidad-identidad .field-select.form-select.documentype .c-form__field select, .pospagov-portabilidad-identidad .typeStreet.field-select .c-form__field select, .portabilidadmovistar-portabilidad-identidad .field-select.form-select.documentype .c-form__field select, .portabilidadmovistar-portabilidad-identidad .typeStreet.field-select .c-form__field select { font-size: 1em; line-height: 24px; max-width: 100%; height: 51px; width: 100%; padding-left: 12px; padding-top: 15px; z-index: 5; } .pospago-portabilidad-identidad .typeDocument .c-form__icon_select::before, .pospagov-portabilidad-identidad .typeDocument .c-form__icon_select::before, .portabilidadmovistar-portabilidad-identidad .typeDocument .c-form__icon_select::before { z-index: 2; } .pospago-portabilidad-identidad .strong, .pospagov-portabilidad-identidad .strong, .portabilidadmovistar-portabilidad-identidad .strong { font-weight: bold; } .pospago-portabilidad-identidad .font-small, .pospagov-portabilidad-identidad .font-small, .portabilidadmovistar-portabilidad-identidad .font-small { font-size: 0.8em; } .pospago-portabilidad-identidad span.c-form__error-text, .pospagov-portabilidad-identidad span.c-form__error-text, .portabilidadmovistar-portabilidad-identidad span.c-form__error-text { padding-left: 0 !important; } .pospago-portabilidad-identidad span.c-form__message-text, .pospagov-portabilidad-identidad span.c-form__message-text, .portabilidadmovistar-portabilidad-identidad span.c-form__message-text { padding-left: 0 !important; color: #5cb615; font-size: 0.875rem; width: fit-content; } .pospago-portabilidad-identidad .errorNumberPortability.msj_fail, .pospagov-portabilidad-identidad .errorNumberPortability.msj_fail, .portabilidadmovistar-portabilidad-identidad .errorNumberPortability.msj_fail { background-color: #f8d2b3; border: 1px solid #f28d15; padding: 0px 20px !important; margin-bottom: 10px; } .pospago-portabilidad-identidad .modals-overlay, .pospagov-portabilidad-identidad .modals-overlay, .portabilidadmovistar-portabilidad-identidad .modals-overlay { background-color: rgba(11, 39, 57, 0.95); } .pospago-portabilidad-identidad .container_code, .pospagov-portabilidad-identidad .container_code, .portabilidadmovistar-portabilidad-identidad .container_code { width: 80%; margin: 0 auto 20px; } .pospago-portabilidad-identidad .center, .pospagov-portabilidad-identidad .center, .portabilidadmovistar-portabilidad-identidad .center { text-align: center; } .pospago-portabilidad-identidad .m-auto, .pospagov-portabilidad-identidad .m-auto, .portabilidadmovistar-portabilidad-identidad .m-auto { margin: auto; display: block; } .pospago-portabilidad-identidad .mt-20, .pospagov-portabilidad-identidad .mt-20, .portabilidadmovistar-portabilidad-identidad .mt-20 { margin-top: 20px; } .pospago-portabilidad-identidad a.disabled, .pospago-portabilidad-identidad .modals-overlay, .pospago-portabilidad-identidad .eventNone, .pospagov-portabilidad-identidad a.disabled, .pospagov-portabilidad-identidad .modals-overlay, .pospagov-portabilidad-identidad .eventNone, .portabilidadmovistar-portabilidad-identidad a.disabled, .portabilidadmovistar-portabilidad-identidad .modals-overlay, .portabilidadmovistar-portabilidad-identidad .eventNone { pointer-events: none !important; } @media (max-width: 600px) { .pospago-portabilidad-identidad #modal-nip, .pospagov-portabilidad-identidad #modal-nip, .portabilidadmovistar-portabilidad-identidad #modal-nip { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 10px; /* 9 */ padding-right: 0.625rem; /* 9 */ } .pospago-portabilidad-identidad .m-none, .pospagov-portabilidad-identidad .m-none, .portabilidadmovistar-portabilidad-identidad .m-none { display: none !important; } .pospago-portabilidad-identidad .container_code, .pospagov-portabilidad-identidad .container_code, .portabilidadmovistar-portabilidad-identidad .container_code { width: 100%; } .pospago-portabilidad-identidad .txt-nip, .pospagov-portabilidad-identidad .txt-nip, .portabilidadmovistar-portabilidad-identidad .txt-nip { margin: auto; } .pospago-portabilidad-identidad .txt-mobile-small *, .pospagov-portabilidad-identidad .txt-mobile-small *, .portabilidadmovistar-portabilidad-identidad .txt-mobile-small * { font-size: 0.8em; } .pospago-portabilidad-identidad .c-form__code-number, .pospagov-portabilidad-identidad .c-form__code-number, .portabilidadmovistar-portabilidad-identidad .c-form__code-number { width: 14vw; height: 20vw; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ } .pospago-portabilidad-identidad .c-form__title_big, .pospagov-portabilidad-identidad .c-form__title_big, .portabilidadmovistar-portabilidad-identidad .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 36px; /* 9 */ font-size: 2.25rem; /* 9 */ text-align: center; } .pospago-portabilidad-identidad #btnPortar, .pospagov-portabilidad-identidad #btnPortar, .portabilidadmovistar-portabilidad-identidad #btnPortar { max-width: 100%; } .pospago-portabilidad-identidad p.c-form__lead.c-form__lead_gray, .pospagov-portabilidad-identidad p.c-form__lead.c-form__lead_gray, .portabilidadmovistar-portabilidad-identidad p.c-form__lead.c-form__lead_gray { text-align: center; } } .pospago-portabilidad-identidad .modal-tratamiento .modal-inner-wrap, .pospagov-portabilidad-identidad .modal-tratamiento .modal-inner-wrap, .portabilidadmovistar-portabilidad-identidad .modal-tratamiento .modal-inner-wrap { margin-top: 2% !important; } @media (max-width: 600px) { .pospago-portabilidad-identidad .modal-tratamiento .modal-inner-wrap, .pospagov-portabilidad-identidad .modal-tratamiento .modal-inner-wrap, .portabilidadmovistar-portabilidad-identidad .modal-tratamiento .modal-inner-wrap { margin-top: 10% !important; } } .pospago-portabilidad-identidad .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago, .pospagov-portabilidad-identidad .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago, .portabilidadmovistar-portabilidad-identidad .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago { overflow-y: auto; } .pospago-portabilidad-identidad .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago .o-modal__footer, .pospagov-portabilidad-identidad .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago .o-modal__footer, .portabilidadmovistar-portabilidad-identidad .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago .o-modal__footer { text-align: center; } .pospago-portabilidad-identidad .header-tratamiento-datos, .pospagov-portabilidad-identidad .header-tratamiento-datos, .portabilidadmovistar-portabilidad-identidad .header-tratamiento-datos { text-align: center; } .pospago-portabilidad-identidad .header-tratamiento-datos p, .pospagov-portabilidad-identidad .header-tratamiento-datos p, .portabilidadmovistar-portabilidad-identidad .header-tratamiento-datos p { width: 70%; margin-left: auto; margin-right: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 26px; /* 9 */ line-height: 1.625rem; /* 9 */ color: #019DF4; } @media (max-width: 600px) { .pospago-portabilidad-identidad .header-tratamiento-datos p, .pospagov-portabilidad-identidad .header-tratamiento-datos p, .portabilidadmovistar-portabilidad-identidad .header-tratamiento-datos p { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 25px; /* 9 */ line-height: 1.5625rem; /* 9 */ } } .pospago-portabilidad-identidad .o-modal__content, .pospagov-portabilidad-identidad .o-modal__content, .portabilidadmovistar-portabilidad-identidad .o-modal__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 15px; /* 9 */ margin-bottom: 0.9375rem; /* 9 */ } .pospago-portabilidad-identidad .o-modal__content .contenido-tratamiento-datos, .pospagov-portabilidad-identidad .o-modal__content .contenido-tratamiento-datos, .portabilidadmovistar-portabilidad-identidad .o-modal__content .contenido-tratamiento-datos { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 18px; /* 9 */ line-height: 1.125rem; /* 9 */ text-align: justify; } @media (max-width: 600px) { .pospago-portabilidad-identidad .o-modal__content .contenido-tratamiento-datos, .pospagov-portabilidad-identidad .o-modal__content .contenido-tratamiento-datos, .portabilidadmovistar-portabilidad-identidad .o-modal__content .contenido-tratamiento-datos { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 16px; /* 9 */ line-height: 1rem; /* 9 */ } } .pospago-portabilidad-identidad .o-modal__content .titulo-whatsapp, .pospagov-portabilidad-identidad .o-modal__content .titulo-whatsapp, .portabilidadmovistar-portabilidad-identidad .o-modal__content .titulo-whatsapp { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ color: #019df4; font-weight: normal; } .pospago-portabilidad-identidad .o-modal__footer .btnContinuarTratamiento, .pospagov-portabilidad-identidad .o-modal__footer .btnContinuarTratamiento, .portabilidadmovistar-portabilidad-identidad .o-modal__footer .btnContinuarTratamiento { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 255px; /* 9 */ min-width: 15.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } @media (max-width: 600px) { .pospago-portabilidad-identidad .o-modal__footer .btnContinuarTratamiento, .pospagov-portabilidad-identidad .o-modal__footer .btnContinuarTratamiento, .portabilidadmovistar-portabilidad-identidad .o-modal__footer .btnContinuarTratamiento { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 150px; /* 9 */ min-width: 9.375rem; /* 9 */ } } .pospago-portabilidad-identidad .c-form__actions_left, .pospagov-portabilidad-identidad .c-form__actions_left, .portabilidadmovistar-portabilidad-identidad .c-form__actions_left { text-align: left; } .pospago-portabilidad-identidad span.c-form__error-text, .pospagov-portabilidad-identidad span.c-form__error-text, .portabilidadmovistar-portabilidad-identidad span.c-form__error-text { text-align: left; font-size: 12px; } .pospago-portabilidad-identidad .btnNextStep, .pospagov-portabilidad-identidad .btnNextStep, .portabilidadmovistar-portabilidad-identidad .btnNextStep { color: #019df4; border-radius: 60px; padding: 0 10px; font-size: 16px; text-decoration: underline; cursor: pointer; } .pospago-portabilidad-identidad .btnNextStep .i-arrow-right, .pospagov-portabilidad-identidad .btnNextStep .i-arrow-right, .portabilidadmovistar-portabilidad-identidad .btnNextStep .i-arrow-right { font-size: 12px; } .pospago-portabilidad-identidad .btnNextStep:disabled, .pospagov-portabilidad-identidad .btnNextStep:disabled, .portabilidadmovistar-portabilidad-identidad .btnNextStep:disabled { opacity: 0.6; } .pospago-portabilidad-identidad .u-hidden, .pospagov-portabilidad-identidad .u-hidden, .portabilidadmovistar-portabilidad-identidad .u-hidden { display: none !important; } .pospago-portabilidad-identidad .u-margin-bottom-0, .pospagov-portabilidad-identidad .u-margin-bottom-0, .portabilidadmovistar-portabilidad-identidad .u-margin-bottom-0 { margin-bottom: 0; } .pospago-portabilidad-identidad .c-numberPortability, .pospagov-portabilidad-identidad .c-numberPortability, .portabilidadmovistar-portabilidad-identidad .c-numberPortability { display: flex; align-items: baseline; } .pospago-portabilidad-identidad .c-numberPortability .c-form__actions_right, .pospagov-portabilidad-identidad .c-numberPortability .c-form__actions_right, .portabilidadmovistar-portabilidad-identidad .c-numberPortability .c-form__actions_right { margin-bottom: 1.5rem; } .pospago-portabilidad-identidad #btnPortar, .pospagov-portabilidad-identidad #btnPortar, .portabilidadmovistar-portabilidad-identidad #btnPortar { height: 52px; } .pospago-portabilidad-identidad .no-edit, .pospagov-portabilidad-identidad .no-edit, .portabilidadmovistar-portabilidad-identidad .no-edit { opacity: 0.4; } .pospago-portabilidad-identidad .no-edit *, .pospagov-portabilidad-identidad .no-edit *, .portabilidadmovistar-portabilidad-identidad .no-edit * { pointer-events: none; } .pospago-portabilidad-identidad span.select2-selection__arrow, .pospagov-portabilidad-identidad span.select2-selection__arrow, .portabilidadmovistar-portabilidad-identidad span.select2-selection__arrow { display: none; } @media screen and (max-width: 768px) { .pospago-portabilidad-identidad .mb-width-100, .pospagov-portabilidad-identidad .mb-width-100, .portabilidadmovistar-portabilidad-identidad .mb-width-100 { width: 100% !important; } .pospago-portabilidad-identidad .mb-row, .pospagov-portabilidad-identidad .mb-row, .portabilidadmovistar-portabilidad-identidad .mb-row { flex-direction: row; } .pospago-portabilidad-identidad #campoCalle, .pospago-portabilidad-identidad #campoNumCalle, .pospago-portabilidad-identidad #campoNum2Calle, .pospagov-portabilidad-identidad #campoCalle, .pospagov-portabilidad-identidad #campoNumCalle, .pospagov-portabilidad-identidad #campoNum2Calle, .portabilidadmovistar-portabilidad-identidad #campoCalle, .portabilidadmovistar-portabilidad-identidad #campoNumCalle, .portabilidadmovistar-portabilidad-identidad #campoNum2Calle { width: 33% !important; } .pospago-portabilidad-identidad .mb-row-gap-0, .pospagov-portabilidad-identidad .mb-row-gap-0, .portabilidadmovistar-portabilidad-identidad .mb-row-gap-0 { row-gap: 0; } .pospago-portabilidad-identidad .c-numberPortability, .pospagov-portabilidad-identidad .c-numberPortability, .portabilidadmovistar-portabilidad-identidad .c-numberPortability { flex-direction: column; } .pospago-portabilidad-identidad .c-numberPortability .c-form__actions_right.u-width-50, .pospagov-portabilidad-identidad .c-numberPortability .c-form__actions_right.u-width-50, .portabilidadmovistar-portabilidad-identidad .c-numberPortability .c-form__actions_right.u-width-50 { width: 100%; } .pospago-portabilidad-identidad .fieldsetNumPorta, .pospagov-portabilidad-identidad .fieldsetNumPorta, .portabilidadmovistar-portabilidad-identidad .fieldsetNumPorta { width: 100% !important; } } .pospago-confronta-index #alert_container { padding: 5px 15px; } .pospago-confronta-index #alert_container #alert_close_btn { padding: 0; margin-left: auto; } .pospago-confronta-index #alert_container #alert_close_btn .close_btn_ok::after { color: #5CB615; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .pospago-confronta-index #alert_container #alert_close_btn .close_btn_fail::after { color: #FF374A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .img-btnWhastApp { background-image: url("../images/btn-whatsapp.svg"); background-size: cover; background-repeat: no-repeat; background-position: center; border: none; padding: 10px 20px; cursor: pointer; z-index: 102; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } .img-btnWhastApp:hover { opacity: 0.9; } @media (max-width: 768px) { .img-btnWhastApp { right: 5%; bottom: 16.5%; } } @media (min-width: 769px) and (max-width: 1445px) { .img-btnWhastApp { right: 2.5%; bottom: 3%; } } @media (min-width: 1446px) { .img-btnWhastApp { right: 18%; bottom: 3%; } } .modal-small .modal-inner-wrap { width: 85% !important; max-width: 500px; height: auto; max-height: 90%; } .modal-content { background: #fff; padding: 2%; border-radius: 15px; } .action-close { background: white; width: 100%; text-align: right; } img.img-modalThankYou { margin: 1rem auto !important; max-width: 35%; display: block; } .modal-information .o-modal__header { text-align: center; } .modal-information .img-logo { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 48px; /* 9 */ width: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .modal-information .i-information { color: red; text-align: center; font-size: 50px; } .modal-information .i-information span { display: none; } .modal-information .message-principal { font-size: 32px; font-weight: 300; color: #0b2739; text-align: center; line-height: 40px; } .modal-information .message-number { font-size: 16px; font-weight: 400; line-height: 24px; color: #50535a; margin-top: 20px; margin-bottom: 25px; } .modal-information p { font-size: 28px; line-height: 40px; text-align: center; color: #0b2739; } .modal-information .input-phone { margin: 0px auto; width: 304px; height: 52px; border: 1px solid #019df4; } @media (max-width: 600px) { .modal-information .input-phone { width: auto; } } .modal-information .titleInfo { font-family: Telefonica; font-size: 24px; font-weight: 300; line-height: 30px; letter-spacing: 0em; text-align: center; color: #019df4; } @media (max-width: 600px) { .modal-information .titleInfo { font-family: Telefonica; font-size: 20px; font-weight: 300; line-height: 27px; letter-spacing: 0em; text-align: center; color: #0b2739; } } .modal-information .subTitleInfo { font-family: Telefonica; font-size: 24px; font-weight: 300; line-height: 30px; letter-spacing: 0em; text-align: center; color: #019df4; } @media (max-width: 600px) { .modal-information .subTitleInfo { font-family: Telefonica; font-size: 16px; font-weight: 300; line-height: 21px; letter-spacing: 0em; text-align: center; color: #0b2739; } } .modal-information .link { text-decoration: underline; display: block; text-align: center; padding-left: 45%; padding-top: 2%; } .modal-information .close { text-align: right; padding-right: 2%; } .modal-information .container-terms { display: flex; justify-content: center; width: 66%; margin-left: 17%; margin-right: 17%; } @media (max-width: 600px) { .modal-information .container-terms { margin-left: 5%; margin-right: 5%; width: auto; } } .modal-information .terms-text { font-size: 14px; font-weight: 400; line-height: 20px; color: #50535a; text-align: left; } .modal-information .link-terms { text-decoration: underline; color: #019df4; } .modal-information .container-center { display: flex; justify-content: center; } .modal-information .text-information { font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; color: #50535a; width: 90%; margin: 0px auto; padding-top: 15px; } .modal-information .text-information .c-whatsapp span { font-weight: bold; color: #5CB615; text-decoration: underline; } .modal-information .o-modal__footer { margin-top: 10px !important; } @media (max-width: 600px) { #btnContinuar { max-width: 100%; } .modal-information .i-information { font-size: 30px; } .modal-information .message-principal { font-size: 20px; font-weight: 300; line-height: 26px; } .modal-information .message-number { font-size: 13px; line-height: 20px; font-weight: 400; } .modal-information .terms-text { font-size: 14px; line-height: 20px; font-weight: 400; } .modal-information p { font-size: 15px; line-height: 20px; } .modal-information footer.modal-footer { margin-top: -15px; z-index: -1; } } div#inactividad, div#modal-inactividad-catag-libre, div#modal-inactividad-catag-repo, div#modal-inactividad-portabilidad, div#modal-inactividad-prepos, div#modal-inactividad-hogar, div#modal-inactividad-libre, div#modal-inactividad-repo { overflow-y: auto; padding: 0 !important; } div#inactividad .o-modal__content, div#modal-inactividad-catag-libre .o-modal__content, div#modal-inactividad-catag-repo .o-modal__content, div#modal-inactividad-portabilidad .o-modal__content, div#modal-inactividad-prepos .o-modal__content, div#modal-inactividad-hogar .o-modal__content, div#modal-inactividad-libre .o-modal__content, div#modal-inactividad-repo .o-modal__content { padding: 0; margin: 0; } div#inactividad .imgInactividad, div#modal-inactividad-catag-libre .imgInactividad, div#modal-inactividad-catag-repo .imgInactividad, div#modal-inactividad-portabilidad .imgInactividad, div#modal-inactividad-prepos .imgInactividad, div#modal-inactividad-hogar .imgInactividad, div#modal-inactividad-libre .imgInactividad, div#modal-inactividad-repo .imgInactividad { max-width: 50%; width: 50%; margin: auto; } div#inactividad .o-btn, div#inactividad .bg-white, div#modal-inactividad-catag-libre .o-btn, div#modal-inactividad-catag-libre .bg-white, div#modal-inactividad-catag-repo .o-btn, div#modal-inactividad-catag-repo .bg-white, div#modal-inactividad-portabilidad .o-btn, div#modal-inactividad-portabilidad .bg-white, div#modal-inactividad-prepos .o-btn, div#modal-inactividad-prepos .bg-white, div#modal-inactividad-hogar .o-btn, div#modal-inactividad-hogar .bg-white, div#modal-inactividad-libre .o-btn, div#modal-inactividad-libre .bg-white, div#modal-inactividad-repo .o-btn, div#modal-inactividad-repo .bg-white { width: 42%; margin: 10px auto 0; font-size: 14px !important; font-weight: 400; cursor: pointer; padding: 10px 20px; } div#inactividad .bg-white, div#modal-inactividad-catag-libre .bg-white, div#modal-inactividad-catag-repo .bg-white, div#modal-inactividad-portabilidad .bg-white, div#modal-inactividad-prepos .bg-white, div#modal-inactividad-hogar .bg-white, div#modal-inactividad-libre .bg-white, div#modal-inactividad-repo .bg-white { background-color: #fff; border: 1px solid #019df4; color: #019df4; } div#inactividad .c-form__box.u-width-100, div#modal-inactividad-catag-libre .c-form__box.u-width-100, div#modal-inactividad-catag-repo .c-form__box.u-width-100, div#modal-inactividad-portabilidad .c-form__box.u-width-100, div#modal-inactividad-prepos .c-form__box.u-width-100, div#modal-inactividad-hogar .c-form__box.u-width-100, div#modal-inactividad-libre .c-form__box.u-width-100, div#modal-inactividad-repo .c-form__box.u-width-100 { margin-bottom: 0; } div#inactividad .notShowModal, div#modal-inactividad-catag-libre .notShowModal, div#modal-inactividad-catag-repo .notShowModal, div#modal-inactividad-portabilidad .notShowModal, div#modal-inactividad-prepos .notShowModal, div#modal-inactividad-hogar .notShowModal, div#modal-inactividad-libre .notShowModal, div#modal-inactividad-repo .notShowModal { font-size: 12px; color: #019df4; cursor: pointer; text-decoration: underline; text-align: center; margin: 10px auto 20px; } div#inactividad .c-phoneC2C, div#modal-inactividad-catag-libre .c-phoneC2C, div#modal-inactividad-catag-repo .c-phoneC2C, div#modal-inactividad-portabilidad .c-phoneC2C, div#modal-inactividad-prepos .c-phoneC2C, div#modal-inactividad-hogar .c-phoneC2C, div#modal-inactividad-libre .c-phoneC2C, div#modal-inactividad-repo .c-phoneC2C { width: 62%; margin: auto; } div#inactividad .c-phoneC2C .pospago-portabilidad-identidad .c-form__field, div#modal-inactividad-catag-libre .c-phoneC2C .pospago-portabilidad-identidad .c-form__field, div#modal-inactividad-catag-repo .c-phoneC2C .pospago-portabilidad-identidad .c-form__field, div#modal-inactividad-portabilidad .c-phoneC2C .pospago-portabilidad-identidad .c-form__field, div#modal-inactividad-prepos .c-phoneC2C .pospago-portabilidad-identidad .c-form__field, div#modal-inactividad-hogar .c-phoneC2C .pospago-portabilidad-identidad .c-form__field, div#modal-inactividad-libre .c-phoneC2C .pospago-portabilidad-identidad .c-form__field, div#modal-inactividad-repo .c-phoneC2C .pospago-portabilidad-identidad .c-form__field { padding: 10px; } div#inactividad .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field, div#modal-inactividad-catag-libre .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field, div#modal-inactividad-catag-repo .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field, div#modal-inactividad-portabilidad .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field, div#modal-inactividad-prepos .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field, div#modal-inactividad-hogar .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field, div#modal-inactividad-libre .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field, div#modal-inactividad-repo .c-phoneC2C .pospagov-portabilidad-identidad .c-form__field { padding: 10px; } div#inactividad #msjResponseC2C, div#modal-inactividad-catag-libre #msjResponseC2C, div#modal-inactividad-catag-repo #msjResponseC2C, div#modal-inactividad-portabilidad #msjResponseC2C, div#modal-inactividad-prepos #msjResponseC2C, div#modal-inactividad-hogar #msjResponseC2C, div#modal-inactividad-libre #msjResponseC2C, div#modal-inactividad-repo #msjResponseC2C { padding: 5px 10px; margin: 10px auto; font-size: 12px; text-align: left; } div#inactividad #msjResponseC2C.msj_success, div#modal-inactividad-catag-libre #msjResponseC2C.msj_success, div#modal-inactividad-catag-repo #msjResponseC2C.msj_success, div#modal-inactividad-portabilidad #msjResponseC2C.msj_success, div#modal-inactividad-prepos #msjResponseC2C.msj_success, div#modal-inactividad-hogar #msjResponseC2C.msj_success, div#modal-inactividad-libre #msjResponseC2C.msj_success, div#modal-inactividad-repo #msjResponseC2C.msj_success { background-color: #bde4a4; border: 1px solid #5cb615; color: #313235; } div#inactividad #msjResponseC2C.msj_fail, div#modal-inactividad-catag-libre #msjResponseC2C.msj_fail, div#modal-inactividad-catag-repo #msjResponseC2C.msj_fail, div#modal-inactividad-portabilidad #msjResponseC2C.msj_fail, div#modal-inactividad-prepos #msjResponseC2C.msj_fail, div#modal-inactividad-hogar #msjResponseC2C.msj_fail, div#modal-inactividad-libre #msjResponseC2C.msj_fail, div#modal-inactividad-repo #msjResponseC2C.msj_fail { background-color: #f8d2b3; border: 1px solid #f28d15; } div#inactividad .c-form__label, div#modal-inactividad-catag-libre .c-form__label, div#modal-inactividad-catag-repo .c-form__label, div#modal-inactividad-portabilidad .c-form__label, div#modal-inactividad-prepos .c-form__label, div#modal-inactividad-hogar .c-form__label, div#modal-inactividad-libre .c-form__label, div#modal-inactividad-repo .c-form__label { font-size: 0.9rem; } aside.modal-popup.modal-popup.modal-small.modal-information.modal-inactividad.modal-slide._show { z-index: 903 !important; } .modal-inactividad .modal-content { padding: 0 !important; } @media (min-width: 1024px) and (max-width: 1200px) and (orientation: landscape) { #datos-personales-component .c-form { width: 100%; } } @media (min-width: 1024px) and (max-width: 1200px) and (orientation: portrait) { #datos-personales-component .c-form { width: 100%; } } /*-----------------Rediseño V2-----------------*/ .pospagov-portabilidad-identidad input:not(.c-form__code-number), .pospagov-portabilidad-sim input:not(.c-form__code-number), .pospagov-portabilidad-contrato input:not(.c-form__code-number), .pospagov-portabilidad-confronta input:not(.c-form__code-number), .portabilidadmovistar-portabilidad-identidad input:not(.c-form__code-number) { font-size: 18px !important; line-height: 24px; } .pospagov-portabilidad-identidad span.c-form__error-text, .pospagov-portabilidad-sim span.c-form__error-text, .pospagov-portabilidad-contrato span.c-form__error-text, .pospagov-portabilidad-confronta span.c-form__error-text, .portabilidadmovistar-portabilidad-identidad span.c-form__error-text { text-align: left; font-size: 12px; } .pospagov-portabilidad-identidad .btnNextStep, .pospagov-portabilidad-sim .btnNextStep, .pospagov-portabilidad-contrato .btnNextStep, .pospagov-portabilidad-confronta .btnNextStep, .portabilidadmovistar-portabilidad-identidad .btnNextStep { color: #019df4; border-radius: 60px; padding: 0 10px; font-size: 16px; text-decoration: underline; cursor: pointer; } .pospagov-portabilidad-identidad .btnNextStep .i-arrow-right, .pospagov-portabilidad-sim .btnNextStep .i-arrow-right, .pospagov-portabilidad-contrato .btnNextStep .i-arrow-right, .pospagov-portabilidad-confronta .btnNextStep .i-arrow-right, .portabilidadmovistar-portabilidad-identidad .btnNextStep .i-arrow-right { font-size: 12px; } .pospagov-portabilidad-identidad .btnNextStep:disabled, .pospagov-portabilidad-sim .btnNextStep:disabled, .pospagov-portabilidad-contrato .btnNextStep:disabled, .pospagov-portabilidad-confronta .btnNextStep:disabled, .portabilidadmovistar-portabilidad-identidad .btnNextStep:disabled { opacity: 0.6; } .pospagov-portabilidad-identidad .u-hidden, .pospagov-portabilidad-sim .u-hidden, .pospagov-portabilidad-contrato .u-hidden, .pospagov-portabilidad-confronta .u-hidden, .portabilidadmovistar-portabilidad-identidad .u-hidden { display: none !important; } .pospagov-portabilidad-identidad .u-margin-bottom-0, .pospagov-portabilidad-sim .u-margin-bottom-0, .pospagov-portabilidad-contrato .u-margin-bottom-0, .pospagov-portabilidad-confronta .u-margin-bottom-0, .portabilidadmovistar-portabilidad-identidad .u-margin-bottom-0 { margin-bottom: 0; } .pospagov-portabilidad-identidad .c-numberPortability, .pospagov-portabilidad-sim .c-numberPortability, .pospagov-portabilidad-contrato .c-numberPortability, .pospagov-portabilidad-confronta .c-numberPortability, .portabilidadmovistar-portabilidad-identidad .c-numberPortability { display: flex; align-items: baseline; } .pospagov-portabilidad-identidad .c-numberPortability .c-form__actions_right, .pospagov-portabilidad-sim .c-numberPortability .c-form__actions_right, .pospagov-portabilidad-contrato .c-numberPortability .c-form__actions_right, .pospagov-portabilidad-confronta .c-numberPortability .c-form__actions_right, .portabilidadmovistar-portabilidad-identidad .c-numberPortability .c-form__actions_right { margin-bottom: 1.5rem; } .pospagov-portabilidad-identidad #btnPortar, .pospagov-portabilidad-sim #btnPortar, .pospagov-portabilidad-contrato #btnPortar, .pospagov-portabilidad-confronta #btnPortar, .portabilidadmovistar-portabilidad-identidad #btnPortar { height: 52px; } .pospagov-portabilidad-identidad .no-edit, .pospagov-portabilidad-sim .no-edit, .pospagov-portabilidad-contrato .no-edit, .pospagov-portabilidad-confronta .no-edit, .portabilidadmovistar-portabilidad-identidad .no-edit { opacity: 1; } .pospagov-portabilidad-identidad .no-edit *, .pospagov-portabilidad-sim .no-edit *, .pospagov-portabilidad-contrato .no-edit *, .pospagov-portabilidad-confronta .no-edit *, .portabilidadmovistar-portabilidad-identidad .no-edit * { pointer-events: none; } .pospagov-portabilidad-identidad span.select2-selection__arrow, .pospagov-portabilidad-sim span.select2-selection__arrow, .pospagov-portabilidad-contrato span.select2-selection__arrow, .pospagov-portabilidad-confronta span.select2-selection__arrow, .portabilidadmovistar-portabilidad-identidad span.select2-selection__arrow { display: none; } .pospagov-portabilidad-identidad .pospago__space-progress-circle, .pospagov-portabilidad-sim .pospago__space-progress-circle, .pospagov-portabilidad-contrato .pospago__space-progress-circle, .pospagov-portabilidad-confronta .pospago__space-progress-circle, .portabilidadmovistar-portabilidad-identidad .pospago__space-progress-circle { display: flex; align-items: center; gap: 1rem; } @media (max-width: 600px) { .pospagov-portabilidad-identidad .pospago__space-progress-circle, .pospagov-portabilidad-sim .pospago__space-progress-circle, .pospagov-portabilidad-contrato .pospago__space-progress-circle, .pospagov-portabilidad-confronta .pospago__space-progress-circle, .portabilidadmovistar-portabilidad-identidad .pospago__space-progress-circle { justify-content: space-around; } } .pospagov-portabilidad-identidad .pospago__smal-progress-circle, .pospagov-portabilidad-sim .pospago__smal-progress-circle, .pospagov-portabilidad-contrato .pospago__smal-progress-circle, .pospagov-portabilidad-confronta .pospago__smal-progress-circle, .portabilidadmovistar-portabilidad-identidad .pospago__smal-progress-circle { width: 50px !important; height: 50px !important; } .pospagov-portabilidad-identidad .c-form_field__confronta-pospago, .pospagov-portabilidad-sim .c-form_field__confronta-pospago, .pospagov-portabilidad-contrato .c-form_field__confronta-pospago, .pospagov-portabilidad-confronta .c-form_field__confronta-pospago, .portabilidadmovistar-portabilidad-identidad .c-form_field__confronta-pospago { box-shadow: 0 0px 29px rgba(0, 0, 0, 0.1); width: 70%; margin: 0 auto; } .pospagov-portabilidad-identidad .c-form__btn_full_pospago, .pospagov-portabilidad-sim .c-form__btn_full_pospago, .pospagov-portabilidad-contrato .c-form__btn_full_pospago, .pospagov-portabilidad-confronta .c-form__btn_full_pospago, .portabilidadmovistar-portabilidad-identidad .c-form__btn_full_pospago { width: 25%; height: 48px; margin-right: 1rem; } @media (max-width: 600px) { .pospagov-portabilidad-identidad .c-form__btn_full_pospago, .pospagov-portabilidad-sim .c-form__btn_full_pospago, .pospagov-portabilidad-contrato .c-form__btn_full_pospago, .pospagov-portabilidad-confronta .c-form__btn_full_pospago, .portabilidadmovistar-portabilidad-identidad .c-form__btn_full_pospago { width: 80%; height: auto; margin-right: 0; } } .pospagov-portabilidad-identidad .line__pospago-horizontal, .pospagov-portabilidad-sim .line__pospago-horizontal, .pospagov-portabilidad-contrato .line__pospago-horizontal, .pospagov-portabilidad-confronta .line__pospago-horizontal, .portabilidadmovistar-portabilidad-identidad .line__pospago-horizontal { width: 80%; margin-top: 18px; opacity: 0.4; } @media (max-width: 600px) { .pospagov-portabilidad-identidad .line__pospago-horizontal, .pospagov-portabilidad-sim .line__pospago-horizontal, .pospagov-portabilidad-contrato .line__pospago-horizontal, .pospagov-portabilidad-confronta .line__pospago-horizontal, .portabilidadmovistar-portabilidad-identidad .line__pospago-horizontal { width: 100%; } } .pospagov-portabilidad-identidad .step__pospago-confronta, .pospagov-portabilidad-sim .step__pospago-confronta, .pospagov-portabilidad-contrato .step__pospago-confronta, .pospagov-portabilidad-confronta .step__pospago-confronta, .portabilidadmovistar-portabilidad-identidad .step__pospago-confronta { font-size: 18px; font-weight: 600; } .pospagov-portabilidad-identidad .c-form__actions_right_pospago, .pospagov-portabilidad-sim .c-form__actions_right_pospago, .pospagov-portabilidad-contrato .c-form__actions_right_pospago, .pospagov-portabilidad-confronta .c-form__actions_right_pospago, .portabilidadmovistar-portabilidad-identidad .c-form__actions_right_pospago { text-align: right; } @media (max-width: 600px) { .pospagov-portabilidad-identidad .c-form__actions_right_pospago, .pospagov-portabilidad-sim .c-form__actions_right_pospago, .pospagov-portabilidad-contrato .c-form__actions_right_pospago, .pospagov-portabilidad-confronta .c-form__actions_right_pospago, .portabilidadmovistar-portabilidad-identidad .c-form__actions_right_pospago { text-align: center; } } .pospagov-portabilidad-identidad #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-identidad #sim-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-sim #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-sim #sim-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-contrato #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-contrato #sim-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-confronta #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-confronta #sim-form .fieldSelect2 .c-form__box, .portabilidadmovistar-portabilidad-identidad #datos-personales-form .fieldSelect2 .c-form__box, .portabilidadmovistar-portabilidad-identidad #sim-form .fieldSelect2 .c-form__box { max-width: 350px; } @media (max-width: 768px) { .pospagov-portabilidad-identidad #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-identidad #sim-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-sim #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-sim #sim-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-contrato #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-contrato #sim-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-confronta #datos-personales-form .fieldSelect2 .c-form__box, .pospagov-portabilidad-confronta #sim-form .fieldSelect2 .c-form__box, .portabilidadmovistar-portabilidad-identidad #datos-personales-form .fieldSelect2 .c-form__box, .portabilidadmovistar-portabilidad-identidad #sim-form .fieldSelect2 .c-form__box { max-width: 100%; } } .pospagov-portabilidad-identidad #datos-personales-form .fieldSelect2 .c-form__field, .pospagov-portabilidad-identidad #sim-form .fieldSelect2 .c-form__field, .pospagov-portabilidad-sim #datos-personales-form .fieldSelect2 .c-form__field, .pospagov-portabilidad-sim #sim-form .fieldSelect2 .c-form__field, .pospagov-portabilidad-contrato #datos-personales-form .fieldSelect2 .c-form__field, .pospagov-portabilidad-contrato #sim-form .fieldSelect2 .c-form__field, .pospagov-portabilidad-confronta #datos-personales-form .fieldSelect2 .c-form__field, .pospagov-portabilidad-confronta #sim-form .fieldSelect2 .c-form__field, .portabilidadmovistar-portabilidad-identidad #datos-personales-form .fieldSelect2 .c-form__field, .portabilidadmovistar-portabilidad-identidad #sim-form .fieldSelect2 .c-form__field { padding: 0; } .pospagov-portabilidad-identidad #datos-personales-form span.select2-selection.select2-selection--single, .pospagov-portabilidad-identidad #sim-form span.select2-selection.select2-selection--single, .pospagov-portabilidad-sim #datos-personales-form span.select2-selection.select2-selection--single, .pospagov-portabilidad-sim #sim-form span.select2-selection.select2-selection--single, .pospagov-portabilidad-contrato #datos-personales-form span.select2-selection.select2-selection--single, .pospagov-portabilidad-contrato #sim-form span.select2-selection.select2-selection--single, .pospagov-portabilidad-confronta #datos-personales-form span.select2-selection.select2-selection--single, .pospagov-portabilidad-confronta #sim-form span.select2-selection.select2-selection--single, .portabilidadmovistar-portabilidad-identidad #datos-personales-form span.select2-selection.select2-selection--single, .portabilidadmovistar-portabilidad-identidad #sim-form span.select2-selection.select2-selection--single { border: none !important; height: 50px !important; } .pospagov-portabilidad-identidad #datos-personales-form span.select2-selection__rendered, .pospagov-portabilidad-identidad #sim-form span.select2-selection__rendered, .pospagov-portabilidad-sim #datos-personales-form span.select2-selection__rendered, .pospagov-portabilidad-sim #sim-form span.select2-selection__rendered, .pospagov-portabilidad-contrato #datos-personales-form span.select2-selection__rendered, .pospagov-portabilidad-contrato #sim-form span.select2-selection__rendered, .pospagov-portabilidad-confronta #datos-personales-form span.select2-selection__rendered, .pospagov-portabilidad-confronta #sim-form span.select2-selection__rendered, .portabilidadmovistar-portabilidad-identidad #datos-personales-form span.select2-selection__rendered, .portabilidadmovistar-portabilidad-identidad #sim-form span.select2-selection__rendered { height: 50px !important; line-height: 65px !important; max-width: 95%; } .pospagov-portabilidad-identidad #datos-personales-form .select2-container--open .select2-dropdown, .pospagov-portabilidad-identidad #sim-form .select2-container--open .select2-dropdown, .pospagov-portabilidad-sim #datos-personales-form .select2-container--open .select2-dropdown, .pospagov-portabilidad-sim #sim-form .select2-container--open .select2-dropdown, .pospagov-portabilidad-contrato #datos-personales-form .select2-container--open .select2-dropdown, .pospagov-portabilidad-contrato #sim-form .select2-container--open .select2-dropdown, .pospagov-portabilidad-confronta #datos-personales-form .select2-container--open .select2-dropdown, .pospagov-portabilidad-confronta #sim-form .select2-container--open .select2-dropdown, .portabilidadmovistar-portabilidad-identidad #datos-personales-form .select2-container--open .select2-dropdown, .portabilidadmovistar-portabilidad-identidad #sim-form .select2-container--open .select2-dropdown { left: 17px !important; top: 1px !important; } .pospagov-portabilidad-identidad #datos-personales-form span.select2-selection__arrow, .pospagov-portabilidad-identidad #sim-form span.select2-selection__arrow, .pospagov-portabilidad-sim #datos-personales-form span.select2-selection__arrow, .pospagov-portabilidad-sim #sim-form span.select2-selection__arrow, .pospagov-portabilidad-contrato #datos-personales-form span.select2-selection__arrow, .pospagov-portabilidad-contrato #sim-form span.select2-selection__arrow, .pospagov-portabilidad-confronta #datos-personales-form span.select2-selection__arrow, .pospagov-portabilidad-confronta #sim-form span.select2-selection__arrow, .portabilidadmovistar-portabilidad-identidad #datos-personales-form span.select2-selection__arrow, .portabilidadmovistar-portabilidad-identidad #sim-form span.select2-selection__arrow { display: none !important; } .pospagov-portabilidad-identidad #datos-personales-form .c-form__icon, .pospagov-portabilidad-identidad #sim-form .c-form__icon, .pospagov-portabilidad-sim #datos-personales-form .c-form__icon, .pospagov-portabilidad-sim #sim-form .c-form__icon, .pospagov-portabilidad-contrato #datos-personales-form .c-form__icon, .pospagov-portabilidad-contrato #sim-form .c-form__icon, .pospagov-portabilidad-confronta #datos-personales-form .c-form__icon, .pospagov-portabilidad-confronta #sim-form .c-form__icon, .portabilidadmovistar-portabilidad-identidad #datos-personales-form .c-form__icon, .portabilidadmovistar-portabilidad-identidad #sim-form .c-form__icon { cursor: pointer; line-height: 50px; } .pospagov-portabilidad-identidad #datos-personales-form .select2-container--disabled .select2-selection--single, .pospagov-portabilidad-identidad #sim-form .select2-container--disabled .select2-selection--single, .pospagov-portabilidad-sim #datos-personales-form .select2-container--disabled .select2-selection--single, .pospagov-portabilidad-sim #sim-form .select2-container--disabled .select2-selection--single, .pospagov-portabilidad-contrato #datos-personales-form .select2-container--disabled .select2-selection--single, .pospagov-portabilidad-contrato #sim-form .select2-container--disabled .select2-selection--single, .pospagov-portabilidad-confronta #datos-personales-form .select2-container--disabled .select2-selection--single, .pospagov-portabilidad-confronta #sim-form .select2-container--disabled .select2-selection--single, .portabilidadmovistar-portabilidad-identidad #datos-personales-form .select2-container--disabled .select2-selection--single, .portabilidadmovistar-portabilidad-identidad #sim-form .select2-container--disabled .select2-selection--single { background-color: #fff; } .pospagov-portabilidad-identidad #datos-personales-form label.isValid, .pospagov-portabilidad-identidad #sim-form label.isValid, .pospagov-portabilidad-sim #datos-personales-form label.isValid, .pospagov-portabilidad-sim #sim-form label.isValid, .pospagov-portabilidad-contrato #datos-personales-form label.isValid, .pospagov-portabilidad-contrato #sim-form label.isValid, .pospagov-portabilidad-confronta #datos-personales-form label.isValid, .pospagov-portabilidad-confronta #sim-form label.isValid, .portabilidadmovistar-portabilidad-identidad #datos-personales-form label.isValid, .portabilidadmovistar-portabilidad-identidad #sim-form label.isValid { font-size: 14px !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ } @media screen and (max-width: 768px) { .pospagov-portabilidad-identidad .mb-width-100, .pospagov-portabilidad-sim .mb-width-100, .pospagov-portabilidad-contrato .mb-width-100, .pospagov-portabilidad-confronta .mb-width-100, .portabilidadmovistar-portabilidad-identidad .mb-width-100 { width: 100% !important; } .pospagov-portabilidad-identidad .mb-row, .pospagov-portabilidad-sim .mb-row, .pospagov-portabilidad-contrato .mb-row, .pospagov-portabilidad-confronta .mb-row, .portabilidadmovistar-portabilidad-identidad .mb-row { flex-direction: row; } .pospagov-portabilidad-identidad #campoCalle, .pospagov-portabilidad-identidad #campoNumCalle, .pospagov-portabilidad-identidad #campoNum2Calle, .pospagov-portabilidad-sim #campoCalle, .pospagov-portabilidad-sim #campoNumCalle, .pospagov-portabilidad-sim #campoNum2Calle, .pospagov-portabilidad-contrato #campoCalle, .pospagov-portabilidad-contrato #campoNumCalle, .pospagov-portabilidad-contrato #campoNum2Calle, .pospagov-portabilidad-confronta #campoCalle, .pospagov-portabilidad-confronta #campoNumCalle, .pospagov-portabilidad-confronta #campoNum2Calle, .portabilidadmovistar-portabilidad-identidad #campoCalle, .portabilidadmovistar-portabilidad-identidad #campoNumCalle, .portabilidadmovistar-portabilidad-identidad #campoNum2Calle { width: 33% !important; } .pospagov-portabilidad-identidad .mb-row-gap-0, .pospagov-portabilidad-sim .mb-row-gap-0, .pospagov-portabilidad-contrato .mb-row-gap-0, .pospagov-portabilidad-confronta .mb-row-gap-0, .portabilidadmovistar-portabilidad-identidad .mb-row-gap-0 { row-gap: 0; } .pospagov-portabilidad-identidad .c-numberPortability, .pospagov-portabilidad-sim .c-numberPortability, .pospagov-portabilidad-contrato .c-numberPortability, .pospagov-portabilidad-confronta .c-numberPortability, .portabilidadmovistar-portabilidad-identidad .c-numberPortability { flex-direction: column; } .pospagov-portabilidad-identidad .c-numberPortability .c-form__actions_right.u-width-50, .pospagov-portabilidad-sim .c-numberPortability .c-form__actions_right.u-width-50, .pospagov-portabilidad-contrato .c-numberPortability .c-form__actions_right.u-width-50, .pospagov-portabilidad-confronta .c-numberPortability .c-form__actions_right.u-width-50, .portabilidadmovistar-portabilidad-identidad .c-numberPortability .c-form__actions_right.u-width-50 { width: 100%; } .pospagov-portabilidad-identidad .fieldsetNumPorta, .pospagov-portabilidad-sim .fieldsetNumPorta, .pospagov-portabilidad-contrato .fieldsetNumPorta, .pospagov-portabilidad-confronta .fieldsetNumPorta, .portabilidadmovistar-portabilidad-identidad .fieldsetNumPorta { width: 100% !important; } } @media (max-width: 740px) { .pospagov-portabilidad-identidad .c-form__title_big, .pospagov-portabilidad-sim .c-form__title_big, .pospagov-portabilidad-contrato .c-form__title_big, .pospagov-portabilidad-confronta .c-form__title_big, .portabilidadmovistar-portabilidad-identidad .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ text-align: left; font-weight: 500; } .pospagov-portabilidad-identidad .pospago__space-progress-circle, .pospagov-portabilidad-sim .pospago__space-progress-circle, .pospagov-portabilidad-contrato .pospago__space-progress-circle, .pospagov-portabilidad-confronta .pospago__space-progress-circle, .portabilidadmovistar-portabilidad-identidad .pospago__space-progress-circle { justify-content: space-between !important; } .pospagov-portabilidad-identidad .o-section, .pospagov-portabilidad-sim .o-section, .pospagov-portabilidad-contrato .o-section, .pospagov-portabilidad-confronta .o-section, .portabilidadmovistar-portabilidad-identidad .o-section { margin-top: 0; } } .pospagov-portabilidad-identidad .m-auto.mt-20.txt-mobile-small, .pospagov-portabilidad-sim .m-auto.mt-20.txt-mobile-small, .pospagov-portabilidad-contrato .m-auto.mt-20.txt-mobile-small, .pospagov-portabilidad-confronta .m-auto.mt-20.txt-mobile-small, .portabilidadmovistar-portabilidad-identidad .m-auto.mt-20.txt-mobile-small { display: flex !important; align-items: center !important; } .pospago-portabilidad-sim, .pospagov-portabilidad-sim, .portabilidadmovistar-portabilidad-sim { /*--modal tiendas--*/ } .pospago-portabilidad-sim .center, .pospagov-portabilidad-sim .center, .portabilidadmovistar-portabilidad-sim .center { text-align: center; } .pospago-portabilidad-sim .right, .pospagov-portabilidad-sim .right, .portabilidadmovistar-portabilidad-sim .right { text-align: right; } .pospago-portabilidad-sim .c-form__title_2, .pospagov-portabilidad-sim .c-form__title_2, .portabilidadmovistar-portabilidad-sim .c-form__title_2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ color: #313235; line-height: 1.1; } .pospago-portabilidad-sim .c-form__title_3, .pospagov-portabilidad-sim .c-form__title_3, .portabilidadmovistar-portabilidad-sim .c-form__title_3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ color: #313235; line-height: 1.1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .pospago-portabilidad-sim .c-form__title_2, .pospagov-portabilidad-sim .c-form__title_2, .portabilidadmovistar-portabilidad-sim .c-form__title_2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ color: #313235; line-height: 1.1; } .pospago-portabilidad-sim .c-form__title_3, .pospagov-portabilidad-sim .c-form__title_3, .portabilidadmovistar-portabilidad-sim .c-form__title_3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ color: #313235; line-height: 1.1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .pospago-portabilidad-sim .sub-title, .pospagov-portabilidad-sim .sub-title, .portabilidadmovistar-portabilidad-sim .sub-title { color: #858585; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } .pospago-portabilidad-sim .fw-700, .pospagov-portabilidad-sim .fw-700, .portabilidadmovistar-portabilidad-sim .fw-700 { font-weight: 700; } .pospago-portabilidad-sim .fw-500, .pospagov-portabilidad-sim .fw-500, .portabilidadmovistar-portabilidad-sim .fw-500 { font-weight: 500; } .pospago-portabilidad-sim .strong, .pospagov-portabilidad-sim .strong, .portabilidadmovistar-portabilidad-sim .strong { font-weight: bold; } .pospago-portabilidad-sim .mv-2, .pospagov-portabilidad-sim .mv-2, .portabilidadmovistar-portabilidad-sim .mv-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .pospago-portabilidad-sim .strong, .pospagov-portabilidad-sim .strong, .portabilidadmovistar-portabilidad-sim .strong { font-weight: bold; } .pospago-portabilidad-sim .mv-2, .pospagov-portabilidad-sim .mv-2, .portabilidadmovistar-portabilidad-sim .mv-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .pospago-portabilidad-sim .icon-sim, .pospagov-portabilidad-sim .icon-sim, .portabilidadmovistar-portabilidad-sim .icon-sim { margin-right: 15px; color: #019df4; font-weight: 900; } .pospago-portabilidad-sim .icon-sim::before, .pospagov-portabilidad-sim .icon-sim::before, .portabilidadmovistar-portabilidad-sim .icon-sim::before { padding: 0; font-size: 12px; } .pospago-portabilidad-sim .c-radio-sim, .pospagov-portabilidad-sim .c-radio-sim, .portabilidadmovistar-portabilidad-sim .c-radio-sim { background-color: #fff; padding: 25px; width: 90%; border-radius: 8px; font-family: "Telefonica", sans-serif; font-size: 16px; line-height: 24px; } .pospago-portabilidad-sim .c-radio-sim .c-form__icon, .pospagov-portabilidad-sim .c-radio-sim .c-form__icon, .portabilidadmovistar-portabilidad-sim .c-radio-sim .c-form__icon { right: auto; } .pospago-portabilidad-sim .c-radio-sim .ml-35, .pospagov-portabilidad-sim .c-radio-sim .ml-35, .portabilidadmovistar-portabilidad-sim .c-radio-sim .ml-35 { margin-left: 35px; } .pospago-portabilidad-sim #tienda, .pospagov-portabilidad-sim #tienda, .portabilidadmovistar-portabilidad-sim #tienda { max-width: 100%; } .pospago-portabilidad-sim .f-c-calendar__grid_day.is-invalid, .pospagov-portabilidad-sim .f-c-calendar__grid_day.is-invalid, .portabilidadmovistar-portabilidad-sim .f-c-calendar__grid_day.is-invalid { cursor: not-allowed; background: linear-gradient(150deg, #f5f5f5, #f5f5f5 49px, #d0d0d0 50px, #f5f5f5 51px); pointer-events: none; text-align: center; } .pospago-portabilidad-sim .f-c-calendar__grid_day.is-current, .pospagov-portabilidad-sim .f-c-calendar__grid_day.is-current, .portabilidadmovistar-portabilidad-sim .f-c-calendar__grid_day.is-current { color: white !important; background: #0b2739 !important; } .pospago-portabilidad-sim .f-c-calendar__grid_day, .pospagov-portabilidad-sim .f-c-calendar__grid_day, .portabilidadmovistar-portabilidad-sim .f-c-calendar__grid_day { padding: 16px 0; padding: 1rem 0; font-weight: 300; line-height: 1; cursor: pointer; transition: all 0.1s ease; text-align: center; } .pospago-portabilidad-sim .c-selectEntrega, .pospagov-portabilidad-sim .c-selectEntrega, .portabilidadmovistar-portabilidad-sim .c-selectEntrega { margin-left: 0; margin-top: 0; } .pospago-portabilidad-sim .c-radio-sim.is-field-check, .pospagov-portabilidad-sim .c-radio-sim.is-field-check, .portabilidadmovistar-portabilidad-sim .c-radio-sim.is-field-check { border: 2px solid #019df4; border: 2px solid #019df4; } .pospago-portabilidad-sim .c-radio-sim.is-field-check .c-form__radio-button[type=radio]::before, .pospagov-portabilidad-sim .c-radio-sim.is-field-check .c-form__radio-button[type=radio]::before, .portabilidadmovistar-portabilidad-sim .c-radio-sim.is-field-check .c-form__radio-button[type=radio]::before { transform: scale(1); } .pospago-portabilidad-sim .c-radio-sim.is-field-check input, .pospagov-portabilidad-sim .c-radio-sim.is-field-check input, .portabilidadmovistar-portabilidad-sim .c-radio-sim.is-field-check input { border: 1px solid #019df4; } .pospago-portabilidad-sim .c-radio-sim:not(.is-field-check) input, .pospagov-portabilidad-sim .c-radio-sim:not(.is-field-check) input, .portabilidadmovistar-portabilidad-sim .c-radio-sim:not(.is-field-check) input { border: 1px solid #b6b7b7; } .pospago-portabilidad-sim .c-radio-sim:not(.is-field-check) .c-form__radio-button[type=radio]::before, .pospagov-portabilidad-sim .c-radio-sim:not(.is-field-check) .c-form__radio-button[type=radio]::before, .portabilidadmovistar-portabilidad-sim .c-radio-sim:not(.is-field-check) .c-form__radio-button[type=radio]::before { transform: scale(0); } .pospago-portabilidad-sim .info-sim, .pospagov-portabilidad-sim .info-sim, .portabilidadmovistar-portabilidad-sim .info-sim { background: #fff; border: none; padding: 20px 35px; font-size: 14px; line-height: 16px; } .pospago-portabilidad-sim .info-sim .c-form__icon, .pospagov-portabilidad-sim .info-sim .c-form__icon, .portabilidadmovistar-portabilidad-sim .info-sim .c-form__icon { right: unset; } .pospago-portabilidad-sim .info-sim .i-information::before, .pospagov-portabilidad-sim .info-sim .i-information::before, .portabilidadmovistar-portabilidad-sim .info-sim .i-information::before { color: #019df4; font-weight: 900; } .pospago-portabilidad-sim .info-sim div, .pospagov-portabilidad-sim .info-sim div, .portabilidadmovistar-portabilidad-sim .info-sim div { margin-left: 30px; } .pospago-portabilidad-sim .c-form__box .c-form__field, .pospagov-portabilidad-sim .c-form__box .c-form__field, .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field { background-color: #fff !important; padding: 12px; } .pospago-portabilidad-sim .c-form__box .c-form__field .address_select, .pospago-portabilidad-sim .c-form__box .c-form__field .c-form__select, .pospagov-portabilidad-sim .c-form__box .c-form__field .address_select, .pospagov-portabilidad-sim .c-form__box .c-form__field .c-form__select, .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field .address_select, .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field .c-form__select { max-width: 100%; } .pospago-portabilidad-sim .c-form__box .c-form__field .in-detalle-direccion, .pospagov-portabilidad-sim .c-form__box .c-form__field .in-detalle-direccion, .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field .in-detalle-direccion { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 8px; /* 9 */ top: 0.5rem; /* 9 */ } .pospago-portabilidad-sim .c-form__box .c-form__field .lb-detalle-direccion, .pospagov-portabilidad-sim .c-form__box .c-form__field .lb-detalle-direccion, .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field .lb-detalle-direccion { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -32px; /* 9 */ top: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #019DF4; } .pospago-portabilidad-sim .c-form__box .c-form__field.is-error .lb-detalle-direccion, .pospagov-portabilidad-sim .c-form__box .c-form__field.is-error .lb-detalle-direccion, .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field.is-error .lb-detalle-direccion { color: #FF374A; } .pospago-portabilidad-sim .c-form__box .c-form__text, .pospagov-portabilidad-sim .c-form__box .c-form__text, .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__text { display: block; text-align: left; } .pospago-portabilidad-sim .c-form__box.is-error .c-form__text, .pospagov-portabilidad-sim .c-form__box.is-error .c-form__text, .portabilidadmovistar-portabilidad-sim .c-form__box.is-error .c-form__text { display: none; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .c-form__box.is-error .c-form__text, .pospagov-portabilidad-sim .c-form__box.is-error .c-form__text, .portabilidadmovistar-portabilidad-sim .c-form__box.is-error .c-form__text { display: block; } } .pospago-portabilidad-sim .c-form__box-select .c-form__field, .pospagov-portabilidad-sim .c-form__box-select .c-form__field, .portabilidadmovistar-portabilidad-sim .c-form__box-select .c-form__field { padding: 9px 12px; border: 1px solid #019df4; } .pospago-portabilidad-sim .c-form__field.border-none, .pospagov-portabilidad-sim .c-form__field.border-none, .portabilidadmovistar-portabilidad-sim .c-form__field.border-none { width: auto; border: none; } .pospago-portabilidad-sim .ptoRetiro, .pospagov-portabilidad-sim .ptoRetiro, .portabilidadmovistar-portabilidad-sim .ptoRetiro { border-bottom: 1px solid #e6e6e6; margin-bottom: 20px; } .pospago-portabilidad-sim .tiendaSeleccionada, .pospagov-portabilidad-sim .tiendaSeleccionada, .portabilidadmovistar-portabilidad-sim .tiendaSeleccionada { max-width: 60%; } .pospago-portabilidad-sim .cambiarPto, .pospagov-portabilidad-sim .cambiarPto, .portabilidadmovistar-portabilidad-sim .cambiarPto { font-weight: 400; font-size: 16px; line-height: 65px; text-decoration-line: underline; color: #019df4; padding: 0 20px; cursor: pointer; } .pospago-portabilidad-sim .d-f, .pospagov-portabilidad-sim .d-f, .portabilidadmovistar-portabilidad-sim .d-f { display: flex; } .pospago-portabilidad-sim .max-h, .pospagov-portabilidad-sim .max-h, .portabilidadmovistar-portabilidad-sim .max-h { max-height: 340px; } .pospago-portabilidad-sim .tiendas_municipio ol, .pospagov-portabilidad-sim .tiendas_municipio ol, .portabilidadmovistar-portabilidad-sim .tiendas_municipio ol { list-style-type: none; } .pospago-portabilidad-sim .tiendas_municipio ol li, .pospagov-portabilidad-sim .tiendas_municipio ol li, .portabilidadmovistar-portabilidad-sim .tiendas_municipio ol li { padding: 15px; border: 1px solid #d8d8d8; border-radius: 4px; margin-bottom: 10px; cursor: pointer; } .pospago-portabilidad-sim .lugar, .pospagov-portabilidad-sim .lugar, .portabilidadmovistar-portabilidad-sim .lugar { font-style: normal; font-weight: 700; font-size: 18px; line-height: 24px; display: flex; align-items: center; color: #50535a; } .pospago-portabilidad-sim .centro, .pospagov-portabilidad-sim .centro, .portabilidadmovistar-portabilidad-sim .centro { font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; color: #0b2739; display: flex; } .pospago-portabilidad-sim .horario, .pospagov-portabilidad-sim .horario, .portabilidadmovistar-portabilidad-sim .horario { font-style: normal; font-weight: 400; font-size: 14px; line-height: 18px; color: #86888c; } .pospago-portabilidad-sim .o-modal__footer, .pospagov-portabilidad-sim .o-modal__footer, .portabilidadmovistar-portabilidad-sim .o-modal__footer { margin-top: 15px; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .lg-input, .pospagov-portabilidad-sim .lg-input, .portabilidadmovistar-portabilidad-sim .lg-input { display: none; } } .pospago-portabilidad-sim .mb-group-input, .pospagov-portabilidad-sim .mb-group-input, .portabilidadmovistar-portabilidad-sim .mb-group-input { display: none; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .mb-group-input, .pospagov-portabilidad-sim .mb-group-input, .portabilidadmovistar-portabilidad-sim .mb-group-input { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; } .pospago-portabilidad-sim .mb-group-input .u-mb-width-40, .pospagov-portabilidad-sim .mb-group-input .u-mb-width-40, .portabilidadmovistar-portabilidad-sim .mb-group-input .u-mb-width-40 { max-width: 40%; } .pospago-portabilidad-sim .mb-group-input .u-mb-width-25, .pospagov-portabilidad-sim .mb-group-input .u-mb-width-25, .portabilidadmovistar-portabilidad-sim .mb-group-input .u-mb-width-25 { max-width: 25%; } .pospago-portabilidad-sim .mb-group-input .mb-input, .pospagov-portabilidad-sim .mb-group-input .mb-input, .portabilidadmovistar-portabilidad-sim .mb-group-input .mb-input { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 15px; /* 9 */ margin-bottom: 0.9375rem; /* 9 */ } } @media (max-width: 600px) { .pospago-portabilidad-sim .m-none, .pospagov-portabilidad-sim .m-none, .portabilidadmovistar-portabilidad-sim .m-none { display: none !important; } .pospago-portabilidad-sim .tiendaSeleccionada, .pospago-portabilidad-sim .cambiarPto, .pospagov-portabilidad-sim .tiendaSeleccionada, .pospagov-portabilidad-sim .cambiarPto, .portabilidadmovistar-portabilidad-sim .tiendaSeleccionada, .portabilidadmovistar-portabilidad-sim .cambiarPto { width: 100%; margin: 0px !important; max-width: 100%; } .pospago-portabilidad-sim .cambiarPto, .pospagov-portabilidad-sim .cambiarPto, .portabilidadmovistar-portabilidad-sim .cambiarPto { text-align: right; } .pospago-portabilidad-sim .d-f, .pospagov-portabilidad-sim .d-f, .portabilidadmovistar-portabilidad-sim .d-f { display: block; } .pospago-portabilidad-sim .c-radio-sim, .pospagov-portabilidad-sim .c-radio-sim, .portabilidadmovistar-portabilidad-sim .c-radio-sim { width: 100%; padding: 12px; } .pospago-portabilidad-sim .c-radio-sim div, .pospagov-portabilidad-sim .c-radio-sim div, .portabilidadmovistar-portabilidad-sim .c-radio-sim div { display: flex; flex-direction: column; } .pospago-portabilidad-sim .c-radio-sim div .c-form__icon, .pospagov-portabilidad-sim .c-radio-sim div .c-form__icon, .portabilidadmovistar-portabilidad-sim .c-radio-sim div .c-form__icon { position: relative; margin-left: 0; } .pospago-portabilidad-sim .c-radio-sim div .ml-35, .pospagov-portabilidad-sim .c-radio-sim div .ml-35, .portabilidadmovistar-portabilidad-sim .c-radio-sim div .ml-35 { margin-left: 0; } .pospago-portabilidad-sim .m-center, .pospagov-portabilidad-sim .m-center, .portabilidadmovistar-portabilidad-sim .m-center { text-align: center; } .pospago-portabilidad-sim .info-sim, .pospagov-portabilidad-sim .info-sim, .portabilidadmovistar-portabilidad-sim .info-sim { padding: 16px; } .pospago-portabilidad-sim .info-sim div, .pospagov-portabilidad-sim .info-sim div, .portabilidadmovistar-portabilidad-sim .info-sim div { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 40px; /* 9 */ margin-left: 2.5rem; /* 9 */ } .pospago-portabilidad-sim .info-sim .i-information::before, .pospagov-portabilidad-sim .info-sim .i-information::before, .portabilidadmovistar-portabilidad-sim .info-sim .i-information::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .pospago-portabilidad-sim #boxBtn, .pospagov-portabilidad-sim #boxBtn, .portabilidadmovistar-portabilidad-sim #boxBtn { margin: 0 auto; text-align: center; padding: 16px; } .pospago-portabilidad-sim #boxBtn div, .pospagov-portabilidad-sim #boxBtn div, .portabilidadmovistar-portabilidad-sim #boxBtn div { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 40px; /* 9 */ margin-left: 2.5rem; /* 9 */ } .pospago-portabilidad-sim #boxBtn .i-information::before, .pospagov-portabilidad-sim #boxBtn .i-information::before, .portabilidadmovistar-portabilidad-sim #boxBtn .i-information::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .pospago-portabilidad-sim #boxBtn, .pospagov-portabilidad-sim #boxBtn, .portabilidadmovistar-portabilidad-sim #boxBtn { margin: 0 auto; text-align: center; } } .pospago-portabilidad-sim #alert_container.is-error, .pospagov-portabilidad-sim #alert_container.is-error, .portabilidadmovistar-portabilidad-sim #alert_container.is-error { padding: 0.6rem 0.8rem; margin-top: 1rem; } .pospago-portabilidad-sim #alert_container.is-error .c-callout__btn::after, .pospagov-portabilidad-sim #alert_container.is-error .c-callout__btn::after, .portabilidadmovistar-portabilidad-sim #alert_container.is-error .c-callout__btn::after { color: #ff374a; } .pospago-portabilidad-sim .c-form__error-text, .pospagov-portabilidad-sim .c-form__error-text, .portabilidadmovistar-portabilidad-sim .c-form__error-text { padding-left: 0; text-align: left; font-size: 10px; } .pospago-portabilidad-sim .c-form__box.u-width-90, .pospagov-portabilidad-sim .c-form__box.u-width-90, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-90 { width: 80%; } .pospago-portabilidad-sim .c-form__box.u-width-80, .pospagov-portabilidad-sim .c-form__box.u-width-80, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-80 { width: 90%; } .pospago-portabilidad-sim .c-form__box.u-width-45, .pospagov-portabilidad-sim .c-form__box.u-width-45, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-45 { width: 45%; } .pospago-portabilidad-sim .c-form__box.u-width-25, .pospagov-portabilidad-sim .c-form__box.u-width-25, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-25 { width: 25%; } .pospago-portabilidad-sim .c-form__box.u-width-5, .pospagov-portabilidad-sim .c-form__box.u-width-5, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-5 { width: 5%; } .pospago-portabilidad-sim .c-entrega, .pospagov-portabilidad-sim .c-entrega, .portabilidadmovistar-portabilidad-sim .c-entrega { background: #ffffff; border-radius: 6px; padding: 20px; } .pospago-portabilidad-sim .c-entrega h2, .pospagov-portabilidad-sim .c-entrega h2, .portabilidadmovistar-portabilidad-sim .c-entrega h2 { font-weight: 500; } .pospago-portabilidad-sim .c-entrega h2.title-2, .pospagov-portabilidad-sim .c-entrega h2.title-2, .portabilidadmovistar-portabilidad-sim .c-entrega h2.title-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 24px; /* 9 */ padding-left: 1.5rem; /* 9 */ margin-bottom: 0 !important; } .pospago-portabilidad-sim .c-entrega h3, .pospagov-portabilidad-sim .c-entrega h3, .portabilidadmovistar-portabilidad-sim .c-entrega h3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .pospago-portabilidad-sim .c-entrega .sub-title, .pospagov-portabilidad-sim .c-entrega .sub-title, .portabilidadmovistar-portabilidad-sim .c-entrega .sub-title { color: #86888C; margin-bottom: 0; } .pospago-portabilidad-sim .c-entrega h3, .pospagov-portabilidad-sim .c-entrega h3, .portabilidadmovistar-portabilidad-sim .c-entrega h3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .pospago-portabilidad-sim .c-entrega .sub-title, .pospagov-portabilidad-sim .c-entrega .sub-title, .portabilidadmovistar-portabilidad-sim .c-entrega .sub-title { color: #86888C; margin-bottom: 0; } .pospago-portabilidad-sim .c-entrega .subtitle-2, .pospagov-portabilidad-sim .c-entrega .subtitle-2, .portabilidadmovistar-portabilidad-sim .c-entrega .subtitle-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .pospago-portabilidad-sim .c-entrega .c-form__field-canvas, .pospagov-portabilidad-sim .c-entrega .c-form__field-canvas, .portabilidadmovistar-portabilidad-sim .c-entrega .c-form__field-canvas { margin-bottom: 0; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .c-entrega .c-form__field-canvas, .pospagov-portabilidad-sim .c-entrega .c-form__field-canvas, .portabilidadmovistar-portabilidad-sim .c-entrega .c-form__field-canvas { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } } .pospago-portabilidad-sim .c-entrega .c-form__radio-button-label, .pospagov-portabilidad-sim .c-entrega .c-form__radio-button-label, .portabilidadmovistar-portabilidad-sim .c-entrega .c-form__radio-button-label { grid-template-columns: 5px auto !important; } .pospago-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar, .pospagov-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar, .portabilidadmovistar-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar { column-gap: 0; margin-top: 20px; } .pospago-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar .c-form__field, .pospagov-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar .c-form__field, .portabilidadmovistar-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar .c-form__field { padding: 12px !important; color: #019df4; border: none; width: 0; margin-right: 10px; margin-left: -5px; } .pospago-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar .c-form__icon::before, .pospagov-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar .c-form__icon::before, .portabilidadmovistar-portabilidad-sim .c-entrega .c-form__field-canvas.selectEntregar .c-form__icon::before { padding-right: 0; } .pospago-portabilidad-sim .c-entrega .infoEntregar, .pospagov-portabilidad-sim .c-entrega .infoEntregar, .portabilidadmovistar-portabilidad-sim .c-entrega .infoEntregar { font-weight: 400; font-size: 14px; line-height: 20px; } .pospago-portabilidad-sim .c-radio-simTitular .c-form__radio-button.is-field-check[type=radio], .pospagov-portabilidad-sim .c-radio-simTitular .c-form__radio-button.is-field-check[type=radio], .portabilidadmovistar-portabilidad-sim .c-radio-simTitular .c-form__radio-button.is-field-check[type=radio] { border: 1px solid #019df4; } .pospago-portabilidad-sim .c-radio-simTitular .c-form__radio-button.is-field-check[type=radio]::before, .pospagov-portabilidad-sim .c-radio-simTitular .c-form__radio-button.is-field-check[type=radio]::before, .portabilidadmovistar-portabilidad-sim .c-radio-simTitular .c-form__radio-button.is-field-check[type=radio]::before { transform: scale(0.9); border: 1px solid #019df4; margin-top: 1px; } .pospago-portabilidad-sim .txtDelivery, .pospagov-portabilidad-sim .txtDelivery, .portabilidadmovistar-portabilidad-sim .txtDelivery { margin-top: 15px; margin-left: 6%; } .pospago-portabilidad-sim .datesMonth, .pospagov-portabilidad-sim .datesMonth, .portabilidadmovistar-portabilidad-sim .datesMonth { margin-bottom: 15px; font-size: 20px; } .pospago-portabilidad-sim table th, .pospago-portabilidad-sim table td, .pospagov-portabilidad-sim table th, .pospagov-portabilidad-sim table td, .portabilidadmovistar-portabilidad-sim table th, .portabilidadmovistar-portabilidad-sim table td { text-align: center; } .pospago-portabilidad-sim .pagination li:hover, .pospagov-portabilidad-sim .pagination li:hover, .portabilidadmovistar-portabilidad-sim .pagination li:hover { cursor: pointer; } .pospago-portabilidad-sim table tbody tr, .pospagov-portabilidad-sim table tbody tr, .portabilidadmovistar-portabilidad-sim table tbody tr { display: none; } .pospago-portabilidad-sim table tbody tr td:not(.line), .pospagov-portabilidad-sim table tbody tr td:not(.line), .portabilidadmovistar-portabilidad-sim table tbody tr td:not(.line) { cursor: pointer; } .pospago-portabilidad-sim ul.pagination, .pospagov-portabilidad-sim ul.pagination, .portabilidadmovistar-portabilidad-sim ul.pagination { list-style-type: none; } .pospago-portabilidad-sim ul.pagination li, .pospagov-portabilidad-sim ul.pagination li, .portabilidadmovistar-portabilidad-sim ul.pagination li { color: #019df4; margin-top: 45px; } .pospago-portabilidad-sim .c-form__field-canvas.fechas, .pospagov-portabilidad-sim .c-form__field-canvas.fechas, .portabilidadmovistar-portabilidad-sim .c-form__field-canvas.fechas { column-gap: 0.5rem; } .pospago-portabilidad-sim .txtND, .pospagov-portabilidad-sim .txtND, .portabilidadmovistar-portabilidad-sim .txtND { margin-right: 6%; } .pospago-portabilidad-sim #days-table .line, .pospago-portabilidad-sim #days-window .line, .pospagov-portabilidad-sim #days-table .line, .pospagov-portabilidad-sim #days-window .line, .portabilidadmovistar-portabilidad-sim #days-table .line, .portabilidadmovistar-portabilidad-sim #days-window .line { background-image: linear-gradient(to top left, #f5f5f5 48%, #c4c4c4, #f5f5f5 52%); color: #86888C; } .pospago-portabilidad-sim #days-table .dateSelected, .pospago-portabilidad-sim #days-window .dateSelected, .pospagov-portabilidad-sim #days-table .dateSelected, .pospagov-portabilidad-sim #days-window .dateSelected, .portabilidadmovistar-portabilidad-sim #days-table .dateSelected, .portabilidadmovistar-portabilidad-sim #days-window .dateSelected { background-color: #0b2739; color: #fff; } .pospago-portabilidad-sim #days-table .firstElement, .pospago-portabilidad-sim #days-window .firstElement, .pospagov-portabilidad-sim #days-table .firstElement, .pospagov-portabilidad-sim #days-window .firstElement, .portabilidadmovistar-portabilidad-sim #days-table .firstElement, .portabilidadmovistar-portabilidad-sim #days-window .firstElement { border-radius: 8px 0px 0 8px; } .pospago-portabilidad-sim #days-table .lastElement, .pospago-portabilidad-sim #days-window .lastElement, .pospagov-portabilidad-sim #days-table .lastElement, .pospagov-portabilidad-sim #days-window .lastElement, .portabilidadmovistar-portabilidad-sim #days-table .lastElement, .portabilidadmovistar-portabilidad-sim #days-window .lastElement { border-radius: 0px 8px 8px 0; } .pospago-portabilidad-sim #days-table th, .pospago-portabilidad-sim #days-window th, .pospagov-portabilidad-sim #days-table th, .pospagov-portabilidad-sim #days-window th, .portabilidadmovistar-portabilidad-sim #days-table th, .portabilidadmovistar-portabilidad-sim #days-window th { padding-bottom: 10px; } .pospago-portabilidad-sim #days-table tbody, .pospago-portabilidad-sim #days-window tbody, .pospagov-portabilidad-sim #days-table tbody, .pospagov-portabilidad-sim #days-window tbody, .portabilidadmovistar-portabilidad-sim #days-table tbody, .portabilidadmovistar-portabilidad-sim #days-window tbody { border-collapse: collapse; border-radius: 8px; border-style: hidden; /* hide standard table (collapsed) border */ box-shadow: 0 0 0 1px #d4d4d4; /* this draws the table border */ } .pospago-portabilidad-sim #days-table tbody td, .pospago-portabilidad-sim #days-window tbody td, .pospagov-portabilidad-sim #days-table tbody td, .pospagov-portabilidad-sim #days-window tbody td, .portabilidadmovistar-portabilidad-sim #days-table tbody td, .portabilidadmovistar-portabilidad-sim #days-window tbody td { padding: 10px; color: #afb1b3; border: 1px solid #d4d4d4; } .pospago-portabilidad-sim .edit-address-client-portabilidad, .pospago-portabilidad-sim .save-address-client-portabilidad, .pospagov-portabilidad-sim .edit-address-client-portabilidad, .pospagov-portabilidad-sim .save-address-client-portabilidad, .portabilidadmovistar-portabilidad-sim .edit-address-client-portabilidad, .portabilidadmovistar-portabilidad-sim .save-address-client-portabilidad { text-align: end; cursor: pointer; margin-bottom: 15px; font-size: 0.9rem; margin: 0 8px; color: #019df4; width: 20%; margin-left: 80%; margin-top: 16px; } .pospago-portabilidad-sim .edit-address-client-portabilidad::before, .pospago-portabilidad-sim .save-address-client-portabilidad::before, .pospagov-portabilidad-sim .edit-address-client-portabilidad::before, .pospagov-portabilidad-sim .save-address-client-portabilidad::before, .portabilidadmovistar-portabilidad-sim .edit-address-client-portabilidad::before, .portabilidadmovistar-portabilidad-sim .save-address-client-portabilidad::before { margin-right: 5px; } .pospago-portabilidad-sim .address-client-portabilidad.no-edit .edit-customer-data, .pospagov-portabilidad-sim .address-client-portabilidad.no-edit .edit-customer-data, .portabilidadmovistar-portabilidad-sim .address-client-portabilidad.no-edit .edit-customer-data { display: flex; } .pospago-portabilidad-sim .address-client-portabilidad.no-edit .c-form__box, .pospagov-portabilidad-sim .address-client-portabilidad.no-edit .c-form__box, .portabilidadmovistar-portabilidad-sim .address-client-portabilidad.no-edit .c-form__box { pointer-events: none; opacity: 0.4; } @media (max-width: 600px) { .pospago-portabilidad-sim .c-form__box.u-width-80, .pospago-portabilidad-sim .c-form__box.u-width-45, .pospago-portabilidad-sim .c-form__box.u-width-25, .pospagov-portabilidad-sim .c-form__box.u-width-80, .pospagov-portabilidad-sim .c-form__box.u-width-45, .pospagov-portabilidad-sim .c-form__box.u-width-25, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-80, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-45, .portabilidadmovistar-portabilidad-sim .c-form__box.u-width-25 { width: 100% !important; } .pospago-portabilidad-sim .c-form__header, .pospagov-portabilidad-sim .c-form__header, .portabilidadmovistar-portabilidad-sim .c-form__header { margin-top: 0; } .pospago-portabilidad-sim .c-form__header, .pospagov-portabilidad-sim .c-form__header, .portabilidadmovistar-portabilidad-sim .c-form__header { margin-top: 0; } .pospago-portabilidad-sim h2, .pospagov-portabilidad-sim h2, .portabilidadmovistar-portabilidad-sim h2 { text-align: center; } .pospago-portabilidad-sim .c-form__recibir-sim, .pospagov-portabilidad-sim .c-form__recibir-sim, .portabilidadmovistar-portabilidad-sim .c-form__recibir-sim { flex-direction: row; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 8px; /* 9 */ gap: 0.5rem; /* 9 */ } .pospago-portabilidad-sim .c-form__title_2, .pospagov-portabilidad-sim .c-form__title_2, .portabilidadmovistar-portabilidad-sim .c-form__title_2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .pospago-portabilidad-sim .c-entrega, .pospagov-portabilidad-sim .c-entrega, .portabilidadmovistar-portabilidad-sim .c-entrega { padding: 16px; } .pospago-portabilidad-sim .c-entrega .ce-tienda, .pospagov-portabilidad-sim .c-entrega .ce-tienda, .portabilidadmovistar-portabilidad-sim .c-entrega .ce-tienda { text-align: left; } .pospago-portabilidad-sim .c-entrega h3, .pospagov-portabilidad-sim .c-entrega h3, .portabilidadmovistar-portabilidad-sim .c-entrega h3 { text-align: center; line-height: 1.1; } .pospago-portabilidad-sim .c-entrega .subtitle-2, .pospagov-portabilidad-sim .c-entrega .subtitle-2, .portabilidadmovistar-portabilidad-sim .c-entrega .subtitle-2 { text-align: center; } .pospago-portabilidad-sim .sub-title, .pospagov-portabilidad-sim .sub-title, .portabilidadmovistar-portabilidad-sim .sub-title { text-align: center; } .pospago-portabilidad-sim .sub-title p, .pospagov-portabilidad-sim .sub-title p, .portabilidadmovistar-portabilidad-sim .sub-title p { line-height: 1.1; } .pospago-portabilidad-sim .sub-title.sub-title-tienda, .pospagov-portabilidad-sim .sub-title.sub-title-tienda, .portabilidadmovistar-portabilidad-sim .sub-title.sub-title-tienda { text-align: left; } .pospago-portabilidad-sim .sub-title.sub-title-tienda p, .pospagov-portabilidad-sim .sub-title.sub-title-tienda p, .portabilidadmovistar-portabilidad-sim .sub-title.sub-title-tienda p { line-height: 1.5; } .pospago-portabilidad-sim .c-form__recibir-sim, .pospagov-portabilidad-sim .c-form__recibir-sim, .portabilidadmovistar-portabilidad-sim .c-form__recibir-sim { flex-direction: row; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 8px; /* 9 */ gap: 0.5rem; /* 9 */ } .pospago-portabilidad-sim .c-form__title_2, .pospagov-portabilidad-sim .c-form__title_2, .portabilidadmovistar-portabilidad-sim .c-form__title_2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .pospago-portabilidad-sim .c-entrega, .pospagov-portabilidad-sim .c-entrega, .portabilidadmovistar-portabilidad-sim .c-entrega { padding: 16px; } .pospago-portabilidad-sim .c-entrega .ce-tienda, .pospagov-portabilidad-sim .c-entrega .ce-tienda, .portabilidadmovistar-portabilidad-sim .c-entrega .ce-tienda { text-align: left; } .pospago-portabilidad-sim .c-entrega h3, .pospagov-portabilidad-sim .c-entrega h3, .portabilidadmovistar-portabilidad-sim .c-entrega h3 { text-align: center; line-height: 1.1; } .pospago-portabilidad-sim .c-entrega .subtitle-2, .pospagov-portabilidad-sim .c-entrega .subtitle-2, .portabilidadmovistar-portabilidad-sim .c-entrega .subtitle-2 { text-align: center; } .pospago-portabilidad-sim .sub-title, .pospagov-portabilidad-sim .sub-title, .portabilidadmovistar-portabilidad-sim .sub-title { text-align: center; } .pospago-portabilidad-sim .sub-title p, .pospagov-portabilidad-sim .sub-title p, .portabilidadmovistar-portabilidad-sim .sub-title p { line-height: 1.1; } .pospago-portabilidad-sim .sub-title.sub-title-tienda, .pospagov-portabilidad-sim .sub-title.sub-title-tienda, .portabilidadmovistar-portabilidad-sim .sub-title.sub-title-tienda { text-align: left; } .pospago-portabilidad-sim .sub-title.sub-title-tienda p, .pospagov-portabilidad-sim .sub-title.sub-title-tienda p, .portabilidadmovistar-portabilidad-sim .sub-title.sub-title-tienda p { line-height: 1.5; } .pospago-portabilidad-sim .c-form__field-canvas.fechas, .pospago-portabilidad-sim .c-form__field-canvas.selectEntregar, .pospagov-portabilidad-sim .c-form__field-canvas.fechas, .pospagov-portabilidad-sim .c-form__field-canvas.selectEntregar, .portabilidadmovistar-portabilidad-sim .c-form__field-canvas.fechas, .portabilidadmovistar-portabilidad-sim .c-form__field-canvas.selectEntregar { flex-direction: inherit; } .pospago-portabilidad-sim .c-form__field-canvas.fechas .c-form__box.u-width-80, .pospago-portabilidad-sim .c-form__field-canvas.selectEntregar .c-form__box.u-width-80, .pospagov-portabilidad-sim .c-form__field-canvas.fechas .c-form__box.u-width-80, .pospagov-portabilidad-sim .c-form__field-canvas.selectEntregar .c-form__box.u-width-80, .portabilidadmovistar-portabilidad-sim .c-form__field-canvas.fechas .c-form__box.u-width-80, .portabilidadmovistar-portabilidad-sim .c-form__field-canvas.selectEntregar .c-form__box.u-width-80 { width: 90% !important; } .pospago-portabilidad-sim #calendar-retirar .c-fechas, .pospagov-portabilidad-sim #calendar-retirar .c-fechas, .portabilidadmovistar-portabilidad-sim #calendar-retirar .c-fechas { padding: 12px 0; } .pospago-portabilidad-sim #calendar-retirar .c-fechas, .pospagov-portabilidad-sim #calendar-retirar .c-fechas, .portabilidadmovistar-portabilidad-sim #calendar-retirar .c-fechas { padding: 12px 0; } .pospago-portabilidad-sim .c-fechas, .pospagov-portabilidad-sim .c-fechas, .portabilidadmovistar-portabilidad-sim .c-fechas { padding: 12px; } .pospago-portabilidad-sim .txtDelivery, .pospagov-portabilidad-sim .txtDelivery, .portabilidadmovistar-portabilidad-sim .txtDelivery { line-height: 20px; text-align: center; margin-left: 0 !important; font-size: 13px; } } @media (min-width: 1024px) and (max-width: 1200px) and (orientation: landscape) { .pospago-portabilidad-sim .c-form-sim-responsive, .pospagov-portabilidad-sim .c-form-sim-responsive, .portabilidadmovistar-portabilidad-sim .c-form-sim-responsive { width: 100% !important; } } @media (min-width: 1024px) and (max-width: 1200px) and (orientation: portrait) { .pospago-portabilidad-sim .c-form-sim-responsive, .pospagov-portabilidad-sim .c-form-sim-responsive, .portabilidadmovistar-portabilidad-sim .c-form-sim-responsive { width: 100% !important; } } .pospago-portabilidad-sim #contenedorTiendas, .pospagov-portabilidad-sim #contenedorTiendas, .portabilidadmovistar-portabilidad-sim #contenedorTiendas { margin: 20px 0; max-height: 400px; overflow: auto; padding-right: 15px; } .pospago-portabilidad-sim #contenedorTiendas::-webkit-scrollbar, .pospagov-portabilidad-sim #contenedorTiendas::-webkit-scrollbar, .portabilidadmovistar-portabilidad-sim #contenedorTiendas::-webkit-scrollbar { width: 6px; /* width of the entire scrollbar */ } .pospago-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-track, .pospagov-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-track, .portabilidadmovistar-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-track { background: #D9D9D9; border: 1px solid #f5f5f5; /* color of the tracking area */ } .pospago-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-thumb, .pospagov-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-thumb, .portabilidadmovistar-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-thumb { background-color: white; border-radius: 20px; box-shadow: 0px 0px 5px #00000023; max-width: 60px; } .pospago-portabilidad-sim .tiendaContainer, .pospagov-portabilidad-sim .tiendaContainer, .portabilidadmovistar-portabilidad-sim .tiendaContainer { background: #FFFFFF; border-radius: 8px; padding: 15px; margin: 20px 0; display: grid; grid-template-columns: 1fr 20px; align-items: center; } .pospago-portabilidad-sim .tiendaContainer .tiendaHeader, .pospagov-portabilidad-sim .tiendaContainer .tiendaHeader, .portabilidadmovistar-portabilidad-sim .tiendaContainer .tiendaHeader { display: flex; gap: 10px; align-items: center; } .pospago-portabilidad-sim .tiendaContainer .tiendaHeader .tiendaIcon, .pospagov-portabilidad-sim .tiendaContainer .tiendaHeader .tiendaIcon, .portabilidadmovistar-portabilidad-sim .tiendaContainer .tiendaHeader .tiendaIcon { background-image: url("../images/pospago/iconMap.png"); display: flex; width: 24px; height: 24px; background-repeat: no-repeat; background-position: center; } .pospago-portabilidad-sim .tiendaContainer .tiendaInfo, .pospago-portabilidad-sim .tiendaContainer footer, .pospagov-portabilidad-sim .tiendaContainer .tiendaInfo, .pospagov-portabilidad-sim .tiendaContainer footer, .portabilidadmovistar-portabilidad-sim .tiendaContainer .tiendaInfo, .portabilidadmovistar-portabilidad-sim .tiendaContainer footer { text-align: left; margin-left: 34px; } .pospago-portabilidad-sim .tiendaContainer footer a, .pospagov-portabilidad-sim .tiendaContainer footer a, .portabilidadmovistar-portabilidad-sim .tiendaContainer footer a { color: #019df4; text-decoration: underline; } .pospago-portabilidad-sim .activeTienda, .pospagov-portabilidad-sim .activeTienda, .portabilidadmovistar-portabilidad-sim .activeTienda { border: 2px solid #019BEF; } .pospago-portabilidad-sim .btnBuscar, .pospagov-portabilidad-sim .btnBuscar, .portabilidadmovistar-portabilidad-sim .btnBuscar { width: 136px; height: 50px; background: #019BEF; border-radius: 60px; color: white; text-align: center; } .pospago-portabilidad-sim .desactivado, .pospagov-portabilidad-sim .desactivado, .portabilidadmovistar-portabilidad-sim .desactivado { opacity: 0.5; pointer-events: none; } .pospago-portabilidad-sim .selectedposFlex, .pospagov-portabilidad-sim .selectedposFlex, .portabilidadmovistar-portabilidad-sim .selectedposFlex { border: 1px solid #019DF4; } .pospago-portabilidad-sim .shipping-method-portabilidad, .pospagov-portabilidad-sim .shipping-method-portabilidad, .portabilidadmovistar-portabilidad-sim .shipping-method-portabilidad { display: none; } .pospagov-portabilidad-sim .strong { font-weight: 500 !important; } .pospagov-portabilidad-sim .c-radio-sim { padding: 12px !important; } .pospagov-portabilidad-sim .c-radio-sim .c-form__icon { right: 0; } .pospagov-portabilidad-sim .typeStreet .c-form__field { padding: 0; } .pospagov-portabilidad-sim .typeStreet .c-form__field select { font-size: 1em; line-height: 24px; max-width: 100%; height: 51px; width: 100%; padding-left: 12px; padding-top: 15px; top: 0; } .pospagov-portabilidad-sim div#deliveryAddress { background-color: #e0e0e07d; border-radius: 10px; text-align: left; padding: 12px; font-size: 12px; } .pospagov-portabilidad-sim div#deliveryAddress p { font-weight: 600; font-size: 16px; line-height: 16px; } .pospagov-portabilidad-sim .c-form__field-canvas { margin-bottom: 1.5rem; } .pospagov-portabilidad-sim .btnNextStep { color: #019df4; border-radius: 60px; padding: 0 10px; font-size: 16px; text-decoration: underline; cursor: pointer; } .pospagov-portabilidad-sim .btnNextStep .i-arrow-right { font-size: 12px; } .pospagov-portabilidad-sim .btnNextStep:disabled { opacity: 0.6; } .pospagov-portabilidad-sim .fs-24 { font-size: 1.3rem !important; } @media (max-width: 600px) { .pospagov-portabilidad-sim .fs-24 { font-size: 1.3rem !important; text-align: center; font-weight: 600; } } .pospagov-portabilidad-sim .c-typeStreet { width: 40%; } .pospagov-portabilidad-sim .c-others { display: flex; gap: 1.5rem; width: 60%; } .pospagov-portabilidad-sim .c-form__field .select2-container { top: 0 !important; } .pospagov-portabilidad-sim .c-form__field .select2-container span.select2-selection__rendered { padding-left: 8px !important; } .pospagov-portabilidad-sim span:has(+ label[for=city]) { margin-top: -10px; } .pospagov-portabilidad-sim .containerSelects .c-form__field.city_field { padding: 10px 0 0 10px; } .pospagov-portabilidad-sim .containerSelects .c-form__field.departament_field { padding: 10px 0 0 10px; } .pospagov-portabilidad-sim .edit-address-client-portabilidad, .pospagov-portabilidad-sim .save-address-client-portabilidad { text-align: end; cursor: pointer; margin-bottom: 15px; font-size: 0.9rem; margin: 0 8px; color: #019df4; width: 20%; margin-left: 80%; margin-top: 16px; } .pospagov-portabilidad-sim .edit-address-client-portabilidad::before, .pospagov-portabilidad-sim .save-address-client-portabilidad::before { margin-right: 5px; } .pospagov-portabilidad-sim #contenedorTiendas { margin: 20px 0; max-height: 400px; overflow: auto; padding-right: 15px; } .pospagov-portabilidad-sim #contenedorTiendas::-webkit-scrollbar { width: 6px; /* width of the entire scrollbar */ } .pospagov-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-track { background: #D9D9D9; border: 1px solid #f5f5f5; /* color of the tracking area */ } .pospagov-portabilidad-sim #contenedorTiendas::-webkit-scrollbar-thumb { background-color: white; border-radius: 20px; box-shadow: 0px 0px 5px #00000023; max-width: 60px; } .pospagov-portabilidad-sim .tiendaContainer { background: #FFFFFF; border-radius: 8px; padding: 15px; margin: 20px 0; display: grid; grid-template-columns: 1fr 20px; align-items: center; } .pospagov-portabilidad-sim .tiendaContainer .tiendaHeader { display: flex; gap: 10px; align-items: center; } .pospagov-portabilidad-sim .tiendaContainer .tiendaHeader .tiendaIcon { background-image: url("../images/pospago/iconMap.png"); display: flex; width: 24px; height: 24px; background-repeat: no-repeat; background-position: center; } .pospagov-portabilidad-sim .tiendaContainer .tiendaInfo, .pospagov-portabilidad-sim .tiendaContainer footer { text-align: left; margin-left: 34px; } .pospagov-portabilidad-sim .tiendaContainer footer a { color: #019df4; text-decoration: underline; } .pospagov-portabilidad-sim .activeTienda { border: 2px solid #019BEF; } .pospagov-portabilidad-sim .btnBuscar { width: 136px; height: 50px; background: #019BEF; border-radius: 60px; color: white; text-align: center; } .pospagov-portabilidad-sim .desactivado { opacity: 0.5; pointer-events: none; } .pospagov-portabilidad-sim .selectedposFlex { border: 1px solid #019DF4; } .pospagov-portabilidad-sim section#noStockTienda { border-radius: 8px; background-color: #FFFFFF; padding: 20px; color: darkgray; font-weight: bold; margin-block-end: 20px; } .pospagov-portabilidad-sim .fechas-footer { display: grid; gap: 10px; width: max-content; color: #86888C; margin: 20px; } .pospagov-portabilidad-sim .fechas-footer div { display: flex; gap: 10px; align-items: center; } .pospagov-portabilidad-sim .fechas-round-icon { width: 20px; height: 20px; display: inline-block; border-radius: 50%; } .pospagov-portabilidad-sim .gris { background-color: #F5F5F5; } .pospagov-portabilidad-sim .verde-claro { background-color: #80CEF9; } .pospagov-portabilidad-sim .verde-oscuro { background-color: #008EDD; } .pospagov-portabilidad-sim .msgRetiroTienda { display: grid; grid-template-columns: 30px 1fr; align-items: center; padding: 10px 20px; gap: 10px; font-size: 14px; } .pospagov-portabilidad-sim #days-table .line, .pospagov-portabilidad-sim #days-window .line { background-image: linear-gradient(to top left, #f5f5f5 48%, #f5f5f5, #f5f5f5 52%); color: #86888C; } .pospagov-portabilidad-sim #days-table .dateSelected, .pospagov-portabilidad-sim #days-window .dateSelected { background-color: #008EDD; color: #fff; } .pospagov-portabilidad-sim #days-table .firstElement, .pospagov-portabilidad-sim #days-window .firstElement { border-radius: 8px 0px 0 8px; } .pospagov-portabilidad-sim #days-table .lastElement, .pospagov-portabilidad-sim #days-window .lastElement { border-radius: 0px 8px 8px 0; } .pospagov-portabilidad-sim #days-table th, .pospagov-portabilidad-sim #days-window th { padding-bottom: 10px; } .pospagov-portabilidad-sim #days-table tbody, .pospagov-portabilidad-sim #days-window tbody { border-collapse: collapse; border-radius: 8px; border-style: hidden; /* hide standard table (collapsed) border */ box-shadow: 0 0 0 1px #008EDD; /* this draws the table border */ } .pospagov-portabilidad-sim #days-table tbody td, .pospagov-portabilidad-sim #days-window tbody td { padding: 10px; color: #008EDD; border: 1px solid #008EDD; background-color: #80CEF9; } .pospagov-portabilidad-sim .shipping-method-portabilidad { display: block; } @media (max-width: 768px) { .pospagov-portabilidad-sim section#datos-sim, .pospagov-portabilidad-sim .c-form__header { margin-top: 0; } .pospagov-portabilidad-sim section#datos-sim .c-form__title, .pospagov-portabilidad-sim .c-form__header .c-form__title { max-width: 90%; margin: 8px auto; } .pospagov-portabilidad-sim div#c-typeDelivery { gap: 0.4rem; } .pospagov-portabilidad-sim div#c-typeDelivery .ml-35 { margin-left: 35px; } .pospagov-portabilidad-sim .c-form__field-canvas.mb-column { display: flex; flex-direction: row; } .pospagov-portabilidad-sim .c-form__field-canvas.mb-column .c-form__radio-button-label { gap: 0.5rem; } .pospagov-portabilidad-sim .c-radio-sim .ml-35 { margin-left: 25px; line-height: 16px; } .pospagov-portabilidad-sim .edit-address-client-portabilidad, .pospagov-portabilidad-sim .save-address-client-portabilidad { width: 50% !important; margin-left: 50% !important; } .pospagov-portabilidad-sim .mb-gap { gap: 0.2rem; } .pospagov-portabilidad-sim .c-select-mb { gap: 0; } .pospagov-portabilidad-sim .c-select-mb .c-form__box-select:first-of-type, .pospagov-portabilidad-sim .c-select-mb .c-form__box:first-of-type { margin-bottom: 24px; } .pospagov-portabilidad-sim #btnContinuar { max-width: 60% !important; } .pospagov-portabilidad-sim .c-typeStreet { width: 100%; } .pospagov-portabilidad-sim .c-others { width: 100%; } .pospagov-portabilidad-sim .c-others .c-form__box { width: 33%; } } .pospagov-portabilidad-sim .modal-popup._show .modal-inner-wrap { margin-top: 25px; padding-bottom: 25px; background: #fff; position: relative; } .pospagov-portabilidad-sim .modal-footer { border-top: 0 !important; text-align: center !important; margin-top: 0 !important; padding: 0 !important; } .pospagov-portabilidad-contrato #submit-sign-contract { margin-right: 0px; } @media screen and (max-width: 768px) { .pospagov-portabilidad-contrato #submit-sign-contract { margin: 0px !important; } } .c-card-summary__amount { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ color: #313235; } .c-card-summary__amount h4 { margin-right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .c-card-summary__amount small { padding: 3px 5px; border-radius: 6px; background: #EDEDED; color: #606060; font-size: 12px; line-height: 15px; font-weight: 600; text-align: center; } .c-card-summary__details { padding-bottom: 13px; list-style: disc; padding-left: 10px; } .c-card-summary__details .li-details { max-width: 100%; font-style: normal; font-weight: normal; font-size: 11px; line-height: 15px; color: #313235; text-align: left; } .c-card-summary__free-shipping { border-bottom: 1px solid #D3D4D3; padding-bottom: 20px; display: flex; justify-content: space-between; } .c-card-summary__details-customer { border-bottom: 1px solid #D3D4D3; padding-bottom: 21px; } .c-card-summary__details-customer .mark { font-size: 13px; margin: 12px 0; } .details-customer-summary li { list-style: none; display: flex; justify-content: space-between; font-size: 11px; padding: 7px 0; } .details-customer-summary li strong { font-style: normal; font-weight: 700; font-size: 12px; line-height: 12px; color: #424B5A; } .details-customer-summary li p { font-style: normal; font-weight: 400; font-size: 12px; line-height: 12px; color: #424B5A; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .esim-identidad-index .details-customer-summary li { list-style: none; display: flex; justify-content: flex-start; font-size: 11px; padding: 7px 0; gap: 4px; } .esim-identidad-index .details-customer-summary li strong { font-style: normal; font-weight: 700; font-size: 12px; line-height: 14px; color: #424B5A; } .esim-identidad-index .details-customer-summary li p { font-style: normal; font-weight: 400; font-size: 12px; line-height: 14px; color: #424B5A; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .esim-identidad-index .accordion-toggle { cursor: pointer; transition: transform 0.3s ease; display: inline-block; float: right; font-size: 18px; line-height: 2; } .esim-identidad-index .expanded { transform: rotate(180deg); } .c-card-summary__address-detail { padding: 21px 0; border-bottom: 1px solid #D3D4D3; } .c-card-summary__address-detail .c-card-summary__title-content { display: flex; justify-content: space-between; margin-bottom: 9px; /* .icon-pencil::after{ content: ""; } */ } .c-card-summary__address-detail .c-card-summary__title-content .mark { font-style: normal; font-weight: 400; font-size: 13px; line-height: 21px; } .c-card-summary__address-detail .c-card-summary__content { display: flex; justify-content: flex-start; width: 284px; gap: 18px; } .c-card-summary__address-detail .c-card-summary__content li { list-style: none; font-style: normal; font-weight: 700; font-size: 9.275px; line-height: 13px; } .c-card-summary__address-detail .c-card-summary__content .direction { width: 97px; } .c-card-summary .c-card-summary__box { border-bottom: none; padding-bottom: 0; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .c-card-checkout-cta__btn, .pospago-portabilidad-identidad .c-card-checkout-cta__btn, .pospago-portabilidad-confronta .c-card-checkout-cta__btn, .pospago-portabilidad-contrato .c-card-checkout-cta__btn, .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn { background-color: #FFFFFF; color: #000000; border-radius: 0px 0px 0px 0px; flex-direction: row; font-size: 4.5vw; } .pospago-portabilidad-sim .c-card-checkout-cta__btn-plan, .pospago-portabilidad-identidad .c-card-checkout-cta__btn-plan, .pospago-portabilidad-confronta .c-card-checkout-cta__btn-plan, .pospago-portabilidad-contrato .c-card-checkout-cta__btn-plan, .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-plan { font-weight: bold; } .pospago-portabilidad-sim .c-card-checkout-cta__btn-img img, .pospago-portabilidad-identidad .c-card-checkout-cta__btn-img img, .pospago-portabilidad-confronta .c-card-checkout-cta__btn-img img, .pospago-portabilidad-contrato .c-card-checkout-cta__btn-img img, .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-img img { width: 25vw; } .pospago-portabilidad-sim .c-card-checkout-cta__btn .i-chevron-down, .pospago-portabilidad-identidad .c-card-checkout-cta__btn .i-chevron-down, .pospago-portabilidad-confronta .c-card-checkout-cta__btn .i-chevron-down, .pospago-portabilidad-contrato .c-card-checkout-cta__btn .i-chevron-down, .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn .i-chevron-down { color: #019DF4; } } .c-card-summary__amount_before { margin-top: -12px; font-weight: 400; font-size: 13px; font-size: 0.8125rem; } .d-flex { display: flex; justify-content: center; } .column { display: flex; flex-direction: column; padding: 5px; } .row { display: flex; flex-direction: row; } h1 { margin-bottom: 0px; } .w-100 { width: 100%; } .w-auto { width: auto; } #thank-you-page { margin-top: 0; } #thank-you-page .c-califica { display: flex; align-items: center; justify-content: center; border: 1px solid #019df4; border-radius: 20px; max-width: 20%; padding: 6px; margin: 22px auto; background-color: #fff; } #thank-you-page .c-califica .btn-califica { color: #019DF4; display: flex; align-items: center; gap: 5px; font-weight: 600; font-size: 16px; line-height: 15px; } @media screen and (max-width: 600px) { #thank-you-page .c-califica { max-width: 80%; } } .containerPrincipal .bannerTotal { width: 80%; margin: 0px auto; margin-top: 20px; padding: 10px 20px; border-radius: 10px; } @media screen and (max-width: 600px) { .containerPrincipal .bannerTotal { width: 100%; } } .containerPrincipal .o-btn { background-color: white; padding: 10px 20px; border-radius: 25px; max-width: 172px; color: black; font-size: 12px; font-weight: 400; } @media screen and (max-width: 600px) { .containerPrincipal .o-btn { width: 90%; margin: 10px auto; min-height: 34px; max-width: none; } } .containerPrincipal .messageCongratulations { align-items: center; margin-top: 30px; } .containerPrincipal .titleCongratulations { color: #019DF4; font-weight: 700; font-size: 28px; line-height: 38px; } .containerPrincipal .descriptionCongratulations { color: #424B5A; line-height: 21px; font-size: 20px; font-weight: 400; } .containerPrincipal .containerDirectionDate { margin-top: 16px; justify-content: space-evenly; align-items: center; background-color: #E6F5FD; } .containerPrincipal .titleDirection, .containerPrincipal .titleDate { color: #50535A; font-weight: 700; font-size: 16px; line-height: 16px; } .containerPrincipal .userDirection, .containerPrincipal .date { color: #424B5A; line-height: 24px; font-size: 14px; font-weight: 400; } .containerPrincipal .txh-icon { width: 30px; } .containerPrincipal .purchaseSummary { margin-top: 25px; } .containerPrincipal .purchaseSummary .titleSummary { font-weight: 700; font-size: 28px; line-height: 24px; text-align: center; } .containerPrincipal .purchaseSummary .contentPurchaseSummary { width: 80%; margin: 0 auto; justify-content: center; } .containerPrincipal .purchaseSummary .dataClient { margin-right: 50px; margin-top: 0px; } .containerPrincipal .purchaseSummary .separador { opacity: 0.2; width: 90%; } .containerPrincipal .purchaseSummary #c-thxpage-DataClient, .containerPrincipal .purchaseSummary #c-thxpage-DataAddress { padding: 20px; } .containerPrincipal .purchaseSummary #c-thxpage-DataClient .titleDataClient, .containerPrincipal .purchaseSummary #c-thxpage-DataAddress .titleDataClient { font-weight: 300; width: 100%; } .containerPrincipal .purchaseSummary #c-thxpage-DataClient ul, .containerPrincipal .purchaseSummary #c-thxpage-DataAddress ul { max-width: 100%; list-style: none; } .containerPrincipal .purchaseSummary #c-thxpage-DataClient ul li, .containerPrincipal .purchaseSummary #c-thxpage-DataAddress ul li { margin-top: 10px; display: flex; } .containerPrincipal .purchaseSummary #c-thxpage-DataClient ul li .title, .containerPrincipal .purchaseSummary #c-thxpage-DataAddress ul li .title { width: 40%; } .containerPrincipal .purchaseSummary #c-thxpage-DataClient ul li .info, .containerPrincipal .purchaseSummary #c-thxpage-DataAddress ul li .info { width: 60%; text-align: right; } .containerPrincipal .purchaseSummary .numberClient, .containerPrincipal .purchaseSummary .serviceClient, .containerPrincipal .purchaseSummary .nameClient, .containerPrincipal .purchaseSummary .numberBased, .containerPrincipal .purchaseSummary .buyDate { padding: 10px; align-items: baseline; border-bottom: 1px solid #D3D4D3; } .containerPrincipal .purchaseSummary .titleDataClient { color: #313235; font-weight: 700; font-size: 20px; line-height: 28px; width: 30%; } .containerPrincipal .purchaseSummary .detailDataClient { color: #313235; line-height: 22px; font-size: 16px; font-weight: 400; } .containerPrincipal .purchaseSummary .detailDataClient.detailServices { max-width: 70%; } @media (max-width: 768px) { .containerPrincipal .purchaseSummary .detailDataClient.detailServices { max-width: 100%; } } .containerPrincipal .purchaseSummary .monthFree { background: rgba(1, 157, 244, 0.15); border-radius: 6px; width: 115px; text-align: center; margin-left: 20%; } .containerPrincipal .purchaseSummary .btnPortabilidad { display: flex; background: #FFFFFF; border-radius: 24.5px; border: 1px solid #019DF4; width: 165px; height: 49px; text-align: center; align-items: center; justify-content: center; margin-left: 5%; } .containerPrincipal .purchaseSummary .btnPortabilidad p { color: #019DF4; line-height: 14px; font-size: 12px; font-weight: 400; } .containerPrincipal .purchaseSummary .containerTotal { background: #FFFFFF; border-radius: 8px; padding: 15px; } .containerPrincipal .purchaseSummary .titleCount { color: #424B5A; font-size: 16px; font-weight: 700; line-height: 24px; } .containerPrincipal .purchaseSummary .btnGOBack { background: #019DF4; border-radius: 60px; display: flex; justify-content: center; align-items: center; width: 351px; height: 56px; color: white; text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; margin-top: 30px; } .containerPrincipal .purchaseSummary .link { text-decoration: underline; color: #019DF4; font-weight: 700; } .containerPrincipal .purchaseSummary .bannerPublicidad { width: 80%; margin: 0px auto; padding-top: 15px; margin-top: 20px; } .containerPrincipal .purchaseSummary .btnPublicidad { display: flex; justify-content: center; align-items: center; width: 75%; height: 49px; background: #FFFFFF; font-size: 12px; font-weight: bold; } .containerPrincipal .dataClient { width: 60%; background: #fff; border-radius: 16px; } @media (max-width: 768px) { .containerPrincipal .dataClient { width: 100%; } } .containerPrincipal .dataInfo { width: 25%; } @media (max-width: 768px) { .containerPrincipal .dataInfo { width: 100%; } .containerPrincipal .dataInfo .imageAppMovistar { order: 1; } .containerPrincipal .dataInfo .containerTotal { order: 0; } .containerPrincipal .dataInfo .containerSim { order: 2; } } .containerPrincipal .dataInfo * { max-width: 100%; } @media (max-width: 768px) { .mt-3 { margin-top: 30px; } .mr-1 { margin-right: 10px; } .row { display: flex; flex-direction: column; } .column-flex { width: 95%; display: flex; flex-direction: row; } .gridPurchase { margin-right: 0px; display: grid; grid-template-columns: repeat(3, 1fr); } .containerPrincipal .purchaseSummary .titleSummary { font-size: 26px; } .containerPrincipal .purchaseSummary .titleDataClient { font-size: 16px; line-height: 18px; margin-right: 10px; width: 100%; } .containerPrincipal .purchaseSummary .detailDataClient { font-size: 16px; } .containerPrincipal .purchaseSummary .dataClient { margin-right: 0px; } .lineClient { grid-area: 1/1/2/2; } .phoneClient { grid-area: 1/2/2/3; } .monthFree { grid-area: 1/3/2/4; } .titleService, .nameNameClient { grid-area: 2/1/3/2; } .detailServices, .nombreCliente { grid-area: 2/2/3/4; } .containerPrincipal .purchaseSummary .monthFree { width: auto; height: auto; } .numberBased { display: flex; flex-direction: row; height: 120px; } .containerPrincipal .purchaseSummary .btnPortabilidad p { margin-top: 2%; } .titleRadicado { width: 30% !important; } .buyDate { margin-top: 50px; } .containerPrincipal .purchaseSummary .containerTotal, .containerPrincipal .purchaseSummary .btnGOBack { width: 100%; } .btnPortabilidad { position: relative; top: 45px; width: 100% !important; margin-left: -250px !important; display: block !important; } .bannerPublicidad { width: 100% !important; height: 176px; } .btnPublicidad { margin: 0px auto; margin-top: 20px; } } .pospagov-portabilidad-thankyoupage #thank-you-page { margin-top: 0; } .pospagov-portabilidad-thankyoupage #thank-you-page .c-califica { display: flex; align-items: center; justify-content: center; border: 1px solid #019df4; border-radius: 20px; max-width: 20%; padding: 6px; margin: 22px auto; background-color: #fff; } .pospagov-portabilidad-thankyoupage #thank-you-page .c-califica .btn-califica { color: #019DF4; display: flex; align-items: center; gap: 5px; font-weight: 600; font-size: 16px; line-height: 15px; } @media screen and (max-width: 600px) { .pospagov-portabilidad-thankyoupage #thank-you-page .c-califica { max-width: 80%; } } .pospagov-portabilidad-thankyoupage .containerPrincipal .containerDirectionDate { margin-top: 16px; justify-content: space-evenly; padding-top: 0px; align-items: center; background-color: #E6F5FD; } .pospagov-portabilidad-thankyoupage .containerPrincipal .titleDate { color: #50535A; line-height: 16px; } .pospagov-portabilidad-thankyoupage .containerPrincipal .txh-icon { width: 30px; } .pospagov-portabilidad-thankyoupage .containerPrincipal .purchaseSummary { margin-top: 25px; } .pospagov-portabilidad-thankyoupage .containerPrincipal .dataClient { margin-top: 0px; } .pospagov-portabilidad-thankyoupage .containerPrincipal .separador { opacity: 0.2; width: 90%; } .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataClient, .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataAddress { padding: 20px; } .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataClient .titleDataClient, .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataAddress .titleDataClient { font-weight: 300; width: 100%; } .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataClient ul, .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataAddress ul { max-width: 100%; list-style: none; } .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataClient ul li, .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataAddress ul li { margin-top: 10px; display: flex; } .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataClient ul li .title, .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataAddress ul li .title { width: 40%; } .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataClient ul li .info, .pospagov-portabilidad-thankyoupage .containerPrincipal #c-thxpage-DataAddress ul li .info { width: 60%; text-align: right; } .pospagov-portabilidad-thankyoupage .containerPrincipal .containerTotal { width: auto; height: auto; } .pospagov-portabilidad-thankyoupage .containerPrincipal .dataClient { width: 60%; background: #fff; border-radius: 16px; } @media (max-width: 768px) { .pospagov-portabilidad-thankyoupage .containerPrincipal .dataClient { width: 100%; } } .pospagov-portabilidad-thankyoupage .containerPrincipal .dataInfo { width: 25%; } @media (max-width: 768px) { .pospagov-portabilidad-thankyoupage .containerPrincipal .dataInfo { width: 100%; } .pospagov-portabilidad-thankyoupage .containerPrincipal .dataInfo .imageAppMovistar { order: 1; } .pospagov-portabilidad-thankyoupage .containerPrincipal .dataInfo .containerTotal { order: 0; } .pospagov-portabilidad-thankyoupage .containerPrincipal .dataInfo .containerSim { order: 2; } } .pospagov-portabilidad-thankyoupage .containerPrincipal .dataInfo * { max-width: 100%; } .recuadro-pagoAutomatico-pospago .promo-container { padding: 20px; background: #fff; border-radius: 10px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); max-width: 800px; margin: auto; margin-top: 30px; } .recuadro-pagoAutomatico-pospago .promo-content { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } .recuadro-pagoAutomatico-pospago .promo-left { display: flex; flex: 1; align-items: center; } .recuadro-pagoAutomatico-pospago .promo-image img { width: 90px; height: 90px; margin-right: 75px; } .recuadro-pagoAutomatico-pospago .promo-text p { margin: 0 20px 5px 20px; font-size: 14px; color: #333; } .recuadro-pagoAutomatico-pospago .promo-text a { display: block; margin: 0 0px 0 20px; font-size: 14px; color: #007bff; text-decoration: none; text-decoration: underline; } .recuadro-pagoAutomatico-pospago .promo-text p:first-child { font-weight: bold; font-size: 16px; } .recuadro-pagoAutomatico-pospago .promo-button { background-color: #00aaff; color: white; border: none; padding: 10px 20px; border-radius: 20px; font-size: 14px; cursor: pointer; text-align: center; white-space: nowrap; } @media (max-width: 768px) { .recuadro-pagoAutomatico-pospago .promo-content { flex-direction: column; align-items: flex-start; } .recuadro-pagoAutomatico-pospago .promo-left { margin-bottom: 15px; align-items: flex-start; } .recuadro-pagoAutomatico-pospago .promo-button { width: 100%; text-align: center; } .recuadro-pagoAutomatico-pospago .promo-container { margin-left: 40px; margin-right: 40px; } .recuadro-pagoAutomatico-pospago .promo-image, .recuadro-pagoAutomatico-pospago .promo-text { display: inline-block; vertical-align: top; } } @media (max-width: 768px) and (min-width: 1200px) { .recuadro-pagoAutomatico-pospago .promo-container { max-width: 900px; } } .pospago-portabilidad-sim, .pospago-portabilidad-identidad, .pospago-portabilidad-confronta, .pospago-portabilidad-contrato, .pospago-portabilidad-thankyoupage, .pospago-portabilidad-datos, .pospago-prepos-sim, .pospago-prepos-identidad, .pospago-prepos-confronta, .pospago-prepos-contrato, .pospago-prepos-thankyoupage, .pospago-prepos-datos, .portabilidadmovistar-portabilidad-sim, .portabilidadmovistar-portabilidad-identidad, .portabilidadmovistar-portabilidad-confronta, .portabilidadmovistar-portabilidad-contrato, .portabilidadmovistar-portabilidad-thankyoupage, .portabilidadmovistar-portabilidad-datos { font-family: "Telefonica", sans-serif; } .pospago-portabilidad-sim button, .pospago-portabilidad-sim input, .pospago-portabilidad-sim optgroup, .pospago-portabilidad-sim select, .pospago-portabilidad-sim textarea, .pospago-portabilidad-identidad button, .pospago-portabilidad-identidad input, .pospago-portabilidad-identidad optgroup, .pospago-portabilidad-identidad select, .pospago-portabilidad-identidad textarea, .pospago-portabilidad-confronta button, .pospago-portabilidad-confronta input, .pospago-portabilidad-confronta optgroup, .pospago-portabilidad-confronta select, .pospago-portabilidad-confronta textarea, .pospago-portabilidad-contrato button, .pospago-portabilidad-contrato input, .pospago-portabilidad-contrato optgroup, .pospago-portabilidad-contrato select, .pospago-portabilidad-contrato textarea, .pospago-portabilidad-thankyoupage button, .pospago-portabilidad-thankyoupage input, .pospago-portabilidad-thankyoupage optgroup, .pospago-portabilidad-thankyoupage select, .pospago-portabilidad-thankyoupage textarea, .pospago-portabilidad-datos button, .pospago-portabilidad-datos input, .pospago-portabilidad-datos optgroup, .pospago-portabilidad-datos select, .pospago-portabilidad-datos textarea, .pospago-prepos-sim button, .pospago-prepos-sim input, .pospago-prepos-sim optgroup, .pospago-prepos-sim select, .pospago-prepos-sim textarea, .pospago-prepos-identidad button, .pospago-prepos-identidad input, .pospago-prepos-identidad optgroup, .pospago-prepos-identidad select, .pospago-prepos-identidad textarea, .pospago-prepos-confronta button, .pospago-prepos-confronta input, .pospago-prepos-confronta optgroup, .pospago-prepos-confronta select, .pospago-prepos-confronta textarea, .pospago-prepos-contrato button, .pospago-prepos-contrato input, .pospago-prepos-contrato optgroup, .pospago-prepos-contrato select, .pospago-prepos-contrato textarea, .pospago-prepos-thankyoupage button, .pospago-prepos-thankyoupage input, .pospago-prepos-thankyoupage optgroup, .pospago-prepos-thankyoupage select, .pospago-prepos-thankyoupage textarea, .pospago-prepos-datos button, .pospago-prepos-datos input, .pospago-prepos-datos optgroup, .pospago-prepos-datos select, .pospago-prepos-datos textarea, .portabilidadmovistar-portabilidad-sim button, .portabilidadmovistar-portabilidad-sim input, .portabilidadmovistar-portabilidad-sim optgroup, .portabilidadmovistar-portabilidad-sim select, .portabilidadmovistar-portabilidad-sim textarea, .portabilidadmovistar-portabilidad-identidad button, .portabilidadmovistar-portabilidad-identidad input, .portabilidadmovistar-portabilidad-identidad optgroup, .portabilidadmovistar-portabilidad-identidad select, .portabilidadmovistar-portabilidad-identidad textarea, .portabilidadmovistar-portabilidad-confronta button, .portabilidadmovistar-portabilidad-confronta input, .portabilidadmovistar-portabilidad-confronta optgroup, .portabilidadmovistar-portabilidad-confronta select, .portabilidadmovistar-portabilidad-confronta textarea, .portabilidadmovistar-portabilidad-contrato button, .portabilidadmovistar-portabilidad-contrato input, .portabilidadmovistar-portabilidad-contrato optgroup, .portabilidadmovistar-portabilidad-contrato select, .portabilidadmovistar-portabilidad-contrato textarea, .portabilidadmovistar-portabilidad-thankyoupage button, .portabilidadmovistar-portabilidad-thankyoupage input, .portabilidadmovistar-portabilidad-thankyoupage optgroup, .portabilidadmovistar-portabilidad-thankyoupage select, .portabilidadmovistar-portabilidad-thankyoupage textarea, .portabilidadmovistar-portabilidad-datos button, .portabilidadmovistar-portabilidad-datos input, .portabilidadmovistar-portabilidad-datos optgroup, .portabilidadmovistar-portabilidad-datos select, .portabilidadmovistar-portabilidad-datos textarea { font-family: "Telefonica", sans-serif; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .f-c-header-step__brand-inner, .pospago-portabilidad-identidad .f-c-header-step__brand-inner, .pospago-portabilidad-confronta .f-c-header-step__brand-inner, .pospago-portabilidad-contrato .f-c-header-step__brand-inner, .pospago-portabilidad-thankyoupage .f-c-header-step__brand-inner, .pospago-portabilidad-datos .f-c-header-step__brand-inner, .pospago-prepos-sim .f-c-header-step__brand-inner, .pospago-prepos-identidad .f-c-header-step__brand-inner, .pospago-prepos-confronta .f-c-header-step__brand-inner, .pospago-prepos-contrato .f-c-header-step__brand-inner, .pospago-prepos-thankyoupage .f-c-header-step__brand-inner, .pospago-prepos-datos .f-c-header-step__brand-inner, .portabilidadmovistar-portabilidad-sim .f-c-header-step__brand-inner, .portabilidadmovistar-portabilidad-identidad .f-c-header-step__brand-inner, .portabilidadmovistar-portabilidad-confronta .f-c-header-step__brand-inner, .portabilidadmovistar-portabilidad-contrato .f-c-header-step__brand-inner, .portabilidadmovistar-portabilidad-thankyoupage .f-c-header-step__brand-inner, .portabilidadmovistar-portabilidad-datos .f-c-header-step__brand-inner { text-align: center; } } .pospago-portabilidad-sim .page-wrapper .c-header-wrap, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap, .pospago-portabilidad-datos .page-wrapper .c-header-wrap, .pospago-prepos-sim .page-wrapper .c-header-wrap, .pospago-prepos-identidad .page-wrapper .c-header-wrap, .pospago-prepos-confronta .page-wrapper .c-header-wrap, .pospago-prepos-contrato .page-wrapper .c-header-wrap, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap, .pospago-prepos-datos .page-wrapper .c-header-wrap, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap { position: relative; z-index: 9 !important; } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps { width: 100%; height: 5em; display: flex; justify-content: center; align-items: center; background-color: white; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps { height: auto; display: block; background-color: transparent; } } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container { margin-top: 24px; margin-top: 1.5rem; } } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list { column-gap: 76px; column-gap: 4.75rem; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list { column-gap: 40px; column-gap: 2.5rem; } } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step { max-width: 6rem; } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after { top: -25px; width: 76px; width: 4.75rem; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after { top: 0; width: 34px; width: 2.125rem; } } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type { padding-left: 0.75rem; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type { padding-left: 0; } } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before { color: #019DF4; } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title { color: #019DF4; } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before { border-color: #019DF4; background-color: transparent; content: ""; font-family: "ico-movistar"; color: #019DF4; border: 2px solid #019DF4; border-radius: 50%; } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after { background-color: #019DF4; } .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title { font-family: "Telefonica", sans-serif; display: block; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .pospago-prepos-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-sim .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-identidad .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-confronta .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-contrato .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-thankyoupage .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .portabilidadmovistar-portabilidad-datos .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title { display: none; } } .pospago-portabilidad-sim span.errorPhone, .pospago-portabilidad-identidad span.errorPhone, .pospago-portabilidad-confronta span.errorPhone, .pospago-portabilidad-contrato span.errorPhone, .pospago-portabilidad-thankyoupage span.errorPhone, .pospago-portabilidad-datos span.errorPhone, .pospago-prepos-sim span.errorPhone, .pospago-prepos-identidad span.errorPhone, .pospago-prepos-confronta span.errorPhone, .pospago-prepos-contrato span.errorPhone, .pospago-prepos-thankyoupage span.errorPhone, .pospago-prepos-datos span.errorPhone, .portabilidadmovistar-portabilidad-sim span.errorPhone, .portabilidadmovistar-portabilidad-identidad span.errorPhone, .portabilidadmovistar-portabilidad-confronta span.errorPhone, .portabilidadmovistar-portabilidad-contrato span.errorPhone, .portabilidadmovistar-portabilidad-thankyoupage span.errorPhone, .portabilidadmovistar-portabilidad-datos span.errorPhone { margin-left: 16%; color: red; } @media screen and (max-width: 600px) { .pospago-portabilidad-sim span.errorPhone, .pospago-portabilidad-identidad span.errorPhone, .pospago-portabilidad-confronta span.errorPhone, .pospago-portabilidad-contrato span.errorPhone, .pospago-portabilidad-thankyoupage span.errorPhone, .pospago-portabilidad-datos span.errorPhone, .pospago-prepos-sim span.errorPhone, .pospago-prepos-identidad span.errorPhone, .pospago-prepos-confronta span.errorPhone, .pospago-prepos-contrato span.errorPhone, .pospago-prepos-thankyoupage span.errorPhone, .pospago-prepos-datos span.errorPhone, .portabilidadmovistar-portabilidad-sim span.errorPhone, .portabilidadmovistar-portabilidad-identidad span.errorPhone, .portabilidadmovistar-portabilidad-confronta span.errorPhone, .portabilidadmovistar-portabilidad-contrato span.errorPhone, .portabilidadmovistar-portabilidad-thankyoupage span.errorPhone, .portabilidadmovistar-portabilidad-datos span.errorPhone { margin-left: 0px; color: red; } } .pospago-portabilidad-sim footer.modal-footer, .pospago-portabilidad-identidad footer.modal-footer, .pospago-portabilidad-confronta footer.modal-footer, .pospago-portabilidad-contrato footer.modal-footer, .pospago-portabilidad-thankyoupage footer.modal-footer, .pospago-portabilidad-datos footer.modal-footer, .pospago-prepos-sim footer.modal-footer, .pospago-prepos-identidad footer.modal-footer, .pospago-prepos-confronta footer.modal-footer, .pospago-prepos-contrato footer.modal-footer, .pospago-prepos-thankyoupage footer.modal-footer, .pospago-prepos-datos footer.modal-footer, .portabilidadmovistar-portabilidad-sim footer.modal-footer, .portabilidadmovistar-portabilidad-identidad footer.modal-footer, .portabilidadmovistar-portabilidad-confronta footer.modal-footer, .portabilidadmovistar-portabilidad-contrato footer.modal-footer, .portabilidadmovistar-portabilidad-thankyoupage footer.modal-footer, .portabilidadmovistar-portabilidad-datos footer.modal-footer { border-top: 0 !important; text-align: center !important; padding: 1rem; margin-top: 1rem !important; background: #fff; margin: 0; width: 500px !important; margin-top: -15px !important; border-radius: 0 0 15px 15px; } @media screen and (max-width: 739px) { .pospago-portabilidad-sim #prepos-header-steps .f-c-header-step__wrap, .pospago-portabilidad-identidad #prepos-header-steps .f-c-header-step__wrap, .pospago-portabilidad-confronta #prepos-header-steps .f-c-header-step__wrap, .pospago-portabilidad-contrato #prepos-header-steps .f-c-header-step__wrap, .pospago-portabilidad-thankyoupage #prepos-header-steps .f-c-header-step__wrap, .pospago-portabilidad-datos #prepos-header-steps .f-c-header-step__wrap, .pospago-prepos-sim #prepos-header-steps .f-c-header-step__wrap, .pospago-prepos-identidad #prepos-header-steps .f-c-header-step__wrap, .pospago-prepos-confronta #prepos-header-steps .f-c-header-step__wrap, .pospago-prepos-contrato #prepos-header-steps .f-c-header-step__wrap, .pospago-prepos-thankyoupage #prepos-header-steps .f-c-header-step__wrap, .pospago-prepos-datos #prepos-header-steps .f-c-header-step__wrap, .portabilidadmovistar-portabilidad-sim #prepos-header-steps .f-c-header-step__wrap, .portabilidadmovistar-portabilidad-identidad #prepos-header-steps .f-c-header-step__wrap, .portabilidadmovistar-portabilidad-confronta #prepos-header-steps .f-c-header-step__wrap, .portabilidadmovistar-portabilidad-contrato #prepos-header-steps .f-c-header-step__wrap, .portabilidadmovistar-portabilidad-thankyoupage #prepos-header-steps .f-c-header-step__wrap, .portabilidadmovistar-portabilidad-datos #prepos-header-steps .f-c-header-step__wrap { display: flex; align-items: center; justify-content: space-around; background-color: #fff; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); } } @media screen and (max-width: 739px) { .pospago-portabilidad-sim #prepos-header-steps .f-c-header-step__brand, .pospago-portabilidad-identidad #prepos-header-steps .f-c-header-step__brand, .pospago-portabilidad-confronta #prepos-header-steps .f-c-header-step__brand, .pospago-portabilidad-contrato #prepos-header-steps .f-c-header-step__brand, .pospago-portabilidad-thankyoupage #prepos-header-steps .f-c-header-step__brand, .pospago-portabilidad-datos #prepos-header-steps .f-c-header-step__brand, .pospago-prepos-sim #prepos-header-steps .f-c-header-step__brand, .pospago-prepos-identidad #prepos-header-steps .f-c-header-step__brand, .pospago-prepos-confronta #prepos-header-steps .f-c-header-step__brand, .pospago-prepos-contrato #prepos-header-steps .f-c-header-step__brand, .pospago-prepos-thankyoupage #prepos-header-steps .f-c-header-step__brand, .pospago-prepos-datos #prepos-header-steps .f-c-header-step__brand, .portabilidadmovistar-portabilidad-sim #prepos-header-steps .f-c-header-step__brand, .portabilidadmovistar-portabilidad-identidad #prepos-header-steps .f-c-header-step__brand, .portabilidadmovistar-portabilidad-confronta #prepos-header-steps .f-c-header-step__brand, .portabilidadmovistar-portabilidad-contrato #prepos-header-steps .f-c-header-step__brand, .portabilidadmovistar-portabilidad-thankyoupage #prepos-header-steps .f-c-header-step__brand, .portabilidadmovistar-portabilidad-datos #prepos-header-steps .f-c-header-step__brand { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 32px; /* 9 */ margin-left: 2rem; /* 9 */ box-shadow: none; } } @media screen and (max-width: 739px) { .pospago-portabilidad-sim #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-portabilidad-identidad #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-portabilidad-confronta #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-portabilidad-contrato #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-portabilidad-thankyoupage #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-portabilidad-datos #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-prepos-sim #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-prepos-identidad #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-prepos-confronta #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-prepos-contrato #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-prepos-thankyoupage #prepos-header-steps .f-c-header-step__content.pos-steps-container, .pospago-prepos-datos #prepos-header-steps .f-c-header-step__content.pos-steps-container, .portabilidadmovistar-portabilidad-sim #prepos-header-steps .f-c-header-step__content.pos-steps-container, .portabilidadmovistar-portabilidad-identidad #prepos-header-steps .f-c-header-step__content.pos-steps-container, .portabilidadmovistar-portabilidad-confronta #prepos-header-steps .f-c-header-step__content.pos-steps-container, .portabilidadmovistar-portabilidad-contrato #prepos-header-steps .f-c-header-step__content.pos-steps-container, .portabilidadmovistar-portabilidad-thankyoupage #prepos-header-steps .f-c-header-step__content.pos-steps-container, .portabilidadmovistar-portabilidad-datos #prepos-header-steps .f-c-header-step__content.pos-steps-container { margin-top: 0; } } .pospago-prepos-validatenumber .c-header-wrap { z-index: 9 !important; } .pos-con-container { margin: 0 auto; } @media screen and (min-width: 740px) { .pos-con-container { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 620px; /* 9 */ max-width: 38.75rem; /* 9 */ } } @media screen and (max-width: 739px) { .pos-con-container { width: 100%; } } @media screen and (max-width: 739px) { .pos-con-container__title .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 36px; /* 9 */ font-size: 2.25rem; /* 9 */ text-align: center; } } .pos-con-container__title .c-form__title_big { font-weight: bold; } .pos-con-container__subtitle { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 35px; /* 9 */ margin-top: 2.1875rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .pos-con-container__subtitle h3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ } .pos-con-container__info { width: 100%; display: flex; justify-content: flex-start; align-items: center; background-color: white; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 30px; /* 9 */ margin-top: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 10px; /* 9 */ padding-right: 0.625rem; /* 9 */ } @media screen and (max-width: 739px) { .pos-con-container__info { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ align-items: flex-start; } } .pos-con-container__info-icon { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 15px; /* 9 */ margin: 0.9375rem; /* 9 */ font-size: 25px; color: #019DF4; } @media screen and (max-width: 739px) { .pos-con-container__info-icon { margin-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 10px; /* 9 */ margin-right: 0.625rem; /* 9 */ } } .pos-con-container__info h4 { text-transform: uppercase; } .pos-con-container__info p { font-size: 14px; } .pos-con-container__contract { display: flex; justify-content: space-around; align-items: center; width: max-content; max-width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 30px; /* 9 */ margin-top: 1.875rem; /* 9 */ margin-right: auto; margin-left: auto; } @media screen and (max-width: 739px) { .pos-con-container__contract { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 15px; /* 9 */ padding-left: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 15px; /* 9 */ padding-right: 0.9375rem; /* 9 */ } } .pos-con-container__contract .pos-icon-document { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 64px; /* 9 */ font-size: 4rem; /* 9 */ color: #019DF4; cursor: pointer; } .pos-con-container__contract-download { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 10px; /* 9 */ margin: 0.625rem; /* 9 */ } .pos-con-container__contract-download .download-doc { display: flex; align-items: center; justify-content: flex-start; font-size: 14px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 5px; /* 9 */ padding-bottom: 0.3125rem; /* 9 */ color: #019DF4; } .pos-con-container__contract-download .download-doc p { text-decoration: underline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ } .pos-con-container__contract-download .sign-contract { display: flex; align-items: center; justify-content: flex-start; } .pos-con-container__contract-download .sign-contract input[type=checkbox] { transform: scale(1.25); } .pos-con-container__contract-download .sign-contract p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ } .pos-con-container__contract-download .sign-contract p span { font-weight: bold; } @media (max-width: 600px) { .pos-con-container__contract-download .sign-contract p { text-align: left; } } .pos-con-container__submit { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ display: flex; align-items: center; justify-content: flex-end; } @media screen and (max-width: 739px) { .pos-con-container__submit { justify-content: center; } } .pos-con-container .pos-con-container__info { border-radius: 4px; } .pos-con-container .pos-con-container__info .descripcion { padding: 10px 0; } /* Modal Tratamiento de datos */ .modal-tratamiento .modal-inner-wrap { margin-top: 2% !important; } @media (max-width: 600px) { .modal-tratamiento .modal-inner-wrap { margin-top: 10% !important; } } .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago { overflow-y: auto; } .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago .o-modal__footer { text-align: center; } .header-tratamiento-datos { text-align: center; } .header-tratamiento-datos p { width: 70%; margin-left: auto; margin-right: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 26px; /* 9 */ line-height: 1.625rem; /* 9 */ color: #019DF4; } @media (max-width: 600px) { .header-tratamiento-datos p { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 25px; /* 9 */ line-height: 1.5625rem; /* 9 */ } } .o-modal__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 15px; /* 9 */ margin-bottom: 0.9375rem; /* 9 */ } .o-modal__content .contenido-tratamiento-datos { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 18px; /* 9 */ line-height: 1.125rem; /* 9 */ text-align: justify; } @media (max-width: 600px) { .o-modal__content .contenido-tratamiento-datos { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 16px; /* 9 */ line-height: 1rem; /* 9 */ } } .o-modal__content .titulo-whatsapp { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ color: #019DF4; font-weight: normal; } .o-modal__footer .btnContinuarTratamiento { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 255px; /* 9 */ min-width: 15.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } @media (max-width: 600px) { .o-modal__footer .btnContinuarTratamiento { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 150px; /* 9 */ min-width: 9.375rem; /* 9 */ } } .modalOrdenesPendientes .modal-footer, .modalErroresDatosPco .modal-footer { padding-bottom: 2.5rem !important; padding-top: 0.5rem !important; } #ordenes-pendientes h3.i-information, #errores-datos-pco h3.i-information { margin-top: 0rem; font-size: 70px; } #ordenes-pendientes .o-link { text-decoration: none; } @media only screen and (max-width: 620px) { .modalErroresDatosPco button.o-btn.o-btn_w255.o-btn_height56 { font-size: 13px !important; min-width: 210px !important; min-height: 50px !important; } .modalOrdenesPendientes .modal-footer, .modalErroresDatosPco .modal-footer { padding-top: 1rem !important; } #ordenes-pendientes h3.i-information, #errores-datos-pco h3.i-information { font-size: 50px !important; } } .pospagov-portabilidad-identidad #modal-nip { padding: 0; } .pospagov-portabilidad-identidad #modal-nip .o-modal__content { padding: 0; } .pospagov-portabilidad-identidad #modal-nip .nipTime, .pospagov-portabilidad-identidad #modal-nip .nipSendCode { width: 45%; float: left; margin: 0 auto; } #modal-nip { padding: 0; } #modal-nip .o-modal__content { padding: 0; } #modal-nip .header-imagen-nip { text-align: right; margin-right: 30%; } @media only screen and (max-width: 768px) { #modal-nip .header-imagen-nip { float: right; margin-right: 14%; } } #modal-nip .row { display: grid; grid-template-columns: 1fr 2fr; grid-template-rows: 1fr; grid-column-gap: 0px; grid-row-gap: 0px; } @media only screen and (max-width: 768px) { #modal-nip .row { display: block; } } #modal-nip .container-imagen-admin { width: 100%; height: auto; } #modal-nip .title-message-nip { font-size: 36px; font-weight: lighter; line-height: 48px; text-align: center; color: #313235; margin-bottom: 14px; } @media only screen and (max-width: 768px) { #modal-nip .title-message-nip { font-size: 24px; line-height: 26px; float: right; margin-top: -50px; width: 50%; text-align: center; } } #modal-nip .text-data-information-nip { font-size: 16px; line-height: 20px; text-align: center; } @media only screen and (max-width: 768px) { #modal-nip .text-data-information-nip { font-size: 14px; line-height: 20px; clear: both; } } #modal-nip .container_code { width: 80%; margin: 0 auto 20px; } #modal-nip .c-form__code-number { border: 1px solid #019df4; background: #e8f4ff; width: 50px; height: 65px; } @media only screen and (max-width: 768px) { #modal-nip .c-form__code-number { width: 11vw; height: 13vw; font-size: 20px; font-size: 2.5rem; padding: 0; } } #modal-nip .text-information-nip { color: #6b6b6b; font-size: 16px; font-weight: normal; text-align: center; width: 86%; margin: 0px auto; } @media only screen and (max-width: 768px) { #modal-nip .text-information-nip { font-size: 12px; line-height: 14px; } } #modal-nip .nipTime, #modal-nip .nipSendCode { width: 50%; float: left; } #modal-nip .nipTime { color: #50535a; font-size: 16px; font-weight: normal !important; } @media only screen and (max-width: 768px) { #modal-nip .nipTime { font-size: 13px; line-height: 24px; } } #modal-nip .nipSendCode { color: #b6b7b7; font-size: 16px; font-weight: normal !important; text-decoration: underline; } @media only screen and (max-width: 768px) { #modal-nip .nipSendCode { font-size: 13px; line-height: 24px; } } @media only screen and (max-width: 768px) { #modal-nip .row-mobile { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; grid-column-gap: 0px; grid-row-gap: 0px; } } .modalRateFibra { display: grid; padding: 10px; grid-template-rows: 200px 1fr 60px; gap: 10px; overflow: auto; } .modalRateFibra-header { display: grid; place-items: center; } .modalRateFibra-title { color: #313235; font-size: 24px; font-weight: 300; } .modalRateFibra-question { border: 1px solid #D3D4D3; border-radius: 6px; display: grid; place-items: center; padding: 10px; max-height: 250px; margin: 10px; } .modalRateFibra-points { display: flex; justify-content: space-around; align-items: center; gap: 20px; margin-top: 12px; } .modalRateFibra-points .point { width: 28px; height: 28px; border-radius: 100%; border: 1px solid; display: flex; justify-content: center; align-items: center; font-size: 14px; cursor: pointer; transition: all 0.2s; } .hover { color: #FFFFFF; background-color: #B8DBFB; border-color: #B8DBFB; } .befores { color: #FFFFFF; background-color: #B8DBFB; border-color: #B8DBFB; } span.point.active { color: #FFFFFF; background-color: #019DF4; border-color: #019DF4; } .modalRateFibra-footer { margin: 0 auto; } .point:hover { color: #FFFFFF; background-color: #B8DBFB; border-color: #B8DBFB; } .btn-enviar-rate { width: 200px; } @media only screen and (max-width: 800px) { .modalRateFibra-title { font-size: 18px; } .modalRateFibra-label { font-size: 14px; text-align: center; } img.modalRateFibra-icon { width: 100px; } .modalRateFibra { grid-template-rows: 123px 1fr 60px; } } .pospago-portabilidad-offers .f-c-plan__toggle-btn::after, .esim-index-index .f-c-plan__toggle-btn::after, .pospago-portabilidad-sim .f-c-plan__toggle-btn::after, .pospagov-portabilidad-offers .f-c-plan__toggle-btn::after { margin-left: -40px; } .pospago-portabilidad-offers .f-c-plan__toggle-btn::before, .esim-index-index .f-c-plan__toggle-btn::before, .pospago-portabilidad-sim .f-c-plan__toggle-btn::before, .pospagov-portabilidad-offers .f-c-plan__toggle-btn::before { position: relative; left: 78px; top: 3px; } .pospago-portabilidad-offers .is-benefits-down .f-c-plan__toggle-btn::before, .esim-index-index .is-benefits-down .f-c-plan__toggle-btn::before, .pospago-portabilidad-sim .is-benefits-down .f-c-plan__toggle-btn::before, .pospagov-portabilidad-offers .is-benefits-down .f-c-plan__toggle-btn::before { position: relative; left: 110px; } .pospago-portabilidad-offers .btnC2C-block, .esim-index-index .btnC2C-block, .pospago-portabilidad-sim .btnC2C-block, .pospagov-portabilidad-offers .btnC2C-block { cursor: pointer; } .pospago-portabilidad-offers .beneficioSlider img, .esim-index-index .beneficioSlider img, .pospago-portabilidad-sim .beneficioSlider img, .pospagov-portabilidad-offers .beneficioSlider img { box-shadow: 0px 0px 4px 2px rgba(11, 39, 57, 0.1); border-radius: 15px; } .pospago-portabilidad-offers .beneficioSlider:hover, .esim-index-index .beneficioSlider:hover, .pospago-portabilidad-sim .beneficioSlider:hover, .pospagov-portabilidad-offers .beneficioSlider:hover { transform: translateY(-3px); } .pospago-portabilidad-offers img.tooltip_disney, .esim-index-index img.tooltip_disney, .pospago-portabilidad-sim img.tooltip_disney, .pospagov-portabilidad-offers img.tooltip_disney { position: relative; left: 45%; top: -40px; } .pospago-portabilidad-offers b, .pospago-portabilidad-offers strong, .esim-index-index b, .esim-index-index strong, .pospago-portabilidad-sim b, .pospago-portabilidad-sim strong, .pospagov-portabilidad-offers b, .pospagov-portabilidad-offers strong { font-weight: bold; } .pospago-portabilidad-offers .d-flex-row, .esim-index-index .d-flex-row, .pospago-portabilidad-sim .d-flex-row, .pospagov-portabilidad-offers .d-flex-row { display: flex; flex-direction: row !important; } .pospago-portabilidad-offers .o-section, .esim-index-index .o-section, .pospago-portabilidad-sim .o-section, .pospagov-portabilidad-offers .o-section { margin-top: 50px; } .pospago-portabilidad-offers .modals-overlay, .esim-index-index .modals-overlay, .pospago-portabilidad-sim .modals-overlay, .pospagov-portabilidad-offers .modals-overlay { pointer-events: none; cursor: none; } .pospago-portabilidad-offers section#content-component, .esim-index-index section#content-component, .pospago-portabilidad-sim section#content-component, .pospagov-portabilidad-offers section#content-component { margin-top: 0px !important; } .pospago-portabilidad-offers .column.main, .esim-index-index .column.main, .pospago-portabilidad-sim .column.main, .pospagov-portabilidad-offers .column.main { padding: 0; } .pospago-portabilidad-offers .search-tabs, .esim-index-index .search-tabs, .pospago-portabilidad-sim .search-tabs, .pospagov-portabilidad-offers .search-tabs { display: none; } .pospago-portabilidad-offers .elige_apps, .esim-index-index .elige_apps, .pospago-portabilidad-sim .elige_apps, .pospagov-portabilidad-offers .elige_apps { cursor: pointer; } .pospago-portabilidad-offers .f-c-plan__content, .esim-index-index .f-c-plan__content, .pospago-portabilidad-sim .f-c-plan__content, .pospagov-portabilidad-offers .f-c-plan__content { padding: 0 0 4px 0; border-radius: 16px; } .pospago-portabilidad-offers .is-plan-recommended .f-c-plan__content, .esim-index-index .is-plan-recommended .f-c-plan__content, .pospago-portabilidad-sim .is-plan-recommended .f-c-plan__content, .pospagov-portabilidad-offers .is-plan-recommended .f-c-plan__content { padding: 0 !important; } .pospago-portabilidad-offers header.f-c-plan__header, .esim-index-index header.f-c-plan__header, .pospago-portabilidad-sim header.f-c-plan__header, .pospagov-portabilidad-offers header.f-c-plan__header { margin-bottom: 15px; } .pospago-portabilidad-offers .f-c-plan__header-price, .esim-index-index .f-c-plan__header-price, .pospago-portabilidad-sim .f-c-plan__header-price, .pospagov-portabilidad-offers .f-c-plan__header-price { margin-top: 0; } .pospago-portabilidad-offers .f-c-plan__header-price .header_plan_dcto, .esim-index-index .f-c-plan__header-price .header_plan_dcto, .pospago-portabilidad-sim .f-c-plan__header-price .header_plan_dcto, .pospagov-portabilidad-offers .f-c-plan__header-price .header_plan_dcto { background-color: #F28D15; color: #fff; padding: 5px; font-size: 14px; font-weight: bold; line-height: 16px; } .pospago-portabilidad-offers .f-c-plan__header-price .txt_price, .esim-index-index .f-c-plan__header-price .txt_price, .pospago-portabilidad-sim .f-c-plan__header-price .txt_price, .pospagov-portabilidad-offers .f-c-plan__header-price .txt_price { color: #313235; padding: 15px; } .pospago-portabilidad-offers .f-c-plan__header-price .f-c-plan__price-dues, .esim-index-index .f-c-plan__header-price .f-c-plan__price-dues, .pospago-portabilidad-sim .f-c-plan__header-price .f-c-plan__price-dues, .pospagov-portabilidad-offers .f-c-plan__header-price .f-c-plan__price-dues { color: #86888C; font-size: 14px; line-height: 16px; padding: 10px 20px; font-weight: 300; text-align: center; } .pospago-portabilidad-offers .f-c-plan__header-caption, .esim-index-index .f-c-plan__header-caption, .pospago-portabilidad-sim .f-c-plan__header-caption, .pospagov-portabilidad-offers .f-c-plan__header-caption { background-color: #0B2739; border-radius: 16px 16px 0 0; padding: 10px; text-align: center; } .pospago-portabilidad-offers .f-c-plan__header-caption .f-c-plan_subtitle, .esim-index-index .f-c-plan__header-caption .f-c-plan_subtitle, .pospago-portabilidad-sim .f-c-plan__header-caption .f-c-plan_subtitle, .pospagov-portabilidad-offers .f-c-plan__header-caption .f-c-plan_subtitle { font-size: 14px; font-weight: 100; margin-top: 10px; } .pospago-portabilidad-offers .f-c-plan__header-caption .f-c-plan__title, .esim-index-index .f-c-plan__header-caption .f-c-plan__title, .pospago-portabilidad-sim .f-c-plan__header-caption .f-c-plan__title, .pospagov-portabilidad-offers .f-c-plan__header-caption .f-c-plan__title { font-size: 36px; font-weight: bold; color: #fff; } .pospago-portabilidad-offers .f-c-plan__flag, .esim-index-index .f-c-plan__flag, .pospago-portabilidad-sim .f-c-plan__flag, .pospagov-portabilidad-offers .f-c-plan__flag { text-align: center; max-width: 100% !important; border-radius: 16px 16px 0 0 !important; top: -24px !important; font-size: 16px !important; line-height: 24px; } .pospago-portabilidad-offers .is-plan-recommended .f-c-plan__content, .esim-index-index .is-plan-recommended .f-c-plan__content, .pospago-portabilidad-sim .is-plan-recommended .f-c-plan__content, .pospagov-portabilidad-offers .is-plan-recommended .f-c-plan__content { border-radius: 0 0 16px 16px; } .pospago-portabilidad-offers .is-plan-recommended .f-c-plan__content .f-c-plan__header-caption, .esim-index-index .is-plan-recommended .f-c-plan__content .f-c-plan__header-caption, .pospago-portabilidad-sim .is-plan-recommended .f-c-plan__content .f-c-plan__header-caption, .pospagov-portabilidad-offers .is-plan-recommended .f-c-plan__content .f-c-plan__header-caption { border-radius: 0 !important; } .pospago-portabilidad-offers .f-c-plan__price-offer, .esim-index-index .f-c-plan__price-offer, .pospago-portabilidad-sim .f-c-plan__price-offer, .pospagov-portabilidad-offers .f-c-plan__price-offer { font-size: 40px; line-height: 38px; color: #313235; } .pospago-portabilidad-offers .ivaincluido, .esim-index-index .ivaincluido, .pospago-portabilidad-sim .ivaincluido, .pospagov-portabilidad-offers .ivaincluido { font-weight: 300; } .pospago-portabilidad-offers .f-c-plan__price, .esim-index-index .f-c-plan__price, .pospago-portabilidad-sim .f-c-plan__price, .pospagov-portabilidad-offers .f-c-plan__price { display: block; } .pospago-portabilidad-offers .center, .esim-index-index .center, .pospago-portabilidad-sim .center, .pospagov-portabilidad-offers .center { text-align: center; } .pospago-portabilidad-offers .button-c2c, .esim-index-index .button-c2c, .pospago-portabilidad-sim .button-c2c, .pospagov-portabilidad-offers .button-c2c { padding: 13px; margin: 10px auto 0; width: 80%; border: 1px solid #019DF4; color: #019df4; font-weight: 700; } .pospago-portabilidad-offers .c-prime, .esim-index-index .c-prime, .pospago-portabilidad-sim .c-prime, .pospagov-portabilidad-offers .c-prime { margin: 10px auto; width: 87%; position: relative; } .pospago-portabilidad-offers .c-eligeApps, .esim-index-index .c-eligeApps, .pospago-portabilidad-sim .c-eligeApps, .pospagov-portabilidad-offers .c-eligeApps { width: 100%; margin-top: 10px; text-align: center; cursor: pointer; } .pospago-portabilidad-offers .c-eligeApps__title, .esim-index-index .c-eligeApps__title, .pospago-portabilidad-sim .c-eligeApps__title, .pospagov-portabilidad-offers .c-eligeApps__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ text-decoration: underline; } .pospago-portabilidad-offers .c-eligeApps__img, .esim-index-index .c-eligeApps__img, .pospago-portabilidad-sim .c-eligeApps__img, .pospagov-portabilidad-offers .c-eligeApps__img { max-width: 100%; margin: 8px auto; } .pospago-portabilidad-offers .c-minutos, .esim-index-index .c-minutos, .pospago-portabilidad-sim .c-minutos, .pospagov-portabilidad-offers .c-minutos { display: flex; align-items: center; justify-content: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 8px; /* 9 */ gap: 0.5rem; /* 9 */ } .pospago-portabilidad-offers .img_min img, .esim-index-index .img_min img, .pospago-portabilidad-sim .img_min img, .pospagov-portabilidad-offers .img_min img { width: 30px !important; } .pospago-portabilidad-offers .c-compartir, .esim-index-index .c-compartir, .pospago-portabilidad-sim .c-compartir, .pospagov-portabilidad-offers .c-compartir { width: 100%; } .pospago-portabilidad-offers .f-c-plan__toggle-content.js-plan-target, .esim-index-index .f-c-plan__toggle-content.js-plan-target, .pospago-portabilidad-sim .f-c-plan__toggle-content.js-plan-target, .pospagov-portabilidad-offers .f-c-plan__toggle-content.js-plan-target { margin-top: 0; } .pospago-portabilidad-offers li.f-c-plan__benefit.js-plan-benefit, .esim-index-index li.f-c-plan__benefit.js-plan-benefit, .pospago-portabilidad-sim li.f-c-plan__benefit.js-plan-benefit, .pospagov-portabilidad-offers li.f-c-plan__benefit.js-plan-benefit { border-bottom: 1px solid #E4E4E4; margin: auto; width: 96%; } .pospago-portabilidad-offers li.f-c-plan__benefit.js-plan-benefit:last-of-type, .esim-index-index li.f-c-plan__benefit.js-plan-benefit:last-of-type, .pospago-portabilidad-sim li.f-c-plan__benefit.js-plan-benefit:last-of-type, .pospagov-portabilidad-offers li.f-c-plan__benefit.js-plan-benefit:last-of-type { border: none; } .pospago-portabilidad-offers .f-c-plan__toggle-btn, .esim-index-index .f-c-plan__toggle-btn, .pospago-portabilidad-sim .f-c-plan__toggle-btn, .pospagov-portabilidad-offers .f-c-plan__toggle-btn { display: none; } .pospago-portabilidad-offers .minutes, .esim-index-index .minutes, .pospago-portabilidad-sim .minutes, .pospagov-portabilidad-offers .minutes { color: #0B2739; font-size: 12px; line-height: 15px; padding: 0 10px 0 0; } .pospago-portabilidad-offers .gbcompartir, .esim-index-index .gbcompartir, .pospago-portabilidad-sim .gbcompartir, .pospagov-portabilidad-offers .gbcompartir { line-height: 15px; width: 76%; text-align: left; } .pospago-portabilidad-offers .tooltip, .esim-index-index .tooltip, .pospago-portabilidad-sim .tooltip, .pospagov-portabilidad-offers .tooltip { display: none; border: #019DF4 1px solid; padding: 5px; z-index: 100; background-color: #E1EFFF; left: 75%; position: absolute; top: 95%; text-decoration: none; color: #6b6b6b; font-size: 11px; line-height: 11px; display: none; width: 175px; border-radius: 3px; } .pospago-portabilidad-offers .tooltip_cortesia, .esim-index-index .tooltip_cortesia, .pospago-portabilidad-sim .tooltip_cortesia, .pospagov-portabilidad-offers .tooltip_cortesia { position: absolute; top: 35%; right: 4%; } .pospago-portabilidad-offers .tooltipPrime, .esim-index-index .tooltipPrime, .pospago-portabilidad-sim .tooltipPrime, .pospagov-portabilidad-offers .tooltipPrime { box-shadow: 0px 4px 4px rgba(11, 39, 57, 0.1); padding: 5px; display: none; z-index: 100; font-size: 11px; line-height: 11px; width: 95px; border-radius: 3px; left: 70%; top: -70%; position: absolute; background: #fff; } .pospago-portabilidad-offers .compartir, .esim-index-index .compartir, .pospago-portabilidad-sim .compartir, .pospagov-portabilidad-offers .compartir { margin: 0 8px; } .pospago-portabilidad-offers .tip, .esim-index-index .tip, .pospago-portabilidad-sim .tip, .pospagov-portabilidad-offers .tip { right: 8%; position: absolute; bottom: 6%; } .pospago-portabilidad-offers .f-c-plan-slide, .pospago-portabilidad-offers .f-c-plan, .esim-index-index .f-c-plan-slide, .esim-index-index .f-c-plan, .pospago-portabilidad-sim .f-c-plan-slide, .pospago-portabilidad-sim .f-c-plan, .pospagov-portabilidad-offers .f-c-plan-slide, .pospagov-portabilidad-offers .f-c-plan { max-width: initial !important; } .pospago-portabilidad-offers .pasos_prepos, .esim-index-index .pasos_prepos, .pospago-portabilidad-sim .pasos_prepos, .pospagov-portabilidad-offers .pasos_prepos { background-color: #fff; box-shadow: 0px 4px 4px rgba(11, 39, 57, 0.1); } .pospago-portabilidad-offers .compartir, .esim-index-index .compartir, .pospago-portabilidad-sim .compartir, .pospagov-portabilidad-offers .compartir { margin: 0 15px; } .pospago-portabilidad-offers div#modal-Eligeapps, .esim-index-index div#modal-Eligeapps, .pospago-portabilidad-sim div#modal-Eligeapps, .pospagov-portabilidad-offers div#modal-Eligeapps { padding: 2.75rem 0px !important; } .pospago-portabilidad-offers .pagebuilder-column:not(.d-flex-row) figure, .esim-index-index .pagebuilder-column:not(.d-flex-row) figure, .pospago-portabilidad-sim .pagebuilder-column:not(.d-flex-row) figure, .pospagov-portabilidad-offers .pagebuilder-column:not(.d-flex-row) figure { margin: auto; } .pospago-portabilidad-offers button#btnConfirmarLine, .esim-index-index button#btnConfirmarLine, .pospago-portabilidad-sim button#btnConfirmarLine, .pospagov-portabilidad-offers button#btnConfirmarLine { margin-bottom: 20px; } .pospago-portabilidad-offers span#messageInf, .esim-index-index span#messageInf, .pospago-portabilidad-sim span#messageInf, .pospagov-portabilidad-offers span#messageInf { padding-left: 0px !important; } .pospago-portabilidad-offers #msjResponseC2C, .esim-index-index #msjResponseC2C, .pospago-portabilidad-sim #msjResponseC2C, .pospagov-portabilidad-offers #msjResponseC2C { padding: 5px 10px; margin: 10px auto; font-size: 12px; text-align: left; } .pospago-portabilidad-offers #msjResponseC2C.msj_success, .esim-index-index #msjResponseC2C.msj_success, .pospago-portabilidad-sim #msjResponseC2C.msj_success, .pospagov-portabilidad-offers #msjResponseC2C.msj_success { background-color: #BDE4A4; border: 1px solid #5CB615; color: #313235; } .pospago-portabilidad-offers #msjResponseC2C.msj_fail, .esim-index-index #msjResponseC2C.msj_fail, .pospago-portabilidad-sim #msjResponseC2C.msj_fail, .pospagov-portabilidad-offers #msjResponseC2C.msj_fail { background-color: #F8D2B3; border: 1px solid #F28D15; } .pospago-portabilidad-offers span#modaltyc, .esim-index-index span#modaltyc, .pospago-portabilidad-sim span#modaltyc, .pospagov-portabilidad-offers span#modaltyc { cursor: pointer; text-decoration: underline; } .pospago-portabilidad-offers .title-c2c p span, .esim-index-index .title-c2c p span, .pospago-portabilidad-sim .title-c2c p span, .pospagov-portabilidad-offers .title-c2c p span { font-size: 36px !important; line-height: 38px !important; } .pospago-portabilidad-offers .o-modal, .esim-index-index .o-modal, .pospago-portabilidad-sim .o-modal, .pospagov-portabilidad-offers .o-modal { overflow: auto; } .pospago-portabilidad-offers .web-none, .esim-index-index .web-none, .pospago-portabilidad-sim .web-none, .pospagov-portabilidad-offers .web-none { display: none; } .pospago-portabilidad-offers .mobile-none, .esim-index-index .mobile-none, .pospago-portabilidad-sim .mobile-none, .pospagov-portabilidad-offers .mobile-none { display: flex; } .pospago-portabilidad-offers #dejanosLlamarte, .esim-index-index #dejanosLlamarte, .pospago-portabilidad-sim #dejanosLlamarte, .pospagov-portabilidad-offers #dejanosLlamarte { background-color: #0B2739; border-radius: 8px; padding: 5px auto; } .pospago-portabilidad-offers #c-c2c *, .esim-index-index #c-c2c *, .pospago-portabilidad-sim #c-c2c *, .pospagov-portabilidad-offers #c-c2c * { font-size: 14px; } .pospago-portabilidad-offers #c-c2c .c-form__box, .esim-index-index #c-c2c .c-form__box, .pospago-portabilidad-sim #c-c2c .c-form__box, .pospagov-portabilidad-offers #c-c2c .c-form__box { margin-bottom: 0px; } .pospago-portabilidad-offers #c-c2c small.c-form__checkbox-text.tcC2C, .esim-index-index #c-c2c small.c-form__checkbox-text.tcC2C, .pospago-portabilidad-sim #c-c2c small.c-form__checkbox-text.tcC2C, .pospagov-portabilidad-offers #c-c2c small.c-form__checkbox-text.tcC2C { color: #fff; } .pospago-portabilidad-offers #c-c2c .c-form__field, .esim-index-index #c-c2c .c-form__field, .pospago-portabilidad-sim #c-c2c .c-form__field, .pospagov-portabilidad-offers #c-c2c .c-form__field { padding: 4px 10px; border-radius: 8px; } .pospago-portabilidad-offers #c-c2c .c-form__input2, .esim-index-index #c-c2c .c-form__input2, .pospago-portabilidad-sim #c-c2c .c-form__input2, .pospagov-portabilidad-offers #c-c2c .c-form__input2 { width: 100%; border: none; color: #0B2739; background: #fff; } .pospago-portabilidad-offers #c-c2c .c-form__icon, .esim-index-index #c-c2c .c-form__icon, .pospago-portabilidad-sim #c-c2c .c-form__icon, .pospagov-portabilidad-offers #c-c2c .c-form__icon { color: #019DF4; } .pospago-portabilidad-offers #c-c2c button.btnC2C-prepos, .esim-index-index #c-c2c button.btnC2C-prepos, .pospago-portabilidad-sim #c-c2c button.btnC2C-prepos, .pospagov-portabilidad-offers #c-c2c button.btnC2C-prepos { padding: 9px; } .pospago-portabilidad-offers #dejanosLlamarte .f-flex-tyc, .esim-index-index #dejanosLlamarte .f-flex-tyc, .pospago-portabilidad-sim #dejanosLlamarte .f-flex-tyc, .pospagov-portabilidad-offers #dejanosLlamarte .f-flex-tyc { padding-left: 30px; margin-bottom: 3px; } .pospago-portabilidad-offers #dejanosLlamarte .f-flex-tyc .tcC2C, .esim-index-index #dejanosLlamarte .f-flex-tyc .tcC2C, .pospago-portabilidad-sim #dejanosLlamarte .f-flex-tyc .tcC2C, .pospagov-portabilidad-offers #dejanosLlamarte .f-flex-tyc .tcC2C { color: #fff; font-size: 12px; } .pospago-portabilidad-offers #dejanosLlamarte .c-form__checkbox-label:before, .esim-index-index #dejanosLlamarte .c-form__checkbox-label:before, .pospago-portabilidad-sim #dejanosLlamarte .c-form__checkbox-label:before, .pospagov-portabilidad-offers #dejanosLlamarte .c-form__checkbox-label:before { margin-right: 10px; } .pospago-portabilidad-offers .img-rooming, .esim-index-index .img-rooming, .pospago-portabilidad-sim .img-rooming, .pospagov-portabilidad-offers .img-rooming { max-width: 30%; } .pospago-portabilidad-offers .btn-compra, .esim-index-index .btn-compra, .pospago-portabilidad-sim .btn-compra, .pospagov-portabilidad-offers .btn-compra { border: 1px solid #019DF4; color: #019DF4; font-size: 15px; font-weight: bold; border-radius: 60px; padding: 5px; max-width: 50%; } .pospago-portabilidad-offers .btn-planes, .esim-index-index .btn-planes, .pospago-portabilidad-sim .btn-planes, .pospagov-portabilidad-offers .btn-planes { border: 1px solid #fff; color: #fff; font-size: 15px; font-weight: bold; border-radius: 60px; padding: 5px 25px; max-width: 50%; margin: auto; cursor: pointer; } .pospago-portabilidad-offers .recomendado, .esim-index-index .recomendado, .pospago-portabilidad-sim .recomendado, .pospagov-portabilidad-offers .recomendado { background-color: #F28D15; width: 90px; margin-left: 65%; } .pospago-portabilidad-offers .video-disney-star, .esim-index-index .video-disney-star, .pospago-portabilidad-sim .video-disney-star, .pospagov-portabilidad-offers .video-disney-star { /* height: 200px; width: 85%;*/ } .pospago-portabilidad-offers .video-disney-star iframe, .esim-index-index .video-disney-star iframe, .pospago-portabilidad-sim .video-disney-star iframe, .pospagov-portabilidad-offers .video-disney-star iframe { height: 250px; width: 90%; } .pospago-portabilidad-offers .button-c2c.c2c-banner, .esim-index-index .button-c2c.c2c-banner, .pospago-portabilidad-sim .button-c2c.c2c-banner, .pospagov-portabilidad-offers .button-c2c.c2c-banner { background-color: #019DF4; color: #fff; border-radius: 30px; max-width: 50%; margin: 15px 0; } .pospago-portabilidad-offers .sidebar.sidebar-main.terms, .esim-index-index .sidebar.sidebar-main.terms, .pospago-portabilidad-sim .sidebar.sidebar-main.terms, .pospagov-portabilidad-offers .sidebar.sidebar-main.terms { margin-top: 0; border-bottom: 1px solid #D3D4D3; padding: 15px 0; } .pospago-portabilidad-offers .comentario figure img, .esim-index-index .comentario figure img, .pospago-portabilidad-sim .comentario figure img, .pospagov-portabilidad-offers .comentario figure img { width: 15px; max-width: 15px; min-width: 15px; } .pospago-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-arrow, .esim-index-index .js-slider-beneficios-porta-wrap .f-c-plan-arrow, .pospago-portabilidad-sim .js-slider-beneficios-porta-wrap .f-c-plan-arrow, .pospagov-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-arrow { top: 100%; } .pospago-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-next, .esim-index-index .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-next, .pospago-portabilidad-sim .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-next, .pospagov-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-next { right: 30px; } .pospago-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-prev, .esim-index-index .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-prev, .pospago-portabilidad-sim .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-prev, .pospagov-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-arrow.swiper-button-prev { right: 100px; } .pospago-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-wrap, .esim-index-index .js-slider-beneficios-porta-wrap .f-c-plan-wrap, .pospago-portabilidad-sim .js-slider-beneficios-porta-wrap .f-c-plan-wrap, .pospagov-portabilidad-offers .js-slider-beneficios-porta-wrap .f-c-plan-wrap { margin-top: 0px !important; } @media only screen and (max-width: 620px) { .pospago-portabilidad-offers #c-rooming-netflix, .esim-index-index #c-rooming-netflix, .pospago-portabilidad-sim #c-rooming-netflix, .pospagov-portabilidad-offers #c-rooming-netflix { flex-direction: column; } .pospago-portabilidad-offers #c-rooming-netflix .mobile-100, .esim-index-index #c-rooming-netflix .mobile-100, .pospago-portabilidad-sim #c-rooming-netflix .mobile-100, .pospagov-portabilidad-offers #c-rooming-netflix .mobile-100 { width: 100%; } .pospago-portabilidad-offers #c-rooming-netflix .btn-compra, .esim-index-index #c-rooming-netflix .btn-compra, .pospago-portabilidad-sim #c-rooming-netflix .btn-compra, .pospagov-portabilidad-offers #c-rooming-netflix .btn-compra { margin: 15px auto; padding: 5px 10px; } } .pospago-portabilidad-offers .modal-content, .esim-index-index .modal-content, .pospago-portabilidad-sim .modal-content, .pospagov-portabilidad-offers .modal-content { padding: 0; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix, .esim-index-index .modal-content #modal-planes-netflix, .pospago-portabilidad-sim .modal-content #modal-planes-netflix, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix { /*background-color: #0C273A;*/ padding: 30px; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .f-c-plan__title, .esim-index-index .modal-content #modal-planes-netflix .f-c-plan__title, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .f-c-plan__title, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .f-c-plan__title { margin-bottom: 0; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .msjPantalla, .esim-index-index .modal-content #modal-planes-netflix .msjPantalla, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .msjPantalla, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .msjPantalla { background-color: #F28D15; font-size: 14px; text-align: center; color: white; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .title-plan-netflix, .esim-index-index .modal-content #modal-planes-netflix .title-plan-netflix, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .title-plan-netflix, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .title-plan-netflix { background-color: #019DF4; border-radius: 15px 15px 0 0; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix #c-input-phone, .esim-index-index .modal-content #modal-planes-netflix #c-input-phone, .pospago-portabilidad-sim .modal-content #modal-planes-netflix #c-input-phone, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix #c-input-phone { width: 600px !important; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .c-form__checkbox, .esim-index-index .modal-content #modal-planes-netflix .c-form__checkbox, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .c-form__checkbox, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .c-form__checkbox { padding-top: 6px; width: 25px; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .tcC2C, .esim-index-index .modal-content #modal-planes-netflix .tcC2C, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .tcC2C, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .tcC2C { font-size: 11px; line-height: 12px; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .f-c-plan__price img, .esim-index-index .modal-content #modal-planes-netflix .f-c-plan__price img, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .f-c-plan__price img, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .f-c-plan__price img { pointer-events: none; margin: 8px 33%; text-align: center; width: 34%; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix header.f-c-plan__header, .esim-index-index .modal-content #modal-planes-netflix header.f-c-plan__header, .pospago-portabilidad-sim .modal-content #modal-planes-netflix header.f-c-plan__header, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix header.f-c-plan__header { margin-bottom: 0px; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .c_roomin, .esim-index-index .modal-content #modal-planes-netflix .c_roomin, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .c_roomin, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .c_roomin { background-color: #f5f5f5; width: 85%; margin: auto; padding: 10px; display: flex; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .c_roomin p, .esim-index-index .modal-content #modal-planes-netflix .c_roomin p, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .c_roomin p, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .c_roomin p { font-size: 12px; color: #313235; font-weight: bold; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix #c-C2Cnetflix, .esim-index-index .modal-content #modal-planes-netflix #c-C2Cnetflix, .pospago-portabilidad-sim .modal-content #modal-planes-netflix #c-C2Cnetflix, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix #c-C2Cnetflix { width: 85%; margin: auto; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c, .esim-index-index .modal-content #modal-planes-netflix #c-c2c, .pospago-portabilidad-sim .modal-content #modal-planes-netflix #c-c2c, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c { font-size: 12px; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c .c-form__field, .esim-index-index .modal-content #modal-planes-netflix #c-c2c .c-form__field, .pospago-portabilidad-sim .modal-content #modal-planes-netflix #c-c2c .c-form__field, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c .c-form__field { width: 95%; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c .c-form__icon::before, .esim-index-index .modal-content #modal-planes-netflix #c-c2c .c-form__icon::before, .pospago-portabilidad-sim .modal-content #modal-planes-netflix #c-c2c .c-form__icon::before, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c .c-form__icon::before { padding-right: 0.4rem; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c .o-btn, .esim-index-index .modal-content #modal-planes-netflix #c-c2c .o-btn, .pospago-portabilidad-sim .modal-content #modal-planes-netflix #c-c2c .o-btn, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix #c-c2c .o-btn { width: 100%; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .c-C2Cnetflix, .esim-index-index .modal-content #modal-planes-netflix .c-C2Cnetflix, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .c-C2Cnetflix, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .c-C2Cnetflix { width: 90%; margin: 20px auto 0; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix .c-C2Cnetflix .u-width-100, .esim-index-index .modal-content #modal-planes-netflix .c-C2Cnetflix .u-width-100, .pospago-portabilidad-sim .modal-content #modal-planes-netflix .c-C2Cnetflix .u-width-100, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix .c-C2Cnetflix .u-width-100 { width: 100% !important; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit, .esim-index-index .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit, .pospago-portabilidad-sim .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit { padding: 5px; } .pospago-portabilidad-offers .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit:first-of-type, .esim-index-index .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit:first-of-type, .pospago-portabilidad-sim .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit:first-of-type, .pospagov-portabilidad-offers .modal-content #modal-planes-netflix li.f-c-plan__benefit.js-plan-benefit:first-of-type { border-top: 1px solid #E4E4E4; margin-top: 10px; } .pospago-portabilidad-offers span.f-c-plan__toggle-btn, .esim-index-index span.f-c-plan__toggle-btn, .pospago-portabilidad-sim span.f-c-plan__toggle-btn, .pospagov-portabilidad-offers span.f-c-plan__toggle-btn { margin-top: 10px; } @media only screen and (max-width: 620px) { .pospago-portabilidad-offers .mobile-flex-colum, .esim-index-index .mobile-flex-colum, .pospago-portabilidad-sim .mobile-flex-colum, .pospagov-portabilidad-offers .mobile-flex-colum { flex-direction: column; } .pospago-portabilidad-offers .mobile-flex-colum #c-input-phone, .esim-index-index .mobile-flex-colum #c-input-phone, .pospago-portabilidad-sim .mobile-flex-colum #c-input-phone, .pospagov-portabilidad-offers .mobile-flex-colum #c-input-phone { max-width: 100%; } .pospago-portabilidad-offers .mobile-margin-top-16, .esim-index-index .mobile-margin-top-16, .pospago-portabilidad-sim .mobile-margin-top-16, .pospagov-portabilidad-offers .mobile-margin-top-16 { margin-top: 16px; } .pospago-portabilidad-offers .web-none, .esim-index-index .web-none, .pospago-portabilidad-sim .web-none, .pospagov-portabilidad-offers .web-none { display: block; } .pospago-portabilidad-offers .title-c2c p span, .esim-index-index .title-c2c p span, .pospago-portabilidad-sim .title-c2c p span, .pospagov-portabilidad-offers .title-c2c p span { font-size: 26px !important; line-height: 28px !important; } .pospago-portabilidad-offers .f-c-plan__toggle-btn, .pospago-portabilidad-offers header.f-c-plan__header, .esim-index-index .f-c-plan__toggle-btn, .esim-index-index header.f-c-plan__header, .pospago-portabilidad-sim .f-c-plan__toggle-btn, .pospago-portabilidad-sim header.f-c-plan__header, .pospagov-portabilidad-offers .f-c-plan__toggle-btn, .pospagov-portabilidad-offers header.f-c-plan__header { display: block; margin-top: 0; margin-bottom: 1rem; } .pospago-portabilidad-offers .mobile-none, .pospago-portabilidad-offers .f-c-plan__header::before, .esim-index-index .mobile-none, .esim-index-index .f-c-plan__header::before, .pospago-portabilidad-sim .mobile-none, .pospago-portabilidad-sim .f-c-plan__header::before, .pospagov-portabilidad-offers .mobile-none, .pospagov-portabilidad-offers .f-c-plan__header::before { display: none; } .pospago-portabilidad-offers .f-c-plan-mb-0, .esim-index-index .f-c-plan-mb-0, .pospago-portabilidad-sim .f-c-plan-mb-0, .pospagov-portabilidad-offers .f-c-plan-mb-0 { margin-bottom: 0; } .pospago-portabilidad-offers .f-c-plan__price-offer, .esim-index-index .f-c-plan__price-offer, .pospago-portabilidad-sim .f-c-plan__price-offer, .pospagov-portabilidad-offers .f-c-plan__price-offer { margin-top: 10px; margin-bottom: 0; } .pospago-portabilidad-offers img.tooltip_cortesia, .esim-index-index img.tooltip_cortesia, .pospago-portabilidad-sim img.tooltip_cortesia, .pospagov-portabilidad-offers img.tooltip_cortesia { top: 35%; } .pospago-portabilidad-offers li.f-c-plan__benefit.js-plan-benefit, .esim-index-index li.f-c-plan__benefit.js-plan-benefit, .pospago-portabilidad-sim li.f-c-plan__benefit.js-plan-benefit, .pospagov-portabilidad-offers li.f-c-plan__benefit.js-plan-benefit { width: 85%; } .pospago-portabilidad-offers .imgBanderas, .esim-index-index .imgBanderas, .pospago-portabilidad-sim .imgBanderas, .pospagov-portabilidad-offers .imgBanderas { margin: auto 10px; } .pospago-portabilidad-offers .compartir, .esim-index-index .compartir, .pospago-portabilidad-sim .compartir, .pospagov-portabilidad-offers .compartir { margin: 0 25px; } .pospago-portabilidad-offers .tooltip, .esim-index-index .tooltip, .pospago-portabilidad-sim .tooltip, .pospagov-portabilidad-offers .tooltip { left: 48%; top: 86%; } .pospago-portabilidad-offers .tooltipPrime, .esim-index-index .tooltipPrime, .pospago-portabilidad-sim .tooltipPrime, .pospagov-portabilidad-offers .tooltipPrime { top: -70%; } .pospago-portabilidad-offers .pasos_prepos .pagebuilder-column-line, .esim-index-index .pasos_prepos .pagebuilder-column-line, .pospago-portabilidad-sim .pasos_prepos .pagebuilder-column-line, .pospagov-portabilidad-offers .pasos_prepos .pagebuilder-column-line { display: block !important; } .pospago-portabilidad-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column, .esim-index-index .pasos_prepos .pagebuilder-column-line .pagebuilder-column, .pospago-portabilidad-sim .pasos_prepos .pagebuilder-column-line .pagebuilder-column, .pospagov-portabilidad-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column { display: block !important; width: 100% !important; margin-top: 20px !important; } .pospago-portabilidad-offers .pasos_prepos .pagebuilder-column-line .mobile-top-none, .pospago-portabilidad-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column:first-of-type, .pospago-portabilidad-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column:last-of-type, .esim-index-index .pasos_prepos .pagebuilder-column-line .mobile-top-none, .esim-index-index .pasos_prepos .pagebuilder-column-line .pagebuilder-column:first-of-type, .esim-index-index .pasos_prepos .pagebuilder-column-line .pagebuilder-column:last-of-type, .pospago-portabilidad-sim .pasos_prepos .pagebuilder-column-line .mobile-top-none, .pospago-portabilidad-sim .pasos_prepos .pagebuilder-column-line .pagebuilder-column:first-of-type, .pospago-portabilidad-sim .pasos_prepos .pagebuilder-column-line .pagebuilder-column:last-of-type, .pospagov-portabilidad-offers .pasos_prepos .pagebuilder-column-line .mobile-top-none, .pospagov-portabilidad-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column:first-of-type, .pospagov-portabilidad-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column:last-of-type { margin-top: 0px !important; } .pospago-portabilidad-offers .tip, .esim-index-index .tip, .pospago-portabilidad-sim .tip, .pospagov-portabilidad-offers .tip { bottom: unset; } .pospago-portabilidad-offers .pagebuilder-column, .esim-index-index .pagebuilder-column, .pospago-portabilidad-sim .pagebuilder-column, .pospagov-portabilidad-offers .pagebuilder-column { flex-basis: unset; } .pospago-portabilidad-offers .mobile-w100, .esim-index-index .mobile-w100, .pospago-portabilidad-sim .mobile-w100, .pospagov-portabilidad-offers .mobile-w100 { width: 100% !important; } .pospago-portabilidad-offers #dejanosLlamarte, .esim-index-index #dejanosLlamarte, .pospago-portabilidad-sim #dejanosLlamarte, .pospagov-portabilidad-offers #dejanosLlamarte { flex-direction: column; padding: 10px 0; margin-top: 0; } .pospago-portabilidad-offers #dejanosLlamarte .u-width-50, .esim-index-index #dejanosLlamarte .u-width-50, .pospago-portabilidad-sim #dejanosLlamarte .u-width-50, .pospagov-portabilidad-offers #dejanosLlamarte .u-width-50 { width: 100%; } .pospago-portabilidad-offers #dejanosLlamarte .txt-dejanosLlamarte, .esim-index-index #dejanosLlamarte .txt-dejanosLlamarte, .pospago-portabilidad-sim #dejanosLlamarte .txt-dejanosLlamarte, .pospagov-portabilidad-offers #dejanosLlamarte .txt-dejanosLlamarte { padding: 0 40px; text-align: center; margin-top: 0; } .pospago-portabilidad-offers #dejanosLlamarte #c-c2c, .esim-index-index #dejanosLlamarte #c-c2c, .pospago-portabilidad-sim #dejanosLlamarte #c-c2c, .pospagov-portabilidad-offers #dejanosLlamarte #c-c2c { flex-direction: column; } .pospago-portabilidad-offers #dejanosLlamarte #c-c2c .btnC2C-prepos, .esim-index-index #dejanosLlamarte #c-c2c .btnC2C-prepos, .pospago-portabilidad-sim #dejanosLlamarte #c-c2c .btnC2C-prepos, .pospagov-portabilidad-offers #dejanosLlamarte #c-c2c .btnC2C-prepos { width: 100%; max-width: 100%; margin-top: 15px; } .pospago-portabilidad-offers .mobile-fd-column .pagebuilder-column-line, .esim-index-index .mobile-fd-column .pagebuilder-column-line, .pospago-portabilidad-sim .mobile-fd-column .pagebuilder-column-line, .pospagov-portabilidad-offers .mobile-fd-column .pagebuilder-column-line { flex-direction: column; } .pospago-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .pagebuilder-column, .esim-index-index .mobile-fd-column .pagebuilder-column-line .pagebuilder-column, .pospago-portabilidad-sim .mobile-fd-column .pagebuilder-column-line .pagebuilder-column, .pospagov-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .pagebuilder-column { width: 90% !important; margin-bottom: 0px !important; } .pospago-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .pagebuilder-column .title-disney-start p, .esim-index-index .mobile-fd-column .pagebuilder-column-line .pagebuilder-column .title-disney-start p, .pospago-portabilidad-sim .mobile-fd-column .pagebuilder-column-line .pagebuilder-column .title-disney-start p, .pospagov-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .pagebuilder-column .title-disney-start p { line-height: 32px !important; } .pospago-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .video-disney-start, .esim-index-index .mobile-fd-column .pagebuilder-column-line .video-disney-start, .pospago-portabilidad-sim .mobile-fd-column .pagebuilder-column-line .video-disney-start, .pospagov-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .video-disney-start { margin-left: 0 !important; } .pospago-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .video-disney-start iframe, .esim-index-index .mobile-fd-column .pagebuilder-column-line .video-disney-start iframe, .pospago-portabilidad-sim .mobile-fd-column .pagebuilder-column-line .video-disney-start iframe, .pospagov-portabilidad-offers .mobile-fd-column .pagebuilder-column-line .video-disney-start iframe { margin: auto; width: 100% !important; height: 218px !important; } .pospago-portabilidad-offers .text_cliente, .esim-index-index .text_cliente, .pospago-portabilidad-sim .text_cliente, .pospagov-portabilidad-offers .text_cliente { width: 100% !important; } .pospago-portabilidad-offers .text_cliente p, .esim-index-index .text_cliente p, .pospago-portabilidad-sim .text_cliente p, .pospagov-portabilidad-offers .text_cliente p { text-align: center !important; } .pospago-portabilidad-offers .text_cliente .title_cliente, .esim-index-index .text_cliente .title_cliente, .pospago-portabilidad-sim .text_cliente .title_cliente, .pospagov-portabilidad-offers .text_cliente .title_cliente { margin: 20px auto 5px !important; } .pospago-portabilidad-offers .text_cliente .button-c2c.c2c-banner, .esim-index-index .text_cliente .button-c2c.c2c-banner, .pospago-portabilidad-sim .text_cliente .button-c2c.c2c-banner, .pospagov-portabilidad-offers .text_cliente .button-c2c.c2c-banner { width: 80% !important; max-width: 80% !important; margin: 15px auto; } .pospago-portabilidad-offers .u-margin-top-40, .esim-index-index .u-margin-top-40, .pospago-portabilidad-sim .u-margin-top-40, .pospagov-portabilidad-offers .u-margin-top-40 { margin-top: 15px !important; } .pospago-portabilidad-offers .c-filter, .esim-index-index .c-filter, .pospago-portabilidad-sim .c-filter, .pospagov-portabilidad-offers .c-filter { margin: 0 !important; } } .esim-index-index .o-btn, .pospago-portabilidad-offers .o-btn, .pospagov-portabilidad-offers .o-btn { width: 80%; margin: auto; text-align: center; display: block; } .pospago-portabilidad-sim .o-btn { width: 80%; margin: auto; text-align: center; } .o-btn-modal { width: 40%; margin: 40px auto 0px; text-align: center; display: block; } .btnC2C-prepos { width: 80%; margin: auto; text-align: center; display: block; } .tab { border: none; display: flex; background-color: #fff; border-radius: 16px; max-width: 38%; margin: -45px auto; padding: 6px 10px; } .tab a { flex-grow: 1; } @media only screen and (max-width: 620px) { .tab { max-width: 96%; margin: -26px auto; } } .tab-pospago { padding: 10px; border-radius: 8px; font-size: 18px; line-height: 22px; background-color: #f5f5f5; color: #0A2739; margin: 0 5px; text-align: center; } @media only screen and (max-width: 620px) { .tab-pospago { font-size: 14px; line-height: 16px; } } .tab-pospago.active { background-color: #0A2739; color: #fff; } .header-pospago-flex { text-align: center; } @media only screen and (max-width: 620px) { .header-pospago-flex { font-size: 12px; } } .wide-btn-pospagoflex { width: 180px !important; } @media only screen and (max-width: 620px) { .wide-btn-pospagoflex:nth-child(1) { width: auto !important; } .wide-btn-pospagoflex:nth-child(2) { width: auto !important; } } .wide-btn-pospagoflexmodal { width: 200px !important; } @media only screen and (max-width: 620px) { .wide-btn-pospagoflexmodal { width: 215 !important; } } .box-btn-pospagoflex { display: flex; justify-content: space-around; } .box-btn-pospagoflexmodal { display: flex; justify-content: space-around; } @media only screen and (max-width: 620px) { .box-btn-pospagoflexmodal { flex-direction: column; gap: 1rem; } } .color-btn-arrow-pospagoflex { background-color: transparent; } .card-pospagoflex { width: 180px !important; margin: 0 auto !important; } .backgorund-card-pospagoflex { background-color: #e63078 !important; } .hogar-cobertura-index, .hogar-datos-index, .hogar-confronta-index, .hogar-agendar-index, .hogar-servicios-index, .hogar-contrato-index, .convergente-cobertura-index, .convergente-datos-index { --checked-color: #019DF4; --color: #999; --bg-color: #e8e8e8; } .hogar-cobertura-index span.c-form__error-text, .hogar-cobertura-index .error_input, .hogar-datos-index span.c-form__error-text, .hogar-datos-index .error_input, .hogar-confronta-index span.c-form__error-text, .hogar-confronta-index .error_input, .hogar-agendar-index span.c-form__error-text, .hogar-agendar-index .error_input, .hogar-servicios-index span.c-form__error-text, .hogar-servicios-index .error_input, .hogar-contrato-index span.c-form__error-text, .hogar-contrato-index .error_input, .convergente-cobertura-index span.c-form__error-text, .convergente-cobertura-index .error_input, .convergente-datos-index span.c-form__error-text, .convergente-datos-index .error_input { padding-left: 0 !important; text-align: left !important; line-height: 14px !important; font-size: 12px !important; } .hogar-cobertura-index .salto-linea-email_error, .hogar-datos-index .salto-linea-email_error, .hogar-confronta-index .salto-linea-email_error, .hogar-agendar-index .salto-linea-email_error, .hogar-servicios-index .salto-linea-email_error, .hogar-contrato-index .salto-linea-email_error, .convergente-cobertura-index .salto-linea-email_error, .convergente-datos-index .salto-linea-email_error { display: none; } @media (max-width: 600px) { .hogar-cobertura-index .salto-linea-email_error, .hogar-datos-index .salto-linea-email_error, .hogar-confronta-index .salto-linea-email_error, .hogar-agendar-index .salto-linea-email_error, .hogar-servicios-index .salto-linea-email_error, .hogar-contrato-index .salto-linea-email_error, .convergente-cobertura-index .salto-linea-email_error, .convergente-datos-index .salto-linea-email_error { display: block; } } .hogar-cobertura-index .grid__fibra-container, .hogar-datos-index .grid__fibra-container, .hogar-confronta-index .grid__fibra-container, .hogar-agendar-index .grid__fibra-container, .hogar-servicios-index .grid__fibra-container, .hogar-contrato-index .grid__fibra-container, .convergente-cobertura-index .grid__fibra-container, .convergente-datos-index .grid__fibra-container { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1.5rem; align-items: baseline; } @media (max-width: 600px) { .hogar-cobertura-index .grid__fibra-container, .hogar-datos-index .grid__fibra-container, .hogar-confronta-index .grid__fibra-container, .hogar-agendar-index .grid__fibra-container, .hogar-servicios-index .grid__fibra-container, .hogar-contrato-index .grid__fibra-container, .convergente-cobertura-index .grid__fibra-container, .convergente-datos-index .grid__fibra-container { display: block; } } .hogar-cobertura-index .o-list-steps__step::before, .hogar-datos-index .o-list-steps__step::before, .hogar-confronta-index .o-list-steps__step::before, .hogar-agendar-index .o-list-steps__step::before, .hogar-servicios-index .o-list-steps__step::before, .hogar-contrato-index .o-list-steps__step::before, .convergente-cobertura-index .o-list-steps__step::before, .convergente-datos-index .o-list-steps__step::before { width: 32px !important; height: 32px !important; min-width: 32px; min-height: 32px; line-height: 16px; } .hogar-cobertura-index select, .hogar-cobertura-index input, .hogar-datos-index select, .hogar-datos-index input, .hogar-confronta-index select, .hogar-confronta-index input, .hogar-agendar-index select, .hogar-agendar-index input, .hogar-servicios-index select, .hogar-servicios-index input, .hogar-contrato-index select, .hogar-contrato-index input, .convergente-cobertura-index select, .convergente-cobertura-index input, .convergente-datos-index select, .convergente-datos-index input { max-width: 90%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .hogar-cobertura-index .f-c-header-step__wrap, .hogar-cobertura-index .o-layout-2-columns, .hogar-datos-index .f-c-header-step__wrap, .hogar-datos-index .o-layout-2-columns, .hogar-confronta-index .f-c-header-step__wrap, .hogar-confronta-index .o-layout-2-columns, .hogar-agendar-index .f-c-header-step__wrap, .hogar-agendar-index .o-layout-2-columns, .hogar-servicios-index .f-c-header-step__wrap, .hogar-servicios-index .o-layout-2-columns, .hogar-contrato-index .f-c-header-step__wrap, .hogar-contrato-index .o-layout-2-columns, .convergente-cobertura-index .f-c-header-step__wrap, .convergente-cobertura-index .o-layout-2-columns, .convergente-datos-index .f-c-header-step__wrap, .convergente-datos-index .o-layout-2-columns { max-width: 960px !important; } .hogar-cobertura-index span.o-list-steps__txt, .hogar-datos-index span.o-list-steps__txt, .hogar-confronta-index span.o-list-steps__txt, .hogar-agendar-index span.o-list-steps__txt, .hogar-servicios-index span.o-list-steps__txt, .hogar-contrato-index span.o-list-steps__txt, .convergente-cobertura-index span.o-list-steps__txt, .convergente-datos-index span.o-list-steps__txt { font-size: 12px; line-height: 14px; } .hogar-cobertura-index fieldset.c-form__fieldset.c-form__field-container, .hogar-datos-index fieldset.c-form__fieldset.c-form__field-container, .hogar-confronta-index fieldset.c-form__fieldset.c-form__field-container, .hogar-agendar-index fieldset.c-form__fieldset.c-form__field-container, .hogar-servicios-index fieldset.c-form__fieldset.c-form__field-container, .hogar-contrato-index fieldset.c-form__fieldset.c-form__field-container, .convergente-cobertura-index fieldset.c-form__fieldset.c-form__field-container, .convergente-datos-index fieldset.c-form__fieldset.c-form__field-container { margin-top: 1rem; padding: 0; } .hogar-cobertura-index label.c-form__checkbox-label.u-text-left, .hogar-datos-index label.c-form__checkbox-label.u-text-left, .hogar-confronta-index label.c-form__checkbox-label.u-text-left, .hogar-agendar-index label.c-form__checkbox-label.u-text-left, .hogar-servicios-index label.c-form__checkbox-label.u-text-left, .hogar-contrato-index label.c-form__checkbox-label.u-text-left, .convergente-cobertura-index label.c-form__checkbox-label.u-text-left, .convergente-datos-index label.c-form__checkbox-label.u-text-left { line-height: 20px; } .hogar-cobertura-index .o-section, .hogar-datos-index .o-section, .hogar-confronta-index .o-section, .hogar-agendar-index .o-section, .hogar-servicios-index .o-section, .hogar-contrato-index .o-section, .convergente-cobertura-index .o-section, .convergente-datos-index .o-section { margin-top: 0px; margin-bottom: 40px; } .hogar-cobertura-index .c-form__header, .hogar-datos-index .c-form__header, .hogar-confronta-index .c-form__header, .hogar-agendar-index .c-form__header, .hogar-servicios-index .c-form__header, .hogar-contrato-index .c-form__header, .convergente-cobertura-index .c-form__header, .convergente-datos-index .c-form__header { margin-top: 20px; margin-bottom: 20px; } .hogar-cobertura-index .c-form__input, .hogar-datos-index .c-form__input, .hogar-confronta-index .c-form__input, .hogar-agendar-index .c-form__input, .hogar-servicios-index .c-form__input, .hogar-contrato-index .c-form__input, .convergente-cobertura-index .c-form__input, .convergente-datos-index .c-form__input { font-size: 16px; height: 42px; top: -15px; padding-top: 15px; z-index: 99; width: 98%; max-width: 98%; left: -10px; padding-left: 10px; } .hogar-cobertura-index .c-form__field, .hogar-datos-index .c-form__field, .hogar-confronta-index .c-form__field, .hogar-agendar-index .c-form__field, .hogar-servicios-index .c-form__field, .hogar-contrato-index .c-form__field, .convergente-cobertura-index .c-form__field, .convergente-datos-index .c-form__field { padding: 15px 10px 10px 10px; height: 42px; } .hogar-cobertura-index .c-form__space, .hogar-datos-index .c-form__space, .hogar-confronta-index .c-form__space, .hogar-agendar-index .c-form__space, .hogar-servicios-index .c-form__space, .hogar-contrato-index .c-form__space, .convergente-cobertura-index .c-form__space, .convergente-datos-index .c-form__space { padding-left: 2.28px; } .hogar-cobertura-index .c-text__employeer, .hogar-datos-index .c-text__employeer, .hogar-confronta-index .c-text__employeer, .hogar-agendar-index .c-text__employeer, .hogar-servicios-index .c-text__employeer, .hogar-contrato-index .c-text__employeer, .convergente-cobertura-index .c-text__employeer, .convergente-datos-index .c-text__employeer { font-size: 0.79rem; } .hogar-cobertura-index label.c-form__label, .hogar-datos-index label.c-form__label, .hogar-confronta-index label.c-form__label, .hogar-agendar-index label.c-form__label, .hogar-servicios-index label.c-form__label, .hogar-contrato-index label.c-form__label, .convergente-cobertura-index label.c-form__label, .convergente-datos-index label.c-form__label { padding-left: 10px; font-size: 16px; line-height: 22px; } .hogar-cobertura-index .c-form__input.c-form__input_label-top + .c-form__label, .hogar-cobertura-index .c-form__input:valid + .c-form__label, .hogar-cobertura-index .c-form__input:focus + .c-form__label, .hogar-datos-index .c-form__input.c-form__input_label-top + .c-form__label, .hogar-datos-index .c-form__input:valid + .c-form__label, .hogar-datos-index .c-form__input:focus + .c-form__label, .hogar-confronta-index .c-form__input.c-form__input_label-top + .c-form__label, .hogar-confronta-index .c-form__input:valid + .c-form__label, .hogar-confronta-index .c-form__input:focus + .c-form__label, .hogar-agendar-index .c-form__input.c-form__input_label-top + .c-form__label, .hogar-agendar-index .c-form__input:valid + .c-form__label, .hogar-agendar-index .c-form__input:focus + .c-form__label, .hogar-servicios-index .c-form__input.c-form__input_label-top + .c-form__label, .hogar-servicios-index .c-form__input:valid + .c-form__label, .hogar-servicios-index .c-form__input:focus + .c-form__label, .hogar-contrato-index .c-form__input.c-form__input_label-top + .c-form__label, .hogar-contrato-index .c-form__input:valid + .c-form__label, .hogar-contrato-index .c-form__input:focus + .c-form__label, .convergente-cobertura-index .c-form__input.c-form__input_label-top + .c-form__label, .convergente-cobertura-index .c-form__input:valid + .c-form__label, .convergente-cobertura-index .c-form__input:focus + .c-form__label, .convergente-datos-index .c-form__input.c-form__input_label-top + .c-form__label, .convergente-datos-index .c-form__input:valid + .c-form__label, .convergente-datos-index .c-form__input:focus + .c-form__label { top: -1.4rem; } .hogar-cobertura-index .c-form__field-canvas, .hogar-datos-index .c-form__field-canvas, .hogar-confronta-index .c-form__field-canvas, .hogar-agendar-index .c-form__field-canvas, .hogar-servicios-index .c-form__field-canvas, .hogar-contrato-index .c-form__field-canvas, .convergente-cobertura-index .c-form__field-canvas, .convergente-datos-index .c-form__field-canvas { margin-bottom: 0.6rem; } .hogar-cobertura-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0, .hogar-datos-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0, .hogar-confronta-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0, .hogar-agendar-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0, .hogar-servicios-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0, .hogar-contrato-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0, .convergente-cobertura-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0, .convergente-datos-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0 { padding: 14px !important; font-size: 14px !important; line-height: 18px; } .hogar-cobertura-index form, .hogar-datos-index form, .hogar-confronta-index form, .hogar-agendar-index form, .hogar-servicios-index form, .hogar-contrato-index form, .convergente-cobertura-index form, .convergente-datos-index form { max-width: 620px; } .hogar-cobertura-index .c-form__checkbox, .hogar-datos-index .c-form__checkbox, .hogar-confronta-index .c-form__checkbox, .hogar-agendar-index .c-form__checkbox, .hogar-servicios-index .c-form__checkbox, .hogar-contrato-index .c-form__checkbox, .convergente-cobertura-index .c-form__checkbox, .convergente-datos-index .c-form__checkbox { font-size: 14px; line-height: 18px; } .hogar-cobertura-index .c-form__actions, .hogar-datos-index .c-form__actions, .hogar-confronta-index .c-form__actions, .hogar-agendar-index .c-form__actions, .hogar-servicios-index .c-form__actions, .hogar-contrato-index .c-form__actions, .convergente-cobertura-index .c-form__actions, .convergente-datos-index .c-form__actions { margin-top: 1rem; justify-content: end; } .hogar-cobertura-index span.c-form__icon, .hogar-datos-index span.c-form__icon, .hogar-confronta-index span.c-form__icon, .hogar-agendar-index span.c-form__icon, .hogar-servicios-index span.c-form__icon, .hogar-contrato-index span.c-form__icon, .convergente-cobertura-index span.c-form__icon, .convergente-datos-index span.c-form__icon { width: 10%; } .hogar-cobertura-index .o-identification-card, .hogar-datos-index .o-identification-card, .hogar-confronta-index .o-identification-card, .hogar-agendar-index .o-identification-card, .hogar-servicios-index .o-identification-card, .hogar-contrato-index .o-identification-card, .convergente-cobertura-index .o-identification-card, .convergente-datos-index .o-identification-card { grid-auto-rows: minmax(200px, auto); } .hogar-cobertura-index form#questions-form, .hogar-datos-index form#questions-form, .hogar-confronta-index form#questions-form, .hogar-agendar-index form#questions-form, .hogar-servicios-index form#questions-form, .hogar-contrato-index form#questions-form, .convergente-cobertura-index form#questions-form, .convergente-datos-index form#questions-form { width: 100% !important; max-width: 960px !important; } .hogar-cobertura-index ol#questionList, .hogar-datos-index ol#questionList, .hogar-confronta-index ol#questionList, .hogar-agendar-index ol#questionList, .hogar-servicios-index ol#questionList, .hogar-contrato-index ol#questionList, .convergente-cobertura-index ol#questionList, .convergente-datos-index ol#questionList { padding: 30px 50px; } .hogar-cobertura-index ol#questionList li.c-form__item-list, .hogar-datos-index ol#questionList li.c-form__item-list, .hogar-confronta-index ol#questionList li.c-form__item-list, .hogar-agendar-index ol#questionList li.c-form__item-list, .hogar-servicios-index ol#questionList li.c-form__item-list, .hogar-contrato-index ol#questionList li.c-form__item-list, .convergente-cobertura-index ol#questionList li.c-form__item-list, .convergente-datos-index ol#questionList li.c-form__item-list { font-size: 16px; padding: 16px 0; } .hogar-cobertura-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before, .hogar-datos-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before, .hogar-confronta-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before, .hogar-agendar-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before, .hogar-servicios-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before, .hogar-contrato-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before, .convergente-cobertura-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before, .convergente-datos-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before { font-size: 16px; } .hogar-cobertura-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column, .hogar-datos-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column, .hogar-confronta-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column, .hogar-agendar-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column, .hogar-servicios-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column, .hogar-contrato-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column, .convergente-cobertura-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column, .convergente-datos-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column { font-size: 14px; row-gap: 0.6rem; margin: 20px; } .hogar-cobertura-index .f-c-calendar, .hogar-datos-index .f-c-calendar, .hogar-confronta-index .f-c-calendar, .hogar-agendar-index .f-c-calendar, .hogar-servicios-index .f-c-calendar, .hogar-contrato-index .f-c-calendar, .convergente-cobertura-index .f-c-calendar, .convergente-datos-index .f-c-calendar { padding: 12px; } .hogar-cobertura-index li.f-c-calendar__header_day, .hogar-datos-index li.f-c-calendar__header_day, .hogar-confronta-index li.f-c-calendar__header_day, .hogar-agendar-index li.f-c-calendar__header_day, .hogar-servicios-index li.f-c-calendar__header_day, .hogar-contrato-index li.f-c-calendar__header_day, .convergente-cobertura-index li.f-c-calendar__header_day, .convergente-datos-index li.f-c-calendar__header_day { font-size: 14px; padding: 0 14px; } .hogar-cobertura-index li.f-c-calendar__grid_day, .hogar-datos-index li.f-c-calendar__grid_day, .hogar-confronta-index li.f-c-calendar__grid_day, .hogar-agendar-index li.f-c-calendar__grid_day, .hogar-servicios-index li.f-c-calendar__grid_day, .hogar-contrato-index li.f-c-calendar__grid_day, .convergente-cobertura-index li.f-c-calendar__grid_day, .convergente-datos-index li.f-c-calendar__grid_day { font-size: 18px; padding: 10px; } .hogar-cobertura-index div#checkout-summary, .hogar-datos-index div#checkout-summary, .hogar-confronta-index div#checkout-summary, .hogar-agendar-index div#checkout-summary, .hogar-servicios-index div#checkout-summary, .hogar-contrato-index div#checkout-summary, .convergente-cobertura-index div#checkout-summary, .convergente-datos-index div#checkout-summary { max-width: 320px !important; width: 320px; } .hogar-cobertura-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .hogar-datos-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .hogar-confronta-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .hogar-agendar-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .hogar-servicios-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .hogar-contrato-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .convergente-cobertura-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .convergente-datos-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border { font-size: 20px !important; padding-bottom: 16px; margin-bottom: 16px; } .hogar-cobertura-index div#checkout-summary .c-card-summary__amount h4, .hogar-datos-index div#checkout-summary .c-card-summary__amount h4, .hogar-confronta-index div#checkout-summary .c-card-summary__amount h4, .hogar-agendar-index div#checkout-summary .c-card-summary__amount h4, .hogar-servicios-index div#checkout-summary .c-card-summary__amount h4, .hogar-contrato-index div#checkout-summary .c-card-summary__amount h4, .convergente-cobertura-index div#checkout-summary .c-card-summary__amount h4, .convergente-datos-index div#checkout-summary .c-card-summary__amount h4 { font-size: 14px; line-height: 18px; } .hogar-cobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .hogar-datos-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .hogar-confronta-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .hogar-agendar-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .hogar-servicios-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .hogar-contrato-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .convergente-cobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .convergente-datos-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before { font-size: 12px; line-height: 16px; margin-bottom: 0; } .hogar-cobertura-index div#checkout-summary ul.c-card-summary__details, .hogar-datos-index div#checkout-summary ul.c-card-summary__details, .hogar-confronta-index div#checkout-summary ul.c-card-summary__details, .hogar-agendar-index div#checkout-summary ul.c-card-summary__details, .hogar-servicios-index div#checkout-summary ul.c-card-summary__details, .hogar-contrato-index div#checkout-summary ul.c-card-summary__details, .convergente-cobertura-index div#checkout-summary ul.c-card-summary__details, .convergente-datos-index div#checkout-summary ul.c-card-summary__details { font-size: 10px; padding-bottom: 0; } .hogar-cobertura-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .hogar-datos-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .hogar-confronta-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .hogar-agendar-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .hogar-servicios-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .hogar-contrato-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .convergente-cobertura-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .convergente-datos-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary { padding: 1rem; max-width: 100% !important; min-width: 300px; } .hogar-cobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .hogar-datos-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .hogar-confronta-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .hogar-agendar-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .hogar-servicios-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .hogar-contrato-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .convergente-cobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .convergente-datos-index div#checkout-summary .c-card-summary__amount.c-card-summary__total { margin: -15px 0 5px 0; } .hogar-cobertura-index div#checkout-summary .c-card-summary__message.i-information, .hogar-datos-index div#checkout-summary .c-card-summary__message.i-information, .hogar-confronta-index div#checkout-summary .c-card-summary__message.i-information, .hogar-agendar-index div#checkout-summary .c-card-summary__message.i-information, .hogar-servicios-index div#checkout-summary .c-card-summary__message.i-information, .hogar-contrato-index div#checkout-summary .c-card-summary__message.i-information, .convergente-cobertura-index div#checkout-summary .c-card-summary__message.i-information, .convergente-datos-index div#checkout-summary .c-card-summary__message.i-information { font-size: 10px; } .hogar-cobertura-index div#checkout-summary h4.c-card-summary__subtitle, .hogar-datos-index div#checkout-summary h4.c-card-summary__subtitle, .hogar-confronta-index div#checkout-summary h4.c-card-summary__subtitle, .hogar-agendar-index div#checkout-summary h4.c-card-summary__subtitle, .hogar-servicios-index div#checkout-summary h4.c-card-summary__subtitle, .hogar-contrato-index div#checkout-summary h4.c-card-summary__subtitle, .convergente-cobertura-index div#checkout-summary h4.c-card-summary__subtitle, .convergente-datos-index div#checkout-summary h4.c-card-summary__subtitle { margin-bottom: 5px; } .hogar-cobertura-index div#checkout-summary td.c-card-summary__table-cell, .hogar-datos-index div#checkout-summary td.c-card-summary__table-cell, .hogar-confronta-index div#checkout-summary td.c-card-summary__table-cell, .hogar-agendar-index div#checkout-summary td.c-card-summary__table-cell, .hogar-servicios-index div#checkout-summary td.c-card-summary__table-cell, .hogar-contrato-index div#checkout-summary td.c-card-summary__table-cell, .convergente-cobertura-index div#checkout-summary td.c-card-summary__table-cell, .convergente-datos-index div#checkout-summary td.c-card-summary__table-cell { padding-top: 0px; } .hogar-cobertura-index div#checkout-summary .borderDetail, .hogar-datos-index div#checkout-summary .borderDetail, .hogar-confronta-index div#checkout-summary .borderDetail, .hogar-agendar-index div#checkout-summary .borderDetail, .hogar-servicios-index div#checkout-summary .borderDetail, .hogar-contrato-index div#checkout-summary .borderDetail, .convergente-cobertura-index div#checkout-summary .borderDetail, .convergente-datos-index div#checkout-summary .borderDetail { border-top: 1px solid #d3d4d3; border-bottom: 1px solid #d3d4d3; padding: 10px 0; } .hogar-cobertura-index div#checkout-summary .mb-10, .hogar-datos-index div#checkout-summary .mb-10, .hogar-confronta-index div#checkout-summary .mb-10, .hogar-agendar-index div#checkout-summary .mb-10, .hogar-servicios-index div#checkout-summary .mb-10, .hogar-contrato-index div#checkout-summary .mb-10, .convergente-cobertura-index div#checkout-summary .mb-10, .convergente-datos-index div#checkout-summary .mb-10 { margin-bottom: 10px; } .hogar-cobertura-index div#checkout-summary .c-card-summary, .hogar-datos-index div#checkout-summary .c-card-summary, .hogar-confronta-index div#checkout-summary .c-card-summary, .hogar-agendar-index div#checkout-summary .c-card-summary, .hogar-servicios-index div#checkout-summary .c-card-summary, .hogar-contrato-index div#checkout-summary .c-card-summary, .convergente-cobertura-index div#checkout-summary .c-card-summary, .convergente-datos-index div#checkout-summary .c-card-summary { background: none; opacity: 1; visibility: visible; max-width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 300px; /* 9 */ min-width: 18.75rem; /* 9 */ } .hogar-cobertura-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .hogar-datos-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .hogar-confronta-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .hogar-agendar-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .hogar-servicios-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .hogar-contrato-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .convergente-cobertura-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .convergente-datos-index div#checkout-summary .c-card-summary dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown { font-weight: 300; } .hogar-cobertura-index div#checkout-summary .c-card-summary .c-filter__options-title::after, .hogar-datos-index div#checkout-summary .c-card-summary .c-filter__options-title::after, .hogar-confronta-index div#checkout-summary .c-card-summary .c-filter__options-title::after, .hogar-agendar-index div#checkout-summary .c-card-summary .c-filter__options-title::after, .hogar-servicios-index div#checkout-summary .c-card-summary .c-filter__options-title::after, .hogar-contrato-index div#checkout-summary .c-card-summary .c-filter__options-title::after, .convergente-cobertura-index div#checkout-summary .c-card-summary .c-filter__options-title::after, .convergente-datos-index div#checkout-summary .c-card-summary .c-filter__options-title::after { font-weight: 100; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary { padding: 5px 20px; background: #fff; margin-bottom: 5px; border-radius: 4px; width: 100%; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary h4, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary h4, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary h4, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary h4, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary h4, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary h4, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary h4, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary h4 { font-weight: 500; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary hr, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary hr, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary hr, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary hr, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary hr, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary hr, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary hr, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary hr { opacity: 0.5; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary dt, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary dt, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary dt, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary dt, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary dt, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary dt, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary dt, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary dt { margin-bottom: 0; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary dd, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary dd, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary dd, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary dd, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary dd, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary dd, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary dd, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary dd { padding: 0; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary ul.c-card-summary__details { font-weight: 300; padding-left: 20px; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount { font-size: 14px; line-height: 20px; margin-top: 5px; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before { margin-top: 5px; font-size: 12px; font-weight: 300; color: #999; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__amount_before h4 { font-size: 12px; font-weight: 300; color: #999; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__box { margin-bottom: 0; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total, .hogar-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total, .hogar-confronta-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total, .hogar-agendar-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total, .hogar-servicios-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total, .hogar-contrato-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total, .convergente-datos-index div#checkout-summary .c-card-summary .section-summary .c-card-summary__total { text-transform: none; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount, .hogar-datos-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount, .hogar-confronta-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount, .hogar-agendar-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount, .hogar-servicios-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount, .hogar-contrato-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount, .convergente-datos-index div#checkout-summary .c-card-summary .section-address .c-card-summary__amount_address .c-card-summary__amount { margin: 0 !important; } .hogar-cobertura-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount, .hogar-datos-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount, .hogar-confronta-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount, .hogar-agendar-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount, .hogar-servicios-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount, .hogar-contrato-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount, .convergente-cobertura-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount, .convergente-datos-index div#checkout-summary .c-card-summary .section-datos .c-card-summary__amount_datos .c-card-summary__amount { margin: 0 !important; } .hogar-cobertura-index div#checkout-summary .c-card-summary__message, .hogar-datos-index div#checkout-summary .c-card-summary__message, .hogar-confronta-index div#checkout-summary .c-card-summary__message, .hogar-agendar-index div#checkout-summary .c-card-summary__message, .hogar-servicios-index div#checkout-summary .c-card-summary__message, .hogar-contrato-index div#checkout-summary .c-card-summary__message, .convergente-cobertura-index div#checkout-summary .c-card-summary__message, .convergente-datos-index div#checkout-summary .c-card-summary__message { align-items: center; } .hogar-cobertura-index div#checkout-summary .c-card-summary__message::before, .hogar-datos-index div#checkout-summary .c-card-summary__message::before, .hogar-confronta-index div#checkout-summary .c-card-summary__message::before, .hogar-agendar-index div#checkout-summary .c-card-summary__message::before, .hogar-servicios-index div#checkout-summary .c-card-summary__message::before, .hogar-contrato-index div#checkout-summary .c-card-summary__message::before, .convergente-cobertura-index div#checkout-summary .c-card-summary__message::before, .convergente-datos-index div#checkout-summary .c-card-summary__message::before { margin-right: 0; margin-left: 2px; width: 8px; } .hogar-cobertura-index div#checkout-summary .o-dropdown__content.is-summary-show, .hogar-datos-index div#checkout-summary .o-dropdown__content.is-summary-show, .hogar-confronta-index div#checkout-summary .o-dropdown__content.is-summary-show, .hogar-agendar-index div#checkout-summary .o-dropdown__content.is-summary-show, .hogar-servicios-index div#checkout-summary .o-dropdown__content.is-summary-show, .hogar-contrato-index div#checkout-summary .o-dropdown__content.is-summary-show, .convergente-cobertura-index div#checkout-summary .o-dropdown__content.is-summary-show, .convergente-datos-index div#checkout-summary .o-dropdown__content.is-summary-show { max-height: fit-content; transition: all 0.2s ease; } .hogar-cobertura-index div#checkout-summary .is-summary-show.o-dropdown__btn::after, .hogar-datos-index div#checkout-summary .is-summary-show.o-dropdown__btn::after, .hogar-confronta-index div#checkout-summary .is-summary-show.o-dropdown__btn::after, .hogar-agendar-index div#checkout-summary .is-summary-show.o-dropdown__btn::after, .hogar-servicios-index div#checkout-summary .is-summary-show.o-dropdown__btn::after, .hogar-contrato-index div#checkout-summary .is-summary-show.o-dropdown__btn::after, .convergente-cobertura-index div#checkout-summary .is-summary-show.o-dropdown__btn::after, .convergente-datos-index div#checkout-summary .is-summary-show.o-dropdown__btn::after { transform: rotate(180deg); } .hogar-cobertura-index div#checkout-summary .o-dropdown__btn::after, .hogar-datos-index div#checkout-summary .o-dropdown__btn::after, .hogar-confronta-index div#checkout-summary .o-dropdown__btn::after, .hogar-agendar-index div#checkout-summary .o-dropdown__btn::after, .hogar-servicios-index div#checkout-summary .o-dropdown__btn::after, .hogar-contrato-index div#checkout-summary .o-dropdown__btn::after, .convergente-cobertura-index div#checkout-summary .o-dropdown__btn::after, .convergente-datos-index div#checkout-summary .o-dropdown__btn::after { font-size: 14px; color: #019DF4; font-weight: 700; } .hogar-cobertura-index div#checkout-summary .u-width-90, .hogar-datos-index div#checkout-summary .u-width-90, .hogar-confronta-index div#checkout-summary .u-width-90, .hogar-agendar-index div#checkout-summary .u-width-90, .hogar-servicios-index div#checkout-summary .u-width-90, .hogar-contrato-index div#checkout-summary .u-width-90, .convergente-cobertura-index div#checkout-summary .u-width-90, .convergente-datos-index div#checkout-summary .u-width-90 { width: 90%; } .hogar-cobertura-index div#checkout-summary .d-flex.js-summary-btn, .hogar-datos-index div#checkout-summary .d-flex.js-summary-btn, .hogar-confronta-index div#checkout-summary .d-flex.js-summary-btn, .hogar-agendar-index div#checkout-summary .d-flex.js-summary-btn, .hogar-servicios-index div#checkout-summary .d-flex.js-summary-btn, .hogar-contrato-index div#checkout-summary .d-flex.js-summary-btn, .convergente-cobertura-index div#checkout-summary .d-flex.js-summary-btn, .convergente-datos-index div#checkout-summary .d-flex.js-summary-btn { align-items: center; } @media screen and (max-width: 1024px) { .hogar-cobertura-index div#checkout-summary, .hogar-datos-index div#checkout-summary, .hogar-confronta-index div#checkout-summary, .hogar-agendar-index div#checkout-summary, .hogar-servicios-index div#checkout-summary, .hogar-contrato-index div#checkout-summary, .convergente-cobertura-index div#checkout-summary, .convergente-datos-index div#checkout-summary { max-width: 100%; display: block; margin-top: 10px; } .hogar-cobertura-index div#checkout-summary .c-card-summary, .hogar-datos-index div#checkout-summary .c-card-summary, .hogar-confronta-index div#checkout-summary .c-card-summary, .hogar-agendar-index div#checkout-summary .c-card-summary, .hogar-servicios-index div#checkout-summary .c-card-summary, .hogar-contrato-index div#checkout-summary .c-card-summary, .convergente-cobertura-index div#checkout-summary .c-card-summary, .convergente-datos-index div#checkout-summary .c-card-summary { max-height: none; opacity: 1; visibility: visible; } .hogar-cobertura-index div#checkout-summary .c-card-summary .c-filter__content, .hogar-datos-index div#checkout-summary .c-card-summary .c-filter__content, .hogar-confronta-index div#checkout-summary .c-card-summary .c-filter__content, .hogar-agendar-index div#checkout-summary .c-card-summary .c-filter__content, .hogar-servicios-index div#checkout-summary .c-card-summary .c-filter__content, .hogar-contrato-index div#checkout-summary .c-card-summary .c-filter__content, .convergente-cobertura-index div#checkout-summary .c-card-summary .c-filter__content, .convergente-datos-index div#checkout-summary .c-card-summary .c-filter__content { padding: 0; } } .hogar-cobertura-index li.f-c-calendar__header_day, .hogar-datos-index li.f-c-calendar__header_day, .hogar-confronta-index li.f-c-calendar__header_day, .hogar-agendar-index li.f-c-calendar__header_day, .hogar-servicios-index li.f-c-calendar__header_day, .hogar-contrato-index li.f-c-calendar__header_day, .convergente-cobertura-index li.f-c-calendar__header_day, .convergente-datos-index li.f-c-calendar__header_day { padding: 0 10px !important; } .hogar-cobertura-index #cross-selling-service-component, .hogar-datos-index #cross-selling-service-component, .hogar-confronta-index #cross-selling-service-component, .hogar-agendar-index #cross-selling-service-component, .hogar-servicios-index #cross-selling-service-component, .hogar-contrato-index #cross-selling-service-component, .convergente-cobertura-index #cross-selling-service-component, .convergente-datos-index #cross-selling-service-component { width: 620px; } @media screen and (max-width: 600px) { .hogar-cobertura-index #cross-selling-service-component, .hogar-datos-index #cross-selling-service-component, .hogar-confronta-index #cross-selling-service-component, .hogar-agendar-index #cross-selling-service-component, .hogar-servicios-index #cross-selling-service-component, .hogar-contrato-index #cross-selling-service-component, .convergente-cobertura-index #cross-selling-service-component, .convergente-datos-index #cross-selling-service-component { max-width: 100%; } } .hogar-cobertura-index .select2-container--default .select2-search--dropdown .select2-search__field, .hogar-datos-index .select2-container--default .select2-search--dropdown .select2-search__field, .hogar-confronta-index .select2-container--default .select2-search--dropdown .select2-search__field, .hogar-agendar-index .select2-container--default .select2-search--dropdown .select2-search__field, .hogar-servicios-index .select2-container--default .select2-search--dropdown .select2-search__field, .hogar-contrato-index .select2-container--default .select2-search--dropdown .select2-search__field, .convergente-cobertura-index .select2-container--default .select2-search--dropdown .select2-search__field, .convergente-datos-index .select2-container--default .select2-search--dropdown .select2-search__field { border-color: #019DF4 !important; } .hogar-cobertura-index #select2-departament-container, .hogar-datos-index #select2-departament-container, .hogar-confronta-index #select2-departament-container, .hogar-agendar-index #select2-departament-container, .hogar-servicios-index #select2-departament-container, .hogar-contrato-index #select2-departament-container, .convergente-cobertura-index #select2-departament-container, .convergente-datos-index #select2-departament-container { margin-top: -10px; } .hogar-cobertura-index .select2.select2-container.select2-container--default, .hogar-datos-index .select2.select2-container.select2-container--default, .hogar-confronta-index .select2.select2-container.select2-container--default, .hogar-agendar-index .select2.select2-container.select2-container--default, .hogar-servicios-index .select2.select2-container.select2-container--default, .hogar-contrato-index .select2.select2-container.select2-container--default, .convergente-cobertura-index .select2.select2-container.select2-container--default, .convergente-datos-index .select2.select2-container.select2-container--default { width: 100% !important; } .hogar-cobertura-index .select2.select2-container.select2-container--default .select2-selection__arrow, .hogar-datos-index .select2.select2-container.select2-container--default .select2-selection__arrow, .hogar-confronta-index .select2.select2-container.select2-container--default .select2-selection__arrow, .hogar-agendar-index .select2.select2-container.select2-container--default .select2-selection__arrow, .hogar-servicios-index .select2.select2-container.select2-container--default .select2-selection__arrow, .hogar-contrato-index .select2.select2-container.select2-container--default .select2-selection__arrow, .convergente-cobertura-index .select2.select2-container.select2-container--default .select2-selection__arrow, .convergente-datos-index .select2.select2-container.select2-container--default .select2-selection__arrow { margin-top: -10px; } .hogar-cobertura-index .section-download, .hogar-datos-index .section-download, .hogar-confronta-index .section-download, .hogar-agendar-index .section-download, .hogar-servicios-index .section-download, .hogar-contrato-index .section-download, .convergente-cobertura-index .section-download, .convergente-datos-index .section-download { display: flex; column-gap: 30px; align-items: center; } .hogar-cobertura-index .section-download .text-div, .hogar-datos-index .section-download .text-div, .hogar-confronta-index .section-download .text-div, .hogar-agendar-index .section-download .text-div, .hogar-servicios-index .section-download .text-div, .hogar-contrato-index .section-download .text-div, .convergente-cobertura-index .section-download .text-div, .convergente-datos-index .section-download .text-div { flex: 1; display: flex; flex-direction: column; text-align: left; row-gap: 10px; } .hogar-cobertura-index .section-download .text-div .text-link, .hogar-datos-index .section-download .text-div .text-link, .hogar-confronta-index .section-download .text-div .text-link, .hogar-agendar-index .section-download .text-div .text-link, .hogar-servicios-index .section-download .text-div .text-link, .hogar-contrato-index .section-download .text-div .text-link, .convergente-cobertura-index .section-download .text-div .text-link, .convergente-datos-index .section-download .text-div .text-link { flex: 1; } .hogar-cobertura-index .section-download .text-div .text-link a.c-btn-download__button, .hogar-datos-index .section-download .text-div .text-link a.c-btn-download__button, .hogar-confronta-index .section-download .text-div .text-link a.c-btn-download__button, .hogar-agendar-index .section-download .text-div .text-link a.c-btn-download__button, .hogar-servicios-index .section-download .text-div .text-link a.c-btn-download__button, .hogar-contrato-index .section-download .text-div .text-link a.c-btn-download__button, .convergente-cobertura-index .section-download .text-div .text-link a.c-btn-download__button, .convergente-datos-index .section-download .text-div .text-link a.c-btn-download__button { color: #019DF4; } .hogar-cobertura-index .section-download .text-div .check-link, .hogar-datos-index .section-download .text-div .check-link, .hogar-confronta-index .section-download .text-div .check-link, .hogar-agendar-index .section-download .text-div .check-link, .hogar-servicios-index .section-download .text-div .check-link, .hogar-contrato-index .section-download .text-div .check-link, .convergente-cobertura-index .section-download .text-div .check-link, .convergente-datos-index .section-download .text-div .check-link { flex: 1; } .hogar-cobertura-index .section-download .text-div .check-link label, .hogar-datos-index .section-download .text-div .check-link label, .hogar-confronta-index .section-download .text-div .check-link label, .hogar-agendar-index .section-download .text-div .check-link label, .hogar-servicios-index .section-download .text-div .check-link label, .hogar-contrato-index .section-download .text-div .check-link label, .convergente-cobertura-index .section-download .text-div .check-link label, .convergente-datos-index .section-download .text-div .check-link label { color: #000000; } .hogar-cobertura-index .u-width-60, .hogar-datos-index .u-width-60, .hogar-confronta-index .u-width-60, .hogar-agendar-index .u-width-60, .hogar-servicios-index .u-width-60, .hogar-contrato-index .u-width-60, .convergente-cobertura-index .u-width-60, .convergente-datos-index .u-width-60 { width: 60% !important; } .c-definition-list__box.fs-14 { padding: 10px 0px; } .c-form__field-address .c-form__field:nth-of-type(3), .c-form__field-address .c-form__field.placa_field { width: 35%; } .mb-20 { margin-bottom: 20px; } .m0-5 { margin: 0 5px; top: -8px; position: relative; } .m-10-0 { margin: 10px 0; } .pb-5 { padding: 0 0 5px 0; } .info-enCuenta { font-size: 12px; line-height: 14px; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } .blue { color: #019DF4; } .w-960 { width: 960px; } .fs-14 { font-size: 14px; line-height: 18px; font-weight: 300; } .fs-18 { font-size: 18px; line-height: 22px; font-weight: 300; } .title28 { font-size: 28px; line-height: 32px; font-weight: 300; } a.o-link.open-modal { font-size: 14px; } .hogar-cobertura-index .c-header-wrap { z-index: 9 !important; } .hogar-cobertura-index .numeroSecundario_field, .hogar-cobertura-index .placa_field { padding: 15px 7px; } .hogar-cobertura-index .c-form__help-text.c-form__help-text_phone { margin-left: 0; font-size: 11px; line-height: 13px; } .hogar-cobertura-index .shapeButton { opacity: 1; /* hiding browser el */ appearance: none; /* Safari support */ -webkit-appearance: none; border: 0.2rem solid #fff; background-color: var(--bg-color); border-radius: 50%; box-shadow: 0 0 0 1px var(--color); width: 20px; height: 18px; } .hogar-cobertura-index .shapeButton:focus-visible { outline-offset: 0; } .hogar-cobertura-index .shapeButton:checked { box-shadow: 0 0 0 1px var(--checked-color); background-color: var(--checked-color); border-width: 0.2rem; } @media screen and (max-width: 600px) { .hogar-cobertura-index .c-header-wrap { z-index: 0; } .hogar-cobertura-index .c-text__employeer { font-size: 0.79rem; display: flex; flex-direction: column; } .hogar-cobertura-index .c-form__space { padding-left: 0px; } } .hogar-cobertura-index .c-card-checkout-cta { justify-content: center; } .hogar-cobertura-index .c-form_ejemplo { font-size: 12px; color: #86888C; text-align: left; } .hogar-cobertura-index .u-hidden { display: none !important; } .hogar-cobertura-index .modal-large .modal-inner-wrap { width: 70% !important; max-width: 450px; height: auto; max-height: 95%; } .hogar-cobertura-index .modal-large .modal-inner-wrap .o-message__title_fs18 { font-size: 18px; } .hogar-cobertura-index .modal-large .modal-inner-wrap .c-form__radio.c-form__radio_border.dirRadio { font-size: 15px; } .hogar-cobertura-index .modal-large .modal-inner-wrap img.o-modal__img { width: 80%; } .hogar-cobertura-index .modal-large .modal-inner-wrap #modal-address-divipola { padding: 10px; } .hogar-cobertura-index .modal-large .modal-inner-wrap .c-form__icon { right: 15px; } #modal-terms { padding: 10px; } #modal-terms p { font-size: 14px; line-height: 18px; } #modal-terms .o-modal__text-box { margin-top: -30px; } @media screen and (max-width: 600px) { .mobile-none { display: none !important; } } @media screen and (min-width: 601px) { .web-none { display: none !important; } } /* --------------------- */ .hogar-index-index .c-header-wrap { z-index: 9 !important; } .hogar-index-index .f-c-plan__toggle-content.js-plan-target { margin-top: 0; } .hogar-index-index .f-c-plan__benefit { border: none; padding: 0; } .hogar-index-index .f-c-plan__benefit .pagebuilder-column-group { width: 100%; } .hogar-index-index img.img_mini_offer { padding: 0; margin-top: 15px; } .hogar-index-index .f-c-plan__content { padding: 0; border-radius: 12px; background-color: #f5f5f5; } .hogar-index-index span.f-c-plan__tag.o-tag.o-tag_success { width: 100%; border-radius: 0px; background-color: #f28d15; color: #fff; } .hogar-index-index .swiper-slide.f-c-plan-slide { margin-top: 20px; } .hogar-index-index .f-c-plan__header-caption { border-radius: 10px; background-color: #0b2739; } .hogar-index-index .f-c-plan__header-caption .f-c-plan__value.megas { margin-bottom: 0; } .hogar-index-index .f-c-plan__header-caption .c-subtitle { color: #FFFFFF; font-size: 10px; padding: 10px 0 5px; } .hogar-index-index .f-c-plan__header-caption .c-subtitle span { text-decoration: line-through; } .hogar-index-index .is-plan-recommended .f-c-plan__flag { position: absolute; top: -20px; right: 0; left: 0; max-width: 100%; margin: 0 auto; border-radius: 12px 12px 0 0; font-size: 14px; line-height: 18px; width: 100%; display: block; padding: 2px; } .hogar-index-index .is-plan-recommended .f-c-plan__content { border-radius: 0 0 12px 12px; } .hogar-index-index .is-plan-recommended .f-c-plan__content .f-c-plan__header-caption { border-radius: 0px; } .hogar-index-index .is-plan-new .f-c-plan__flag { position: absolute; top: -20px; right: 0; left: 0; max-width: 100%; margin: 0 auto; border-radius: 12px 12px 0 0; font-size: 14px; line-height: 18px; background-color: #f28d15; color: #fff; width: 100%; display: block; padding: 2px; } .hogar-index-index .is-plan-new .f-c-plan__content { border-radius: 0 0 12px 12px; } .hogar-index-index .is-plan-new .f-c-plan__content .f-c-plan__header-caption { border-radius: 0px; } .hogar-index-index .is-plan-new .f-c-plan__content .f-c-plan__header-caption span.f-c-plan__tag.o-tag.o-tag_success { background-color: #e1efff; color: #0b2739; } .hogar-index-index .is-plan-new a.o-btn.o-btn_full.gtmPaso0 { background-color: #f28d15; } .hogar-index-index a.o-btn.o-btn_full.gtmPaso0 { max-width: 88%; padding: 12px; } .hogar-index-index .f-c-plan__notify { margin: 12px auto; max-width: 88%; background: none; padding: 0; } .hogar-index-index .f-c-plan__value { color: #FFFFFF; } .hogar-index-index .f-c-plan__value.megas { font-size: 28px; } .hogar-index-index .f-c-plan__value.subtitle { font-size: 10px; } .hogar-index-index .f-c-plan__content { background-color: #FFFFFF; padding-bottom: 15px; } .hogar-index-index img.tooltip_OfferFija { position: relative; top: -42px; left: 38%; cursor: pointer; } .hogar-index-index .tooltipOfferFija { position: absolute; top: 15px; max-width: 130px; right: -15px; box-shadow: 0 0 2px 1px var(--color); border-radius: 8px; } @media screen and (max-width: 600px) { .hogar-index-index article.f-c-plan { max-width: 100%; } .hogar-index-index article.f-c-plan .f-c-plan__header-caption { border-radius: 10px 10px 0 0px; } .hogar-index-index article.f-c-plan .f-c-plan__price-wrap, .hogar-index-index article.f-c-plan .f-c-plan__price { padding: 20px 10px; margin-bottom: 0; } .hogar-index-index article.f-c-plan.is-plan-new span.f-c-plan__tag.o-tag.o-tag_success { background-color: #e1efff; color: #0b2739; } .hogar-index-index article.f-c-plan .tooltipOfferFija { right: 10px; } .hogar-index-index article.f-c-plan .f-c-plan__benefit { max-width: 90%; margin: auto; } } .hogar-index-index .f-c-plan__header-price { margin-top: 10px; } .hogar-index-index .f-c-tabs__subtabs { column-gap: 0.5rem; border-radius: 60px; padding: 6px; background: #fff; box-shadow: 3px 3px 3px rgba(56, 100, 166, 0.16); margin: 0 auto 30px; display: inline-flex; } .hogar-index-index .f-c-tabs__subtabs .f-c-tabs__btn { background-color: #f5f5f5; } .hogar-index-index .f-c-tabs__subtabs .f-c-tabs__btn.is-tab-active, .hogar-index-index .f-c-tabs__subtabs .f-c-tabs__btn:hover { background-color: #0B2739; } @media screen and (max-width: 768px) { .hogar-index-index .f-c-tabs__subtabs { margin-top: 20px !important; } } .hogar-index-index .c_info { color: #019DF4; font-size: 11px; font-weight: 700; line-height: 14px; background: rgba(1, 157, 244, 0.2); width: 90%; margin: auto; border-radius: 6px; padding: 6px; margin-bottom: 15px; } @media screen and (max-width: 768px) { .hogar-index-index .c_info { margin: 20px auto 0; font-size: 14px; } } .hogar-index-index .f-c-tabs__tab { padding: 10px 8px; } .hogar-index-index .f-c-plan__price-wrap { padding: 0 10px; } .hogar-index-index header.f-c-plan__header { margin-bottom: 10px; } .hogar-index-index .f-c-tabs__control { margin-bottom: 0; top: -27px; } .hogar-index-index .f-c-tabs__description.js-subtab-content { display: none; } .hogar-index-index .column.main { padding: 0; } .hogar-index-index #bannerTop { width: 100%; padding: 0 !important; margin: 0; max-width: 100%; color: white; font-weight: 400; font-size: 20px; line-height: 28px; } .hogar-index-index #bannerTop h2 { font-weight: 300; font-size: 40px; line-height: 48px; color: #FFFFFF; } @media screen and (max-width: 430px) { .hogar-index-index .f-c-tabs { overflow: hidden !important; } .hogar-index-index .f-c-tabs__control { margin-bottom: 0; top: 10px; } } @media screen and (min-width: 740px) { .hogar-index-index .f-c-plan-arrow.swiper-button-next { top: 40%; } .hogar-index-index .f-c-plan-wrap { margin-top: 0px; padding-top: 0; } } @media screen and (max-width: 600px) { .hogar-index-index .desde { text-align: center !important; } .hogar-index-index #bannerTop { font-size: 16px; line-height: 20px; } .hogar-index-index #bannerTop h2 { font-size: 28px; line-height: 32px; } } .hogar-index-index #bannerTop .c-form__header { margin-top: 0 !important; margin-bottom: 0 !important; } .hogar-index-index .f-c-tabs__control { margin-top: 50px; } @media screen and (max-width: 740px) { .hogar-index-index .f-c-tabs__control { margin-top: 5px; } } .hogar-index-index .section-elegirMovistar { max-width: 1440px; width: 100%; margin: 0 auto; } .hogar-index-index .tittleLineLanding { line-height: 1px; background-color: #EEEEEE !important; } .hogar-index-index .tittleLineLanding h1 { font-weight: bold; } .hogar-index-index .tittleLineLanding h2 { font-weight: 400; } .hogar-index-index .subtitleTextBeneficios { font-size: 14px; } .hogar-index-index .textSliderLanding p { font-size: 15px !important; } .hogar-index-index .textSliderLanding p span strong span { font-size: 15px !important; } .hogar-index-index .sliderLandingHogar .slick-list { height: 250px !important; border-radius: 10px !important; } .hogar-index-index .section-header { background-color: #EEEEEE !important; padding: 30px 25px 15px; } @media screen and (max-width: 740px) { .hogar-index-index .section-header { padding: 10px 25px; } } @media screen and (max-width: 740px) { .hogar-index-index .tittleLineLanding { margin-bottom: 20px; } .hogar-index-index .tittleLineLanding h1 { line-height: 25px !important; } .hogar-index-index .tittleLineLanding h1 span { font-size: 20px !important; } .hogar-index-index .tittleLineLanding h2 { line-height: 25px; } .hogar-index-index .tittleLineLanding h2 span { font-size: 16px !important; } } @media (min-width: 1024px) and (max-width: 1200px) { .o-identification-card__date { bottom: 51%; left: -27px; } } @media (min-width: 1201px) { .o-identification-card__date { bottom: 47%; left: -35px; } } @media (min-width: 768px) and (max-width: 1023px) { .o-identification-card__date { left: -32px; bottom: 46%; } } @media (min-width: 360px) and (max-width: 767px) { .o-identification-card__date { bottom: 50%; } } .hogar-datos-index #ExpCard { border: 2px solid green; margin-top: 10px; border-radius: 5px; height: 20px; width: 10em; margin-left: 120px; } .hogar-datos-index .ui-datepicker-calendar td a { margin-left: 0px; text-align: center; color: #0B2739; } .hogar-datos-index .ui-datepicker-unselectable span { position: relative; right: 7px; text-align: center; } .hogar-datos-index .ui-datepicker-calendar .ui-state-active { border-radius: 30%; padding-right: 10px; background-color: blue; color: white; } @media screen and (max-width: 600px) { .hogar-datos-index #ExpCard { margin-left: 150px; } } .hogar-datos-index #DocumentCard { font-size: 10px; margin-top: 7px; } @media screen and (max-width: 600px) { .hogar-datos-index #DocumentCard { position: absolute; top: 38px; } } .hogar-cobertura-index .o-layout-2-columns .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0 { margin-top: 5px; } .hogar-cobertura-index .o-layout-2-columns .u-hiddenSeccionDir { display: none; opacity: 0; } .hogar-servicios-index .c-header-wrap { z-index: 9 !important; } @media only screen and (min-width: 1024px) { .hogar-servicios-index .o-layout-2-columns #checkout-summary { margin-top: -160px; order: 3; } .hogar-servicios-index .o-layout-2-columns header { order: 0; } .hogar-servicios-index .o-layout-2-columns #cross-selling-service-component { order: 2; } } @media only screen and (max-width: 1023px) { .hogar-servicios-index .o-layout-2-columns { flex-direction: column; } .hogar-servicios-index .o-layout-2-columns header { order: 0; } .hogar-servicios-index .o-layout-2-columns #checkout-summary { order: 1; margin-top: 20px; } .hogar-servicios-index .o-layout-2-columns #cross-selling-service-component { order: 2; } } @media only screen and (max-width: 1023px) { .hogar-cobertura-index .o-layout-2-columns, .hogar-datos-index .o-layout-2-columns, .hogar-confronta-index .o-layout-2-columns, .hogar-agendar-index .o-layout-2-columns, .hogar-contrato-index .o-layout-2-columns { flex-direction: column; } .hogar-cobertura-index .o-layout-2-columns header, .hogar-datos-index .o-layout-2-columns header, .hogar-confronta-index .o-layout-2-columns header, .hogar-agendar-index .o-layout-2-columns header, .hogar-contrato-index .o-layout-2-columns header { order: 0; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary, .hogar-datos-index .o-layout-2-columns #checkout-summary, .hogar-confronta-index .o-layout-2-columns #checkout-summary, .hogar-agendar-index .o-layout-2-columns #checkout-summary, .hogar-contrato-index .o-layout-2-columns #checkout-summary { order: 1; margin-top: 20px; } .hogar-cobertura-index .o-layout-2-columns form, .hogar-datos-index .o-layout-2-columns form, .hogar-confronta-index .o-layout-2-columns form, .hogar-agendar-index .o-layout-2-columns form, .hogar-contrato-index .o-layout-2-columns form { order: 2; } } @media only screen and (min-width: 1023px) { .hogar-cobertura-index .o-layout-2-columns, .hogar-datos-index .o-layout-2-columns, .hogar-confronta-index .o-layout-2-columns, .hogar-agendar-index .o-layout-2-columns, .hogar-contrato-index .o-layout-2-columns { width: 95% !important; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary, .hogar-datos-index .o-layout-2-columns #checkout-summary, .hogar-confronta-index .o-layout-2-columns #checkout-summary, .hogar-agendar-index .o-layout-2-columns #checkout-summary, .hogar-contrato-index .o-layout-2-columns #checkout-summary { margin-top: -120px; } } .hogar-cobertura-index #c-MsjError, .hogar-datos-index #c-MsjError, .hogar-confronta-index #c-MsjError, .hogar-agendar-index #c-MsjError, .hogar-contrato-index #c-MsjError { background-color: #F8CCCC; border: 1px solid #FF374A; border-radius: 4px; padding: 6px 16px; text-align: left; color: #313235; display: flex; align-items: center; line-height: 20px; } .hogar-cobertura-index #c-MsjError .i-close, .hogar-datos-index #c-MsjError .i-close, .hogar-confronta-index #c-MsjError .i-close, .hogar-agendar-index #c-MsjError .i-close, .hogar-contrato-index #c-MsjError .i-close { color: #FF374A; font-size: 12px; margin-right: 8px; } .hogar-cobertura-index .u-hidden, .hogar-datos-index .u-hidden, .hogar-confronta-index .u-hidden, .hogar-agendar-index .u-hidden, .hogar-contrato-index .u-hidden { display: none !important; } .hogar-agendar-index .f-c-calendar__grid_day.is-invalid { pointer-events: initial !important; } .hogar-agendar-index .f-c-calendar__grid_day.calendarValid { border: 1px solid red; } .hogar-agendar-index .calendarValid:last-of-type { border-radius: 0px 8px 8px 0; } @media only screen and (min-width: 1023px) { .o-layout-2-columns.o-section { margin-left: auto; } } .fija-no-cobertura { display: flex; align-items: center; justify-content: center; margin: 25px 0; gap: 130px; flex-wrap: wrap; } @media screen and (max-width: 768px) { .fija-no-cobertura { gap: 50px; } .fija-no-cobertura .content-text { min-width: unset; } } .fija-no-cobertura .content-text { text-align: center; min-width: 320px; } @media screen and (max-width: 768px) { .fija-no-cobertura .content-text { min-width: unset; } } .fija-no-cobertura .content-text h2 { margin-bottom: 24px; color: #019DF4; font-size: 40px; font-weight: 300; display: flex; align-items: center; justify-content: space-between; } .fija-no-cobertura .content-text h2::after, .fija-no-cobertura .content-text h2::before { content: ""; background-image: url("../images/fija/fija-icon-alert.png"); width: 32px; height: 32px; display: inline-block; margin: 0 10px; background-repeat: no-repeat; background-size: contain; } .fija-no-cobertura .content-text p { margin-bottom: 40px; font-size: 22px; } .modal-fija-no-cobertura .modal-fija-container { text-align: center; } .modal-fija-no-cobertura .modal-logo, .modal-fija-no-cobertura h2 { margin-bottom: 16px; } .modal-fija-no-cobertura h2 { font-size: 22px; padding: 0 50px; } .modal-fija-no-cobertura p { padding: 0 30px; } .modal-fija-no-cobertura .content-inputs { margin: 22px auto; padding: 0 20px; } .modal-fija-no-cobertura .action-close { display: inline-block !important; } .modal-fija-no-cobertura .action-close::before { background-image: url("../images/modals/modals-icon-close.png"); background-repeat: no-repeat; width: 36px; height: 36px; background-size: contain; content: ""; } .modal-fija-no-cobertura .modal-inner-wrap { background: #fff; padding: 2%; border-radius: 15px; height: fit-content; } @media (min-width: 768px) { .modal-fija-no-cobertura .modal-inner-wrap { max-width: 400px; } } .modal-fija-no-cobertura .modal-content { background: unset; padding: unset; border-radius: unset; } .modal-fija-no-cobertura.modal-popup.modal-slide .modal-footer { border-top: none; text-align: unset; padding: 2%; text-align: center; } .hogar-datos-index .is-error .c-form__input[type=email]:invalid + .c-form__label { top: -1.4rem !important; } .hogar-datos-index .is-error .c-form__input[type=email] { top: -15px !important; } .hogar-cobertura-index .select2-selection__arrow { display: none !important; } .hogar-landingcobertura-index { --checked-color: #019DF4; --color: #999; --bg-color: #e8e8e8; } .hogar-landingcobertura-index .c-header-wrap { z-index: 9 !important; } .hogar-landingcobertura-index .f-c-header-step__brand { margin: auto; } .hogar-landingcobertura-index .title-lc { width: 100%; } .hogar-landingcobertura-index .c-img { padding: 0 40px 60px; align-self: flex-end; padding-bottom: 50px; } .hogar-landingcobertura-index .shapeButton { opacity: 1; appearance: none; -webkit-appearance: none; border: 0.2rem solid #fff; background-color: var(--bg-color); border-radius: 50%; box-shadow: 0 0 0 1px var(--color); width: 20px; height: 18px; } .hogar-landingcobertura-index .shapeButton:checked { box-shadow: 0 0 0 1px var(--checked-color); background-color: var(--checked-color); border-width: 0.2rem; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap { max-width: 400px; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap #modal-address-divipola { padding: 5px 20px; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap #img-cobertura { max-width: 30%; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap h2 { font-size: 20px; padding: 0 15px; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap .c-steps__value { font-size: 14px; width: 28px; height: 28px; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap .dirRadio { column-gap: 0.3rem; padding: 8px 2px; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap .dirRadio label { text-align: left; font-size: 16px; line-height: 20px; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap .c-form__icon_select::before { padding: 0; font-size: 10px; } .hogar-landingcobertura-index .w-400 .modal-inner-wrap #btn-verifyOrch { margin: 20px 0 0; max-width: max-content; } .hogar-landingcobertura-index figure#img-cobertura { margin: 0 auto 16px; } .hogar-landingcobertura-index #modal-success { display: block; padding: 0 20px 10px; } .hogar-landingcobertura-index #modal-success p.o-message__txt.u-text-regular { padding: 0; font-size: 12px; } .hogar-landingcobertura-index #modal-success a#show-offers-btn { padding: 10px 40px; margin-bottom: 30px; } .hogar-landingcobertura-index #modal-error { padding: 0 20px 10px; } .hogar-landingcobertura-index #modal-error .c-botones { display: flex; column-gap: 1rem; } .hogar-landingcobertura-index #modal-error a.o-btn { width: 200px; } .hogar-landingcobertura-index #modal-error .error_msg p { font-size: 14px; line-height: 16px; } @media screen and (max-width: 600px) { .hogar-landingcobertura-index #title-mobile { display: flex; order: 2; margin-bottom: 0; } .hogar-landingcobertura-index #title-mobile h2 { font-size: 22px; margin-bottom: 0; } .hogar-landingcobertura-index .c-landing { flex-direction: column; } .hogar-landingcobertura-index .c-landing form { order: 3; } .hogar-landingcobertura-index .c-landing .c-img { width: 60%; margin: auto; order: 1; padding-bottom: 0; } } .hogar-landingcobertura-index span.c-form__error-text, .hogar-landingcobertura-index .error_input { padding-left: 0 !important; text-align: left !important; line-height: 14px !important; font-size: 12px !important; } .hogar-landingcobertura-index .o-list-steps__step::before { width: 32px !important; height: 32px !important; min-width: 32px; min-height: 32px; line-height: 16px; } .hogar-landingcobertura-index select, .hogar-landingcobertura-index input { max-width: 90%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .hogar-landingcobertura-index .f-c-header-step__wrap, .hogar-landingcobertura-index .o-layout-2-columns { max-width: 960px !important; } .hogar-landingcobertura-index span.o-list-steps__txt { font-size: 12px; line-height: 14px; } .hogar-landingcobertura-index fieldset.c-form__fieldset.c-form__field-container { margin-top: 1rem; padding: 0; } .hogar-landingcobertura-index label.c-form__checkbox-label.u-text-left { line-height: 20px; } .hogar-landingcobertura-index .o-section { margin-top: 0px; margin-bottom: 40px; } .hogar-landingcobertura-index .c-form__header { margin-top: 20px; margin-bottom: 20px; } .hogar-landingcobertura-index .c-form__input { font-size: 16px; height: 42px; top: -15px; padding-top: 15px; z-index: 99; width: 108%; max-width: 108%; left: -10px; padding-left: 10px; } .hogar-landingcobertura-index .c-form__field { padding: 15px 10px 10px 10px; height: 42px; } .hogar-landingcobertura-index label.c-form__label { padding-left: 10px; font-size: 16px; line-height: 22px; } .hogar-landingcobertura-index .c-form__input.c-form__input_label-top + .c-form__label, .hogar-landingcobertura-index .c-form__input:valid + .c-form__label, .hogar-landingcobertura-index .c-form__input:focus + .c-form__label { top: -1.4rem; } .hogar-landingcobertura-index .c-form__field-canvas { margin-bottom: 0.6rem; } .hogar-landingcobertura-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0 { padding: 14px !important; font-size: 14px !important; line-height: 18px; } .hogar-landingcobertura-index form { max-width: 620px; } .hogar-landingcobertura-index .c-form__checkbox { font-size: 14px; line-height: 18px; } .hogar-landingcobertura-index .c-form__actions { margin-top: 1rem; } .hogar-landingcobertura-index span.c-form__icon { width: 10%; } .hogar-landingcobertura-index .o-identification-card { grid-auto-rows: minmax(200px, auto); } .hogar-landingcobertura-index form#questions-form { width: 960px !important; max-width: 960px !important; } .hogar-landingcobertura-index ol#questionList { padding: 30px 50px; } .hogar-landingcobertura-index ol#questionList li.c-form__item-list { font-size: 16px; padding: 16px 0; } .hogar-landingcobertura-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before { font-size: 16px; } .hogar-landingcobertura-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column { font-size: 14px; row-gap: 0.6rem; margin: 20px; } .hogar-landingcobertura-index .f-c-calendar { padding: 12px; } .hogar-landingcobertura-index li.f-c-calendar__header_day { font-size: 14px; padding: 0 14px; } .hogar-landingcobertura-index li.f-c-calendar__grid_day { font-size: 18px; padding: 10px; } .hogar-landingcobertura-index div#checkout-summary { max-width: 300px; } .hogar-landingcobertura-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border { font-size: 20px !important; padding-bottom: 16px; margin-bottom: 16px; } .hogar-landingcobertura-index div#checkout-summary .c-card-summary__amount h4 { font-size: 14px; line-height: 18px; } .hogar-landingcobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before { font-size: 12px; line-height: 16px; margin-bottom: 0; } .hogar-landingcobertura-index div#checkout-summary ul.c-card-summary__details { font-size: 10px; padding-bottom: 0; } .hogar-landingcobertura-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary { padding: 1rem; max-width: 100% !important; min-width: 300px; } .hogar-landingcobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__total { margin: -15px 0 5px 0; } .hogar-landingcobertura-index div#checkout-summary .c-card-summary__message.i-information { font-size: 10px; } .hogar-landingcobertura-index div#checkout-summary h4.c-card-summary__subtitle { margin-bottom: 5px; } .hogar-landingcobertura-index div#checkout-summary td.c-card-summary__table-cell { padding-top: 0px; } .hogar-landingcobertura-index div#checkout-summary .borderDetail { border-top: 1px solid #d3d4d3; border-bottom: 1px solid #d3d4d3; padding: 10px 0; } .hogar-landingcobertura-index div#checkout-summary .mb-10 { margin-bottom: 10px; } .hogar-landingcobertura-index li.f-c-calendar__header_day { padding: 0 10px !important; } .hogar-landingcobertura-index #modal-c2c { padding: 0 2rem; } .hogar-landingcobertura-index #modal-c2c #msjResponseC2C { width: 70% !important; } .c-definition-list__box.fs-14 { padding: 10px 0px; } .c-form__field-address .c-form__field:nth-of-type(3), .c-form__field-address .c-form__field.placa_field { width: 35%; } .mb-20 { margin-bottom: 20px; } .m0-5 { margin: 0 5px; top: -8px; position: relative; } .m-10-0 { margin: 10px 0; } .pb-5 { padding: 0 0 5px 0; } .info-enCuenta { font-size: 12px; line-height: 14px; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } .blue { color: #019DF4; } .w-960 { width: 960px; } .fs-14 { font-size: 14px; line-height: 18px; font-weight: 300; } .fs-18 { font-size: 18px; line-height: 22px; font-weight: 300; } .title28 { font-size: 28px; line-height: 32px; font-weight: 300; } a.o-link.open-modal { font-size: 14px; } #modal-terms { padding: 10px; } #modal-terms p { font-size: 14px; line-height: 18px; } #modal-terms .o-modal__text-box { margin-top: -30px; } /*Inicio stylos recibo*/ .receipt-name.u-text-light { font-weight: bold; color: #6C6D6D; } .sheet { width: 55px; position: absolute; left: 220px; top: 45px; } .text-rdp { font-size: 12px; position: relative; top: -6px; width: 150px; color: #0B2739; background: #BDE4A4; border: 2px solid #5CB615; border-radius: 4px; margin-left: 1px; height: 30px; } .client-name { font-size: 12px; color: #0B2739; position: relative; top: -5px; left: 3px; font-weight: bold; } .Num_contract { border-color: #E2E2E2; border-radius: 5px; font-size: 14px; color: #5D5C5C; background: none; padding: 2px; border: 1.5px solid #BCBCBB; margin-left: 18px; } .receipt-address.c-form__address { position: relative; width: 100%; height: 100px; padding: 1em 1.5em; margin: 2em auto; bottom: 30px; border: 0px solid #f5f5f5ff; border-radius: 10px; box-shadow: -2px 2px 2px #D0D3D4; background: #ffffff; border-color: transparent; } .receipt-address.c-form__address:before { content: ""; position: absolute; top: 0; right: 0; border-width: 0 60px 60px 0; border-style: solid; border-color: #D3D4D3 #f5f5f5ff; border-radius: 5px; box-shadow: -1px 1px 1px #A6ACAF; z-index: 2; } .header-rdp.c-form__address-header { /* Estilos para la cabecera */ text-align: center; font-weight: bold; background: #ffffff; height: 10px; border: 1px solid #ffffff; margin-left: -19px; } .content-rdp.c-form__address-content { /* Estilos para el contenido principal */ margin-top: 12px; height: 46px; padding: 1px; border: 1.5px solid #BCBCBB; border-color: #E2E2E2; width: 200px; border-radius: 4px; margin-left: -15px; } @media screen and (max-width: 600px) { .Num_contract { margin-left: 43px; } .sheet { left: 245px; } .receipt-address.c-form__address { position: relative; top: -300px; padding-top: 10px; } #DireccionFija { margin-top: 1.5rem; } #politi-cobertFija { margin-top: 0; } } /*Fin stylos recibo*/ @media screen and (max-width: 600px) { .mobile-none { display: none !important; } } @media screen and (min-width: 601px) { .web-none { display: none !important; } } /* --------------------- */ @media (min-width: 1024px) and (max-width: 1200px) { .o-identification-card__date { bottom: 51%; left: -27px; } } @media (min-width: 1201px) { .o-identification-card__date { bottom: 47%; left: -35px; } } @media (min-width: 768px) and (max-width: 1023px) { .o-identification-card__date { left: -32px; bottom: 46%; } } .flex-2columns-center { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 1.5rem; } .numSize { min-width: 90px; } #otro-si { grid-column: 2/3; grid-row: 1; } /* movil */ @media screen and (max-width: 600px) { #politi-cobertFija { margin-top: 0; } #DireccionFija { margin-top: 1.5rem; } .flex-2columns-center { grid-template-columns: 1fr; } .numSize { min-width: 120px; } #otro-si { grid-column: 1; grid-row: 2; } } .hogar-cobertura-index .modal-information .i-information { color: #019df4; text-align: center; font-size: 50px; } .c-new-preloader { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 999; 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; height: 100%; background-color: #fff; opacity: 0; visibility: hidden; transition: all 0.4s ease-in; } .is-preload .c-new-preloader { opacity: 1; background-color: rgba(255, 255, 255, 0.9); visibility: visible; } .c-new-preloader_position { position: relative; z-index: 8; } .c-new-preloader__box { display: grid; place-items: center; row-gap: 0px; line-height: 25px; } .c-new-preloader_z-index { z-index: 1000; } .c-new-preloader__circle { box-sizing: border-box; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 274px; /* 9 */ height: 17.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 330px; /* 9 */ width: 20.625rem; /* 9 */ padding-left: 40px; background-repeat: no-repeat; background-size: contain; object-fit: cover; } .c-new-preloader__circle.coveragev2 { width: 330px; height: 247px; } .c-new-preloader__circle.coverage { width: 330px; height: 247px; } .c-new-preloader__circle.customer { width: 330px; height: 247px; } .c-new-preloader__circle.shedule { width: 330px; height: 247px; } .c-new-preloader__circle.services { width: 330px; height: 247px; } .c-new-preloader__circle.contract { width: 330px; height: 247px; } .c-new-preloader__circle.coveragev2 { background-image: url("../images/fija/preload/anim-coverage_new.gif"); } .c-new-preloader__circle.coverage { background-image: url("../images/fija/preload/anim-coverage.gif"); } #status { background-image: url("../images/fija/preload/anim-coverage.gif") !important; } .c-new-preloader__circle.customer { background-image: url("../images/fija/preload/anim-customer.gif"); } #status { background-image: url("../images/fija/preload/anim-customer.gif") !important; } .c-new-preloader__circle.schedule { background-image: url("../images/fija/preload/anim-schedule.gif"); } #status { background-image: url("../images/fija/preload/anim-schedule.gif") !important; } .c-new-preloader__circle.services { background-image: url("../images/fija/preload/anim-services.gif"); } #status { background-image: url("../images/fija/preload/anim-services.gif") !important; } .c-new-preloader__circle.contract { background-image: url("../images/fija/preload/anim-contract.gif"); } #status { background-image: url("../images/fija/preload/anim-contract.gif") !important; } .c-new-preloader__textFw { font-weight: 600; font-size: 22px; } .c-new-preloader__text { color: #019DF4; } .c-new-preloader_textSize-24 { font-size: 18px; font-weight: 300; } @keyframes loading { 0% { transform: rotate(0deg); } 0% { transform: rotate(360deg); } } .cat-card__link { 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-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 324px; /* 9 */ max-width: 20.25rem; /* 9 */ margin: 0 auto; border: 1px solid transparent; color: #313235; background-color: #fff; transition: all 0.2s ease-in-out; cursor: pointer; } .cat-card__link:hover { border-color: #B6B7B7; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); } @media (min-width: 769px) { .cat-card__link { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -moz-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px 16px; /* 9 */ padding: 0.75rem 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 255px; /* 9 */ max-width: 15.9375rem; /* 9 */ width: 100%; height: 100%; } } .card_link { 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-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 324px; /* 9 */ max-width: 20.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 5px 8px; /* 9 */ padding: 0.3125rem 0.5rem; /* 9 */ margin: 0 auto; border: 1px solid transparent; color: #313235; background-color: #fff; transition: all 0.2s ease-in-out; cursor: pointer; } @media (min-width: 769px) { .card_link { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -moz-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px 16px; /* 9 */ padding: 0.75rem 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 255px; /* 9 */ max-width: 15.9375rem; /* 9 */ width: 100%; height: 100%; } } .c-review { display: flex; font-size: 14px; color: #737578; } .c-review .review_percentage { margin-top: 4px; margin-right: 2px; } .cat-card__content { position: relative; } .cat-card__name { font-weight: 300; display: block; display: -webkit-box; max-height: 64.8px; max-height: 4.05rem; overflow: hidden; line-height: 1.2; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; font-size: 18px; font-size: 1.125rem; color: #313235; font-weight: 700; } .c-card__price_eq { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ font-weight: 700; line-height: 1.2; } .c-card__text_sm { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: #0B2739; } .c-card__price-before { text-decoration: line-through; color: #737578; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 20px; /* 9 */ line-height: 1.25rem; /* 9 */ } .c-card-detail__btn-equipos { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 287px; /* 9 */ max-width: 17.9375rem; /* 9 */ margin: 10px auto; font-weight: 400; } .c-card-detail__btn-equipos.u-hidden { position: absolute; } .cat-card-medios__pagos { margin-top: 10px; width: 75%; } .cat-card__photo .product-image-photo { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 252px; /* 9 */ max-width: 15.75rem; /* 9 */ height: auto; } .cat-card__tagEquipos { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ flex-wrap: wrap; } .cat-card__tagValue { display: inline-block; margin: 4px 0 4px 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 2px 5px; /* 9 */ padding: 0.125rem 0.3125rem; /* 9 */ font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #fff; background-color: #E01F6E; } .cat-card__tagValue.currentTagTextDesc { color: #fff; background-color: #E01F6E; } .cat-filters span { display: inline-block; word-break: break-all; } .cat-card__brand { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 20px; /* 9 */ line-height: 1.25rem; /* 9 */ color: #737578; text-transform: uppercase; } @media (min-width: 769px) { .cat-card__content { width: 100%; 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; } .c-card__btn { width: 100%; 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; } .c-card__price_eq { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 28px; /* 9 */ line-height: 1.75rem; /* 9 */ color: #313235; } .cat-card__tagValue { width: max-content; max-width: 100%; } } @media (max-width: 768px) { .cat-card__photo { -webkit-flex-basis: 40%; -moz-flex-basis: 40%; -ms-flex-preferred-size: 40%; flex-basis: 40%; } .cat-card__tagEquipos { column-gap: 18px; } .cat-card__content { margin-top: 10px; -webkit-flex-basis: 50%; -moz-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; } .c-card__btn { -webkit-flex-basis: 100%; -moz-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } .cat-card__name { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 4px; /* 9 */ margin-bottom: 0.25rem; /* 9 */ } .c-card__price-before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .pagebuilder-column-line { flex-wrap: nowrap; } .cat-card-medios__pagos { width: 90%; margin-top: 2px; } .cat-card__tagValue { margin: 3px 0 3px 0; } .pagebuilder-mobile-hidden { display: none !important; } .detail-price-product .c-price .prices { text-align: center; } } .catalog-category-view, .catalogsearch-result-index { --white: #ffffff; --blue: #019df4; --darkblue: #0b2739; } .catalog-category-view #modal-offert, .catalogsearch-result-index #modal-offert { padding: 0px !important; background-color: var(--blue); } .catalog-category-view #modal-offert .o-modal__content, .catalogsearch-result-index #modal-offert .o-modal__content { padding: 0px !important; } .catalog-category-view #modal-offert .btnOffert, .catalogsearch-result-index #modal-offert .btnOffert { border-radius: 50px; padding: 5px 15px; margin: 0 10px; cursor: pointer; } .catalog-category-view #modal-offert .bg-white, .catalogsearch-result-index #modal-offert .bg-white { background-color: var(--white); border: 1px solid var(--darkblue); color: var(--darkblue); } .catalog-category-view #modal-offert .bg-darkblue, .catalogsearch-result-index #modal-offert .bg-darkblue { background-color: var(--darkblue); color: var(--white); } .catalog-category-view #modal-offert .d-flex, .catalogsearch-result-index #modal-offert .d-flex { display: flex; } .catalog-category-view #modal-offert .btnIcon::before, .catalogsearch-result-index #modal-offert .btnIcon::before { margin-top: 5px; } .catalog-category-view #modal-offert .column-center, .catalogsearch-result-index #modal-offert .column-center { margin: auto; } .catalog-category-view #modal-offert .column-none, .catalogsearch-result-index #modal-offert .column-none { display: none; } .catalog-category-view #modal-offert .o-modal__btn-close::before, .catalogsearch-result-index #modal-offert .o-modal__btn-close::before { font-size: 10px; color: #86888c; background: #fff; padding: 5px; border-radius: 50%; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); } .catalog-category-view .modal-content, .catalogsearch-result-index .modal-content { padding: 0; } @media (max-width: 768px) { .catalog-category-view .pagebuilder-column-line, .catalogsearch-result-index .pagebuilder-column-line { flex-wrap: wrap !important; } .catalog-category-view .btnOffert, .catalogsearch-result-index .btnOffert { margin: 1% 15% !important; } } #modal-c2c { /* #phoneC2C:focus{ //top: 5px; + label{ margin-top: 14px; } } */ } #modal-c2c h2.o-headline { font-size: 32px !important; line-height: 34px !important; } #modal-c2c .u-width-70 { width: 70%; margin: auto; } #modal-c2c .c-phoneC2C .c-form__field { padding: 0px; } #modal-c2c .c-phoneC2C .c-form__field input#phoneC2C { width: 100%; height: 52px; padding-left: 15px; z-index: 100; } #modal-c2c .c-phoneC2C span.c-form__error-text { padding: 0; margin: 0; } #modal-c2c #btnC2C { padding: 10px !important; width: 40% !important; margin-top: 10px; background: #fff; color: #008edd; border: 1px solid; } #modal-c2c #btnC2C:hover { background: #008edd; color: #fff; border: 1px solid #008edd; } #modal-c2c #btnC2C:disabled { opacity: 0.5; } #modal-c2c .tcC2C { font-size: 11px; line-height: 13px; } #modal-c2c .tcC2C span.open-modal.check-o-link { font-size: 11px; } #modal-c2c .c-form__actions, #modal-c2c .c-form__btn { margin: auto; } #modal-c2c .c-form__field.is-error label.c-form__label.label, #modal-c2c .c-form__field.is-field-check label.c-form__label.label { font-size: 14px; /* width: 100%; height: 52px; line-height: 52px;*/ } #modal-c2c span.c-form__icon.i-phone { z-index: 0; } #modal-c2c #msjResponseC2C { padding: 5px 10px; width: 70% !important; margin: 10px auto; font-size: 12px; text-align: left; } #modal-c2c #msjResponseC2C.msj_success { background-color: #bde4a4; border: 1px solid #5cb615; color: #313235; } #modal-c2c #msjResponseC2C.msj_fail { background-color: #f8d2b3; border: 1px solid #f28d15; } .btnExistingOrder { max-width: 60%; margin: auto; width: 220px; margin-top: 20px; } .title-text-catalogo h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ line-height: 40px; font-weight: 300; color: #000; } @media (max-width: 768px) { .title-text-catalogo h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ } } @media (min-width: 800px) { .title-text-catalogo h2 { display: none !important; } } .mainMessage { width: 100%; display: none; } @media (min-width: 769px) { .mainMessage { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } } .category-description { display: none; margin: auto; max-width: 70.3125rem; } @media (min-width: 769px) { .category-description { display: block; } } .category-description .catalog-brands-category h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ line-height: 40px; font-weight: 400; color: #313235; margin-bottom: 10px; } @media (max-width: 768px) { .category-description .catalog-brands-category h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ } } .sidebar.sidebar-main.term { color: #0B2739; background: #fff; width: 100%; position: fixed; top: 0; left: -100%; height: 100vh; transition: all 0.2s ease-in-out; } .is-filters-active .sidebar.sidebar-main.term { left: 0; z-index: 10; } .text-white { color: #fff; } .box-title-beneficios { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 32px 2px 16px 2px; /* 9 */ margin: 2rem 0.125rem 1rem 0.125rem; /* 9 */ color: #fff; } @media (min-width: 769px) { .box-title-beneficios { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 38px; /* 9 */ font-size: 2.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 56px 0px 40px 0px; /* 9 */ margin: 3.5rem 0rem 2.5rem 0rem; /* 9 */ } } .cat-card_compare { display: flex; align-items: center; flex-direction: row; justify-content: left; width: 100%; padding: 16px 0px; } @media (max-width: 768px) { .cat-card_compare { padding: 16px 0px; } } .checkbox_compare { width: 18px; height: 18px; border-radius: 2px !important; } .container-card_compare .cat-card_compare input[type=checkbox] { accent-color: #008EDD; } .action.tocompare { color: #737578; font-size: 14px; font-weight: 400; line-height: 20px; text-decoration: none !important; margin-left: 4px; } .page-bottom { max-width: 100% !important; padding: 0px !important; } @media (max-width: 768px) { .titlesCatalogCategories { display: block !important; } } @media (min-width: 800px) { .titlesCatalogCategories { display: none !important; } } @media (min-width: 769px) { #btnVolverArriba { display: none !important; } } @media (max-width: 768px) { #btnVolverArriba { display: none; position: fixed; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ bottom: 10%; right: 5%; background-color: #019bef; color: white; cursor: pointer; border-radius: 50%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); z-index: 99; } #btnVolverArriba .i-after-chevron-down { display: inline-block; transition: transform 0.3s ease; transform: rotate(180deg); /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ margin-top: -10%; } } .container_devolucion { display: flex !important; color: #000; } .text_devolucion { font-size: 16px; line-height: 24px; } @media (max-width: 768px) { .text_devolucion { font-size: 14px; line-height: 20px; padding-left: 3px; } } .catalog-category-view .toolbar-container .numeral_654, .catalogsearch-result-index .toolbar-container .numeral_654 { display: flex; flex-direction: column; align-items: center; flex: 1 1 10%; color: #787878; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .catalog-category-view .toolbar-container .numeral_654 img, .catalogsearch-result-index .toolbar-container .numeral_654 img { width: 24px; height: 24px; } .catalog-category-view .toolbar-container .numeral_654 #textDesk, .catalogsearch-result-index .toolbar-container .numeral_654 #textDesk { display: block; } .catalog-category-view .toolbar-container .numeral_654 #textMobile, .catalogsearch-result-index .toolbar-container .numeral_654 #textMobile { display: none; } @media (max-width: 768px) { .catalog-category-view .toolbar-container .numeral_654, .catalogsearch-result-index .toolbar-container .numeral_654 { flex-direction: row !important; align-items: center; column-gap: 10px; color: #019df4; } .catalog-category-view .toolbar-container .numeral_654 img, .catalogsearch-result-index .toolbar-container .numeral_654 img { filter: invert(50%) sepia(100%) saturate(500%) hue-rotate(180deg) brightness(90%); } .catalog-category-view .toolbar-container .numeral_654 #textDesk, .catalogsearch-result-index .toolbar-container .numeral_654 #textDesk { display: none; } .catalog-category-view .toolbar-container .numeral_654 #textMobile, .catalogsearch-result-index .toolbar-container .numeral_654 #textMobile { display: block; } } @media (min-width: 769px) and (max-width: 796px) { .catalog-category-view .toolbar-container .numeral_654, .catalogsearch-result-index .toolbar-container .numeral_654 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 11px; /* 9 */ font-size: 0.6875rem; /* 9 */ } } .catalog-category-view .img-btnWhastApp, .catalogsearch-result-index .img-btnWhastApp { background-image: url("../images/btn-whatsapp.svg"); background-size: cover; background-repeat: no-repeat; background-position: center; border: none; padding: 10px 20px; cursor: pointer; position: fixed; z-index: 102; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } .catalog-category-view .img-btnWhastApp:hover, .catalogsearch-result-index .img-btnWhastApp:hover { opacity: 0.9; } @media (max-width: 768px) { .catalog-category-view .img-btnWhastApp, .catalogsearch-result-index .img-btnWhastApp { right: 5%; bottom: 16.5%; } } @media (min-width: 769px) and (max-width: 1445px) { .catalog-category-view .img-btnWhastApp, .catalogsearch-result-index .img-btnWhastApp { right: 2.5%; bottom: 3%; } } @media (min-width: 1446px) { .catalog-category-view .img-btnWhastApp, .catalogsearch-result-index .img-btnWhastApp { right: 18%; bottom: 3%; } } .fw-700 { font-weight: 700 !important; } .l-text_title { display: block; text-align: left; margin-bottom: 0.5rem; } @media only screen and (max-width: 426px) { .l-text_title { font-size: 18px !important; } } .l-space-box { display: flex; gap: 30px; } .l-box-grid { display: grid; grid-template-columns: 3rem 1fr; } .l-reset-margin_form { margin: 0 auto; } .l-form__field { position: relative; width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 10px; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 20px; /* 9 */ padding-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 48px; /* 9 */ padding-right: 3rem; /* 9 */ text-align: left; color: #50535A; background-color: #fff; overflow: hidden; } @media only screen and (max-width: 426px) { .l-form__title { text-align: center; font-size: 30px !important; } } .c-form__body { text-align: center; margin-right: auto; margin-left: auto; } .c-form__subtitle { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ font-weight: 300; color: #000000; text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 28px; /* 9 */ line-height: 1.75rem; /* 9 */ } .fieldset-login-sms { width: 50%; margin: 0px auto; margin-top: 31px; text-align: center; } @media only screen and (max-width: 426px) { .fieldset-login-sms { width: 100%; } } .o-link-login { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 14px; /* 9 */ line-height: 0.875rem; /* 9 */ font-weight: 400; text-align: left; color: #019DF4; } .recaptcha-center { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 20px; /* 9 */ padding-top: 1.25rem; /* 9 */ display: flex; justify-content: center; } .lineTyC { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 14px; /* 9 */ line-height: 0.875rem; /* 9 */ font-weight: 400; text-align: left; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 14px; /* 9 */ padding-bottom: 0.875rem; /* 9 */ } @media only screen and (max-width: 1240px) { #contRept .rc-anchor-normal .rc-anchor-pt { margin: 2px 5px 0 0; padding-right: 0px; position: absolute; right: 0; text-align: left; width: 100px; } } .h_activate_flex { display: flex; background: white; width: 100%; margin: 0 auto; gap: 0.8rem; padding: 0.25rem; padding-top: 1.25rem; padding-bottom: 1.25rem; padding-left: 3rem; padding-right: 3rem; } .h_icon_space { padding-left: 0.5rem; padding-right: 0.5rem; } .h_same_ratio { flex: 1; } .h_size_ratio { flex: 2; } .h_icon_size { font-size: 1.6rem; } .h_icon_size_header_modal { font-size: 2rem; } .h_icon_size_footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .h_menu_subtitle_size { font-size: 0.75rem; } .h_menu_title_size { font-size: 0.8rem; font-weight: bold; } .h_container_menu { background: #f4f4f4; flex: 1; display: flex; align-items: center; padding: 0.2rem; } .h_container_submenu { display: flex; flex-direction: column; align-items: flex-start; } .h_container_new { margin-top: 3rem; margin-bottom: 0.6rem; } .h_container_title { display: flex; justify-content: space-between; width: 100%; align-items: baseline; margin-top: 3rem; } .h_container_brand { width: 90%; display: flex; justify-content: space-between; margin: 2rem auto 1rem auto; margin-bottom: 4rem; } .h_container_product { display: flex; gap: 0.8rem; margin-top: 1rem; } .h-swatch-brand { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 56px; /* 9 */ width: 4.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 56px; /* 9 */ height: 4.5rem; /* 9 */ border-radius: 8px; background-color: white; transition: all 0.2s ease-in-out; } .h-swatch-brand::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 56px; /* 9 */ font-size: 3.5rem; /* 9 */ } .h-swatch-brand:hover { color: #fff; background-color: #019DF4; } .h_container_news { display: flex; gap: 1rem; } .h_fit_image { width: 100%; height: 300px; object-fit: cover; } .h_size_btn_mobile { width: 200px; } .h_show_box { display: none; } .h-card-grid { width: 100%; display: flex; gap: 1rem; } .h-card-grid { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ list-style: none; } /* Estilos para el contenedor de los bullets específico */ .mi-swiper .swiper-pagination { position: inherit; bottom: -6px; left: 50%; transform: translateX(-50%); } /* Estilos para los bullets individuales específicos */ .mi-swiper .swiper-pagination-bullet { width: 10px; height: 10px; background-color: #C4C4C4; opacity: 0.5; border-radius: 50%; margin: 0 5px; cursor: pointer; } /* Estilos para el bullet activo específico */ .mi-swiper .swiper-pagination-bullet-active { background-color: #019DF4; opacity: 1; } .h-modal { position: absolute; z-index: 10000; /* 1 */ top: 0; left: 0; visibility: hidden; width: 100%; height: 100%; } .h-modal.is-visible { visibility: visible; } .h-modal-overlay { position: fixed; z-index: 10; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); visibility: hidden; opacity: 0; transition: visibility 0s linear 0.3s, opacity 0.3s; } .h-modal.is-visible .h-modal-overlay { opacity: 1; visibility: visible; transition-delay: 0s; } .h-modal-wrapper { position: absolute; z-index: 9999; top: 6em; left: 40%; width: 44em; margin-left: -16em; background-color: #fff; box-shadow: 0 0 1.5em rgba(0, 0, 0, 0.35); padding: 1.5rem; border-radius: 14px; } .h-modal-transition { transition: all 0.3s 0.12s; transform: translateY(-10%); opacity: 0; } .h-modal.is-visible .h-modal-transition { transform: translateY(0); opacity: 1; } .h-modal-header, .h-modal-content { padding: 1em; border-radius: 0px; border-bottom: 1px solid #e8e8e8; } .h-modal-footer { padding: 1em; border-radius: 0px; } .h-box-organize-footer { display: flex; gap: 1rem; } .h-box-header-footer { display: flex; gap: 0.5rem; flex: 1; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .h-modal-header { position: relative; background-color: #fff; border-bottom: 1px solid #e8e8e8; } .h-modal-close { position: absolute; top: 0; right: 0; padding: 1em; color: #aaa; background: none; border: 0; } .h-modal-close:hover { color: #777; } .h-modal-heading { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ margin: 0; margin-bottom: 1rem; font-weight: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .h-box-header { display: flex; gap: 0.5rem; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .h-vertical-line { border-left: 1px solid #e8e8e8; } .h-box-organize { display: flex; justify-content: space-between; margin-left: 2rem; margin-right: 2rem; } .h-modal-content > *:first-child { margin-top: 0; } .h-modal-content > *:last-child { margin-bottom: 0; } .h-break-wrap .pagebuilder-column-line { gap: 1rem !important; } .new-styles-home .product-items { width: 100%; display: flex; gap: 0rem; list-style: none; } .new-styles-home .product-item { border-radius: 4px; border-radius: 0.25rem; transition: all 0.2s ease-in; flex: 1; } .new-styles-home .product-item-info { 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-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 10px; /* 9 */ border-radius: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 324px; /* 9 */ max-width: 20.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 5px 8px; /* 9 */ padding: 0.3125rem 0.5rem; /* 9 */ margin: 0 auto; border: 1px solid transparent; color: #313235; background-color: #fff; transition: all 0.2s ease-in-out; } .new-styles-home .product-item-info:hover, .carousel-product-home .product-item-info:hover { border-color: #B6B7B7; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); } .new-styles-home .product-image-container .product-image-photo { width: 100%; max-width: 252px; max-width: 10.75rem; height: auto; border-radius: 8px; margin: 0 auto; } .new-styles-home .swatch-attribute .color, .carousel-product-home .swatch-attribute .color { display: none; } .new-styles-home .actions-secondary, .carousel-product-home .actions-secondary { display: none; } .new-styles-home .product-item-link { font-weight: 300; display: block; display: -webkit-box; max-height: 64.8px; max-height: 4.05rem; overflow: hidden; line-height: 1.2; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; font-size: 18px; font-size: 1.125rem; } .new-styles-home .price { font-size: 1.8rem; font-weight: 700; line-height: 1.2; display: block; } .new-styles-home .old-price .price-container .price-wrapper .price { text-decoration: line-through; color: #FF374A; font-size: 20px; font-size: 1.25rem; } .carousel-product-home .product-item-inner, .new-styles-home .product-item-inner { display: none !important; } .carousel-product-home .price-label, .new-styles-home .price-label { display: none !important; } .carousel-product-home .widget-product-grid { width: 100%; max-width: 1122px; margin: 0 auto; } .carousel-product-home .widget-product-grid .slick-slide { text-align: center; } .carousel-product-home .product-items { list-style: none; } .carousel-product-home .product-item-details { text-align: left; } .carousel-product-home .product-image-container .product-image-photo { height: auto; border-radius: 8px; } @media (min-width: 769px) { .carousel-product-home .cat-card__link { padding: 0.75rem 1rem !important; } } /*------------------------------------*\ Media querys Tablet \*------------------------------------*/ @media only screen and (max-width: 769px) { .h_container_brand { flex-wrap: wrap; justify-content: flex-start; gap: 1rem; } .h-card-grid { 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; row-gap: 16px; row-gap: 1rem; column-gap: 30px; column-gap: 1.875rem; width: 100%; } .new-styles-home .product-items { flex-wrap: wrap !important; gap: 2rem !important; } .new-styles-home .product-item { 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; row-gap: 16px; row-gap: 1rem; column-gap: 30px; column-gap: 1.875rem; width: 100%; } .new-styles-home .product-item-link { font-size: 13px; margin-bottom: 8px; } .new-styles-home .price { font-size: 18px; } .new-styles-home .product-item-details { width: 100%; margin: 0 5px; } .new-styles-home .cat-card__link { max-width: 15.25rem !important; margin-right: 5px; border-radius: 8px !important; height: 300px; max-height: 320px; } .new-styles-home .c-card-detail__btn-equipos { height: 40px; } .h_menu_title_size { font-size: 0.7rem; } .h-modal-wrapper { left: 38%; } .h-break-wrap .pagebuilder-column-line:nth-child(2) { flex-wrap: wrap !important; gap: 1rem !important; justify-content: center !important; } } /*------------------------------------*\ Media querys mobile \*------------------------------------*/ @media only screen and (max-width: 500px) { .h-break-wrap .pagebuilder-column-line:nth-child(1) { flex-wrap: wrap; gap: 1rem; text-align: center; } .h-break-wrap-ofertas .pagebuilder-column-line:nth-child(1) { flex-wrap: wrap; gap: 1rem; text-align: center; } .h_container_menu { display: flex; align-items: center; padding: 0.2rem; width: 170px; } .h_container_news { flex-direction: column; gap: 2rem; } .h_space_recomendation { text-align: center; margin-bottom: 2rem; margin-top: 1rem; } .h_swiper-slide-mobile { display: flex; gap: 1rem; justify-content: flex-start; } .h_size_ratio { flex: 1; } .h_hide_box { display: none; } .h-swatch-brand { width: 6.5rem; height: 6.5rem; } .h_show_box { display: block; } .h_container_title { margin-bottom: 1.5rem; flex-direction: column; align-items: center; } .h_wide_mobile { width: 100%; } .h_wide_mobile .h_size_btn_mobile { width: 100% !important; margin-top: 1rem !important; } .h_font_mobile { font-size: 16px; } .h_activate_flex { display: flex; overflow: scroll; padding-right: 1rem; padding-left: 1rem; } .h-modal-wrapper { left: 77%; width: 20em; } .h-box-organize { margin-left: 0; margin-right: 0; flex-direction: column; gap: 1rem; } .h-box-organize-footer { flex-direction: column; } .new-styles-home .pagebuilder-column-line { flex-wrap: wrap; gap: 1rem; text-align: center; } } .cms-home .h-title-page { margin: 15px 0; line-height: 35px; font-weight: 400; } .cms-home .h-title-page span { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ color: #313235; } @media screen and (max-width: 768px) { .cms-home .h-title-page span { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } } @media screen and (max-width: 768px) { .cms-home .h-title-page { margin: 15px 0; } } .cms-home .h-subtitle-page { margin: 12px 0; line-height: 24px; font-weight: 400; } .cms-home .h-subtitle-page span { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ color: #6B6C6F; } @media screen and (max-width: 768px) { .cms-home .h-subtitle-page span { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } } @media screen and (max-width: 768px) { .cms-home .h-subtitle-page { margin: 16px 0; } } @media screen and (max-width: 768px) { .cms-home .h-mobile-none { display: none !important; } .cms-home .h-web-none { display: block !important; } } @media screen and (min-width: 769px) { .cms-home .h-web-none { display: none !important; } .cms-home .h-mobile-none { display: block !important; } } .cms-home .image-container { margin: 0 2%; } .cms-home .image-container img { max-height: 470px !important; height: auto !important; object-fit: cover; } .cms-home .image-container:nth-child(1) { width: 40% !important; } .cms-home .image-container:nth-child(2), .cms-home .image-container:nth-child(3) { width: 25% !important; } .cms-home .c-main-menu__search { display: none !important; } .tarjetas-metodopago { display: flex; flex-direction: column; } .titulo-metodo-pago { margin-bottom: 0.7rem; } .tarjeta-metodopago { margin: 8px; } .tarjeta-parrafo { display: flex !important; flex-direction: row !important; } .tarjeta-parrafo .i-chevron-right { color: #019DF4 !important; } .titulo-metodo-pago-modal { padding-bottom: 0.5rem; margin-left: 1rem; } .mp-modal-content { padding: 1em; border-radius: 0px; border-bottom: 1px solid #e8e8e8; border-top: 1px solid #e8e8e8; text-align: left; } .mp-modal-content p { font-size: 16px; line-height: 20px; text-align: left; } .mp-modal-content-modal { padding: 5px; padding-top: 0px; border-radius: 0px; text-align: left; border-bottom: 1px solid #e8e8e8; border-top: 1px solid #e8e8e8; } .mp-modal-content-modal p { font-size: 16px; line-height: 20px; text-align: left; } .mp-modal-content-modal .pagebuilder-column-line:nth-child(n+2) { flex-wrap: nowrap !important; gap: 6px !important; margin-top: 10px; } .paymentMethod { width: 80% !important; cursor: pointer; } .paymentMethod .pagebuilder-button-link { color: #019DF4 !important; text-decoration-line: underline !important; /* Elimina el subrayado, ya que agregaremos la flecha */ position: relative; /* Hace que el elemento sea un contenedor relativo para el posicionamiento del pseudo-elemento */ } .border-right { border-right: 1px solid #D3D4D3; } .card-detail-device { margin-bottom: 10px; display: flex; flex-direction: row; } .card-detail-device_text { color: #50535A; font-weight: 700; font-size: 14px; line-height: 20px; } .text-alert { color: #50535A; font-size: 12px; font-weight: 400; } .i-alert { width: 24px; height: 24px; } /*start c2c*/ .c-card-container-btn-buy { display: flex; justify-content: left; gap: 5px; margin-bottom: 20px; } .c-card-container-btn-c2c { display: flex; gap: 10px; align-items: baseline; flex-direction: row; flex-wrap: wrap; } .container-click-to-call-btn { display: flex; gap: 10px; align-items: center; } @media only screen and (max-width: 768px) { .container-click-to-call-btn { align-items: center; flex-direction: column; width: 100%; } } .c-card-container-text-c2c { text-align: justify; color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } .c-card-container-text-c2c span i { color: #019DF4; } .c-btn-secondary-circle { padding: 15px; text-align: center; text-decoration: none; line-height: 1; border-radius: 50px; color: #fff; transition: all 0.4s ease-in; border: 2px solid #019DF4; height: fit-content; } .c-btn-secondary-circle img { font-size: 1.7rem; color: #019DF4; } .o-btn_secondary-full { color: #019DF4; background-color: transparent; border: 1px solid #019DF4; transition: all 0.4s ease-in; font-weight: 700; border-radius: 60px; padding: 13px 24px; width: 80%; } .o-btn_secondary-full:not([disabled]):hover, .o-btn_secondary-full:not([disabled]):focus, .o-btn_secondary-full:not([disabled]):active { color: #fff; background-color: #019DF4; } .o-btn_secondary-full:disabled { color: #80CEF9; border: 1px solid #80CEF9; } .c-form__error-text.is-error { display: block; } /*end c2c*/ .modal-calculate-time .o-modal__content { padding: 0px; } .modal-calculate-time .o-modal { padding: 12px; } .logo-movistar-modal-calcular-tiempo { width: 45%; margin-bottom: 15px; } /* TABS CARACTERISTICAS */ .single-tab .c-tabs-content__actions { display: block; } .single-tab #tab_element_content { margin-top: 0; } #tab_element.single-tab .c-tabs-content__action { max-width: 100%; } /* Suggestion products */ .card-product_suggestion { width: 255px !important; } .c-card__content_product_suggestion { width: 90%; margin: 0px auto; } .c-card__photo_product_suggestion { display: flex; justify-content: center; align-items: center; } .c-card-detail__price .stock-container { height: 32px; display: flex; align-items: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ background-color: #EEEEEE; } .c-card-detail__price .stock-container__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ color: #50535A; } .c-card-detail__price .stock-container__text .stockUnidades { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ font-weight: 700; } .c-card-detail__price .stock-container__text .text-green { color: #5CB615; } .c-card-detail__price .stock-container__text .text-red { color: #FF374A; } .c-card-detail__price .stock-container__text .text-orange { color: #EC624B; } .c-card-detail__price .stock-container__text.no-stock { color: #86888C; } .c-card-detail__price .stock-container #stock-no-available { color: #313235; } .stock-container { color: #066FCB; font-size: 14px; font-weight: bold; } .stock-container .stockUnidades { font-weight: bolder; } .c-card-detail-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ font-weight: 700; color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .brand-size_terminales { font-size: 14px; } #h1-marca { font-size: 22px; font-family: "Telefonica"; } #maincontent .breadcrumbs .items .item .i-arrow-left:before { font-size: 12px; } .content-dropup { margin-top: 30px; margin-bottom: 20px; } .c-card-information__item { 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; } .c-card-information { max-height: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ opacity: 0; visibility: hidden; transition: all 0.2s ease-in-out; background: #fff; } .c-card-information.is-summary-show { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 12px; /* 9 */ padding: 0 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 3000px; /* 9 */ max-height: 187.5rem; /* 9 */ opacity: 1; visibility: visible; overflow-y: auto; } .c-card-information__btn { 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; -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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px 16px; /* 9 */ padding: 0.5rem 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ font-weight: 400; color: #50535A; background: #fff; column-gap: 10px; border: 1px solid #D3D4D3; } .c-card-information__btn::before { color: #019DF4; transition: all 0.2s ease-in-out; } .c-card-information__btn.is-summary-show { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ background-color: #019DF4; color: #fff; } .c-card-information__btn.is-summary-show::before { transform: rotate(180deg); color: #fff; } #tabsCelulares { width: 105% !important; } @media only screen and (max-width: 767px) { #tabsCelulares { width: 100% !important; } .c-card-detail__price { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } .c-card-detail__price .stock-container { /* 3 */ /* 3 */ /* 5 */ /* 5 */ margin: 0; /* 8 */ } .c-card-detail-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } #section-info-product h3.o-headline { font-size: 26px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ font-weight: 300; } #section-info-product .c-especifications { /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 12px 30px 12px; /* 9 */ padding: 0 0.75rem 1.875rem 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } #section-info-product .c-especifications__wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 5px; /* 9 */ padding-bottom: 0.3125rem; /* 9 */ } #section-info-product .c-especification__item { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 12px; /* 9 */ margin-bottom: 0.75rem; /* 9 */ } #section-info-product .o-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } } /*--- modal-disponibilidadEquipo ---*/ #modal-disponibilidadEquipo { padding: 0 1rem; } #modal-disponibilidadEquipo .o-modal__content { margin-top: 0; } #modal-disponibilidadEquipo .o-modal__content img.pagebuilder-mobile-hidden { max-width: 60%; width: 60%; } #modal-disponibilidadEquipo .o-modal__content .c-form__box { max-width: 80%; margin: 0 auto 1.2rem; } #modal-disponibilidadEquipo .o-modal__content .c-form__field { padding: 10px 10px 5px 10px; } #modal-disponibilidadEquipo .o-modal__content .c-form__field select { max-width: 100%; font-size: 16px; } #modal-disponibilidadEquipo .o-modal__content .c-form__input:valid { top: 0.2rem; } #modal-disponibilidadEquipo .o-modal__content .c-form__input:valid + .c-form__label { top: -1.5rem; left: -6px; } #modal-disponibilidadEquipo .o-modal__content .c-form__actions { margin-top: 0; } #modal-disponibilidadEquipo .o-modal__content button#ver-cobertura { margin: auto; } #modal-disponibilidadEquipo .o-modal__content .msjCE { font-size: 14px; line-height: 24px; color: #313235; text-align: left; padding: 3px 10px; max-width: 80%; margin: 0 auto 16px; border-radius: 4px; } #modal-disponibilidadEquipo .o-modal__content .centroExperiencia-error { background-color: #F8CCCC; border: 1px solid #FF374A; } #modal-disponibilidadEquipo .o-modal__content .centroExperiencia-success { background-color: #E1EFFF; border: 1px solid #019DF4; } #modal-disponibilidadEquipo .o-modal__content .c-form__icon::before { color: #86888C; font-size: 0.6rem; padding-right: 1rem; } @media only screen and (max-width: 600px) { .tarjeta-metodopago { width: calc(100% - 20px); /* Cambiar el ancho al 100% para que se muestre en una columna */ } .titulo-metodo-pago { text-align: left !important; } .tarjetas-metodopago .pagebuilder-column-line { flex-wrap: wrap !important; text-align: center; } .mp-modal-content-modal { padding: 1em; border-radius: 0px; border-bottom: 1px solid #e8e8e8; border-top: 1px solid #e8e8e8; text-align: left; } .mp-modal-content-modal p { font-size: 16px; line-height: 20px; text-align: left; } .mp-modal-content-modal .pagebuilder-column-line:nth-child(n+2) { display: flex !important; flex-direction: row; flex-wrap: wrap !important; gap: 2px !important; } .mp-modal-content-modal .pagebuilder-column-line:nth-child(n+2) .pagebuilder-column { max-width: 45% !important; flex-basis: 100% !important; } } .c-banner-intro_device { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ width: 100%; position: relative; margin: auto; } .c-banner-intro_device__picture { width: 100%; height: 100%; } .c-banner-intro-desk__img, .c-banner-intro-mobile__img { width: 100%; height: 100%; } .c-banner-intro-mobile__img { display: none; } .o-swiper-chevron_device { background-color: #fff; width: 2.8%; height: 18%; border-radius: 50%; font-weight: bold; transition: all 0.2s ease-in; } .o-swiper-chevron_device::after { color: #019DF4; } .o-swiper-chevron_device.swiper-button-disabled { opacity: 0; } .cat-banner.swiper-button-prev, .cat-banner.swiper-button-next { top: 40%; } .c-banner-btn { position: absolute; padding: 0.8em 1em; top: 75%; left: 80%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .cat-banner.swiper-button-next, .cat-banner.swiper-button-prev { z-index: 8; } @media screen and (min-width: 1023px) { .c-banner0-intro_device__picture { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 300px; /* 9 */ max-width: 18.75rem; /* 9 */ } } @media only screen and (max-width: 767px) { .cat-banner.swiper-button-prev, .cat-banner.swiper-button-next { top: 45%; } .c-banner-intro_device__picture { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ height: auto; } .c-banner-intro-mobile__img { display: block; } .c-banner-intro-desk__img { display: none; } .o-swiper-chevron_device { width: 8%; height: 10%; } .c-banner-btn { top: 90%; left: 75%; } } @media screen and (min-width: 768px) { .c-banner-intro_device__picture { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } } @media screen and (max-width: 460px) { .c-banner-intro__btn { min-width: max-content; } } .tyc { width: 74%; margin: 0px auto; } @media (max-width: 768px) { .tyc { width: 90%; margin: 0px auto; } } .sidebar.sidebar-main.terms { color: #0B2739; background: #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ color: #50535A; position: static; transition: all 0.2s ease-in-out; } .c-filter__list-content-terms { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ text-align: justify; } .c-filter__list-term { border-top: 0px solid #fff; padding: 1px 0; } .c-filter__options-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0px; /* 9 */ padding: 0rem; /* 9 */ } .page-layout-2columns-left #maincontent .sidebar.sidebar-main.terms.sidebar.sidebar-main.terms { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 5px; /* 9 */ border-radius: 0.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ width: 100%; height: max-content; } .c-filter__list-term:first-of-type { padding-top: 0; border-top-color: transparent; } .c-filter__list-term:last-of-type { padding-bottom: 0; } @media only screen and (min-width: 1024px) { .o-layout__aside { 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-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 24px; /* 9 */ column-gap: 1.5rem; /* 9 */ } .o-layout__aside .banner { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -moz-box-flex: 1; -moz-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; } .o-layout__aside .sidebar.sidebar-main.terms { -webkit-box-flex: 1; -webkit-flex: 1 1 20%; -moz-box-flex: 1; -moz-flex: 1 1 20%; -ms-flex: 1 1 20%; flex: 1 1 20%; } .o-layout__aside .column.main { -webkit-box-flex: 1; -webkit-flex: 1 1 70%; -moz-box-flex: 1; -moz-flex: 1 1 70%; -ms-flex: 1 1 70%; flex: 1 1 70%; } .o-layout__aside .information { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -moz-box-flex: 1; -moz-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; order: 4; } .o-layout__aside .tyc { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -moz-box-flex: 1; -moz-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; order: 5; } } @media only screen and (max-width: 1023px) { .sidebar.sidebar-main.terms { height: auto; } .c-filter__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 5px; /* 9 */ padding: 0.3125rem; /* 9 */ } } @media only screen and (max-width: 767px) { .page-layout-2columns-left #maincontent .sidebar.sidebar-main.terms.sidebar.sidebar-main.terms { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ } .sidebar.sidebar-main.terms { padding: 0; } .c-filter.mobil-filter { margin: 18px auto; } } /*Sticky - CTA*/ .container-stickyBar { background: white; margin-left: -5px; box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25); position: fixed; width: 100%; display: none; z-index: 100; bottom: 0px; } .currentTagStickyTextDesc { color: #fff !important; background-color: #E01F6E !important; } .stickyTag-card__tagValue { display: inline-block; margin: 4px 0 4px 0; border-radius: 2px; border-radius: 0.125rem; padding: 0 5px; padding: 0 0.3125rem; font-weight: 700; font-size: 14px; font-size: 0.875rem; color: #712b71; background-color: #f6ecf6; } .container-stickyBar .row { display: grid; grid-template-columns: 1fr 2fr repeat(2, 1fr); grid-template-rows: 1fr; align-items: center; justify-items: center; padding: 10px 0; } @media only screen and (max-width: 768px) { .container-stickyBar .row { margin-top: 12px; padding: 0px; } } .container-stickyBar .containerImgCap { display: flex; } @media only screen and (max-width: 768px) { .container-stickyBar .containerImgCap { margin-left: 0px; } } .container-stickyBar .containerCap { padding: 0px 15px 0px; margin-top: 12px; } @media only screen and (max-width: 768px) { .container-stickyBar .containerCap { padding: 0px; } } .container-etiquetas { display: block; width: 100%; margin-bottom: 10px; } @media only screen and (max-width: 768px) { .container-medios-pago { display: none !important; } } .sticky-card__tagValue { display: inline-block; margin: 4px 0 4px 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 2px; /* 9 */ border-radius: 0.125rem; /* 9 */ /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0 5px; /* 9 */ padding: 0 0.3125rem; /* 9 */ font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #fff; background-color: #F28D15; } .container-stickyBar .productName-sticky { font-weight: 700; font-size: 14px; line-height: 24px; color: #0b2739; margin-bottom: 0px !important; } @media only screen and (max-width: 768px) { .container-stickyBar .productName-sticky { display: none; } } .container-stickyBar .image-phone-sticky { width: 100%; } @media only screen and (max-width: 768px) { .container-stickyBar .image-phone-sticky { width: 100%; } } .container-stickyBar .info-Ability-sticky { width: auto; color: #019df4; pointer-events: none; border: 1px solid #019df4; border-radius: 50px; padding: 0.1rem 0.75rem; transition: all 0.2s ease-in-out; font-weight: 600; text-align: center; } @media only screen and (max-width: 768px) { .container-stickyBar .info-Ability-sticky { display: none; } } @media only screen and (max-width: 768px) { .container-stickyBar .text-Ability-sticky { display: none; } } .container-stickyBar .textCapacity-sticky { font-style: normal; font-weight: 400; font-size: 16px; line-height: 24px; } @media only screen and (max-width: 768px) { .container-stickyBar .textCapacity-sticky { display: none; } } .container-stickyBar .regularPrice-sticky { font-style: normal; font-weight: 400; font-size: 28px; line-height: 32px; color: #313235; } @media only screen and (max-width: 768px) { .container-stickyBar .regularPrice-sticky { font-size: 20px !important; } } .container-stickyBar .previusPrice-sticky { color: grey; font-weight: 400; font-size: 16px; line-height: 16px; text-decoration: line-through; } @media only screen and (max-width: 768px) { .container-stickyBar .previusPrice-sticky { font-size: 12px !important; } } .container-stickyBar .btn-buy-now-general { width: 225px; height: 45px; background-color: #008edd; border-radius: 60px; color: white; font-size: 15px; } @media only screen and (max-width: 768px) { .container-stickyBar .btn-buy-now-general { margin-top: 0px; width: 120px; min-width: 0px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 5px; /* 9 */ margin-left: 0.3125rem; /* 9 */ } } .sticky-card-container-btn-buy { display: flex; justify-content: center; } .selected-sticky { outline: 1.4px solid #019df4; } .row-box-sticky { display: flex; gap: 0.2rem; pointer-events: none; } @media only screen and (max-width: 500px) { .mobile_remove_sticky { display: none; } .container-stickyBar .btn-buy-now-general { margin-top: 0px; width: 120px; min-width: 0px; height: 36px; margin-left: 0px; font-size: 12px !important; } .container-stickyBar .row { text-align: center; } } #stickyBar { padding: 10px; } #stickyBar .container-etiquetas { width: 100%; } #stickyBar .previusPrice-sticky { font-size: 16px !important; } #stickyBar .containerImg { max-width: 70px; } #stickyBar .containerCap { display: flex; } #stickyBar .containerCap .col { margin: 0 10px; } #stickyBar .containerCap .col .text-Ability-sticky { margin-bottom: 6px; font-weight: 600; } #stickyBar .o-btn:disabled { background-color: #80cef9 !important; } #stickyBar .sticky-none { display: none !important; } #stickyBar .c-imagepayments { min-width: 250px; } @media screen and (max-width: 739px) { #stickyBar button#button-buy-now-sticky { padding: 5px; font-size: 14px; } #stickyBar .containerImg { width: 50px; } #stickyBar .containerCap { visibility: hidden; display: none; } #stickyBar .c-imagepayments { min-width: 130px; } } /*Sticky checkout TL*/ .stickyBarCheckoutTL { display: block; } #stickyBarCheckoutTL .flex { display: grid; grid-template-columns: 1fr 2fr 3fr 2fr 2fr; grid-template-rows: 1fr; grid-column-gap: 0px; grid-row-gap: 0px; justify-content: space-between; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .flex { display: none; } } #stickyBarCheckoutTL .col1 { display: flex; align-items: center; } #stickyBarCheckoutTL .col2 { grid-column: 2/span 1; } #stickyBarCheckoutTL .col3 { display: flex; justify-content: center; align-items: center; } #stickyBarCheckoutTL .size-i-truck { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .size-i-truck { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } } #stickyBarCheckoutTL .container-delivery { margin-left: 10px; line-height: 15px; } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .container-delivery { line-height: 8px; } } #stickyBarCheckoutTL .container-mobile { display: none; } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .container-mobile { display: grid; grid-template-columns: repeat(2, 1fr); width: 90%; margin: 0px auto; justify-items: stretch; align-items: center; } } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .col-2-mobile { display: flex; align-items: center; } } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .special-price { font-size: 24px; font-weight: bold; color: #313235; } } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .original-price { color: grey; text-decoration: line-through; font-size: 10px; font-weight: 400; margin-left: 5px; } } @media only screen and (max-width: 768px) { #stickyBarCheckoutTL .discount-percent { background: #E01F6E; color: white; font-size: 7.19px; font-weight: 400; border-radius: 1.2px; width: 22px; height: 11px; text-align: center; } } .c-card-checkout-cta.term { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: nowrap; -moz-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; -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: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; -moz-align-items: baseline; align-items: baseline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 16px; /* 9 */ row-gap: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } .c-card-checkout-cta__items:nth-child(1) { -webkit-align-self: center; -moz-align-self: center; -ms-flex-item-align: center; align-self: center; } .c-card-checkout-cta__btn.term { background-color: #019DF4; color: #fff; } .c-card-checkout-cta__btn.term::before { color: #fff; transition: all 0.2s ease-in-out; } .c-form__title.term { text-align: left; } .c-form__header.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .check-border-bottom { border-top: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } .check-border-bottom-2 { border-top: 2px solid #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 6px; /* 9 */ padding-bottom: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 26px; /* 9 */ margin-top: 1.625rem; /* 9 */ } .c-card-summary__total.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .check-subtitles { font-size: 17px; font-weight: 300; color: #313235; } .check-form-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ font-weight: 300; color: #313235; line-height: 1.1; } .chk-select-delivery { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 32px; /* 9 */ column-gap: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 10px; /* 9 */ row-gap: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } @media only screen and (max-width: 768px) { .chk-select-delivery { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } .chk-opt-delivery { width: 339px; } .text-transform-lower { text-transform: lowercase; } .check-text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .check-text-20 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .color-primary-gray { color: #86888C; } .c-form__input.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .c-form__input_outline.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 15px; /* 9 */ padding-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 15px; /* 9 */ padding-bottom: 0.9375rem; /* 9 */ } .check-container { display: flex; flex-direction: column; -webkit-flex-wrap: nowrap; -moz-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; -webkit-box-pack: normal; -ms-flex-pack: normal; -webkit-justify-content: normal; -moz-justify-content: normal; justify-content: normal; -webkit-box-align: normal; -ms-flex-align: normal; -webkit-align-items: normal; -moz-align-items: normal; align-items: normal; -webkit-align-content: normal; -moz-align-content: normal; -ms-flex-line-pack: normal; align-content: normal; } .check-container-items:nth-child(1) { display: flex; flex: 0 1 auto; -webkit-align-self: auto; -moz-align-self: auto; -ms-flex-item-align: auto; align-self: auto; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; order: 0; } .check-container-items:nth-child(2) { display: block; flex: 0 1 auto; -webkit-align-self: auto; -moz-align-self: auto; -ms-flex-item-align: auto; align-self: auto; order: 0; } .check-container-items:nth-child(3) { display: block; flex: 0 1 auto; -webkit-align-self: auto; -moz-align-self: auto; -ms-flex-item-align: auto; align-self: auto; order: 0; } .check-container-email { display: flex; -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; } .check-container-items-email:nth-child(2) { order: 3; } .check-container-items-email:nth-child(3) { flex: 0 0 50%; } .check-o-link { position: relative; padding: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12.8px; /* 9 */ font-size: 0.8rem; /* 9 */ text-decoration: underline; text-underline-position: under; line-height: 1; color: #019DF4; } .c-form__label-icon.term { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ } .c-form__label-icon.term::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .c-form__label-icon.term::after { content: ""; display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 0px; /* 9 */ height: 0rem; /* 9 */ } .is-field-check .c-form__label-icon.term { color: #019DF4; } .is-field-check .c-form__label-icon.term::before { color: #019DF4; } .is-error .c-form__label-icon.term { color: #FF374A; } .c-form__field.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 13px; /* 9 */ padding-top: 0.8125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 13px; /* 9 */ padding-bottom: 0.8125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ } .c-form__field-white.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 11.2px; /* 9 */ padding-top: 0.7rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 11.2px; /* 9 */ padding-bottom: 0.7rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ } .c-form__field-canvas.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 11.2px; /* 9 */ margin-bottom: 0.7rem; /* 9 */ } .u-border-right { border-right: 1px solid #D3D4D3; } .justify-content-center { justify-content: center; } .text-orange { color: #EC624B; } .chk-size-calendar { width: 100%; } .o-headline.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .c-form__code-number { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 60px; /* 9 */ width: 3.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 65px; /* 9 */ height: 4.0625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ } .o-modal__footer_flex { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 8px; /* 9 */ row-gap: 0.5rem; /* 9 */ } .c-form__box .term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .o-modal__footer { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .c-form__radio.check-list { background-color: #EEEEEE; color: #0B2739; font-weight: 700; } .c-form__wrap-field.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ row-gap: 0px; /* 9 */ row-gap: 0rem; /* 9 */ } .modal-popup._show .modal-inner-wrap { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 25px; /* 9 */ margin-top: 1.5625rem; /* 9 */ } .o-modal__text-box.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 210px; /* 9 */ max-height: 13.125rem; /* 9 */ overflow-x: hidden; } .text-2 { color: #0B2739; font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .text-shippin-details { color: #313235; } @media only screen and (max-width: 768px) { .chk-opt-delivery { width: auto; } .c-form__radio_card.term { flex-direction: column; row-gap: 10px; padding: 13px 24px; } .c-form__radio_card.term .c-form__radio-input { width: 100%; height: 100%; } .c-form__radio_card.term .c-form__radio-box::before { top: 16px; margin-left: 24px; } .c-form__radio_card.term .c-form__radio-box::after { top: 21px; margin-left: 29px; } .c-form__radio_card.term .c-form__radio-label { column-gap: 0; } .c-form__radio_card.term .c-form__radio-label .u-text-left { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 32px; /* 9 */ margin-left: 2rem; /* 9 */ } .c-form__radio_card.term .c-form__radio-label::before { position: absolute; top: 17px; margin-left: 32px; font-size: 20px; } .u-border-right { border-right: 0px solid; } .c-form__wrap-field.term-email { display: flex; } .c-form__wrap-field_mobile { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 17px; /* 9 */ font-size: 1.0625rem; /* 9 */ flex-direction: inherit; column-gap: 0.6rem; } .check-container-items-email:nth-child(2) { order: 2; } .check-container-items-email:nth-child(3) { order: 3; flex: 0 0 100%; } } @media only screen and (min-width: 768px) { .c-form__title.term { text-align: center; } .c-card-summary.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ } .c-form__radio_card.term { column-gap: 30px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ } .c-form__radio_card.term .c-form__radio-label { column-gap: 0; } .c-form__radio_card.term .c-form__radio-label::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ } .check-form-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ } .chk-size-calendar { width: 50%; } } @media only screen and (min-width: 1024px) { .c-card-checkout-cta.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } } @media only screen and (min-width: 375px) { .c-card-checkout-cta__btn.term { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 345px; /* 9 */ min-width: 21.5625rem; /* 9 */ } } .c-form__field-gray { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 11px; /* 9 */ padding-top: 0.6875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 11px; /* 9 */ padding-bottom: 0.6875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 24px; /* 9 */ padding-right: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 4px; /* 9 */ border-radius: 0.25rem; /* 9 */ background-color: #EEEEEE; } .c-form__field-gray .c-form__wrap-field p#icon-wrap-field { font-size: 25px; color: #EC624B; } .c-form__field-gray .c-form__wrap-field p#text-information { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A; } .shippingMethods { background-color: #fff; padding: 0 15px 10px 15px; border-radius: 4px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } .shippingMethods .c-form__fieldset .shippingMethods-header { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; align-items: center; justify-content: space-between; margin: 10px 0; } .shippingMethods .c-form__fieldset .shippingMethods-icon { display: flex; justify-content: flex-start; align-items: center; } .shippingMethods .c-form__fieldset .shippingMethods-icon label { font-size: 14px; } @media (min-width: 769px) { .shippingMethods .c-form__fieldset .shippingMethods-icon label { font-size: 18px; } } .shippingMethods .c-form__fieldset .shippingMethods-icon span#i-credit-card-stroke { font-size: 25px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ } @media (max-width: 768px) { .shippingMethods .c-form__fieldset .shippingMethods-icon span#i-credit-card-stroke { display: none; } } .shippingMethods .c-form__fieldset .shippingMethods-icon img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ } @media (max-width: 768px) { .shippingMethods .c-form__fieldset .shippingMethods-icon img { display: none; } } .info-dues { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 16px; } .box-info-dues { display: flex; flex-direction: column; width: 30%; margin-bottom: 20px; font-size: 16px; } @media (max-width: 768px) { .info-dues { flex-wrap: wrap; justify-content: center; } .box-info-dues { width: 47%; font-size: 14px; margin-bottom: 15px; } .box-info-dues:nth-child(1) { text-align: left; } .box-info-dues:nth-child(2) { text-align: left; } .box-info-dues:nth-child(3) { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-gap: 5px; width: 95%; } .box-info-dues:nth-child(3) :nth-child(1) { place-self: start; } .box-info-dues:nth-child(3) :nth-child(2) { grid-row: 1/3; grid-column: 2/3; place-self: start; } .box-info-dues:nth-child(3) :nth-child(3) { place-self: start; } } .containerBtn { display: flex; flex-wrap: wrap; justify-content: space-around; } .box-btn { width: 23%; margin-bottom: 10px; } @media (max-width: 768px) { .containerBtn { flex-wrap: wrap; justify-content: left; } .box-btn { width: 33%; } .box-btn .o-btn { font-size: 13px; padding: 13px 17px; } } .subtitles-shipping { font-size: 24px; color: #313235; font-weight: 400; } @media (min-width: 769px) { .checkout-cuestionario-index .c-steps { width: 30%; } } .checkout-cuestionario-index .c-form__field-white { box-shadow: 0px 11px 24px 0px #0B273926; } .checkout-cuestionario-index .numbering { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ font-weight: 700; color: #313235; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 40px; /* 9 */ line-height: 2.5rem; /* 9 */ } @media (max-width: 768px) { .checkout-cuestionario-index .numbering { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } } .checkout-cuestionario-index .text-question { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ font-weight: 400; color: #0B2739; } @media (max-width: 768px) { .checkout-cuestionario-index .text-question { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } } @media (max-width: 768px) { .checkout-cuestionario-index h2.u-text-bold.text-shippin-details { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } } .checkout-cuestionario-index .c-form__questions { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 40px; /* 9 */ margin-right: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 40px; /* 9 */ margin-left: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 46px; /* 9 */ margin-top: 2.875rem; /* 9 */ } @media (max-width: 768px) { .checkout-cuestionario-index .c-form__questions { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 5px; /* 9 */ margin-right: 0.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 5px; /* 9 */ margin-left: 0.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 30px; /* 9 */ margin-top: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 15px; /* 9 */ font-size: 0.9375rem; /* 9 */ } } .checkout-cuestionario-index .c-form__questions .c-form__questions_text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ text-align: left; } @media (max-width: 768px) { .checkout-cuestionario-index .c-form__questions .c-form__radio { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ text-align: left; } } .checkout-cuestionario-index .c-form__questions .u-width-100 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 35px; /* 9 */ margin-top: 2.1875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 35px; /* 9 */ margin-bottom: 2.1875rem; /* 9 */ } @media (max-width: 768px) { .checkout-cuestionario-index .c-form__questions .u-width-100 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } } @media (max-width: 768px) { .checkout-cuestionario-index .c-form__questions .u-width-100 .o-btn { /* 3 */ /* 3 */ /* 5 */ /* 5 */ margin-top: 0; /* 8 */ /* 3 */ /* 3 */ /* 5 */ /* 5 */ margin-bottom: 0; /* 8 */ } } .checkout-cuestionario-index .checkout-sumary { display: none; } .checkout-cuestionario-index p#icon-alert-red { color: #FF374A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 35px; /* 9 */ font-size: 2.1875rem; /* 9 */ } .checkout-cuestionario-index h3.o-headline { color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 25px; /* 9 */ font-size: 1.5625rem; /* 9 */ font-weight: 300; } .checkout-cuestionario-index p.c-error-modal__paragraph { color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } .checkout-cuestionario-index small.c-form__checkbox-text { text-align: center; } .checkout-cuestionario-index h3.o-title-ico { color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } @media (max-width: 768px) { .checkout-cuestionario-index h3.o-title-ico { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 25px; /* 9 */ font-size: 1.5625rem; /* 9 */ } } .checkout-cuestionario-index .modals-overlay { pointer-events: none; cursor: none; } .checkout-cuestionario-index .c-form__box.c-phoneC2C { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } .checkout-cuestionario-index .c-form__field { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 15px; /* 9 */ padding-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 15px; /* 9 */ padding-bottom: 0.9375rem; /* 9 */ } .checkout-cuestionario-index .c-form__field-canvas.term { align-items: center; } @media (max-width: 768px) { .checkout-contrato-index .c-form__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 5px; /* 9 */ margin-top: 0.3125rem; /* 9 */ } .checkout-contrato-index .alertPrimary { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } } .checkout-contrato-index .c-btn-download { justify-content: left; } .checkout-contrato-index p#i-information { color: #019DF4; } .checkout-contrato-index .section-download { display: flex; column-gap: 30px; align-items: center; } .checkout-contrato-index .section-download .text-div { flex: 1; display: flex; flex-direction: column; text-align: left; row-gap: 10px; } .checkout-contrato-index .section-download .text-div .text-link { flex: 1; } .checkout-contrato-index .section-download .text-div .text-link a.c-btn-download__button { color: #019DF4; } .checkout-contrato-index .section-download .text-div .check-link { flex: 1; } .checkout-contrato-index .section-download .text-div .check-link label { color: #000000; } .checkout-contrato-index .modals-overlay { pointer-events: none; cursor: none; } .checkout-lineas-index p#icon-alert-red { color: #FF374A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 35px; /* 9 */ font-size: 2.1875rem; /* 9 */ } .checkout-lineas-index h3.o-headline { color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 25px; /* 9 */ font-size: 1.5625rem; /* 9 */ font-weight: 300; } .checkout-lineas-index p.c-error-modal__paragraph { color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } .checkout-lineas-index small.c-form__checkbox-text { text-align: center; } .checkout-lineas-index .modals-overlay { pointer-events: none; cursor: none; } .checkout-lineas-index .c-form__field { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 15px; /* 9 */ padding-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 15px; /* 9 */ padding-bottom: 0.9375rem; /* 9 */ } .checkout-lineas-index .c-form__box.c-phoneC2C { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } .checkout-lineas-index .c-form__field-canvas.term { align-items: center; } .u-hiddenSeccion { display: none; opacity: 0; } .checkout-reintento-index div#checkout-summary, .checkout-reintento-index a.c-main-menu__search.i-search.metricas-icono, .checkout-reintento-index .c-tabs__search { display: none !important; } .checkout-lineas-index .returnTocatalog { align-self: center !important; cursor: pointer; } .checkout-lineas-index .title-text-modal-error { font-weight: 300; } .flex-space-between { display: flex; flex-direction: row; justify-content: space-between; } @media only screen and (max-width: 768px) { .flex-space-between { display: flex; flex-direction: column; } } .iconPin { width: 50px; } @media only screen and (max-width: 768px) { .iconPin { width: 40px; } } .iconCalendar { width: 50px; } @media only screen and (max-width: 768px) { .iconCalendar { width: 40px; } } .flex-center { display: flex; justify-content: center; } .alert-authorization { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 10px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .alert-authorization .c-form__wrap-field { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 20px; /* 9 */ column-gap: 1.25rem; /* 9 */ } .alert-authorization .i-information::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ } .alert-authorization p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 20px; /* 9 */ line-height: 1.25rem; /* 9 */ color: #86888C; } .alert-authorization p.text-orange { color: #EC624B; } .alert-authorization p span { font-weight: 700; } @media only screen and (max-width: 768px) { .alert-authorization { display: none; } } .box-white { background-color: white; border-radius: 4px; } .col-1 { width: 60%; } @media only screen and (max-width: 768px) { .col-1 { width: 100%; height: auto; } } .col-2 { margin-left: 30px; width: 40%; } @media only screen and (max-width: 768px) { .col-2 { width: 100%; margin-left: 0px; height: auto; } } .p-10 { padding: 10px; } .p-20 { padding: 20px; } .font-size-18 { font-size: 18px; } .font-size-16 { font-size: 16px; } .general-container_thankyoupage-terminales { margin-bottom: 50px; } .general-container_thankyoupage-terminales .tp-header-steps { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 70px; /* 9 */ margin-bottom: 4.375rem; /* 9 */ display: flex; align-items: center; justify-content: center; } .general-container_thankyoupage-terminales .container_detailsClient { display: flex; flex-direction: row; align-items: center; justify-content: space-between; border-bottom: 1px solid #D3D4D3; padding: 20px 0px 20px 0px; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .container_detailsClient { display: flex; flex-direction: column; align-items: flex-start; } } .general-container_thankyoupage-terminales .container_detailsClient h1 { flex: 2; } .general-container_thankyoupage-terminales .container_detailsClient p { flex: 4; } .general-container_thankyoupage-terminales .mt-20 { margin-top: 20px; } .general-container_thankyoupage-terminales .text-align-center { text-align: center; } .general-container_thankyoupage-terminales .general-title_dataClient { font-weight: 700; font-size: 20px; color: #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } .general-container_thankyoupage-terminales .resumen_compra { margin-top: 20px; } .general-container_thankyoupage-terminales .resumen_compra .title-2 { font-weight: 300; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 38px; /* 9 */ font-size: 2.375rem; /* 9 */ color: #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .resumen_compra .title-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 40px; /* 9 */ line-height: 2.5rem; /* 9 */ } } .general-container_thankyoupage-terminales .titles_dataClient { font-weight: 700; font-size: 18px; color: #50535A; margin-bottom: 0px !important; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .titles_dataClient { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 20px; /* 9 */ line-height: 1.25rem; /* 9 */ } } .general-container_thankyoupage-terminales .data_clients { font-weight: 400; font-size: 18px; color: #50535A; } .general-container_thankyoupage-terminales .btn-download_pdf { margin-top: 16px; display: flex; flex-direction: row; justify-content: center; align-items: center; width: 202px; height: 40px; border: 1px solid #019DF4; border-radius: 60px; color: #019DF4; font-weight: 700; font-size: 16px; line-height: 24px; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .typ-header-block { margin-bottom: 0; } } .general-container_thankyoupage-terminales .typ-header-block h2 { font-weight: 300; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ color: #50535A; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .typ-header-block h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ } } .general-container_thankyoupage-terminales .typ-header-block p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ color: #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 28px; /* 9 */ line-height: 1.75rem; /* 9 */ width: 85%; margin: 1rem auto; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .typ-header-block p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ width: 100%; } } .general-container_thankyoupage-terminales .typ-header-block .btn-rate-experience { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ display: flex; align-items: center; justify-content: center; } .general-container_thankyoupage-terminales .typ-header-block .btn-rate-experience .o-btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 300px; /* 9 */ max-width: 18.75rem; /* 9 */ background-color: #fff; border: 1px solid #019DF4; color: #019DF4; display: flex; align-items: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 12px; /* 9 */ gap: 0.75rem; /* 9 */ } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .typ-header-block .btn-rate-experience .o-btn { max-width: 100%; } } .general-container_thankyoupage-terminales .data-dir-date { display: flex; flex-direction: column; align-items: center; gap: 30px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 20px; /* 9 */ padding-top: 1.25rem; /* 9 */ } .general-container_thankyoupage-terminales .data-dir-date .container-dir-date { display: flex; flex-direction: row; align-items: center; justify-content: space-between; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .data-dir-date .container-dir-date { flex-direction: column; align-items: flex-start; } } .general-container_thankyoupage-terminales .data-dir-date .container-dir-date .info-dir-date { display: flex; flex: 1; align-items: center; justify-content: flex-start; gap: 10px; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .data-dir-date .container-dir-date .info-dir-date { gap: 0; } } .general-container_thankyoupage-terminales .data-dir-date button, .general-container_thankyoupage-terminales .data-dir-date a { padding: 16px 56px 16px 56px; font-family: "Telefonica", sans-serif; } @media only screen and (max-width: 768px) { .general-container_thankyoupage-terminales .c-card-summary { max-height: max-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px 32px 40px 32px; /* 9 */ padding: 1rem 2rem 2.5rem 2rem; /* 9 */ visibility: visible; opacity: 1; } } .thankyoupage-error_container { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 30px; /* 9 */ margin-top: 1.875rem; /* 9 */ } @media only screen and (max-width: 768px) { .thankyoupage-error_container { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 20px; /* 9 */ padding-left: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 20px; /* 9 */ padding-right: 1.25rem; /* 9 */ } } .thankyoupage-error_container .tp-header-steps { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 70px; /* 9 */ margin-bottom: 4.375rem; /* 9 */ display: flex; align-items: center; justify-content: center; } .thankyoupage-error_container h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 36px; /* 9 */ margin-top: 2.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 36px; /* 9 */ margin-bottom: 2.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ font-weight: 300; } .thankyoupage-error_container p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 36px; /* 9 */ margin-bottom: 2.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 28px; /* 9 */ line-height: 1.75rem; /* 9 */ } .thankyoupage-error_container .container-data-tky-error { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 60px; /* 9 */ margin-bottom: 3.75rem; /* 9 */ } .thankyoupage-error_container .container-data-tky-error .order_info { text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .thankyoupage-error_container .container-data-tky-error .pay-reload { text-align: center; } .thankyoupage-error_container .container-data-tky-error .pay-reload__btn { font-family: "Telefonica", sans-serif; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 70px; /* 9 */ padding-left: 4.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 70px; /* 9 */ padding-right: 4.375rem; /* 9 */ display: flex; align-items: center; justify-content: center; gap: 16px; } @media only screen and (max-width: 768px) { .thankyoupage-error_container .container-data-tky-error .pay-reload__btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 40px; /* 9 */ padding-left: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 40px; /* 9 */ padding-right: 2.5rem; /* 9 */ } } .thankyoupage-error_container .container-data-tky-error .pay-reload__btn::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } .custom-error-404 { display: flex; flex-direction: column; justify-content: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 60px; /* 9 */ margin-bottom: 3.75rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-404 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ margin-bottom: 0; } } .custom-error-404__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 64px; /* 9 */ margin-bottom: 4rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-404__header { margin-bottom: 0; } } .custom-error-404__header h2, .custom-error-404__header p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-404__header h2, .custom-error-404__header p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } } .custom-error-404__header h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 48px; /* 9 */ line-height: 3rem; /* 9 */ font-weight: 300; color: #313235; } @media screen and (max-width: 739px) { .custom-error-404__header h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 36px; /* 9 */ font-size: 2.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 36px; /* 9 */ line-height: 2.25rem; /* 9 */ } } .custom-error-404__header p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 28px; /* 9 */ line-height: 1.75rem; /* 9 */ color: #50535A; } .custom-error-404__links { display: flex; align-items: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 32px; /* 9 */ gap: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-404__links { margin-top: 0; } } .custom-error-404__links .link-to-home { display: flex; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 6px; /* 9 */ gap: 0.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ color: #019DF4; } .custom-error-404__links .link-to-home span { text-decoration: underline; } .custom-error-404__links .link-to-home::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 10px; /* 9 */ font-size: 0.625rem; /* 9 */ } .custom-error-404__button { display: flex; align-items: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 125px; /* 9 */ margin-bottom: 7.8125rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-404__button { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 80px; /* 9 */ margin-bottom: 5rem; /* 9 */ width: 100%; } } .custom-error-404__button div { display: flex; align-items: center; justify-content: center; width: 100%; } .custom-error-404__button div .o-btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 48px; /* 9 */ padding-left: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 48px; /* 9 */ padding-right: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-404__button div .o-btn { width: 100%; padding-left: 0; padding-right: 0; } } .custom-error-408 { display: flex; flex-direction: column; justify-content: center; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 68px; /* 9 */ margin-top: 4.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 144px; /* 9 */ margin-bottom: 9rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-408 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 40px; /* 9 */ margin-top: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 80px; /* 9 */ margin-bottom: 5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 32px; /* 9 */ padding-left: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 32px; /* 9 */ padding-right: 2rem; /* 9 */ } } .custom-error-408 h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 48px; /* 9 */ line-height: 3rem; /* 9 */ color: #313235; } .custom-error-408 h3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ font-weight: 300; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 48px; /* 9 */ line-height: 3rem; /* 9 */ color: #313235; } .custom-error-408 p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ color: #50535A; } .custom-error-408__button { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 64px; /* 9 */ margin-top: 4rem; /* 9 */ display: flex; justify-content: center; align-items: center; } @media screen and (max-width: 739px) { .custom-error-408__button { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ } } .custom-error-408__button .o-btn { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 48px; /* 9 */ padding-left: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 48px; /* 9 */ padding-right: 3rem; /* 9 */ } @media screen and (max-width: 739px) { .custom-error-408__button .o-btn { width: 100%; padding: 0; } } #bloque_html, #bloque-desk, #bloque-stock-desk, #section-info-desk { display: block; } #bloque-mb, #bloque-stock-mb, #section-info-mb, .only-mb { display: none; } @media only screen and (max-width: 767px) { .banner, .information, .c-footer__grid, .c-toolbar__amount, #bloque_html, #bloque-desk, #section-info-desk { display: none; } #bloque-stock-desk { text-align: left; margin-left: 1.1rem; } .cat-card__photo, .cat-card__content { flex: 0 0 45%; } .catalogsearch-result-index .search.results .toolbar.toolbar-products:nth-child(1), .toolbar.toolbar-products:nth-child(2) { position: fixed; bottom: 0; right: 0; left: 0; z-index: 3; background-color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px 9px 15px; /* 9 */ padding: 0.5rem 0.5625rem 0.9375rem; /* 9 */ column-gap: 15px; display: flex; flex-direction: row; overflow-x: auto; } } @media only screen and (max-width: 767px) and (max-width: 552px) { .minisearch { margin: 0; } } @media only screen and (max-width: 767px) { .c-toolbar__box { border: 1px solid #DDDDDD; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 8px; /* 9 */ border-radius: 0.5rem; /* 9 */ color: #0660AA; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } @media only screen and (max-width: 767px) { .c-filter__list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 1px 5px 10px 5px; /* 9 */ padding: 0.0625rem 0.3125rem 0.625rem 0.3125rem; /* 9 */ border-bottom: 1px solid #EEEEEE; } } @media only screen and (max-width: 767px) { .c-filter__options-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 12.8px; /* 9 */ padding-left: 0.8rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 6px; /* 9 */ padding-top: 0.375rem; /* 9 */ color: #0B2739; } } @media only screen and (max-width: 767px) { .pages .items.pages-items { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 22px 0 55px 0px; /* 9 */ padding: 1.375rem 0 3.4375rem 0rem; /* 9 */ } } @media only screen and (max-width: 767px) { .pagebuilder-column-group.box-beneficios { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 0px 5px; /* 9 */ margin: 0rem 0.3125rem; /* 9 */ } } @media only screen and (max-width: 767px) { .pagebuilder-column.box-beneficios-column { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 10px; /* 9 */ margin: 0.625rem; /* 9 */ } } @media only screen and (max-width: 767px) { #bloque-mb, #bloque-stock-mb, #section-info-mb, .only-mb { display: block; } } @media only screen and (max-width: 767px) { .custom-select-wrapper { background-color: #fff; color: #0660AA; font-size: 14px; flex: 1 1 30%; } } .c-main-menu__figure_url { margin-right: auto; } .breadcrumbs .item.search { font-size: 14p !important; } .catalogsearch-result-index .breadcrumbs .item.search { font-size: 14px !important; } @media (max-width: 739px) { .catalogsearch-result-index .title .o-headline.o-light { font-size: 25px; margin-bottom: 10px; } } .switch { position: relative; display: inline-block; min-width: 50px; height: 24px; } @media (min-width: 769px) { .switch { min-width: 55px; height: 30px; } } .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #D3D4D3; -webkit-transition: 0.4s; transition: 0.4s; } .slider:before { position: absolute; content: ""; width: 20px; height: 20px; bottom: 2px; left: 4px; background-color: #EEEEEE; -webkit-transition: 0.4s; transition: 0.4s; } @media (min-width: 769px) { .slider:before { height: 22px; width: 22px; bottom: 4px; } } input:checked + .slider { background-color: #019DF4; } input:focus + .slider { box-shadow: 0 0 1px #019DF4; } input:checked + .slider:before { -webkit-transform: translateX(24px); -ms-transform: translateX(24px); transform: translateX(24px); } @media (min-width: 769px) { input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); } } /* Rounded sliders */ .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; } .payment-epayco { background-color: #fff; padding: 0 15px; border-radius: 4px; border: 1px solid #DEDEDE; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } .payment-epayco .c-form__fieldset .payment-epayco-header { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; align-items: center; justify-content: space-between; margin: 10px 0 15px 0; } .payment-epayco .c-form__fieldset .payment-epayco-icon { display: flex; justify-content: flex-start; align-items: center; } .payment-epayco .c-form__fieldset .payment-epayco-icon label { font-size: 14px; } @media (min-width: 769px) { .payment-epayco .c-form__fieldset .payment-epayco-icon label { font-size: 18px; } } .payment-epayco .c-form__fieldset .payment-epayco-icon span#i-credit-card-stroke { font-size: 25px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ } @media (max-width: 768px) { .payment-epayco .c-form__fieldset .payment-epayco-icon span#i-credit-card-stroke { display: none; } } .payment-epayco .c-form__fieldset .payment-epayco-icon img { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 16px; /* 9 */ margin-right: 1rem; /* 9 */ } @media (max-width: 768px) { .payment-epayco .c-form__fieldset .payment-epayco-icon img { display: none; } } .payment-epayco .c-form__fieldset .twoColumns { display: grid; grid-template-columns: 1fr 1fr 70px; align-items: center; } .payment-epayco .c-form__fieldset .columSpan2 { grid-column: 1/3; display: flex; gap: 7px; } @media only screen and (max-width: 500px) { .payment-epayco .c-form__fieldset .twoColumns { display: grid; grid-template-columns: 1fr 100px; align-items: center; } .payment-epayco .c-form__fieldset .columSpan2 { grid-column: 1/3; text-align: left; font-size: 12px; } .payment-epayco .c-form__fieldset .movil-position-label { grid-row: 2; text-align: left; } } .payment-epayco .payment-form .c-form__box label.c-form__label.label { font-size: 16px !important; } .payment-epayco .payment-form .c-form__icon { z-index: 1; } .payment-epayco .payment-form .checkoutTL .c-form__icon { z-index: 0; } .payment-epayco .payment-form .c-form__field-canvas { column-gap: 0.5rem; } .payment-epayco .payment-form .c-form__field-canvas .content-venci { width: 58% !important; } .payment-epayco .payment-form .c-form__field-canvas .content-cvc { width: 35% !important; } .payment-epayco .payment-form .c-form__field-canvas .content-cuotas { width: 53% !important; } .payment-epayco .payment-form .c-form__field-canvas #paymentBtn { text-align: center; } @media (min-width: 769px) { .payment-epayco .payment-form .c-form__field-canvas #paymentBtn { text-align: right; } } .payment-epayco #bancobogota_field { display: flex; flex-direction: column; align-items: center; } .payment-epayco #bancobogota_field .field-bancobogota_submit_btn { align-self: flex-end; } @media (max-width: 768px) { .payment-epayco #bancobogota_field .field-bancobogota_submit_btn { align-self: center; } } div#paymentMethods .title { text-align: left !important; color: #313235; font-weight: 700; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ } .bancolombia-view-bnpl .o-list-steps__step::before { border: 2px solid #86888C !important; } .bancolombia-view-bnpl .o-list-steps__step.modified::before { border: 1px solid #019DF4 !important; color: #fff; background-color: #019DF4; } .bancolombia-view-bnpl .o-list-steps { column-gap: 238px; column-gap: 14.875rem; } .bancolombia-view-bnpl .o-list-steps__step::after { top: -25px; left: 100%; width: 236px; width: 14.75rem; } .header_checkout_bnc { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 0.5rem; margin-top: 0.5rem; } .checkout_btn_submit_bnc { text-align: right; } .body_checkout_bnc_rounded-list { display: flex; flex-direction: column; gap: 1rem; align-items: flex-start; margin-top: 1rem; } .margin_checkout_bnc-list { margin-left: 1rem; } .margin_checkout_bnc-list p { text-align: left; } .title_checkout_bnc { font-weight: bold; font-size: 1.3rem; } .small_checkout_bnc { font-size: 13px; } .o-link-bnc { position: relative; padding: 0; text-decoration: underline; text-underline-position: under; line-height: 1; color: #019DF4; } .item-checkout_bnc-separator { border-bottom: 1px solid #D3D4D3; } .badge-bnc { display: inline-block; padding: 3px 10px; background-color: #E01F6E; color: #fff; border-radius: 25px; font-size: 12px; width: 55px; margin-left: 1rem; } .c-form_grey_bancolombia .c-form__field { background-color: #F9F9FA; border-color: #F9F9FA; padding: 1rem; } .text_changed_bancolombia { color: #019DF4; } .text_highlighted_bancolombia { color: #019DF4; } .text_highlighted_bancolombia p:first-child { font-size: 15px; } .text_highlighted_bancolombia p:last-child { font-weight: 600; font-size: 16px; } .box_bancolombia_join { gap: 0rem !important; margin-bottom: 0; } .box_bancolombia_dues { display: flex; justify-content: space-between; border-radius: 0px; } .box_bancolombia_dues div:first-child { display: flex; gap: 1rem; } .box_bancolombia_dues div:last-child { color: #86888C; } .circle_bancolombia { display: inline-block; width: 30px; height: 30px; background-color: white; color: #000; border-radius: 50%; text-align: center; line-height: 30px; font-weight: bold; } .box_bancolombia_commissions p:first-child { font-size: 14px; display: inline; } .box_bancolombia_commissions p:last-child { font-weight: bold; } .icon-bancolombia-setting:nth-child(1) { display: inline; font-size: 23px; vertical-align: bottom; margin-left: 6px; } .icon-bancolombia-setting:nth-child(2) { display: inline; font-size: 18px; vertical-align: top; margin-left: 6px; } .box_bancolombia_warning { display: flex; gap: 0.8rem; align-items: center; } .box_bancolombia_authorization { padding-left: 1rem; padding-right: 1rem; padding-bottom: 1rem; list-style-type: disc; text-align: left; } .box_bancolombia_account_selection { display: flex; justify-content: space-between; align-items: center; } .box_bancolombia_account_selection div:first-child p:first-child { font-weight: bold; font-size: 18px; } .box_bancolombia_account_selection div:first-child p:last-child { font-weight: bold; font-size: 18px; } .btn-buy-bancolombia { margin-top: 2rem; height: 53px; } .body_bancolombia-form { width: 50%; margin: 0 auto; background: white; padding: 2rem; padding-top: 10px; border-radius: 12px; } .heigth_icon_brand { height: 106px; } .box_bancolombia_download_contract { margin-top: 1rem; display: flex; justify-content: center; align-items: center; gap: 1rem; } .box_bancolombia_download_contract div:first-child { font-size: 70px; color: #019DF4; } .box_bancolombia_download_contract div:last-child { font-size: 20px; } .box_bancolombia_download_contract .text_changed_bancolombia { vertical-align: sub; } .box_bancolombia_email_input { width: 75%; margin: 0 auto; } .flex-space-between-bancolombia { display: flex; flex-direction: row; justify-content: space-between; align-items: baseline; } .container_detailsClient_bancolombia { display: flex; justify-content: space-between; margin-top: 1rem; } @media only screen and (max-width: 600px) { .bancolombia-view-bnpl .o-list-steps__step::before { border: 2px solid #86888C !important; } .bancolombia-view-bnpl .o-list-steps { column-gap: 64px; column-gap: 4rem; } .bancolombia-view-bnpl .o-list-steps__step::after { top: -15px; left: 100%; width: 64px; width: 4rem; } .bancolombia-view-bnpl .f-c-header-step__content { margin-top: 0px; } .bancolombia-view-bnpl .o-list-steps__txt { display: block !important; } .bancolombia-view-bnpl .f-c-header-step__wrap { display: flex; padding-top: 1rem; align-items: center; background-color: #fff; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); } .bancolombia-view-bnpl .f-c-header-step__brand { box-shadow: none; margin-left: 1rem; } .bancolombia-view-bnpl .text-orange { font-size: 21px; } .body_bancolombia-form { width: 80%; padding: 1rem; } .body_bancolombia-form h2 { font-size: 20px; } .heigth_icon_brand { height: 80px; } .u-text-left.c-form__text-list_confronta { font-size: 14px; } .icon-bancolombia-setting:nth-child(1) { vertical-align: top; } .box_bancolombia_commissions p:first-child { font-size: 12px; } .header_checkout_bnc p { text-align: left; } .header_checkout_bnc p:first-of-type { font-size: 20px; } .margin_checkout_bnc-list { margin-left: 0px; text-align: left; } .checkout_btn_submit_bnc { text-align: center; } .body_checkout_bnc_rounded-list { margin-left: 10px; } .text_contract_bancolombia { font-size: 14px; } .box_bancolombia_download_contract { gap: 0.5rem; } .box_bancolombia_download_contract div:first-child { font-size: 50px; } .flex-space-between-bancolombia { flex-direction: column; } .box_bancolombia_authorization { padding-top: 1rem; padding-left: 1rem; padding-right: 1rem; padding-bottom: 1rem; list-style-type: disc; text-align: left; } } #modal-rate_experience, #modal-rate_thanks { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 24px; /* 9 */ padding-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ padding-bottom: 0; } #modal-rate_experience .o-modal__header, #modal-rate_thanks .o-modal__header { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 32px; /* 9 */ margin-bottom: 2rem; /* 9 */ } #modal-rate_experience .o-modal__header .o-modal__title, #modal-rate_thanks .o-modal__header .o-modal__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 32px; /* 9 */ line-height: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ font-weight: 300; margin-right: auto; margin-left: auto; color: #0B2739; } #modal-rate_experience .o-modal__header-logo, #modal-rate_thanks .o-modal__header-logo { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 40px; /* 9 */ width: 2.5rem; /* 9 */ height: auto; } #modal-rate_experience .o-modal__header .text-w90-ma, #modal-rate_thanks .o-modal__header .text-w90-ma { width: 90%; margin-left: auto; margin-right: auto; } #modal-rate_experience .o-modal__body__questions, #modal-rate_thanks .o-modal__body__questions { margin-left: auto; margin-right: auto; text-align: left; } #modal-rate_experience .o-modal__body__questions .question, #modal-rate_thanks .o-modal__body__questions .question { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } #modal-rate_experience .o-modal__body__questions .question p, #modal-rate_thanks .o-modal__body__questions .question p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 16px; /* 9 */ line-height: 1rem; /* 9 */ } #modal-rate_experience .o-modal__body__questions .question .txt-comment-additional, #modal-rate_thanks .o-modal__body__questions .question .txt-comment-additional { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ resize: none; border-radius: 5px; border: 1px solid #B6B7B7; box-shadow: 1px 1px 1px #B6B7B7; color: #50535A; } #modal-rate_experience .o-modal__body__buttons .btn-notsend, #modal-rate_thanks .o-modal__body__buttons .btn-notsend { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ } #modal-rate_experience .o-modal__body__buttons .btn-notsend__text, #modal-rate_thanks .o-modal__body__buttons .btn-notsend__text { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ font-weight: 700; color: #019DF4; text-decoration: underline; cursor: pointer; } .bg-rating-profile_star { background: #0B2739; color: white; padding: 8px; font-size: 14px; gap: 8px; border-radius: 12px; display: flex; align-items: center; margin-top: 12px; } .bg-rating-profile_withoutstar { background: #0B2739; color: white; padding: 8px; font-size: 14px; gap: 8px; border-radius: 12px; display: inline !important; align-items: center !important; margin-top: 12px; } .rating-profile__size { font-size: 14px !important; } .container_subreview { display: flex; } .c_subreview_valoration { flex: 40%; } .c_subreview_comment { flex: 60%; } .review-ratings .rating-label, .customer-review .review-details .customer-review-rating .rating-label { display: table-cell; padding-bottom: 5px; padding-right: 25px; padding-top: 1px; vertical-align: top; } .review-ratings .rating-result, .customer-review .review-details .customer-review-rating .rating-result { display: table-cell; vertical-align: top; } .abs-rating-summary .rating-summary, .review-ratings .rating-summary, .customer-review .review-details .customer-review-rating .rating-summary { display: flex; align-items: baseline; } .rating-summary .rating-result { width: 93px; display: inline-block; position: relative; vertical-align: middle; } .catalog-category-view .rating-summary .rating-result, .catalogsearch-result-index .rating-summary .rating-result { width: 17px; } .rating-summary .rating-result::before { left: 0; position: absolute; top: 0; width: 100%; z-index: 1; -webkit-font-smoothing: antialiased; line-height: 16px; content: "★★★★★"; display: block; font-style: normal; font-weight: normal; speak: none; color: #c7c7c7; font-family: "Arial Unicode MS"; font-size: 20px; height: 16px; letter-spacing: 2px; } .catalog-category-view .rating-summary .rating-result::before, .catalogsearch-result-index .rating-summary .rating-result::before { content: "★"; } .rating-summary .rating-result > span { display: block; overflow: hidden; } .rating-summary .rating-result > span::before { position: relative; z-index: 2; -webkit-font-smoothing: antialiased; color: #f28d15; font-size: 20px; height: 16px; letter-spacing: 2px; line-height: 16px; content: "★★★★★"; font-family: "Arial Unicode MS"; display: block; font-style: normal; font-weight: 400; speak: none; } .catalog-category-view .rating-summary .rating-result > span::before, .catalogsearch-result-index .rating-summary .rating-result > span::before { content: "★"; } .rating-summary .rating-result > span span { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .abs-rating-summary .rating-result, .review-ratings .rating-result, .customer-review .review-details .customer-review-rating .rating-result { display: table-cell; vertical-align: top; } .rating-summary .label { top: 4px; position: relative; } .item-review-separator { margin-top: 1.5rem; border-bottom: 1px solid #D3D4D3; } .review-headline { font-size: 2rem; line-height: 1rem; font-weight: 300; margin-bottom: 2.5rem; } .input-text-review { padding: 0.8rem; border: 1px solid #B6B7B7; width: inherit; border-radius: 0.25rem; } .review-fieldset { border: none; } .review-control-vote::before { color: #c7c7c7; font-family: "Arial Unicode MS"; font-size: 25px; height: 16px; letter-spacing: 2px; line-height: 16px; font-style: normal; font-weight: 400; speak: none; vertical-align: top; -webkit-font-smoothing: antialiased; content: "★★★★★"; display: block; position: absolute; z-index: 1; } .review-control-vote input[type=radio] { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .review-control-vote input[type=radio]:hover + label:before, .review-control-vote input[type=radio]:checked + label:before { opacity: 1; } .review-control-vote label { cursor: pointer; display: block; position: absolute; } .review-control-vote label span { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .review-control-vote label::before { color: #f28d15; font-family: "Arial Unicode MS"; font-size: 25px; height: 16px; letter-spacing: 2px; line-height: 16px; font-style: normal; font-weight: 400; speak: none; vertical-align: top; -webkit-font-smoothing: antialiased; opacity: 0; } .review-control-vote label:hover::before { opacity: 1; } .review-control-vote label:hover ~ label::before { opacity: 0; } .review-control-vote .rating-5 { z-index: 2; } .review-control-vote .rating-5::before { content: "★★★★★"; } .review-control-vote .rating-4 { z-index: 3; } .review-control-vote .rating-4::before { content: "★★★★"; } .review-control-vote .rating-3 { z-index: 4; } .review-control-vote .rating-3::before { content: "★★★"; } .review-control-vote .rating-2 { z-index: 5; } .review-control-vote .rating-2::before { content: "★★"; } .review-control-vote .rating-1 { z-index: 6; } .review-control-vote .rating-1::before { content: "★"; } .review-control-vote::before { content: "★★★★★"; } .custom-form-container.fieldset.review-fieldset > .field:not(.choice) > .label { padding: 6px 15px 0 0; text-align: left; width: 25.8%; box-sizing: border-box; float: left; } .review-control-title { padding-top: 0px; } .review-hide-summary { visibility: hidden !important; position: absolute; } .container-profile-review { display: grid; grid-template-columns: auto auto auto; align-items: center; gap: 1rem; margin-bottom: 1rem; justify-items: start; } .rating-profile.rating-summary .rating-result { width: auto; display: inline-block; position: relative; vertical-align: middle; } .rating-profile.rating-summary .rating-result::before { left: 0; position: absolute; top: 0; width: 100%; z-index: 1; -webkit-font-smoothing: antialiased; line-height: 16px; content: "★★★★★"; display: block; font-style: normal; font-weight: normal; speak: none; color: #c7c7c7; font-family: "Arial Unicode MS"; font-size: 14px; height: 18px; letter-spacing: 2px; padding-top: 5px; } .rating-profile.rating-summary .rating-result > span { display: block; overflow: hidden; } .rating-profile.rating-summary .rating-result > span::before { position: relative; z-index: 2; -webkit-font-smoothing: antialiased; color: #FDB718; font-size: 14px; height: 18px; letter-spacing: 2px; line-height: 16px; content: "★★★★★"; font-family: "Arial Unicode MS"; display: block; font-style: normal; font-weight: 400; speak: none; padding-top: 5px; } .rating-profile.rating-summary .rating-result > span span { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .reviews-actions-comment { color: #019DF4; text-decoration-line: underline; margin-left: 10px; font-size: 14px; } .c-labels { max-width: 75%; min-width: 75%; } /*------------------------------------*\ Media querys Tablet \*------------------------------------*/ @media only screen and (max-width: 800px) { .reviews-actions-comment { margin-left: 0px; } .container-profile-review { grid-template-columns: 1fr 1fr; place-items: baseline; margin-left: 1rem; } .container-profile-review > div:nth-child(1) { grid-column: 1/span 2; /* Para el primer div, ocupa dos columnas en dispositivos grandes */ } .container-profile-review > div:nth-child(1) ~ div { grid-column: auto; /* Para los divs restantes, deja que ocupen una sola columna */ } .rating-profile.rating-summary { text-align: center; } .container_subreview { flex-direction: column; } .review-headline { font-size: 1.5rem; line-height: 1rem; font-weight: 300; margin-bottom: 2.5rem; line-height: 2rem; } .custom-form-container.fieldset.review-fieldset > .field:not(.choice) > .label { padding: 6px 15px 0 0; text-align: left; width: 100%; } .review-control-title { padding-top: 2.5rem !important; } } @media only screen and (max-width: 500px) { .review-control-vote label { height: 0px; } .review-control-vote label::before { line-height: 75px; } .review-mobile-select { width: 250px; margin-left: auto; margin-right: auto; height: 60px; margin-top: 20px; } .review-control-vote::before { transform: translateY(30px); } .review-control-title { transform: translateY(-40px); padding-top: 2.5rem !important; } .rating-profile.rating-summary .rating-result { display: inline-block; } .rating-profile.rating-summary .rating-result::before { left: 0; position: absolute; top: 0; width: 50%; z-index: 1; -webkit-font-smoothing: antialiased; line-height: 26px; content: "★★★★★"; display: inline-block; font-style: normal; font-weight: normal; speak: none; color: #c7c7c7; font-family: "Arial Unicode MS"; font-size: 18px; height: 16px; letter-spacing: 2px; padding-top: 0px; } .rating-profile.rating-summary .rating-result > span { display: block; overflow: hidden; } .rating-profile.rating-summary .rating-result > span::before { position: relative; z-index: 2; -webkit-font-smoothing: antialiased; color: #f28d15; font-size: 18px; height: 27px; letter-spacing: 2px; line-height: 26px; content: "★★★★★"; font-family: "Arial Unicode MS"; display: block; font-style: normal; font-weight: 400; speak: none; padding-top: 0px; } } @media only screen and (max-width: 600px) { .c-labels { max-width: 65%; min-width: 65%; } } .reviews-actions-ficha { display: flex; gap: 6px; align-items: center; } .empy-starts { cursor: pointer; color: #c7c7c7; font-size: 27px; } @media screen and (max-width: 600px) { .reviews-actions-ficha { flex-direction: column; } } #compare-products .mb-60 { margin-bottom: 60px; } #compare-products .mb-24 { margin-bottom: 24px; } #compare-products .mt-15 { margin-top: 15px; } #compare-products .mt-50 { margin-top: 50px; } #compare-products .mr-10 { margin-right: 10px; } #compare-products .p-20 { padding: 20px; } #compare-products .text-underline { text-decoration: underline; } #compare-products .text-center { text-align: center; } #compare-products .container-btn-goBack { font-size: 16px; font-weight: 400; line-height: 24px; color: #019df4; } #compare-products .title { color: 50535A; font-size: 40px; font-weight: 300; line-height: 48px; text-align: center; } @media only screen and (max-width: 640px) { #compare-products .title { font-size: 32px; } } #compare-products .flex { display: flex; justify-content: space-evenly; } @media only screen and (max-width: 640px) { #compare-products .flex { display: none; } } #compare-products .slider-compare-product { display: none; } @media only screen and (max-width: 640px) { #compare-products .slider-compare-product { display: block; } } #compare-products .product { display: flex; flex-direction: column; align-items: center; } @media only screen and (max-width: 640px) { #compare-products .product { align-items: center; flex-direction: column; width: 100%; } } #compare-products .product .container-card-product { display: flex; flex-direction: column; align-items: flex-end; } #compare-products .card { width: 252px; height: 430px; padding: 5px 0px; border-radius: 10px; border: 1px solid #c6c6c6; background: #fff; margin-top: 16px; } #compare-products .product-item-name { color: #313235; font-size: 17px; font-weight: 400; line-height: 17px; } @media only screen and (max-width: 640px) { #compare-products .product-item-name { font-size: 17px; } } #compare-products .container-price-discount { display: flex; justify-content: flex-start; align-items: center; margin-top: 10px; } #compare-products .container-price-discount .price { color: #979797; font-size: 14px; font-weight: 400; line-height: 20px; text-decoration-line: line-through; } #compare-products .container-tag-discount-price { border-radius: 20px; background: #e1efff; display: flex; padding: 4px 8px; align-items: center; margin-left: 12px; } #compare-products .container-price-discount .price-discount { font-size: 12px; font-weight: 600; color: #019df4; line-height: 14px; } #compare-products .title-original-price { color: #313235; font-size: 14px; font-weight: 400; line-height: 20px; } #compare-products .text-original-price { color: #313235; font-size: 32px; font-weight: 700; line-height: 32px; } #compare-products .container-delivery-free { display: flex; align-items: center; margin-top: 17px; } #compare-products .container-delivery-free .i-truck-stroke { color: #019df4; font-size: 24px; } #compare-products .container-delivery-free .text-delivery-free { margin-left: 10px; color: #019df4; font-size: 12px; line-height: 20px; } #compare-products .icon { font-size: 48px; text-align: center; color: #019df4; } #compare-products .title-detail-compare { color: #0b2739; font-size: 18px; text-align: center; font-weight: 400; line-height: 24px; margin-bottom: 10px; } #sticky-compare-products .w-100 { width: 60%; margin: 0 auto; } @media only screen and (max-width: 640px) { #sticky-compare-products .w-100 { width: 90px; } } #sticky-compare-products .container-general-sticky { display: flex; justify-content: space-between; align-items: center; padding: 10px; } @media only screen and (max-width: 640px) { #sticky-compare-products .container-general-sticky { flex-direction: column; flex-wrap: wrap; align-items: unset; } } #sticky-compare-products .row { justify-content: space-between; display: flex; flex-direction: row; align-items: center; } @media only screen and (max-width: 640px) { #sticky-compare-products .row { display: flex; flex-direction: column; } } #sticky-compare-products .col { margin: 0 auto; display: grid; grid-template-columns: 0.28fr 1fr; grid-template-rows: 1fr; margin-right: 30px; } @media only screen and (max-width: 640px) { #sticky-compare-products .col { display: flex; flex-direction: column; } } #sticky-compare-products .container-detail-product { display: flex; flex-direction: column; justify-content: space-between; } #sticky-compare-products .txt-product_name { word-wrap: break-word; max-width: 200px; } #sticky-compare-products .link { color: #019df4; font-weight: 400; font-size: 16px; line-height: 24px; text-decoration: underline; } #sticky-compare-products .container-txt-compare { display: none; } @media only screen and (max-width: 640px) { #sticky-compare-products .container-txt-compare { display: flex; justify-content: space-between; align-items: center; flex: 10 0 100%; } } #sticky-compare-products .title-compare { font-size: 18px; font-weight: 400; color: #50535a; } #sticky-compare-products .subtitle-compare { display: none; } @media only screen and (max-width: 640px) { #sticky-compare-products .subtitle-compare { display: block; font-size: 16px; font-weight: 400; color: #50535a; } } @media only screen and (max-width: 640px) { #sticky-compare-products .bottom-comapared { margin: 0 auto; } } @media only screen and (max-width: 640px) { #sticky-compare-products .slider-container-compare { display: block; width: 100%; overflow: hidden; position: relative; padding: 20px 0; } } #sticky-compare-products .slider-compare { display: flex; transition: transform 0.5s ease-in-out; gap: 38px; margin-bottom: 10px; } @media only screen and (max-width: 640px) { #sticky-compare-products .slide-compare { flex: 0 0 41%; box-sizing: border-box; text-align: center; } } @media only screen and (min-width: 640px) { #sticky-compare-products .prev-btn, #sticky-compare-products .next-btn { display: none !important; } } @media only screen and (max-width: 640px) { #sticky-compare-products .prev-btn, #sticky-compare-products .next-btn { position: absolute; top: 50%; z-index: 3; transform: translateY(-50%); color: #44464b; border: none; cursor: pointer; } } #sticky-compare-products .i-close.mobile { margin-left: 15px; } @media only screen and (max-width: 640px) { #sticky-compare-products .i-close.mobile { display: none; } } #sticky-compare-products .prev-btn { left: 0; display: none; } #sticky-compare-products .next-btn { right: 15px; } #sticky-compare-products .disabled-btn { background-color: #80cef9; cursor: none; } @media only screen and (max-width: 640px) { #sticky-compare-products .disabled-btn { background-color: #80cef9; cursor: none; } } #sticky-compare-products .name-product { word-wrap: break-word; height: 47px; overflow: hidden; } .ajaxcompare-buttons, .mgp-message-successs, .ajax-compare-image, .message-success { display: none !important; } .action.tocompare { text-decoration: underline; } .disabled-checkbox { pointer-events: none; opacity: 0.5; } /* Sticky Compare products */ .c_sticky-compare-products { background: white; position: sticky; width: 100%; display: block; z-index: 8; top: 0px; right: 0px; overflow: hidden; } .slick-slider { -khtml-user-select: none; -moz-user-select: none; -ms-touch-action: pan-y; -ms-user-select: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; box-sizing: border-box; display: block; position: relative; touch-action: pan-y; user-select: none; } .slick-list { display: block; margin: 0; overflow: hidden; padding: 0; position: relative; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-track { display: block; left: 0; margin-left: auto; margin-right: auto; position: relative; top: 0; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir=rtl] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { border: 1px solid transparent; display: block; height: auto; } .slick-slider .slick-track, .slick-slider .slick-list { -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-arrow.slick-hidden { display: none; } .slick-prev { left: 2rem; } .slick-prev:before { border: solid #019DF4; border-width: 0 3px 3px 0; display: inline-block; padding: 4px; transform: rotate(135deg); -webkit-transform: rotate(135deg); content: ""; } .slick-next { right: 2rem; } .slick-next:before { border: solid #019DF4; border-width: 0 3px 3px 0; display: inline-block; padding: 4px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); content: ""; } .slick-prev, .slick-next { -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); background: rgba(252, 252, 252, 0.6); border: none; border-radius: 50%; color: transparent; cursor: pointer; display: block; font-size: 0; height: 40px; line-height: 0; outline: none; padding: 0; position: absolute; top: 50%; transform: translate(0, -50%); width: 40px; z-index: 101; display: flex; align-items: center; justify-content: center; } .slick-prev.slick-disabled, .slick-next.slick-disabled { opacity: 0.2; } .slick-prev:hover, .slick-next:hover { background: #fcfcfc; border: none; } .slick-prev:hover.slick-disabled, .slick-next:hover.slick-disabled { opacity: 0.2; } .slick-prev:hover:before, .slick-next:hover:before { color: #019DF4; } .slick-prev:before, .slick-prev:after, .slick-next:before, .slick-next:after { color: #019DF4; font-size: 32px; opacity: 1; } .slick-prev:active, .slick-prev:focus, .slick-prev:not(.primary), .slick-next:active, .slick-next:focus, .slick-next:not(.primary) { background: #fff; border: none; box-shadow: none; } .slick-prev:active:active, .slick-prev:focus:active, .slick-prev:not(.primary):active, .slick-next:active:active, .slick-next:focus:active, .slick-next:not(.primary):active { box-shadow: none; } .slick-dots { display: block; list-style: none; margin: 0; padding: 15px 0; text-align: center; width: 100%; } .slick-dots li { cursor: pointer; display: inline-block; height: 14px; margin: 0 5px; padding: 0; position: relative; vertical-align: middle; width: 14px; } .slick-dots li button { background: #fff; border: 1px solid #ccc; border-radius: 10px; box-shadow: none; cursor: pointer; display: block; height: 14px; padding: 0; text-indent: -99999px; transition: 0.3s; width: 14px; } .slick-dots li button:hover { border: 1px solid #b3b3b3; } .slick-dots li button:active, .slick-dots li button:focus, .slick-dots li button:not(.primary) { box-shadow: none; } .slick-dots li.slick-active button { background: #019DF4; } .title-method-pago { margin-top: 20px; font-size: 18px; font-weight: bold; margin-bottom: 15px; } @media (max-width: 552px) { .title-method-pago { text-align: center; color: #50535A; font-weight: 700; margin-top: 1rem; } } .box-tracking-slick { display: flex; gap: 1rem; } @media (max-width: 552px) { .box-tracking-slick { width: 63%; flex-shrink: 0; } } #btn-filter-mobile { order: 3; flex-shrink: 0; font-size: 12px; } .box-tracking-color { gap: 10px; padding: 10px; background: #fff; } @media (max-width: 552px) { .box-tracking-color { gap: 4px; padding: 4px; font-size: 11px; } } .catalog-category-view .slick-dots { text-align: right !important; position: absolute; bottom: 15%; display: block; list-style: none; margin: 0; padding: 5px 0; text-align: center; width: 100%; } .catalog-category-view .slick-dots li { cursor: pointer; display: inline-block; height: 14px; margin: 0 5px; padding: 0; position: relative; vertical-align: middle; width: 14px; } .catalog-category-view .slick-dots li button { background: #949494; border: 1px solid #ccc; border-radius: 10px; box-shadow: none; cursor: pointer; display: block; height: 12px; padding: 0; text-indent: -99999px; transition: 0.3s; width: 12px; } .catalog-category-view .slick-dots li button:hover { border: 1px solid #b3b3b3; } .catalog-category-view .slick-dots li button:active, .catalog-category-view .slick-dots li button:focus, .catalog-category-view .slick-dots li button:not(.primary) { box-shadow: none; } .catalog-category-view .slick-dots li.slick-active button { background: #019DF4; width: 22px; transition: background-color 0.3s ease-in-out; } .pagebuilder-slider:not(.slick-initialized) { display: none; } @media (max-width: 575.98px) { .c-tabs { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ } .c-tabs__nav_center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 5px; /* 9 */ padding-top: 0.3125rem; /* 9 */ } .c-tabs__link { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 160px; /* 9 */ width: 10rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ } .c-tabs_new { position: relative; margin-top: calc(100% - 98%); padding: 8px; margin-left: 0px; } .c-tabs_new.fixed { position: fixed; top: 0; margin-top: 0; background: white; z-index: 3; width: -webkit-fill-available; margin-left: -20px; } .btn-icon-search { height: calc(100% - 30px); max-height: 4em; } .titlesCatalogCategories { display: block !important; } .c-tabs__subtitle { display: none; } } @media (min-width: 576px) and (max-width: 767.98px) { .c-tabs { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ } .c-tabs__nav_center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .c-tabs__link { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 160px; /* 9 */ width: 10rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 8px; /* 9 */ padding: 0.5rem; /* 9 */ } .c-tabs_new { position: relative; padding: 8px; margin-left: 0px; } .c-tabs_new.fixed { position: fixed; top: 0; margin-top: 0; background: white; z-index: 3; width: -webkit-fill-available; margin-left: -20px; } .btn-icon-search { height: calc(100% - 30px); max-height: 4em; } .titlesCatalogCategories { display: block !important; } .c-tabs__subtitle { display: none; } } @media (min-width: 768px) and (max-width: 991.98px) { .c-tabs { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ } .c-tabs__nav_center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .c-tabs__link { width: auto; height: auto; } .c-tabs_new { position: relative; margin-top: calc(100% - 98%); padding: 8px; margin-left: 0px; } .c-tabs_new.fixed { position: fixed; top: 0; margin-top: 0; background: white; z-index: 3; width: -webkit-fill-available; margin-left: -20px; } .btn-icon-search { height: calc(100% - 30px); max-height: 4em; } .titlesCatalogCategories { display: none !important; } } @media (min-width: 992px) and (max-width: 1199.98px) { .c-tabs { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 8px; /* 9 */ padding-top: 0.5rem; /* 9 */ } .c-tabs__nav_center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 5px; /* 9 */ padding-top: 0.3125rem; /* 9 */ } .c-tabs__content { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 12px; /* 9 */ padding-top: 0.75rem; /* 9 */ } .c-tabs__input { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 421px; /* 9 */ max-width: 26.3125rem; /* 9 */ } .c-tabs__nav { -webkit-align-self: flex-end; -moz-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; -webkit-box-flex: 1; -webkit-flex: 1 1 70%; -moz-box-flex: 1; -moz-flex: 1 1 70%; -ms-flex: 1 1 70%; flex: 1 1 70%; -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .titlesCatalogCategories { display: none !important; } } @media (min-width: 1200px) { .c-tabs__content { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 8px; /* 9 */ column-gap: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 12px; /* 9 */ padding-top: 0.75rem; /* 9 */ } .c-tabs__input { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 421px; /* 9 */ max-width: 26.3125rem; /* 9 */ } .c-tabs__nav { -webkit-align-self: flex-end; -moz-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; -webkit-box-flex: 1; -webkit-flex: 1 1 70%; -moz-box-flex: 1; -moz-flex: 1 1 70%; -ms-flex: 1 1 70%; flex: 1 1 70%; -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .titlesCatalogCategories { display: none !important; } } @media (min-width: 768px) { .c-tabs__search { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 12px; /* 9 */ padding-bottom: 0.75rem; /* 9 */ } .c-tabs__searchMobile { display: none; } } @media (max-width: 767px) { .container-search-mobile { text-align: -webkit-center; } .c-tabs__search { display: none; } .c-tabs__searchMobile { display: block; margin-top: 6px !important; } } .hidden-sort-by { display: none !important; } .custom-select-wrapper { position: relative; justify-content: center; display: flex; align-items: center; width: 161px; height: 40px; border-radius: 0.5em; border: 1px solid #DDDDDD; } .custom-select-center { display: flex; align-items: center; gap: 10px; } @media (max-width: 552px) { .custom-select-center { gap: 4px; font-size: 11px; } } .custom-select-wrapper select { opacity: 0; position: absolute; width: 100%; height: 100%; background: transparent; border: none; cursor: pointer; } .custom-select-text { cursor: pointer; text-align: center; width: calc(100% - 30px); box-sizing: border-box; line-height: 36px; } .i-after-sorter { background-size: 20px 20px; width: 30px; display: inline-block; vertical-align: middle; cursor: pointer; } .price-range-list { list-style: none; font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: #50535A; line-height: 15px; } .item-price { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 6px; /* 9 */ padding: 0.375rem; /* 9 */ } .item-price:hover { color: #019DF4; } .checkout-cart { flex-direction: column; gap: 1rem; } .checkout-cart__go-back .go-back-link { display: flex; align-items: center; justify-content: flex-start; text-decoration: none; width: fit-content; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ } @media screen and (max-width: 739px) { .checkout-cart__go-back .go-back-link::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 10px; /* 9 */ font-size: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } } .checkout-cart__go-back .go-back-link p { text-decoration: underline; } @media screen and (max-width: 739px) { .checkout-cart__go-back .go-back-link { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } .checkout-cart__go-back hr { border: 1px solid #D4D4D4; margin: 0 auto; } @media screen and (max-width: 739px) { .checkout-cart__go-back hr { display: none; } } .checkout-cart__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 48px; /* 9 */ font-size: 3rem; /* 9 */ } @media screen and (max-width: 739px) { .checkout-cart__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 40px; /* 9 */ line-height: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ font-weight: 300; } } .checkout-cart .c-callout { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 10px; /* 9 */ padding-right: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 20px; /* 9 */ padding-left: 1.25rem; /* 9 */ position: relative; } @media screen and (max-width: 739px) { .checkout-cart .c-callout { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 10px; /* 9 */ margin-right: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ } } .checkout-cart .c-callout::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } @media screen and (max-width: 739px) { .checkout-cart .c-callout::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } @media screen and (max-width: 739px) { .checkout-cart .c-callout__text { max-width: 80%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } .checkout-cart .c-callout #alert_close_btn { position: absolute; top: 10px; right: 10px; color: #5CB615; } @media screen and (max-width: 739px) { .checkout-cart .c-callout #alert_close_btn { top: 25%; right: 2px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } .checkout-cart__product { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ display: flex; justify-content: space-between; gap: 1.5rem; } @media screen and (max-width: 739px) { .checkout-cart__product { flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 10px; /* 9 */ padding-right: 0.625rem; /* 9 */ } } .checkout-cart__product-info { background-color: #fff; display: flex; flex-direction: column; flex: 5; border-radius: 5px; height: max-content; } .checkout-cart__product-info .cart-product__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 20px; /* 9 */ padding-left: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 20px; /* 9 */ padding-right: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 25px; /* 9 */ padding-top: 1.5625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ } .checkout-cart__product-info .cart-product__title-title { display: flex; justify-content: space-between; } .checkout-cart__product-info .cart-product__title-title p { font-weight: bold; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 12px; /* 9 */ margin-bottom: 0.75rem; /* 9 */ } .checkout-cart__product-info .cart-product__title hr { border: 1px solid #D4D4D4; margin: 0 auto; } @media screen and (max-width: 739px) { .checkout-cart__product-info .cart-product__title { display: none; } } .checkout-cart__product-info .cart-product__details { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 20px; /* 9 */ padding-left: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 20px; /* 9 */ padding-right: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ display: flex; justify-content: space-between; align-items: center; } @media screen and (max-width: 739px) { .checkout-cart__product-info .cart-product__details { flex-direction: column; } } .checkout-cart__product-info .cart-product__details-info { display: flex; align-items: center; } .checkout-cart__product-info .cart-product__details-info .details-image { width: 100px; height: auto; margin-right: 20px; } @media screen and (max-width: 739px) { .checkout-cart__product-info .cart-product__details-info .details-image { width: 150px; } } .checkout-cart__product-info .cart-product__details-info .details-image img { width: 100%; } .checkout-cart__product-info .cart-product__details-info .details-data { display: flex; flex-direction: column; justify-content: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } @media screen and (max-width: 739px) { .checkout-cart__product-info .cart-product__details-info .details-data { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } } .checkout-cart__product-info .cart-product__details-info .details-data p:first-of-type { font-weight: bold; } .checkout-cart__product-info .cart-product__details-price { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } @media screen and (max-width: 739px) { .checkout-cart__product-info .cart-product__details-price { display: none; } } .checkout-cart__product-summary { background-color: #fff; display: flex; flex: 2; flex-direction: column; border-radius: 5px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 40px; /* 9 */ padding-left: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 40px; /* 9 */ padding-right: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 25px; /* 9 */ padding-top: 1.5625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 30px; /* 9 */ padding-bottom: 1.875rem; /* 9 */ height: max-content; } @media screen and (max-width: 739px) { .checkout-cart__product-summary { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 20px; /* 9 */ padding-left: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 20px; /* 9 */ padding-right: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } } .checkout-cart__product-summary .summary-item { display: flex; justify-content: space-between; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } .checkout-cart__product-summary .summary-item p:first-of-type { font-weight: bold; } .checkout-cart__product-summary .summary-item__total { display: flex; justify-content: space-between; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ font-weight: bold; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } .checkout-cart__product-summary hr { border: 1px solid #D4D4D4; margin: 1rem 0; } .checkout-cart__product-summary hr:first-of-type { display: none; } @media screen and (max-width: 739px) { .checkout-cart__product-summary hr:first-of-type { display: inline-block; } } .checkout-cart__product-summary .summary-info { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ line-height: 14px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ } .checkout-cart__product-summary .summary-info::before { color: #F28D15; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .checkout-cart__tyc { margin-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 100px; /* 9 */ margin-bottom: 6.25rem; /* 9 */ display: flex; justify-content: space-between; gap: 1.5rem; } @media screen and (max-width: 739px) { .checkout-cart__tyc { flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 10px; /* 9 */ padding-right: 0.625rem; /* 9 */ } } .checkout-cart__tyc .tyc-check { display: flex; flex-direction: column; justify-content: center; flex: 5; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ } .checkout-cart__tyc .tyc-check__inputs { display: flex; flex-direction: column; } .checkout-cart__tyc .tyc-check__inputs-checkbox { display: flex; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } @media screen and (max-width: 739px) { .checkout-cart__tyc .tyc-check__inputs-checkbox { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ align-items: flex-start; } } .checkout-cart__tyc .tyc-check__inputs-checkbox label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 15px; /* 9 */ padding-left: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 20px; /* 9 */ line-height: 1.25rem; /* 9 */ } .checkout-cart__tyc .tyc-check__inputs-checkbox label span { color: #019DF4; text-decoration: underline; cursor: pointer; } .checkout-cart__tyc .tyc-check__inputs-checkbox input[type=checkbox] { transform: scale(1.5); accent-color: #008EDD; } @media screen and (max-width: 739px) { .checkout-cart__tyc .tyc-check__inputs-checkbox input[type=checkbox] { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ } } .checkout-cart__tyc .tyc-button { display: flex; flex: 2; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 40px; /* 9 */ padding-left: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 40px; /* 9 */ padding-right: 2.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ height: max-content; } @media screen and (max-width: 739px) { .checkout-cart__tyc .tyc-button { padding-left: 0; padding-right: 0; } } .checkout-cart__tyc .tyc-button button { font-family: "Telefonica", sans-serif; } .msjPco { display: flex; margin-top: 20px; display: flex; background-color: #D8F1FF; padding: 10px; border-radius: 10px; font-size: 14px; } .msjPco img { margin-right: 10px; } .direccionTL { background-color: #f5f5f5; border-radius: 5px; border: none !important; font-size: 16px; padding: 10px 5px; column-gap: 1rem; margin-bottom: 10px; } .subtitle { font-size: 14px; line-height: 18px; } .checkoutTL { --color: #019DF4; --bg-color: #ffffff; --font-color: #313235; color: var(--font-color); } .checkoutTL .column.main { flex-direction: row; } @media screen and (max-width: 739px) { .checkoutTL .column.main { flex-direction: column-reverse; } } .checkoutTL .c-steps__name { min-width: auto; } .checkoutTL .ui-datepicker .ui-datepicker-header { width: 284px !important; } .checkoutTL .ui-datepicker-month, .checkoutTL .ui-datepicker-year { font-size: 14px; height: 30px; padding-left: 0px; padding-top: 0px; } .checkoutTL #container_email { display: block; text-align: left; padding: 13px; background: var(--bg-color); } .checkoutTL .c-form__box .term { margin-bottom: 0; } .checkoutTL .c-form__field { padding: 0px; } .checkoutTL .c-form__wrap-field.tl { column-gap: 0.9rem; } .checkoutTL .c-form__wrap-field.tl .i-information::before { font-size: 22px; } .checkoutTL .c-form__wrap-field.tl .check-text { font-size: 14px; } .checkoutTL .c-form__wrap-field.tl .color_grey { color: #50535A; } .checkoutTL .c-form__error-text { padding: 0; font-size: 12px; } .checkoutTL .modal-inner-wrap { margin-left: auto !important; left: 0 !important; } .checkoutTL select { font-size: 16px; max-width: 100%; height: 51px; width: 100%; padding-left: 12px; padding-top: 15px; position: relative; top: 0 !important; } .checkoutTL input:not(#envio):not(#cbx-sign-contract):not(#tycEntregaPorteria):not(.shapeButton):not(.select2-search__field):not(#tyc_pseEpayco):not(#tyc_tarjetaEpayco):not([type=radio]) { font-size: 18px !important; height: 51px; width: 100%; padding-left: 12px; padding-top: 15px; position: relative; top: 0 !important; } .checkoutTL .form__input:valid, .checkoutTL .is-error .c-form__input:invalid { top: 0 !important; } .checkoutTL .bg-white { background: var(--bg-color); } .checkoutTL #content-address { border: 1px solid var(--color); padding: 10px; cursor: pointer; border-radius: 5px; } .checkoutTL .i-home::before { color: var(--color); } .checkoutTL .dirRadio input { margin-left: 12px; } .checkoutTL .inputFocus { box-shadow: 4px 4px 4px 0px rgba(1, 157, 244, 0.12); } .checkoutTL #checkoutSubtotal { font-size: 20px; line-height: 20px; color: #000; } .checkoutTL #checkoutSubtotal ::before { left: 30px; } @media screen and (max-width: 600px) { .checkoutTL .tcBtn { flex-direction: column; } .checkoutTL .tcBtn div.u-width-50 { width: 100% !important; } .checkoutTL .tcBtn div.u-width-50 button { margin: auto; margin-top: 15px; } .checkoutTL .c-form__radio_card .c-form__radio-label::before { left: 30px !important; } .checkoutTL #c-checkoutSubtotal { flex-direction: column; } .checkoutTL .c1-checkoutSubtotal { margin-top: -15px; } } .checkoutTL .c-form__label { font-size: 18px !important; padding-left: 13px; } .checkoutTL .c-form__input:valid + .c-form__label { top: -26px !important; font-size: 14px !important; } .checkoutTL .c-form__icon::before { padding-right: 0.8rem; color: #B6B7B7; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .checkoutTL .c-form__icon_select::before { padding-right: 0.9rem; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 10px; /* 9 */ font-size: 0.625rem; /* 9 */ } .checkoutTL #boxDate label.c-form__label.label { font-size: 14px !important; top: -26px !important; } .checkoutTL .tl-entrega { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px 30px; /* 9 */ padding: 0.625rem 1.875rem; /* 9 */ background-color: #fff; border-radius: 5px; } @media screen and (max-width: 739px) { .checkoutTL .tl-entrega { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ } } .checkoutTL .tl-entrega__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 28px; /* 9 */ line-height: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ text-align: left; } @media screen and (max-width: 739px) { .checkoutTL .tl-entrega__title { text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 22px; /* 9 */ line-height: 1.375rem; /* 9 */ } } .checkoutTL .tl-entrega__options { display: flex; align-items: start; justify-content: flex-start; gap: 20px; } .checkoutTL .tl-entrega__options .c-form__radio-button-label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 10px; /* 9 */ gap: 0.625rem; /* 9 */ } @media screen and (max-width: 739px) { .checkoutTL .tl-entrega__options .c-form__radio-button-label { justify-content: center; } } .checkoutTL .tl-entrega__options .c-form__tercero { margin-bottom: 15px; margin-top: 10px; } .checkoutTL .tl-entrega .u-width-25-mb50 { width: 25%; /* 3 */ /* 3 */ /* 5 */ /* 5 */ margin-bottom: 0; /* 8 */ } @media screen and (max-width: 739px) { .checkoutTL .tl-entrega .u-width-25-mb50 { width: 50%; } } .checkoutTL .tl-entrega .u-width-45-mb50 { width: 45%; /* 3 */ /* 3 */ /* 5 */ /* 5 */ margin-bottom: 0; /* 8 */ } @media screen and (max-width: 739px) { .checkoutTL .tl-entrega .u-width-45-mb50 { width: 50%; } } .checkoutTL .c-form__field-address { margin-top: 0; } .checkoutTL .c-form__field-address .c-form__field:nth-of-type(1) { width: 100%; } .checkoutTL .c-form__field-address .c-form__box:nth-of-type(1) .c-form__field { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 140px; /* 9 */ width: 8.75rem; /* 9 */ } .checkoutTL .c-form__field-canvas { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .checkoutTL .full-address { display: flex; align-items: center; justify-content: space-between; padding: 10px; border: none; border-radius: 5px; } @media only screen and (max-width: 768px) { .checkoutTL .full-address { align-items: flex-start; } } .checkoutTL .full-address__box { text-align: left; } .checkoutTL .full-address__box-label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ margin-bottom: 0; } .checkoutTL .full-address__box-title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: bold; } .checkoutTL .full-address .edit-address-data { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .checkoutTL .full-address .edit-address-data span { cursor: pointer; text-decoration: underline; } .checkoutTL .full-address .edit-address-data span .only-desktop { display: inline; } @media only screen and (max-width: 768px) { .checkoutTL .full-address .edit-address-data span .only-desktop { display: none; } } .checkoutTL .tl-entrega__options { column-gap: 50px; } @media screen and (max-width: 739px) { .checkoutTL .tl-entrega { width: 95% !important; padding: 10px 25px !important; } .checkoutTL .tl-entrega__options { flex-direction: column; align-items: start; column-gap: 0px; } .checkoutTL .c-form__radio-button-label { justify-content: start !important; margin-bottom: 10px; } .checkoutTL .tl-entrega__title { margin-top: 5px; text-align: left !important; } } #modal-inactividad { padding: 15px; } #modal-inactividad .title { font-size: 40px; font-weight: 300; margin-top: 24px; } #modal-callejero { padding: 20px 24px 0 24px; } #modal-callejero .c-form__field { padding: 0px; } #modal-callejero .c-form__field-canvas { margin-bottom: 10px; } #modal-callejero .c-form__field-canvas .box-direccion { width: 50%; } @media screen and (max-width: 739px) { #modal-callejero .c-form__field-canvas { margin-bottom: 0; row-gap: 0; } #modal-callejero .c-form__field-canvas .c-form__box { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 16px; /* 9 */ margin-bottom: 1rem; /* 9 */ } #modal-callejero .c-form__field-canvas .box-direccion { width: 100%; } } #modal-callejero .c-form__field-address { margin-top: 0; } #modal-callejero .c-form__field-address .c-form__field:nth-of-type(1) { width: 100%; } #modal-callejero .c-form__actions { margin-top: 24px; justify-content: center; } #modal-callejero .m0-5 { top: 0; } #modal-callejero .u-width-100.left { text-align: left; font-weight: 600; } #modal-callejero label.c-form__label { padding-left: 10px; margin-top: 30px; top: -2rem !important; font-size: 14px !important; color: #019DF4; } #modal-callejero input { width: 100% !important; padding: 18px 10px 6px 10px !important; top: 0px; height: 43px !important; width: 100%; /*padding-left: 15px; padding-top: 10px; position: relative;*/ } #modal-callejero select { font-size: 16px; max-width: 100%; width: 100%; padding: 18px 35px 6px 10px !important; top: 0 !important; height: 43px !important; width: 100%; /*padding-left: 15px; padding-top: 10px; position: relative;*/ } #modal-callejero .c-form__input:focus + .c-form__label, #modal-callejero .c-form__input:focus + .select2 + .c-form__label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -32px; /* 9 */ top: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #019DF4; } .is-error #modal-callejero .c-form__input:focus + .c-form__label, .is-error #modal-callejero .c-form__input:focus + .select2 + .c-form__label { color: #FF374A; } #modal-callejero span.select2-selection.select2-selection--single { border: none !important; height: 43px !important; } #modal-callejero span.select2-selection__rendered { height: 43px !important; line-height: 60px !important; } #modal-callejero .select2-container--open .select2-dropdown { left: 17px !important; top: 1px !important; } #modal-callejero span.select2-selection__arrow { display: none !important; } #modal-callejero .c-form__icon { z-index: 1 !important; } .edit-customer-data { display: none; justify-content: flex-end; cursor: pointer; margin-bottom: 15px; } .edit-customer-data span { margin: 0 8px; color: #019DF4; text-decoration-line: underline; } .customer-section.no-edit .edit-customer-data, .pickup-section.no-edit .edit-customer-data, .address-section.no-edit .edit-customer-data { display: flex; } .customer-section.no-edit .c-form__box, .pickup-section.no-edit .c-form__box, .address-section.no-edit .c-form__box { pointer-events: none; opacity: 0.4; } .customer-section span.select2-selection__rendered, .pickup-section span.select2-selection__rendered, .address-section span.select2-selection__rendered { white-space: normal !important; } .addi-container .simple, .addi-container-flex .simple { text-align: left; } .addi-container .description-addi, .addi-container-flex .description-addi { text-align: left; } .addi-container-flex .description-addi .description { margin-left: 10px; } .addi-container-flex .description-addi img { margin-right: 15px !important; } .addi-advice { display: flex; gap: 1rem; } .addi-advice-buy { text-align: left; margin-bottom: 1rem; } .input-addi-width { width: 50%; } @media only screen and (max-width: 500px) { .input-addi-width { width: 100%; } .long-text-epayco { max-width: 230px; } } #modal-terms_conditions_delivery .check-form-title_delivery { font-size: 28px; } #modal-terms_conditions_delivery .check-form-title_delivery, #modal-terms_conditions_delivery .check-form-subtitle_delivery { color: #0B2739; font-weight: normal; } .catalog-product-view { --bg-color: #066FCB; --color: #86888C; --bg-color2: #f5f5f5; } .catalog-product-view .d-flex { display: flex; } .catalog-product-view .c-header-wrap { position: relative; z-index: 9 !important; } .catalog-product-view .content-tabs > div:first-child { border-radius: 4px 0 0 0; border: 1px solid #D3D4D3; } .catalog-product-view .content-tabs > div:last-child { border-radius: 0 4px 0 0; border: 1px solid #D3D4D3; } .catalog-product-view .tab-purchase { color: var(--color); text-align: center; width: 100%; padding: 13px 20px; padding: 13px 20px; font-weight: 700; font-size: 12px; line-height: 16px; font-weight: 800; cursor: pointer; position: relative; flex: 1; text-align: center; } .catalog-product-view .tab-purchase.active { background-color: var(--bg-color); color: white; } .catalog-product-view .tab-purchase.active:after { border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(136, 183, 213, 0); border-top-color: var(--bg-color); border-width: 10px; left: 50%; transform: translateX(-50%); margin-top: 29px; } .catalog-product-view .content-tabs-info { width: 100%; text-align: left; background-color: var(--bg-color2); color: #313235; padding: 9px 0; margin-bottom: 10px; } .catalog-product-view .content-tabs-info .i-alert { width: 14px; height: 14px; margin: 4px 8px; } .catalog-product-view .text-purchase { width: 95%; display: none; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } .catalog-product-view .text-purchase.active { display: block; } .catalog-product-view .BlockTyC { font-weight: 400; font-size: 12px; line-height: 20px; margin-left: 10px; } .catalog-product-view .tab-purchase.hideTab { pointer-events: none; } .catalog-product-view .desde { color: #50535A; font-size: 14px; font-weight: 400; margin-bottom: 0; } .catalog-product-view .u-width-60 { width: 60% !important; } .catalog-product-view .u-width-55 { width: 55% !important; } .catalog-product-view .u-width-40 { width: 40% !important; } .catalog-product-view span#truck-stroke { font-size: 40px; margin-left: 5px; } .catalog-product-view .delivery { color: #313235; font-size: 12px; line-height: 16px; margin-left: 5px; } @media (min-width: 768px) { .catalog-product-view .delivery { margin-right: 15px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ } } @media (max-width: 500px) { .catalog-product-view .delivery { line-height: 12px; } } .catalog-product-view .border-left { border-left: 1px solid #d3d4d3; } .catalog-product-view .content-left { justify-content: left !important; } .catalog-product-view p.c-card-detail__number { margin-bottom: 0; } .catalog-product-view .align-items-center { align-items: center; justify-content: space-between; } @media (max-width: 768px) { .catalog-product-view .align-items-center { justify-content: center; gap: 7px; } } .catalog-product-view .c-card-vertical-line { width: 2px; height: 48px; align-self: center; /* 3 */ /* 3 */ /* 5 */ /* 5 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 0 8px; /* 9 */ margin: 0 0.5rem; /* 9 */ background-color: #D3D4D3; } .catalog-product-view button#button-buy-now { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 287px; /* 9 */ min-width: 17.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 56px; /* 9 */ min-height: 3.5rem; /* 9 */ margin-left: 0; background-color: var(--bg-color); } @media only screen and (max-width: 768px) { .catalog-product-view button#button-buy-now { margin: 25px auto 25px; } } .catalog-product-view .hr-carddetails { border-color: #EEEEEE; opacity: 0.4; margin-bottom: 14px; margin-top: -10px; } .catalog-product-view .shipping-method { -webkit-box-pack: left; -ms-flex-pack: left; -webkit-justify-content: left; -moz-justify-content: left; justify-content: left; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ /* 5 */ /* 5 */ margin: 10px 0; /* 9 */ margin: 0.625rem 0; /* 9 */ -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .catalog-product-view .shipping-method span#i-home-stroke { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 25px; /* 9 */ font-size: 1.5625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 10px; /* 9 */ margin-right: 0.625rem; /* 9 */ } .catalog-product-view .shipping-method strong { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .catalog-product-view .shipping-time { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #000; display: flex; } .catalog-product-view .shipping-time a { color: #019DF4; text-decoration-line: underline; font-weight: 700; margin-left: 10px; } .catalog-product-view .tyc-ficha-equipo { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .catalog-product-view .tyc-ficha-equipo img.i-alert { width: 28px; height: 28px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 10px; /* 9 */ margin-right: 0.625rem; /* 9 */ } .catalog-product-view .tyc-ficha-equipo .text-alert { color: #50535A; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ font-weight: 400; } .catalog-product-view .i-truck-stroke { margin-right: 10px; } .catalog-product-view .i-truck-stroke::before { color: var(--bg-color); } @media only screen and (max-width: 768px) { .catalog-product-view .tab-purchase { padding: 12px 20px; font-size: 14px; } .catalog-product-view .tab-purchase.active:after { margin-top: 27px; } .catalog-product-view .c-card-detail__price .u-width-40 { width: 100% !important; } .catalog-product-view .c-card-detail__price .i-truck-stroke { margin-right: 5px; } } @media only screen and (max-width: 767px) { .catalog-product-view { /*.c-card-detail__number{ @include px-to-rem(font-size, 30px); }*/ } .catalog-product-view .shipping-time { flex-direction: column; gap: 5px; } .catalog-product-view .shipping-time a { margin-left: 0px; } .catalog-product-view span#truck-stroke { font-size: 40px; } } @media only screen and (max-width: 767px) and (max-width: 768px) { .catalog-product-view span#truck-stroke { margin: 0; } } @media only screen and (max-width: 767px) { .catalog-product-view button#button-buy-now { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 215px; /* 9 */ min-width: 13.4375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 48px; /* 9 */ min-height: 3rem; /* 9 */ } } .catalog-product-view #button-call-now { height: 50px; min-width: 180px; } .catalog-product-view #button-call-now.o-btn { background-color: var(--bg-color); } .catalog-product-view #button-call-now.o-btn:disabled { background-color: #80CEF9; } .catalog-product-view .buttonCerrarTypC2C { background-color: var(--bg-color); } .catalog-product-view .c-card-container-btn-c2c .c-form__input { width: 95%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } .catalog-product-view .c-card-container-btn-c2c p { font-size: 16px !important; margin-bottom: 15px !important; } .catalog-product-view .c-card-container-btn-c2c .c-form__checkbox-label .tratamientoFichaEquipo { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #50535A !important; line-height: normal; } .catalog-product-view .BlockPayments { padding: 10px; border-style: solid; border-color: #DDDDDD; margin: 25px 0; border-radius: 14px; font-weight: 600; } .catalog-product-view .o-modal__header .i-information { color: red; text-align: center; font-size: 50px; line-height: normal; } .catalog-product-view .o-modal__content .textTratamiento { font-size: 24px; font-weight: 300; line-height: 24px; color: #0B2739; } .catalog-product-view .infoProductModal { display: flex; color: #0B2739; align-items: center; margin-top: 20px; padding-bottom: 20px; border-bottom: 1px solid #D3D4D3; } .catalog-product-view .infoProductModal ul { list-style: none; } .catalog-product-view .infoProductModal .title { font-size: 20px; line-height: 28px; font-weight: 700; width: 200px; margin-left: 30px; } .catalog-product-view .infoProductModal .info { font-size: 18px; line-height: 24px; font-weight: 400; } .modal-calculate-time { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 30px; /* 9 */ padding-top: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ padding: 10px; } .modal-calculate-time .o-headline { font-weight: 300; } .modal-calculate-time .o-btn { color: #019DF4; background-color: transparent; border: 1px solid #019DF4; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 12px; /* 9 */ margin-top: 0.75rem; /* 9 */ } .modal-calculate-time small { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .modal-calculate-time .o-modal__txt { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .modal-calculate-time #date-estimate { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 20px; /* 9 */ line-height: 1.25rem; /* 9 */ font-weight: bold; } .modal-calculate-time .c-form__field { padding: 16px 12px 0 12px; } .modal-calculate-time .c-form__input { top: 0; } .modal-calculate-time label.c-form__label.label.c-form-clone-select { padding-left: 12px; padding-top: 10px; } .modal-calculate-time h3.o-headline.o-headline__line-height { margin-bottom: 0 !important; } .modal-calculate-time .logo-movistar-modal-calcular-tiempo { margin-bottom: 0px; width: 40%; } .modal-calculate-time .c-form__box { margin-bottom: 12px; } .modal-calculate-time header.o-modal__header.o-modal__header-marginb { margin-bottom: 12px !important; } .modal-calculate-time button#btn-close-modal-calculate-time { padding: 8px 24px; } .modal_title_bancolombia { font-size: 26px; } .tyc_modal_bancolombia { font-size: 14px !important; text-align: center !important; } .tyc_box_modal_bancolombia { display: flex; gap: 1rem; margin-top: 0.5rem; align-items: center; } .tyc_interceptor_modal_bancolombia { border-left: 1px solid #2C2A29; height: 30px; } .icon_movistar_modal_bancolombia { width: 28px; } .marca_registrada_bancolombia { position: absolute !important; bottom: 0; left: 0; } .box-modal_icon_center_bancolombia { text-align: center !important; margin-top: 1rem !important; } .box-modal_paragraph_bancolombia { font-size: 16px !important; line-height: 1.5 !important; margin-bottom: 2rem !important; } .box-modal_width_selector_bancolombia { width: 80% !important; margin: 0 auto !important; } .o-modal__btn-close-bancolombia { position: absolute; top: 0; right: 0; padding: 13px 16px 0 0; } #libres-empty-cart { display: flex; align-items: center; justify-content: center; flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 80px; /* 9 */ margin-top: 5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 144px; /* 9 */ margin-bottom: 9rem; /* 9 */ } @media screen and (max-width: 739px) { #libres-empty-cart { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 80px; /* 9 */ margin-bottom: 5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ } } #libres-empty-cart img, #libres-empty-cart h2 { margin-left: auto; margin-right: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } #libres-empty-cart h2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ font-weight: 300; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 48px; /* 9 */ line-height: 3rem; /* 9 */ color: #313235; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 400px; /* 9 */ max-width: 25rem; /* 9 */ } #libres-empty-cart .add-product-btn a { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: 700; } .pospago-portabilidad-sim .select2-container, .pospago-prepos-datos .select2-container, .movistartotal-pospago-index .select2-container, .esim-identidad-index .select2-container { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 8px; /* 9 */ top: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .pospago-portabilidad-sim .select2-container .selection .select2-selection--single, .pospago-prepos-datos .select2-container .selection .select2-selection--single, .movistartotal-pospago-index .select2-container .selection .select2-selection--single, .esim-identidad-index .select2-container .selection .select2-selection--single { background-color: transparent !important; border: none; } .pospago-portabilidad-sim .select2-container .selection .select2-selection--single .select2-selection__rendered, .pospago-prepos-datos .select2-container .selection .select2-selection--single .select2-selection__rendered, .movistartotal-pospago-index .select2-container .selection .select2-selection--single .select2-selection__rendered, .esim-identidad-index .select2-container .selection .select2-selection--single .select2-selection__rendered { padding-left: 0; white-space: normal; } .pospago-portabilidad-sim .select2-container .selection .select2-selection--single .select2-selection__arrow, .pospago-prepos-datos .select2-container .selection .select2-selection--single .select2-selection__arrow, .movistartotal-pospago-index .select2-container .selection .select2-selection--single .select2-selection__arrow, .esim-identidad-index .select2-container .selection .select2-selection--single .select2-selection__arrow { display: none; } .pospago-portabilidad-sim .select2-container .select2-dropdown, .pospago-prepos-datos .select2-container .select2-dropdown, .movistartotal-pospago-index .select2-container .select2-dropdown, .esim-identidad-index .select2-container .select2-dropdown { border: 1px solid #019DF4; border-top: none; } .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-search--dropdown, .pospago-prepos-datos .select2-container .select2-dropdown .select2-search--dropdown, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-search--dropdown, .esim-identidad-index .select2-container .select2-dropdown .select2-search--dropdown { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 20px; /* 9 */ padding-right: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 15px; /* 9 */ padding-left: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-search__field, .pospago-prepos-datos .select2-container .select2-dropdown .select2-search__field, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-search__field, .esim-identidad-index .select2-container .select2-dropdown .select2-search__field { border: 1px solid #019DF4; border-radius: 4px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 5px; /* 9 */ padding-top: 0.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 5px; /* 9 */ padding-bottom: 0.3125rem; /* 9 */ } .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar, .pospago-prepos-datos .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar, .esim-identidad-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar { -webkit-appearance: none; width: 8px; } .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button, .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button:increment, .pospago-prepos-datos .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button, .pospago-prepos-datos .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button:increment, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button:increment, .esim-identidad-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button, .esim-identidad-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-button:increment { display: none; } .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-track, .pospago-prepos-datos .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-track, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-track, .esim-identidad-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-track { background-color: #EEEEEE; } .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-thumb, .pospago-prepos-datos .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-thumb, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-thumb, .esim-identidad-index .select2-container .select2-dropdown .select2-results__options::-webkit-scrollbar-thumb { background-color: #008EDD; border-radius: 2px; border: 1px solid #008EDD; } .pospago-portabilidad-sim .select2-container .select2-dropdown .select2-results__options li, .pospago-prepos-datos .select2-container .select2-dropdown .select2-results__options li, .movistartotal-pospago-index .select2-container .select2-dropdown .select2-results__options li, .esim-identidad-index .select2-container .select2-dropdown .select2-results__options li { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ } #formShipping span.select2-selection.select2-selection--single { border: none !important; height: 50px !important; } #formShipping span.select2-selection__rendered { height: 50px !important; line-height: 65px !important; } #formShipping .select2-container--open .select2-dropdown { left: 17px !important; top: 1px !important; } #formShipping span.select2-selection__arrow { display: none !important; } #formShipping .c-form__icon { z-index: 1 !important; } #formShipping .select2-container--disabled .select2-selection--single { background-color: #fff; } #formShipping label.isValid { font-size: 14px !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ } .select2-tlibre { margin-left: -1px !important; margin-top: 1px !important; border: 1px solid #019DF4; } .select2-tlibre .select2-dropdown { border: 1px solid #019DF4; } .select2-tlibre .select2-dropdown .select2-search { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 6px; /* 9 */ padding: 0.375rem; /* 9 */ } .select2-tlibre .select2-dropdown .select2-search__field { border: 1px solid #019DF4 !important; } .select2-tlibre .select2-results__options::-webkit-scrollbar { -webkit-appearance: none; width: 8px; } .select2-tlibre .select2-results__options::-webkit-scrollbar-button, .select2-tlibre .select2-results__options::-webkit-scrollbar-button:increment { display: none; } .select2-tlibre .select2-results__options::-webkit-scrollbar-track { background-color: #EEEEEE; } .select2-tlibre .select2-results__options::-webkit-scrollbar-thumb { background-color: #008EDD; border-radius: 2px; border: 1px solid #008EDD; } .select2-tlibre .select2-results__options li { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ word-wrap: break-word; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } .starability-basic { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; } .starability-basic > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-basic > input:checked ~ label, .starability-basic > input:focus ~ label { background-position: 0 0; } .starability-basic > input:checked + label, .starability-basic > input:focus + label { background-position: 0 -30px; } .starability-basic > input[disabled]:hover + label { cursor: default; } .starability-basic > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-basic > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-basic > input:not([disabled]):hover + label::before { opacity: 1; } .starability-basic > input:focus + label { outline: 1px dotted #999; } .starability-basic .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-basic > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-basic > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-basic > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-basic > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-basic > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-basic > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-basic > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-basic > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-basic > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-basic { width: auto; } .starability-basic > input { position: static; margin-right: 0; opacity: 1; } .starability-basic .input-no-rate { display: none; } .starability-basic > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-basic > label::before, .starability-basic > label::after { display: none; } } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } .starability-slot { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; } .starability-slot > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-slot > input:checked ~ label, .starability-slot > input:focus ~ label { background-position: 0 0; } .starability-slot > input:checked + label, .starability-slot > input:focus + label { background-position: 0 -30px; } .starability-slot > input[disabled]:hover + label { cursor: default; } .starability-slot > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-slot > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-slot > input:not([disabled]):hover + label::before { opacity: 1; } .starability-slot > input:focus + label { outline: 1px dotted #999; } .starability-slot .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-slot > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-slot > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-slot > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-slot > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-slot > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-slot > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-slot > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-slot > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-slot > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-slot { width: auto; } .starability-slot > input { position: static; margin-right: 0; opacity: 1; } .starability-slot .input-no-rate { display: none; } .starability-slot > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-slot > label::before, .starability-slot > label::after { display: none; } } .starability-slot > input:checked ~ label, .starability-slot > input:hover ~ label, .starability-slot > input:focus ~ label { transition: background-position 0.7s; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @keyframes grow { 0% { transform: scale(1, 1); } 70% { transform: scale(3, 3); opacity: 0; } 100% { transform: scale(1, 1); opacity: 0; } } .starability-grow { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; will-change: contents; } .starability-grow > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-grow > input:checked ~ label, .starability-grow > input:focus ~ label { background-position: 0 0; } .starability-grow > input:checked + label, .starability-grow > input:focus + label { background-position: 0 -30px; } .starability-grow > input[disabled]:hover + label { cursor: default; } .starability-grow > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-grow > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-grow > input:not([disabled]):hover + label::before { opacity: 1; } .starability-grow > input:focus + label { outline: 1px dotted #999; } .starability-grow .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-grow > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-grow > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-grow > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-grow > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-grow > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-grow > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-grow > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-grow > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-grow > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-grow { width: auto; } .starability-grow > input { position: static; margin-right: 0; opacity: 1; } .starability-grow .input-no-rate { display: none; } .starability-grow > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-grow > label::before, .starability-grow > label::after { display: none; } } .starability-grow > label::after { content: " "; position: absolute; opacity: 0; width: 30px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; bottom: 0; left: 0; } @media screen and (min-resolution: 192dpi) { .starability-grow > label::after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } .starability-grow > input:checked + label::after { background-position: 0 -30px; opacity: 1; animation-duration: 1s; animation-name: grow; animation-fill-mode: forwards; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @keyframes grow-rotate { 0% { transform: scale(1, 1) rotate(0deg); } 99% { transform: scale(4, 4) rotate(90deg); opacity: 0; } 100% { transform: scale(1, 1) rotate(0deg); opacity: 0; } } .starability-growRotate { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; will-change: contents; } .starability-growRotate > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-growRotate > input:checked ~ label, .starability-growRotate > input:focus ~ label { background-position: 0 0; } .starability-growRotate > input:checked + label, .starability-growRotate > input:focus + label { background-position: 0 -30px; } .starability-growRotate > input[disabled]:hover + label { cursor: default; } .starability-growRotate > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-growRotate > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-growRotate > input:not([disabled]):hover + label::before { opacity: 1; } .starability-growRotate > input:focus + label { outline: 1px dotted #999; } .starability-growRotate .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-growRotate > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-growRotate > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-growRotate > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-growRotate > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-growRotate > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-growRotate > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-growRotate > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-growRotate > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-growRotate > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-growRotate { width: auto; } .starability-growRotate > input { position: static; margin-right: 0; opacity: 1; } .starability-growRotate .input-no-rate { display: none; } .starability-growRotate > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-growRotate > label::before, .starability-growRotate > label::after { display: none; } } .starability-growRotate > label::after { content: " "; position: absolute; opacity: 0; width: 30px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; bottom: 0; left: 0; } @media screen and (min-resolution: 192dpi) { .starability-growRotate > label::after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } .starability-growRotate > input:checked + label::after { background-position: 0 -30px; opacity: 1; animation-duration: 1s; animation-name: grow-rotate; animation-fill-mode: forwards; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @keyframes fade { 0% { transform: translateY(30px); } 80% { opacity: 100%; } 100% { transform: none; opacity: 0; } } .starability-fade { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; will-change: contents; } .starability-fade > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-fade > input:checked ~ label, .starability-fade > input:focus ~ label { background-position: 0 0; } .starability-fade > input:checked + label, .starability-fade > input:focus + label { background-position: 0 -30px; } .starability-fade > input[disabled]:hover + label { cursor: default; } .starability-fade > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-fade > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-fade > input:not([disabled]):hover + label::before { opacity: 1; } .starability-fade > input:focus + label { outline: 1px dotted #999; } .starability-fade .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-fade > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-fade > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-fade > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-fade > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-fade > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-fade > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-fade > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-fade > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-fade > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-fade { width: auto; } .starability-fade > input { position: static; margin-right: 0; opacity: 1; } .starability-fade .input-no-rate { display: none; } .starability-fade > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-fade > label::before, .starability-fade > label::after { display: none; } } .starability-fade > label::after { content: " "; position: absolute; opacity: 0; width: 30px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; bottom: 30px; left: 0; } @media screen and (min-resolution: 192dpi) { .starability-fade > label::after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } .starability-fade > input:checked + label::after { opacity: 1; animation-name: fade; animation-duration: 1s; animation-fill-mode: forwards; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @keyframes checkmark { 0% { transform: translateX(-15px); } 60% { opacity: 1; } 70% { transform: none; } 80% { opacity: 1; } 100% { opacity: 0; } } .starability-checkmark { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; } .starability-checkmark > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-checkmark > input:checked ~ label, .starability-checkmark > input:focus ~ label { background-position: 0 0; } .starability-checkmark > input:checked + label, .starability-checkmark > input:focus + label { background-position: 0 -30px; } .starability-checkmark > input[disabled]:hover + label { cursor: default; } .starability-checkmark > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-checkmark > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-checkmark > input:not([disabled]):hover + label::before { opacity: 1; } .starability-checkmark > input:focus + label { outline: 1px dotted #999; } .starability-checkmark .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-checkmark > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-checkmark > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-checkmark > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-checkmark > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-checkmark > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-checkmark > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-checkmark > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-checkmark > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-checkmark > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-checkmark { width: auto; } .starability-checkmark > input { position: static; margin-right: 0; opacity: 1; } .starability-checkmark .input-no-rate { display: none; } .starability-checkmark > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-checkmark > label::before, .starability-checkmark > label::after { display: none; } } .starability-checkmark > label { z-index: 2; } .starability-checkmark > label::after { content: " "; position: absolute; opacity: 0; width: 30px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzM4MUFFNkVFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzM4MUFFNkZFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowMjVDOUVGRkUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowMjVDOUYwMEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PrdrnzwAAAI6SURBVHja7Jc9SwNBEIZnL+qBIopgE7EKgtjY+gcsRA2JkEItbGxEooU2xkIs1EZBDFrZiY0pjFGwEfEviI2NpWkEEQRJIt46s4l4d9ndu5zRNB4c5D52npvZmXknjHMOjTgMaNDRMHCT/YIxpn5zLxaGdx4Dbo3hmxG8E648yQPwB2DGBTSzLCxk8yoT9m1ljgsZmIClj3XgMOvLFQaH0BJak32Af/BOdBwsOMYl7bUFkr3iJk7DUu5cBVbv8XY0CRbP1Q4ViHaxlmyoPk3qsfCUoPVIXxb98lwfatrTonUfzFNF2E2jn/ZcH2pKpLpBK2EXNnWhTsfR24/HH1De8GyVPjFDPTx5mpd7THUaOKKQReN9+ONW+txl2wkWzSEQ9BLaOidF7ZrmMF4/V0fcadu1x6IjBYFOwNxRoZwjhVVsNl2SFyO6Xh1WA9gJninXvRsHdHt8F6GLCgvh2kWCsczTyOgULOe2wDDmv6EdIz6hnuqkavC93ddX5RJbOjsQTcE04zbohg9oXgNGlZHLyhAUijeQTnSW4diJkpkXGzTlo54f1GCSNvXCQQHfS3Tb+vmKP2i1bYceCz0twr4WXiJ4bBhK1gxGYtN39pNtpcdUh6Sn2ojxAWyBdzVByaZLn6uzmkScGrsWLqtTjUgIm14zF30ZiXj9prpp2TQir2PKWsYWfq6IaMM1hXg3kOVcWtSrV9iVow+uJRuBxlv6WhJxr4RzJxKtUXjqf8r8i/H2/y/Mbx6fAgwA8wT2yCo9WaMAAAAASUVORK5CYII="); background-repeat: no-repeat; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzM4MUFFNkVFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzM4MUFFNkZFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowMjVDOUVGRkUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowMjVDOUYwMEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PrdrnzwAAAI6SURBVHja7Jc9SwNBEIZnL+qBIopgE7EKgtjY+gcsRA2JkEItbGxEooU2xkIs1EZBDFrZiY0pjFGwEfEviI2NpWkEEQRJIt46s4l4d9ndu5zRNB4c5D52npvZmXknjHMOjTgMaNDRMHCT/YIxpn5zLxaGdx4Dbo3hmxG8E648yQPwB2DGBTSzLCxk8yoT9m1ljgsZmIClj3XgMOvLFQaH0BJak32Af/BOdBwsOMYl7bUFkr3iJk7DUu5cBVbv8XY0CRbP1Q4ViHaxlmyoPk3qsfCUoPVIXxb98lwfatrTonUfzFNF2E2jn/ZcH2pKpLpBK2EXNnWhTsfR24/HH1De8GyVPjFDPTx5mpd7THUaOKKQReN9+ONW+txl2wkWzSEQ9BLaOidF7ZrmMF4/V0fcadu1x6IjBYFOwNxRoZwjhVVsNl2SFyO6Xh1WA9gJninXvRsHdHt8F6GLCgvh2kWCsczTyOgULOe2wDDmv6EdIz6hnuqkavC93ddX5RJbOjsQTcE04zbohg9oXgNGlZHLyhAUijeQTnSW4diJkpkXGzTlo54f1GCSNvXCQQHfS3Tb+vmKP2i1bYceCz0twr4WXiJ4bBhK1gxGYtN39pNtpcdUh6Sn2ojxAWyBdzVByaZLn6uzmkScGrsWLqtTjUgIm14zF30ZiXj9prpp2TQir2PKWsYWfq6IaMM1hXg3kOVcWtSrV9iVow+uJRuBxlv6WhJxr4RzJxKtUXjqf8r8i/H2/y/Mbx6fAgwA8wT2yCo9WaMAAAAASUVORK5CYII="); } @media screen and (min-resolution: 192dpi) { .starability-checkmark > label::after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTgyRjdBNDlFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTgyRjdBNEFFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDMzgxQUU3OEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFODJGN0E0OEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvR97twAAARDSURBVHja7JvNaxNBFMDfbEvaDQQaPFUQBYvkD7D1ZtUKVSGJhVILft16UA9qogdRKKgXm9CLCnqrLVilUJOiUJTqVT0VLz3Ugz3YU2mh0MQiWefNJqVps5Od2dnN1mQgodm0M++37828ry0xDAPqaWhQZ6MB3ABuAO/t0Wz1BSHE+ezPruiQXzsNBThFP0WAQAcYEAYwQsVV1um1VXptkX5YoLd/DlrbPsH1VzmnS1t5H2L5hSzw0wth+LMRpxD46qVXdMEZcvQmzNJXBlqCGbjxZtWfwKjN3FqCLnWXgoaU2B+Bdfr2BPS2tKjW3QVOxYbo+zBdpd2VjUfIMps/mX1ZW+DR/v3wd/Mdnb7TmyOHfIfmwHm4NfXbe+BU/Biddto1rXK1TfogmfkqAyznltKxS2AUPnsOa5K0s7VRBpn7JaxhXKhgjPsjiiCXIZGdcM+k0Yzx7oq7GrcGdWHayUrm7dyk8YDCPesfWDBloTIx2VSHlnga12LP2tnTzFOoBGZ+1ivXI0XdWYwFFBxaZgT105fa3emu9LbDpYhMfg9juOh32JJps9DWiYYxEchv/FIWG7uuZRp7twYPYsIhp2Ez6wnVyEQxZdwU0zKVFWWWPrQwxauNpn5Aq94FmjYoAR2XM+nnV3XYWF3x3O8y2GD3Vh6cjvdBoTBJfwrYDkaC4X3GtbGcmIaxUuE5LDXjppYzZUl/IjMtqGm9KLugSZtlGY9hA92VUr+3By6+p78wb3sujuy8PRzx0IyXrGBxDCxNjAkGPhFxYCy4eQWrQY9lUp+KvaY+dlBwzg5xYFZddFCZ0EjSVnSEsLdnFpXBVpGdY9JGSBpW13tpnppm+arVYcNgjePWsNEXUrBVZFdciC/Clk5ZTM4rnrBkhQKf5cPCkBs7iANM1oX953bYMrdC+pl/LMFqpIden3cP1lp23qElWgA/BPn8kYrfJLIzFPKceUBxYEdio0o0y5Gdd2gtCsexUPgI6dgJC+gvoIcjXFgwbqrJnKxl5+3hBYmFQlAwPlhCW3UPUtHHymCryK5xdvecdJ3JhI7aq6ZQWAPuKT6Z5sSBsYu3ddBIQU+xwJ9fOrqvHBZlNmUXBEbzwy6e/AiwLGckOmANazx0IXKb5TXetCp/nHG4PKZ047u6BOlYwhVYGzLzgbE/y1qWDqGxU1GqKiJswUi5VuJBmaVrWqpNj5BJ+XDR1vwPIJl9xByGdNUSm9Fmf1aBf3QVdpnJKh9alvnOYfD/GLbzlID9ZtpI7Jt/uw80abmT7So3JqfNNOy8qzJt1aaMsjnPlnYMVpEgfQ6CETdGjslk4xEIuXwY+7AaGfINLspS5dEH5wUAltSzSkaupprldP/VHFq7QsN6eqilZN5NgaPshPTyNMY1Bc1YjYbLE4E6eTBt+6irRw+3j7p5uNRK63vl8eH/dTT+BaAB3ABuAO+p8U+AAQA0fxy2fEEf3gAAAABJRU5ErkJggg=="); background-size: 30px auto; } } .starability-checkmark > label:nth-of-type(5)::after { right: -45px; } .starability-checkmark > label:nth-of-type(4)::after { right: -75px; } .starability-checkmark > label:nth-of-type(3)::after { right: -105px; } .starability-checkmark > label:nth-of-type(2)::after { right: -135px; } .starability-checkmark > label:nth-of-type(1)::after { right: -165px; } .starability-checkmark > input:checked + label::after { display: inline-block; animation-name: checkmark; animation-duration: 0.7s; animation-fill-mode: forwards; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @keyframes heart { 0% { transform: translateY(15px); opacity: 1; } 30% { transform: translateY(0); opacity: 0.7; } 45% { transform: translateY(0); transform: scale(1.1, 1.1); } 50% { transform: scale(0.9, 0.9); } 80% { opacity: 0.9; } 100% { transform: scale(0.1, 0.1); opacity: 0; } } .starability-heart { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; will-change: contents; } .starability-heart > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-heart > input:checked ~ label, .starability-heart > input:focus ~ label { background-position: 0 0; } .starability-heart > input:checked + label, .starability-heart > input:focus + label { background-position: 0 -30px; } .starability-heart > input[disabled]:hover + label { cursor: default; } .starability-heart > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-heart > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-heart > input:not([disabled]):hover + label::before { opacity: 1; } .starability-heart > input:focus + label { outline: 1px dotted #999; } .starability-heart .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-heart > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-heart > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-heart > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-heart > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-heart > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-heart > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-heart > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-heart > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-heart > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-heart { width: auto; } .starability-heart > input { position: static; margin-right: 0; opacity: 1; } .starability-heart .input-no-rate { display: none; } .starability-heart > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-heart > label::before, .starability-heart > label::after { display: none; } } .starability-heart > label::after { content: " "; position: absolute; opacity: 0; width: 30px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAcCAYAAAB2+A+pAAAAAXNSR0IArs4c6QAAAsJJREFUSA29lt9LFFEUx8+5u+5CLUEstlRsO5tKPvXjRXoSQpDUfiAhQS9FEIo+CP0Dbe+9FBIZEfgSRL2k4RbUq0S+SBBRGeOmmUJF6Ja67s7pnLE7O667Nis5A8M598z3nM+cuXdmLkLJMVfXuWepsHwBAc4TwF4k2AlAPxHxBREMG5l0uiTFHk4d7Oggq3Ca9S0c2A0Ii0Awi6ge1oQCD/Z9GPnmzuP6xSNjtPcTWTcYGCxG13sI+DgQiXTH3z76IVdmGjuj+aXlQQI6t17pGiGs8o1fNcz0gI7aYOrqCmTGs3eJ6LK+sJnlIu8SQTgmmkyeJvhJNG6md64hDBqXjvdiKmXZYO602yLrjiPw4qC6bsvIuuZFrjWo1BXDHL2H3+vbdi3kYRKIavVFTxYxZ+uIQp70WoQ4HwnXNAQX8tgHZFUHlSLVAjWYKJZdyfUpBKtVx/yyPL+tipf8Ib+ADocXoyLEqBPwyRGm4hf+l088B4NEWcWrZNaJ+Od8ZTCO+cfTJBxTEMDneuibZaZKKHrKn8A5v6DCEqbCyfQKAd7yCywsYfIcA0TCwQH+68xsN1wYwhKODa59P7yICnq3HcwMYTlgcRJmegQQh7YNzrVtxl+A3XERFuvhyX9VHP8fb61mrMddzf4fuwPzyTOx37T6mv8+B9zxLfuIn3dgTVPMHJ531yjpGEAEKqRO8GPPuIVb8rmG1CqFSq0NHWvAl7qz8Vwh95I7b9Cxqizix1Ag1LL/05PpcnkbOtaitQRs5s7HdcyztXOwuRJU6lTsWEOovi2cycPtKjaC93kj2CsfCV2jnP0nWCeZRjuvSrpZcctj78GwPzk16mnT6BksNzCdPHm4QDjE3R/VNySWX5eJANLFuPnsjTu+mV9xjsslSeFENN7EG7UUT9KqnOJLrBpoudqeYzPJU0fk9JxQIvwDg4rmetWjBsMAAAAASUVORK5CYII="); background-repeat: no-repeat; bottom: 30px; left: 0; z-index: 2; } @media screen and (min-resolution: 192dpi) { .starability-heart > label::after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA4CAYAAAChbZtkAAAAAXNSR0IArs4c6QAABddJREFUaAXtmm1sFEUYx+fZu4NS2gDie0pvryDFD6gJMegXbf0gfREMJASjCTFIQKEi0QTUD1q/+IKJRi1GjfhCjGJIgNj0rgoR0EQNSQ2JUQgpvb0rxhqwgLZY6d2O/2ftlOv1Xna9vZO7c5LLvD3zzP+3Mzt7uzMkbAbZ3q717/xukSmpSUhxO35+IWStEKQhHkF8VpD4gYQ8Kr2+Tr2383ubrlOaReuabo2bdA9830ySFsJoFtJTJFGcpIgib+D3LX4hvxE8SoRSG4Gy2ZyuX1Y9PDK6DnabpZA12exVPQQcE1J2+AO3vUOH2mOqPFMsF63zRQf7HzalaEPb+ZlsE+uIhIH+XvFd4d1xfU/nhcS65HRG4LDe8iBG7FUp5czkhnbzDO4R4pE5RuhwpjbG3Oa7ZFy+iZlTn8kuUx0JOoMZsClgBD9JZ5cSOLKwdZb5R/wDdL4sXUMn5egkRqS1Yeq9naqd4W/agFvidcwgXJvcA0Z8d7WX1s7uDf2e7G0S8KkFy2fHRkYOYFRvSTbONU+atkUPB19O9BPWm57EhX0hscyVNIkjQlQsCRj7ziX6mwA8WLdyxnlz6GvcP7xIuB4w5UzSqMkfDu5n59FA892mKUIYWSx87gf011NZVdVw9Y+7h5T3CcCGv/kjdP6AqsxLTHR6+vSqOvY9PDzUh4t7VV76GXOKNeR93QitUX2MA0f15lVxKXepinzGGtFW+CdTyhfz2Y/yDcgVeqR7L+ctYH4cRM709zl57Chn/yrGKFvt8jy649qIIrq+eB4/Hq17Jzp46r6CwbIKBi0U7D/9+Q3jyEpOWsBYkR/nTCkHkvIJ5qOf594752Lsr2gpwyo271RvjRYzRxtUQanH5misUcN0bix1UMUnTa1Bw7+cG1RB6ceyXhMkryx90DFCsGKEqXyAwapJkjPKZYSZFc9hGiwXYGYFsBwoH2A5wP+0yghYMDBFymeEKcJT+mC5AOP70Zear2Lafv4SUerQzKhVVBzQao7v/U2S6Cl1YGZkVl608GdLdJc6sGK0gDWf+BCfPmx9uS/GC8NszMjaLeDa3tBJDPkXxQhjRzOzMeM4MCfIQ9vsNC5GG5Kel5RujPalENabD+Nb0x2XSkogRfRVwAjdqUisKa0y5NGeKqV7mVmYSfFxPAFYP9n1DTajdiYaFHOaWZgpkWECMFdUkm8rHtJnE42KMc0MzJKsfRLwNeHPfsV7I3bzijswA7MkU0wCZoOA0b0LezIF2XZJFuRGnrUzQypfKYHZsNor1guiE6kaXdZl0GxpTyMyLTBvJmtesRwr3fhWYxofl00xa2XNqTbClci0wGzg7w39hGh1MbxNjWlcPaZZ8U2KMwKzNW8z4pzO5kktL7MC1qi2RDNJywrMjf3h0BuYLhOOKmRyWug61sYa7fQLW/sBh0868Eq10X6L/FsCYDtGts1uT7ZGWDnzG6FHsXv/lsr/1zFrYU1OdDgCxvNN1oaDG7BA2Jo+ToQ4tWUNlhabJ/CUf0fA3Iih9UhoE07jPKOcFDrmvi0NDmEt/bmIjegt67Hduh3HJVw5UJZNC0Y1jgu+Md0Bt2ztcwZmB1G9dUlcxD/FB6L87lGROO8RnlW1RtfndsDS2ThapdM5CetLF5Ac7cQKPi+dTS7lENkrybc0YHQez8UPt3V8D6fqkIV4qqoX44yj618/2Sf7dgOWtbsywuoi4H7GgaiWp5F/Ltf7mu9X+HkW9+vzvFCqPnKNXQVWYgx/ayM+9H+MC3CtKnMSA3AAH1bv1yNdB520s2PrypRO7oiFTvWKmyB8X3Jdtjy34bb5gOW+8zLCiVA4sLoG39Jew5ysSixPTkMIXkPpMTxf30uuczOfd2AWG5nfWicvxndIKRpSicfCdIimeB7yn+jqS1XvZllBgFkwL2jRupa1gN6G9Ewuw/Q9B9gttX3Bd5F2bWFi3+lCwYCVAOPGFdeJPy90WPlplW36sT2/qLr/4zxcgb8BJJ/aG25iv4UAAAAASUVORK5CYII="); background-size: 30px auto; } } .starability-heart > input:checked + label::after { opacity: 1; animation-name: heart; animation-duration: 1s; animation-fill-mode: forwards; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @keyframes heartbeat { 0% { transform: translateY(15px); } 30% { transform: translateY(0); opacity: 1; } 45% { transform: translateY(0); transform: scale(0.8, 0.8); } 50% { transform: scale(0.7, 0.7); } 75% { opacity: 0.9; } 100% { transform: scale(1.25, 1.25); opacity: 0; } } .starability-heartbeat { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; will-change: contents; } .starability-heartbeat > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-heartbeat > input:checked ~ label, .starability-heartbeat > input:focus ~ label { background-position: 0 0; } .starability-heartbeat > input:checked + label, .starability-heartbeat > input:focus + label { background-position: 0 -30px; } .starability-heartbeat > input[disabled]:hover + label { cursor: default; } .starability-heartbeat > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-heartbeat > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-heartbeat > input:not([disabled]):hover + label::before { opacity: 1; } .starability-heartbeat > input:focus + label { outline: 1px dotted #999; } .starability-heartbeat .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-heartbeat > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-heartbeat > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-heartbeat > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-heartbeat > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-heartbeat > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-heartbeat > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-heartbeat > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-heartbeat > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-heartbeat > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-heartbeat { width: auto; } .starability-heartbeat > input { position: static; margin-right: 0; opacity: 1; } .starability-heartbeat .input-no-rate { display: none; } .starability-heartbeat > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-heartbeat > label::before, .starability-heartbeat > label::after { display: none; } } .starability-heartbeat > label::after { content: " "; position: absolute; opacity: 0; width: 30px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAcCAYAAAB2+A+pAAAAAXNSR0IArs4c6QAAAsJJREFUSA29lt9LFFEUx8+5u+5CLUEstlRsO5tKPvXjRXoSQpDUfiAhQS9FEIo+CP0Dbe+9FBIZEfgSRL2k4RbUq0S+SBBRGeOmmUJF6Ja67s7pnLE7O667Nis5A8M598z3nM+cuXdmLkLJMVfXuWepsHwBAc4TwF4k2AlAPxHxBREMG5l0uiTFHk4d7Oggq3Ca9S0c2A0Ii0Awi6ge1oQCD/Z9GPnmzuP6xSNjtPcTWTcYGCxG13sI+DgQiXTH3z76IVdmGjuj+aXlQQI6t17pGiGs8o1fNcz0gI7aYOrqCmTGs3eJ6LK+sJnlIu8SQTgmmkyeJvhJNG6md64hDBqXjvdiKmXZYO602yLrjiPw4qC6bsvIuuZFrjWo1BXDHL2H3+vbdi3kYRKIavVFTxYxZ+uIQp70WoQ4HwnXNAQX8tgHZFUHlSLVAjWYKJZdyfUpBKtVx/yyPL+tipf8Ib+ADocXoyLEqBPwyRGm4hf+l088B4NEWcWrZNaJ+Od8ZTCO+cfTJBxTEMDneuibZaZKKHrKn8A5v6DCEqbCyfQKAd7yCywsYfIcA0TCwQH+68xsN1wYwhKODa59P7yICnq3HcwMYTlgcRJmegQQh7YNzrVtxl+A3XERFuvhyX9VHP8fb61mrMddzf4fuwPzyTOx37T6mv8+B9zxLfuIn3dgTVPMHJ531yjpGEAEKqRO8GPPuIVb8rmG1CqFSq0NHWvAl7qz8Vwh95I7b9Cxqizix1Ag1LL/05PpcnkbOtaitQRs5s7HdcyztXOwuRJU6lTsWEOovi2cycPtKjaC93kj2CsfCV2jnP0nWCeZRjuvSrpZcctj78GwPzk16mnT6BksNzCdPHm4QDjE3R/VNySWX5eJANLFuPnsjTu+mV9xjsslSeFENN7EG7UUT9KqnOJLrBpoudqeYzPJU0fk9JxQIvwDg4rmetWjBsMAAAAASUVORK5CYII="); background-repeat: no-repeat; bottom: 30px; left: 0; z-index: 2; } @media screen and (min-resolution: 192dpi) { .starability-heartbeat > label::after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA4CAYAAAChbZtkAAAAAXNSR0IArs4c6QAABddJREFUaAXtmm1sFEUYx+fZu4NS2gDie0pvryDFD6gJMegXbf0gfREMJASjCTFIQKEi0QTUD1q/+IKJRi1GjfhCjGJIgNj0rgoR0EQNSQ2JUQgpvb0rxhqwgLZY6d2O/2ftlOv1Xna9vZO7c5LLvD3zzP+3Mzt7uzMkbAbZ3q717/xukSmpSUhxO35+IWStEKQhHkF8VpD4gYQ8Kr2+Tr2383ubrlOaReuabo2bdA9830ySFsJoFtJTJFGcpIgib+D3LX4hvxE8SoRSG4Gy2ZyuX1Y9PDK6DnabpZA12exVPQQcE1J2+AO3vUOH2mOqPFMsF63zRQf7HzalaEPb+ZlsE+uIhIH+XvFd4d1xfU/nhcS65HRG4LDe8iBG7FUp5czkhnbzDO4R4pE5RuhwpjbG3Oa7ZFy+iZlTn8kuUx0JOoMZsClgBD9JZ5cSOLKwdZb5R/wDdL4sXUMn5egkRqS1Yeq9naqd4W/agFvidcwgXJvcA0Z8d7WX1s7uDf2e7G0S8KkFy2fHRkYOYFRvSTbONU+atkUPB19O9BPWm57EhX0hscyVNIkjQlQsCRj7ziX6mwA8WLdyxnlz6GvcP7xIuB4w5UzSqMkfDu5n59FA892mKUIYWSx87gf011NZVdVw9Y+7h5T3CcCGv/kjdP6AqsxLTHR6+vSqOvY9PDzUh4t7VV76GXOKNeR93QitUX2MA0f15lVxKXepinzGGtFW+CdTyhfz2Y/yDcgVeqR7L+ctYH4cRM709zl57Chn/yrGKFvt8jy649qIIrq+eB4/Hq17Jzp46r6CwbIKBi0U7D/9+Q3jyEpOWsBYkR/nTCkHkvIJ5qOf594752Lsr2gpwyo271RvjRYzRxtUQanH5misUcN0bix1UMUnTa1Bw7+cG1RB6ceyXhMkryx90DFCsGKEqXyAwapJkjPKZYSZFc9hGiwXYGYFsBwoH2A5wP+0yghYMDBFymeEKcJT+mC5AOP70Zear2Lafv4SUerQzKhVVBzQao7v/U2S6Cl1YGZkVl608GdLdJc6sGK0gDWf+BCfPmx9uS/GC8NszMjaLeDa3tBJDPkXxQhjRzOzMeM4MCfIQ9vsNC5GG5Kel5RujPalENabD+Nb0x2XSkogRfRVwAjdqUisKa0y5NGeKqV7mVmYSfFxPAFYP9n1DTajdiYaFHOaWZgpkWECMFdUkm8rHtJnE42KMc0MzJKsfRLwNeHPfsV7I3bzijswA7MkU0wCZoOA0b0LezIF2XZJFuRGnrUzQypfKYHZsNor1guiE6kaXdZl0GxpTyMyLTBvJmtesRwr3fhWYxofl00xa2XNqTbClci0wGzg7w39hGh1MbxNjWlcPaZZ8U2KMwKzNW8z4pzO5kktL7MC1qi2RDNJywrMjf3h0BuYLhOOKmRyWug61sYa7fQLW/sBh0868Eq10X6L/FsCYDtGts1uT7ZGWDnzG6FHsXv/lsr/1zFrYU1OdDgCxvNN1oaDG7BA2Jo+ToQ4tWUNlhabJ/CUf0fA3Iih9UhoE07jPKOcFDrmvi0NDmEt/bmIjegt67Hduh3HJVw5UJZNC0Y1jgu+Md0Bt2ztcwZmB1G9dUlcxD/FB6L87lGROO8RnlW1RtfndsDS2ThapdM5CetLF5Ac7cQKPi+dTS7lENkrybc0YHQez8UPt3V8D6fqkIV4qqoX44yj618/2Sf7dgOWtbsywuoi4H7GgaiWp5F/Ltf7mu9X+HkW9+vzvFCqPnKNXQVWYgx/ayM+9H+MC3CtKnMSA3AAH1bv1yNdB520s2PrypRO7oiFTvWKmyB8X3Jdtjy34bb5gOW+8zLCiVA4sLoG39Jew5ysSixPTkMIXkPpMTxf30uuczOfd2AWG5nfWicvxndIKRpSicfCdIimeB7yn+jqS1XvZllBgFkwL2jRupa1gN6G9Ewuw/Q9B9gttX3Bd5F2bWFi3+lCwYCVAOPGFdeJPy90WPlplW36sT2/qLr/4zxcgb8BJJ/aG25iv4UAAAAASUVORK5CYII="); background-size: 30px auto; } } .starability-heartbeat > input:checked + label::after { opacity: 1; animation-name: heartbeat; animation-timing-function: cubic-bezier(0.19, 1, 0.69, 1.35); animation-duration: 1s; animation-fill-mode: forwards; } .starability-result { position: relative; width: 150px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); font-size: 0.1em; color: transparent; } .starability-result:after { content: " "; position: absolute; left: 0; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 -30px; } .starability-result[data-rating="5"]::after { width: 150px; } .starability-result[data-rating="4"]::after { width: 120px; } .starability-result[data-rating="3"]::after { width: 90px; } .starability-result[data-rating="2"]::after { width: 60px; } .starability-result[data-rating="1"]::after { width: 30px; } @media screen and (min-resolution: 192dpi) { .starability-result { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } .starability-result:after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @keyframes coinFlip { 0% { transform: translateY(0); opacity: 0; } 25% { transform: translateY(-34px); opacity: 1; } 30% { transform: translateY(-30px); } 35% { transform: translateY(-30px) rotateY(0deg); } 50% { transform: translateY(-30px) rotateY(180deg); } 65% { transform: translateY(-30px) rotateY(0deg); } 85% { transform: translateY(-34px); opacity: 1; } 100% { transform: translateY(0); opacity: 0; } } .starability-coinFlip { display: block; position: relative; width: 150px; min-height: 60px; padding: 0; border: none; will-change: contents; } .starability-coinFlip > input { position: absolute; margin-right: -100%; opacity: 0; } .starability-coinFlip > input:checked ~ label, .starability-coinFlip > input:focus ~ label { background-position: 0 0; } .starability-coinFlip > input:checked + label, .starability-coinFlip > input:focus + label { background-position: 0 -30px; } .starability-coinFlip > input[disabled]:hover + label { cursor: default; } .starability-coinFlip > input:not([disabled]):hover ~ label { background-position: 0 0; } .starability-coinFlip > input:not([disabled]):hover + label { background-position: 0 -30px; } .starability-coinFlip > input:not([disabled]):hover + label::before { opacity: 1; } .starability-coinFlip > input:focus + label { outline: 1px dotted #999; } .starability-coinFlip .starability-focus-ring { position: absolute; left: 0; width: 100%; height: 30px; outline: 2px dotted #999; pointer-events: none; opacity: 0; } .starability-coinFlip > .input-no-rate:focus ~ .starability-focus-ring { opacity: 1; } .starability-coinFlip > label { position: relative; display: inline-block; float: left; width: 30px; height: 30px; font-size: 0.1em; color: transparent; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; background-position: 0 -30px; } .starability-coinFlip > label::before { content: ""; position: absolute; display: block; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-position: 0 30px; pointer-events: none; opacity: 0; } .starability-coinFlip > label:nth-of-type(5)::before { width: 120px; left: -120px; } .starability-coinFlip > label:nth-of-type(4)::before { width: 90px; left: -90px; } .starability-coinFlip > label:nth-of-type(3)::before { width: 60px; left: -60px; } .starability-coinFlip > label:nth-of-type(2)::before { width: 30px; left: -30px; } .starability-coinFlip > label:nth-of-type(1)::before { width: 0px; left: 0px; } @media screen and (min-resolution: 192dpi) { .starability-coinFlip > label { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } @media screen and (-ms-high-contrast: active) { .starability-coinFlip { width: auto; } .starability-coinFlip > input { position: static; margin-right: 0; opacity: 1; } .starability-coinFlip .input-no-rate { display: none; } .starability-coinFlip > label { display: inline; float: none; width: auto; height: auto; font-size: 1em; color: inherit; background: none; } .starability-coinFlip > label::before, .starability-coinFlip > label::after { display: none; } } .starability-coinFlip > label::after { content: " "; position: absolute; opacity: 0; width: 30px; height: 30px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII="); background-repeat: no-repeat; bottom: 0; left: 0; z-index: 2; } @media screen and (min-resolution: 192dpi) { .starability-coinFlip > label::after { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg=="); background-size: 30px auto; } } .starability-coinFlip > input:checked + label::after { background-position: 0 -30px; opacity: 1; animation-name: coinFlip; animation-duration: 1.2s; animation-fill-mode: forwards; animation-timing-function: ease-in-out; } .rate-star { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 8px; /* 9 */ margin-top: 0.5rem; /* 9 */ display: flex; align-items: center; justify-content: flex-start; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 8px; /* 9 */ gap: 0.5rem; /* 9 */ } .rate-star .starability { padding: 0; min-height: 30px !important; margin-bottom: 0; } .rate-star__label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 18px; /* 9 */ line-height: 1.125rem; /* 9 */ } .pospago-prepos-offers .modals-overlay { pointer-events: none; cursor: none; } .pospago-prepos-offers section#content-component { margin-top: 50px !important; } .pospago-prepos-offers .column.main { padding: 0; } .pospago-prepos-offers .search-tabs { display: none; } .pospago-prepos-offers .elige_apps { cursor: pointer; } .pospago-prepos-offers .f-c-plan__content { padding: 0 0 4px 0; border-radius: 16px; } .pospago-prepos-offers .is-plan-recommended .f-c-plan__content { padding: 0 !important; } .pospago-prepos-offers header.f-c-plan__header { margin-bottom: 15px; } .pospago-prepos-offers .f-c-plan__header-caption { background-color: #0B2739; border-radius: 16px 16px 0 0; padding: 10px; text-align: center; } .pospago-prepos-offers .f-c-plan__header-caption .f-c-plan_subtitle { font-size: 14px; font-weight: 100; } .pospago-prepos-offers .f-c-plan__header-caption .f-c-plan__title { font-size: 36px; font-weight: bold; color: #fff; } .pospago-prepos-offers .f-c-plan__flag { text-align: center; max-width: 100% !important; border-radius: 16px 16px 0 0 !important; top: -24px !important; font-size: 16px !important; line-height: 24px; } .pospago-prepos-offers .is-plan-recommended .f-c-plan__content { border-radius: 0 0 16px 16px; } .pospago-prepos-offers .is-plan-recommended .f-c-plan__content .f-c-plan__header-caption { border-radius: 0 !important; } .pospago-prepos-offers .f-c-plan__price-offer { font-size: 40px; line-height: 38px; color: #313235; } .pospago-prepos-offers .ivaincluido { font-weight: 300; } .pospago-prepos-offers .f-c-plan__price { display: block; } .pospago-prepos-offers .center { text-align: center; } .pospago-prepos-offers .o-btn { width: 80%; margin: auto; text-align: center; display: block; } .pospago-prepos-offers .button-c2c { padding: 13px; margin: 10px auto 0; width: 80%; border: 1px solid #019DF4; color: #019df4; font-weight: 700; } .pospago-prepos-offers .c-prime { margin: 10px auto; width: 87%; position: relative; } .pospago-prepos-offers .c-eligeApps { width: 100%; } .pospago-prepos-offers .c-minutos { display: flex; } .pospago-prepos-offers .img_min figure { width: 42px !important; } .pospago-prepos-offers .c-compartir { width: 100%; } .pospago-prepos-offers .f-c-plan__toggle-content.js-plan-target { margin-top: 0; } .pospago-prepos-offers li.f-c-plan__benefit.js-plan-benefit { border-bottom: 1px solid #E4E4E4; margin: auto; width: 96%; } .pospago-prepos-offers li.f-c-plan__benefit.js-plan-benefit:last-of-type { border: none; } .pospago-prepos-offers .f-c-plan__toggle-btn { display: none; } .pospago-prepos-offers .minutes { color: #0B2739; font-size: 12px; line-height: 20px; padding: 0 18px; } .pospago-prepos-offers .gbcompartir { line-height: 15px; width: 76%; text-align: left; } .pospago-prepos-offers .tooltip { display: none; border: #019DF4 1px solid; padding: 5px; z-index: 100; background-color: #E1EFFF; left: 75%; position: absolute; top: 95%; text-decoration: none; color: #6b6b6b; font-size: 11px; line-height: 11px; display: none; width: 175px; border-radius: 3px; } .pospago-prepos-offers .tooltip_cortesia { position: absolute; top: 35%; right: 4%; } .pospago-prepos-offers .tooltipPrime { box-shadow: 0px 4px 4px rgba(11, 39, 57, 0.1); padding: 5px; display: none; z-index: 100; font-size: 11px; line-height: 11px; width: 95px; border-radius: 3px; left: 70%; top: -70%; position: absolute; background: #fff; } .pospago-prepos-offers .compartir { margin: 0 8px; } .pospago-prepos-offers .tip { right: 8%; position: absolute; bottom: 6%; } .pospago-prepos-offers .f-c-plan-slide, .pospago-prepos-offers .f-c-plan { max-width: initial !important; } .pospago-prepos-offers .pasos_prepos { background-color: #fff; box-shadow: 0px 4px 4px rgba(11, 39, 57, 0.1); } .pospago-prepos-offers .compartir { margin: 0 15px; } .pospago-prepos-offers div#modal-Eligeapps { padding: 2.75rem 0px !important; } .pospago-prepos-offers .pagebuilder-column figure { margin: auto !important; } .pospago-prepos-offers .c-form__field { padding: 10px; } .pospago-prepos-offers button#btnConfirmarLine { margin-bottom: 20px; } .pospago-prepos-offers span#messageInf { padding-left: 0px !important; } .pospago-prepos-offers #msjResponseC2C { padding: 5px 10px; margin: 10px auto; font-size: 12px; text-align: left; } .pospago-prepos-offers #msjResponseC2C.msj_success { background-color: #BDE4A4; border: 1px solid #5CB615; color: #313235; } .pospago-prepos-offers #msjResponseC2C.msj_fail { background-color: #F8D2B3; border: 1px solid #F28D15; } .pospago-prepos-offers span#modaltyc { cursor: pointer; text-decoration: underline; } .pospago-prepos-offers .title-c2c p span { font-size: 36px !important; line-height: 38px !important; } .pospago-prepos-offers .o-modal { overflow: auto; } .pospago-prepos-offers .c-whatsapp span { color: #5CB615; font-size: 14px; line-height: 20px; text-decoration: underline; } @media only screen and (max-width: 620px) { .pospago-prepos-offers .title-c2c p span { font-size: 26px !important; line-height: 28px !important; } .pospago-prepos-offers .f-c-plan__toggle-btn, .pospago-prepos-offers header.f-c-plan__header { display: block; margin-top: 0; margin-bottom: 1rem; } .pospago-prepos-offers .mobile-none, .pospago-prepos-offers .f-c-plan__header::before { display: none; } .pospago-prepos-offers .f-c-plan-mb-0 { margin-bottom: 0; } .pospago-prepos-offers .f-c-plan__price-offer { margin-top: 10px; margin-bottom: 0; } .pospago-prepos-offers img.tooltip_cortesia { top: 35%; } .pospago-prepos-offers li.f-c-plan__benefit.js-plan-benefit { width: 85%; } .pospago-prepos-offers .imgBanderas { margin: auto 10px; } .pospago-prepos-offers .compartir { margin: 0 25px; } .pospago-prepos-offers .tooltip { left: 48%; top: 86%; } .pospago-prepos-offers .tooltipPrime { top: -70%; } .pospago-prepos-offers .pasos_prepos .pagebuilder-column-line { display: block !important; } .pospago-prepos-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column { display: block !important; width: 100% !important; margin-top: 20px !important; } .pospago-prepos-offers .pasos_prepos .pagebuilder-column-line .mobile-top-none, .pospago-prepos-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column:first-of-type, .pospago-prepos-offers .pasos_prepos .pagebuilder-column-line .pagebuilder-column:last-of-type { margin-top: 0px !important; } .pospago-prepos-offers .tip { bottom: unset; } .pospago-prepos-offers .pagebuilder-column { flex-basis: unset; } .pospago-prepos-offers .mobile-w100 { width: 100% !important; } } .o-btn-modal { width: 40%; margin: 40px auto 0px; text-align: center; display: block; } .btnC2C-prepos { width: 80%; margin: auto; text-align: center; display: block; } .modal-validacion-linea fieldset.c-form__fieldset { max-width: 80% !important; margin: auto; } .modal-codigo-verificacion .center.txt-nip { max-width: 81%; margin: auto; } .modal-codigo-verificacion fieldset.c-form__fieldset { max-width: 70% !important; margin: auto; } .modal-codigo-verificacion, .modal-validacion-linea { padding: 0; } .modal-codigo-verificacion fieldset.c-form__fieldset, .modal-validacion-linea fieldset.c-form__fieldset { max-width: 80% !important; margin: auto; } .modal-codigo-verificacion .img-center-container, .modal-validacion-linea .img-center-container { margin-top: 14px; text-align: center; } .modal-codigo-verificacion .f-flex-container, .modal-validacion-linea .f-flex-container { margin-top: 38px; display: flex; justify-content: space-between; } .modal-codigo-verificacion .f-flex-tyc, .modal-validacion-linea .f-flex-tyc { margin-top: 30px; display: flex; align-items: flex-start !important; } .modal-codigo-verificacion .error-linea-movistar, .modal-validacion-linea .error-linea-movistar { margin-top: 23px; display: flex; font-size: 14px; height: 40px; padding: 16px; align-items: center; gap: 10px; align-self: stretch; border: 1px solid #FF374A; border-radius: 4px; background: #F8CCCC; justify-content: center; } .modal-codigo-verificacion .container-block-beneficios, .modal-validacion-linea .container-block-beneficios { margin-top: 10px; } .modal-codigo-verificacion .link-beneficios, .modal-validacion-linea .link-beneficios { margin-top: 10px; text-decoration-line: underline; text-align: center; font-size: 16px; font-weight: 400; line-height: 24px; color: #019DF4; cursor: pointer; } @media only screen and (max-width: 768px) { .modal-codigo-verificacion .error-linea-movistar, .modal-validacion-linea .error-linea-movistar { height: 76px; } } .pospago-prepos-datos { font-family: "Telefonica", sans-serif; } .pospago-prepos-datos .strong { font-weight: bold; } .pospago-prepos-datos .c-form__fieldset { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 46px; /* 9 */ margin-bottom: 2.875rem; /* 9 */ } .pospago-prepos-datos .c-form__fieldset:first-of-type { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } .pospago-prepos-datos .c-form__field { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-height: 60px; /* 9 */ min-height: 3.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 12px; /* 9 */ padding: 0.75rem; /* 9 */ background-color: #fff; } .pospago-prepos-datos .c-form__field-canvas { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 15px; /* 9 */ column-gap: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 27px; /* 9 */ margin-bottom: 1.6875rem; /* 9 */ } .pospago-prepos-datos .c-form__field-canvas.mb-group-input { display: none; } @media screen and (max-width: 739px) { .pospago-prepos-datos .c-form__field-canvas.mb-group-input { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; } .pospago-prepos-datos .c-form__field-canvas.mb-group-input .mb-input { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 15px; /* 9 */ margin-bottom: 0.9375rem; /* 9 */ } } .pospago-prepos-datos .c-form__field-canvas .font-small { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } .pospago-prepos-datos .c-form__field-canvas .font-small .sp-tratamiento-datos { color: #019DF4; text-decoration: underline; cursor: pointer; } .pospago-prepos-datos .c-form__box.u-width-80 { width: 80%; } .pospago-prepos-datos .c-form__box.u-width-45 { width: 45%; } .pospago-prepos-datos .c-form__box.lg-input { display: block; } @media screen and (max-width: 739px) { .pospago-prepos-datos .c-form__box.lg-input { display: none; } } @media screen and (max-width: 739px) { .pospago-prepos-datos .c-form__box.u-mb-width-40.mb-input { width: 40%; } } @media screen and (max-width: 739px) { .pospago-prepos-datos .c-form__box.u-mb-width-25.mb-input { width: 25%; } } .pospago-prepos-datos .c-form__title { color: #424B5A; } .pospago-prepos-datos .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } .pospago-prepos-datos .c-form__input { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 14px; /* 9 */ top: 0.875rem; /* 9 */ font-family: "Telefonica", sans-serif; } .pospago-prepos-datos .c-form__input.in-detalle-direccion { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 14px; /* 9 */ top: 0.875rem; /* 9 */ } .pospago-prepos-datos .c-form__label { color: #86888C; } .pospago-prepos-datos .c-form__label.lb-detalle-direccion { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -32px; /* 9 */ top: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #019DF4; } .pospago-prepos-datos .c-form__select { max-width: 100%; } .pospago-prepos-datos .c-form__icon { color: #86888C; } .pospago-prepos-datos .c-form__icon::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 15px; /* 9 */ padding-right: 0.9375rem; /* 9 */ } .pospago-prepos-datos .c-form__error-text { padding-left: 0; } .pospago-prepos-datos .prepos-datos-form h3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } @media only screen and (max-width: 620px) { div#datos-component, #pospago-prepos-datos, #contrato-component { margin-top: 0px !important; } } .position-relative { position: relative; } .w-full { width: 100%; } .pospago-prepos-datos input#documentid { width: 100%; z-index: 99; position: relative; } .pospago-prepos-datos input#expdate { position: relative; width: 100%; } .pospago-prepos-datos input#names, .pospago-prepos-datos input#lastname, .pospago-prepos-datos input#email { height: 38px; margin-top: -30px; } #pospago-prepos-sign-contract { max-width: 100%; } #submit-sign-contract { margin: 0px auto 0px; } .pospago-prepos-container { margin: 0 auto; padding: 1rem; } @media screen and (min-width: 740px) { .pospago-prepos-container { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-width: 700px; /* 9 */ max-width: 43.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 700px; /* 9 */ min-width: 43.75rem; /* 9 */ } } @media screen and (max-width: 739px) { .pospago-prepos-container { width: 100%; padding: 1rem 0; } } @media screen and (max-width: 739px) { .pospago-prepos-container__title .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 36px; /* 9 */ font-size: 2.25rem; /* 9 */ text-align: center; } } .pospago-prepos-container__title .c-form__title_big { font-weight: bold; } .pospago-prepos-container__subtitle { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 35px; /* 9 */ margin-top: 2.1875rem; /* 9 */ border-bottom: 1px solid #D3D4D3; } .pospago-prepos-container__subtitle h3 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ } .pospago-prepos-container__text-blue { color: #019DF4; font-weight: 400; } .pospago-prepos-container__info { width: 100%; display: flex; justify-content: flex-start; align-items: center; background-color: white; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 30px; /* 9 */ margin-top: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 10px; /* 9 */ padding-right: 0.625rem; /* 9 */ } @media screen and (max-width: 739px) { .pospago-prepos-container__info { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ align-items: flex-start; } } .pospago-prepos-container__info-icon { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 15px; /* 9 */ margin: 0.9375rem; /* 9 */ font-size: 25px; color: #019DF4; } @media screen and (max-width: 739px) { .pospago-prepos-container__info-icon { margin-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 10px; /* 9 */ margin-right: 0.625rem; /* 9 */ } } .pospago-prepos-container__info h4 { text-transform: uppercase; } .pospago-prepos-container__info p { font-size: 14px; } .pospago-prepos-container__contract { display: flex; justify-content: space-around; align-items: center; width: max-content; max-width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 30px; /* 9 */ margin-top: 1.875rem; /* 9 */ } @media screen and (max-width: 739px) { .pospago-prepos-container__contract { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 15px; /* 9 */ padding-left: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 15px; /* 9 */ padding-right: 0.9375rem; /* 9 */ } } .pospago-prepos-container__contract .pos-icon-document { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 64px; /* 9 */ font-size: 4rem; /* 9 */ color: #019DF4; cursor: pointer; } .pospago-prepos-container__contract-download { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin: 10px; /* 9 */ margin: 0.625rem; /* 9 */ } .pospago-prepos-container__contract-download .download-doc { display: flex; align-items: center; justify-content: flex-start; font-size: 14px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 5px; /* 9 */ padding-bottom: 0.3125rem; /* 9 */ color: #019DF4; } .pospago-prepos-container__contract-download .download-doc p { text-decoration: underline; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ } .pospago-prepos-container__contract-download .sign-contract { display: flex; align-items: center; justify-content: flex-start; } .pospago-prepos-container__contract-download .sign-contract input[type=checkbox] { transform: scale(1.25); } .pospago-prepos-container__contract-download .sign-contract p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 10px; /* 9 */ margin-left: 0.625rem; /* 9 */ } .pospago-prepos-container__contract-download .sign-contract p span { font-weight: bold; } .pospago-prepos-container__submit { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 20px; /* 9 */ margin-top: 1.25rem; /* 9 */ display: flex; align-items: center; justify-content: flex-end; } @media screen and (max-width: 739px) { .pospago-prepos-container__submit { justify-content: center; } } #prepos-confronta .c-form__header { text-align: left; } #prepos-confronta .c-form__header .c-form__title { font-weight: bold; } @media screen and (max-width: 739px) { #prepos-confronta .c-form__header .c-form__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ } } @media screen and (max-width: 739px) { #prepos-confronta .c-form__header .c-form__lead { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ } } @media screen and (max-width: 739px) { #prepos-confronta .c-form__header { text-align: center; } } @media screen and (max-width: 739px) { #prepos-confronta .c-form__item-list { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 20px; /* 9 */ padding-bottom: 1.25rem; /* 9 */ } } #prepos-confronta .answers_list { column-count: 2; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ column-gap: 20px; /* 9 */ column-gap: 1.25rem; /* 9 */ } @media screen and (max-width: 739px) { #prepos-confronta .answers_list { column-count: 1; } } #prepos-confronta .answers_list .c-form__radio-button-label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } @media screen and (max-width: 739px) { #prepos-confronta .answers_list .c-form__radio-button-label { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } } #prepos-confronta .answers_list .c-form__radio-button-label label { cursor: pointer; } #prepos-confronta #alert-container-prepos { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ align-items: center; justify-content: space-between; } #prepos-confronta #alert-container-prepos .alert-msg-container { display: flex; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ gap: 15px; /* 9 */ gap: 0.9375rem; /* 9 */ align-items: center; justify-content: flex-start; } #prepos-confronta #alert-container-prepos .alert-msg-container::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #5CB615; } #prepos-confronta #alert-container-prepos .alert-msg-container.is-error::before { color: #FF374A; } #prepos-confronta #alert-container-prepos .i-close::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #5CB615; } #prepos-confronta #alert-container-prepos .i-close.is-error::before { color: #FF374A; } #summary-prepos .c-card-summary { padding: 1rem 2rem; } #summary-prepos .c-card-summary__title { font-size: 24px; color: #019DF4; padding-bottom: 0.8rem; } #summary-prepos .c-card-summary__box { border-bottom: 1px solid #D3D4D3; } #summary-prepos .c-card-summary__details-customer .mark { font-size: 20px; } @media only screen and (max-width: 620px) { #summary-prepos .c-card-summary__title, #summary-prepos .c-card-summary__amount:not(.c-card-summary__total) { display: none; } } #summaryPrepos button.c-card-checkout-cta__btn.i-chevron-down.js-summary-btn { background-color: #0B2739; color: #fff; padding: 10px 8px; font-size: 14px; } #summaryPrepos .c-card-checkout-cta__btn::before { color: #fff; font-size: 8px; } #prepos-thankyoupage { margin-top: 0px; } #prepos-thankyoupage .imgTYP { max-width: 55%; margin: auto; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .dataClient, #prepos-thankyoupage .containerPrincipal .purchaseSummary .containerTotal { margin-top: 0; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .infoPlan { width: 65%; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .infoPlan li:first-of-type { font-weight: normal; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .detailDataClient.detailServices { font-size: 14px; max-width: 100%; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .detailDataClient.detailServices li strong { width: 40%; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .detailDataClient.detailServices li p { width: 60%; text-align: right; margin-left: 5px; font-weight: normal; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .titleDataClient { width: 35%; font-size: 18px; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .infoCustomer { width: 65%; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .infoCustomer ul.detailServices li { display: flex; } #prepos-thankyoupage .containerPrincipal .purchaseSummary .containerTotal { height: auto; } #prepos-thankyoupage .infoPlan { max-width: 50%; } #prepos-thankyoupage .btn_movistartotal { color: #000; font-size: 12px; background-color: #fff; padding: 5px 30px; border-radius: 50px; width: 200px; line-height: 14px; } #prepos-thankyoupage .promo { width: 80%; margin: auto; } #prepos-thankyoupage .c_btn_volver .downloadDoc { margin: 40px auto; text-align: center; } #prepos-thankyoupage .c_btn_volver a { text-decoration: underline; color: #000000; text-align: center; } #prepos-thankyoupage .c_btn_volver .btn_volver { background-color: #019DF4; color: #fff; padding: 15px; border-radius: 50px; } #prepos-thankyoupage .c_btn_volver .btn_volver a { text-decoration: none; color: #fff; text-align: center; } #prepos-thankyoupage .c_btn_volver .mobile-none { display: none; } @media only screen and (max-width: 620px) { #prepos-thankyoupage .containerPrincipal .purchaseSummary .contentPurchaseSummary { width: 100%; } #prepos-thankyoupage .titleDataClient { width: 50% !important; } #prepos-thankyoupage .gridPurchase { display: flex !important; } #prepos-thankyoupage .numberClient { flex-direction: row; } #prepos-thankyoupage .infoPlan, #prepos-thankyoupage .infoCustomer { width: 100% !important; max-width: 100% !important; padding: 15px !important; } #prepos-thankyoupage .web-none { display: none; } } #general-container-login { margin-top: 30px; margin-bottom: 30px; } #general-container-login .principal-title-login { font-weight: 300; line-height: 46px; text-align: center; font-size: 38px; color: #313235; } #general-container-login .subtitle-login { color: #50535A; text-align: center; font-size: 20px; font-weight: 400; line-height: 28px; } #general-container-login .fieldset-login-backoffice { width: 50%; margin: 0px auto; margin-top: 31px; text-align: center; } #general-container-login .w-input { margin: 0px auto; width: 350px; background-color: #F5F5F5; } #general-container-login .text-forgot-password { color: #999; font-size: 14px; font-weight: 400; line-height: 20px; } #general-container-login .o-btn-login { margin-top: 30px; display: flex; width: 277px; padding: 10px 48px; justify-content: center; align-items: center; gap: 12px; background-color: #019DF4; border-radius: 60px; color: white; } #general-container-login #email-error { display: none !important; } #general-container-login label.c-form__label { padding-left: 10px; margin-top: 30px; top: -2rem !important; font-size: 14px !important; color: #019DF4; } #general-container-login .c-form__input.c-form__input_label-top + .c-form__label, #general-container-login .c-form__input:valid + .c-form__label, #general-container-login .c-form__input:focus + .c-form__label { top: -1.4rem; } #general-container-dashboard { margin-bottom: 60px; } #general-container-dashboard .container-welcome { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; } #general-container-dashboard .container-welcome .container-text h2 { color: #313235; font-weight: 300; font-size: 38px; line-height: 46px; } #general-container-dashboard .container-welcome .container-text p { color: #50535A; font-weight: 400; font-size: 20px; line-height: 28px; } #general-container-dashboard .container-btn-my-requests { display: flex; justify-content: center; align-items: center; } #general-container-dashboard .container-btn-my-requests .btn-requests { display: flex; width: auto; height: 40px; margin: 10px; padding: 8px 32px; justify-content: center; align-items: center; gap: 12px; border-radius: 60px; border: 1px solid #019DF4; background: #FFF; color: #019DF4; font-size: 16px; font-weight: 700; line-height: 24px; } #general-container-dashboard .container-reload-orders { background-color: white; display: flex; justify-content: space-between; align-items: center; margin-top: 40px; padding: 16px 20px; border-radius: 4px; } #general-container-dashboard .container-reload-orders .container-text-reload h2 { color: #50535A; font-size: 16px; font-style: normal; font-weight: 400; line-height: 16px; } #general-container-dashboard .container-reload-orders .btn-reload-orders { display: flex; width: auto; height: 40px; padding: 8px 32px; justify-content: center; align-items: center; gap: 12px; border-radius: 60px; background: #019DF4; color: white; font-size: 16px; font-weight: 700; line-height: 24px; } #general-container-dashboard .container-general-table { padding: 20px; border-radius: 4px; background: #FFF; margin-top: 18px; } #general-container-dashboard .table-data-client { padding-top: 20px; } #general-container-dashboard .table-data-client thead tr th { text-align: center; background-color: #F8F8F8; box-shadow: 0px -1px 0px 0px #019DF4 inset; color: #0B2739; font-size: 16px; font-weight: 700; line-height: 20px; } #general-container-dashboard .table-data-client tbody tr:nth-child(even) { background: white; } #general-container-dashboard .table-data-client tbody tr:nth-child(odd) { background: #E1EFFF; } #general-container-dashboard .table-data-client .td-table-btn-assign { display: flex; justify-content: center; } #general-container-dashboard .assign-button { display: flex; height: 29px; padding: 8px 32px; justify-content: center; align-items: center; gap: 12px; border-radius: 60px; background: #019DF4; color: white; font-size: 12px; font-weight: 700; line-height: 24px; } #general-container-dashboard .container-max-assign { margin-top: 40px; border-radius: 4px; background: #FFF; padding: 15px 17px; } #general-container-dashboard .icon-info-color { color: #F28D15; width: 24px; height: 24px; } #general-container-dashboard .dataTables_length { float: right !important; } #general-container-dashboard .dataTables_length select { border: 1px solid #B6B7B7 !important; border-radius: 4px !important; background-color: white !important; color: #86888C !important; font-weight: 400; font-size: 15px; } #general-container-dashboard .dataTables_paginate .paginate_button { border: 1px solid #D3D4D3; width: 24px !important; height: 24px !important; color: #50535A !important; border-radius: 50%; font-size: 14px; font-weight: 400; padding: 0px; } #general-container-dashboard .dataTables_paginate .paginate_button:hover { background: transparent !important; color: #019DF4 !important; border: 1px solid #019DF4; } #general-container-dashboard .dataTables_paginate .paginate_button.previous, #general-container-dashboard .dataTables_paginate .paginate_button.next { width: 28px; height: 28px; background-color: #019DF4; border-radius: 50%; color: white !important; } #general-container-dashboard .dataTables_paginate .paginate_button.current { border: 1px solid #019DF4; border-radius: 50%; width: 32px; color: #019DF4 !important; width: auto; height: auto; font-size: 14px !important; font-weight: 700; } #general-container-profile { margin-bottom: 60px; } #general-container-profile .container-text-profile { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; } #general-container-profile .container-text-profile h2 { color: #313235; font-weight: 300; font-size: 38px; line-height: 46px; } #general-container-profile .container-text-profile p { color: #50535A; font-weight: 400; font-size: 20px; line-height: 28px; } #general-container-profile .container-text-profile .btn-go-back { display: flex; width: 193px; height: 40px; padding: 8px 32px; justify-content: center; align-items: center; gap: 12px; border-radius: 60px; border: 1px solid #019DF4; background: #FFF; color: #019DF4; font-size: 16px; font-weight: 700; line-height: 24px; } #general-container-profile .container-general-table-ordenes, #general-container-profile .container-general-table-historial-ordenes { max-width: 1200px; padding: 20px; border-radius: 4px; background: #FFF; margin-top: 45px; overflow-x: auto; } #general-container-profile .container-general-table-ordenes .table-data-order, #general-container-profile .container-general-table-historial-ordenes .table-data-order { padding-top: 20px; position: relative; width: 100%; white-space: nowrap; } #general-container-profile .container-general-table-ordenes .table-data-order thead tr th, #general-container-profile .container-general-table-historial-ordenes .table-data-order thead tr th { text-align: center; background-color: #F8F8F8; box-shadow: 0px -1px 0px 0px #019DF4 inset; color: #0B2739; font-size: 16px; font-weight: 700; line-height: 20px; padding: 0.75rem 1.5rem; vertical-align: middle; } #general-container-profile .container-general-table-ordenes .table-data-order tbody td, #general-container-profile .container-general-table-historial-ordenes .table-data-order tbody td { color: #1a202c; text-align: left; padding: 1.5rem 1.5rem; vertical-align: middle; } #general-container-profile .container-general-table-ordenes .table-data-order tbody tr:nth-child(even) td, #general-container-profile .container-general-table-historial-ordenes .table-data-order tbody tr:nth-child(even) td { background: white; } #general-container-profile .container-general-table-ordenes .table-data-order tbody tr:nth-child(odd) td, #general-container-profile .container-general-table-historial-ordenes .table-data-order tbody tr:nth-child(odd) td { background: #E1EFFF; } #general-container-profile .container-general-table-ordenes .table-data-order thead tr > th:last-child, #general-container-profile .container-general-table-ordenes .table-data-order tbody tr > td:last-child { position: sticky; right: 0; } #general-container-profile .btn-modificar { display: flex; height: 29px; padding: 8px 32px; justify-content: center; align-items: center; gap: 12px; border-radius: 60px; background: #019DF4; color: white; font-size: 12px; font-weight: 700; line-height: 24px; } #general-container-profile .dataTables_length { float: right !important; } #general-container-profile .dataTables_scrollBody::-webkit-scrollbar { height: 10px; } #general-container-profile .dataTables_scrollBody::-webkit-scrollbar-thumb { border-radius: 20px; background: #CDD3DD; } #general-container-profile .dataTables_scrollBody { border: 0px !important; } #general-container-profile .dataTables_paginate .paginate_button { border: 1px solid #D3D4D3; width: 24px !important; height: 24px !important; color: #50535A !important; border-radius: 50%; font-size: 14px; font-weight: 400; padding: 0px; } #general-container-profile .dataTables_paginate .paginate_button:hover { background: transparent !important; color: #019DF4 !important; border: 1px solid #019DF4; } #general-container-profile .dataTables_paginate .paginate_button.previous, #general-container-profile .dataTables_paginate .paginate_button.next { width: 28px; height: 28px; background-color: #019DF4; border-radius: 50%; color: white !important; } #general-container-profile .dataTables_paginate .paginate_button.current { border: 1px solid #019DF4; border-radius: 50%; width: 32px; color: #019DF4 !important; width: auto; height: auto; font-size: 14px !important; font-weight: 700; } #general-container-order-info { margin-bottom: 60px; } #general-container-order-info .container-text-order-info { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; } #general-container-order-info .container-text-order-info h2 { color: #313235; font-weight: 300; font-size: 38px; line-height: 46px; } #general-container-order-info .container-text-order-info .btn-go-back { display: flex; width: 193px; height: 40px; padding: 8px 32px; justify-content: center; align-items: center; gap: 12px; border-radius: 60px; border: 1px solid #019DF4; background: #FFF; color: #019DF4; font-size: 16px; font-weight: 700; line-height: 24px; } #general-container-order-info .container-general-detail-info { padding: 20px; border-radius: 4px; background: #FFF; margin-top: 45px; } #general-container-order-info .container-form-detail-info { display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: 1fr; grid-column-gap: 0px; grid-row-gap: 0px; justify-items: center; align-items: center; } #general-container-order-info .select-typification { width: 256px; height: 60px; margin-right: 26px; display: flex; padding: 16px; align-items: center; gap: 8px; align-self: stretch; border-radius: 4px; border: 1px solid #B6B7B7; color: #86888C; font-size: 15px; font-weight: 400; line-height: 24px; } #general-container-order-info .input-observation { width: 256px; height: 60px; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding: 10px; border-radius: 4px; border: 1px solid #B6B7B7; color: #86888C; font-size: 15px; font-style: normal; font-weight: 400; line-height: 24px; } #general-container-order-info .btn-save-order { display: flex; width: 183px; height: 39px; padding: 8px 32px; justify-content: center; align-items: center; gap: 12px; border-radius: 60px; background: #019DF4; color: white; font-size: 12px; font-weight: 700; line-height: 24px; } #general-container-order-info .btn-save-order[disabled] { opacity: 0.5; } .esim-index-index .column { padding: 0; } .esim-index-index .section-banner { margin-top: 40px; } .esim-index-index .section-banner #c-compatibility { background-color: #0B2739; border-radius: 8px; padding: 20px 50px; width: 82%; position: relative; } .esim-index-index .section-banner #c-compatibility #form-compatibility { width: 30%; } .esim-index-index .section-banner #c-compatibility .title-compatibility { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 22px; /* 9 */ line-height: 1.375rem; /* 9 */ color: #fff; font-weight: 300; text-align: center; } .esim-index-index .section-banner #c-compatibility .c-form__box { margin: 0; } .esim-index-index .section-banner #c-compatibility .c-form__box.u-margin-top-24 { margin-top: 24px; } .esim-index-index .section-banner #c-compatibility .c-form__box.u-margin-top-12 { margin-top: 12px; } .esim-index-index .section-banner #c-compatibility .c-form__box .c-form__field { padding: 0px 10px; border: 1px solid #B6B7B7; border-radius: 4px; } .esim-index-index .section-banner #c-compatibility .c-form__box .c-form__field .c-form__icon_select { margin: 0; } .esim-index-index .section-banner #c-compatibility .c-form__box .c-form__field .c-form__icon_select::before { padding: 7px 15px; top: 4px; } .esim-index-index .section-banner #c-compatibility .c-form__box .c-form__field select { top: 2px; font-size: 16px; color: #86888C; width: 100%; } .esim-index-index .section-banner #c-compatibility #banner_link { position: absolute; right: -5%; top: -35px; } .esim-index-index .section-banner #c-compatibility .btn-verify { margin: 25px 25% 40px; } .esim-index-index .section-banner #c-compatibility .text-compatibility { color: #fff; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 16px; /* 9 */ line-height: 1rem; /* 9 */ border-radius: 4px; padding: 4px 10px; position: relative; } .esim-index-index .section-banner #c-compatibility .text-compatibility .c-form__icon::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .esim-index-index .section-banner #c-compatibility .text-compatibility.checked { border: 1px solid #5CB615; } .esim-index-index .section-banner #c-compatibility .text-compatibility.checked .c-form__icon::before { color: #5CB615; } .esim-index-index .section-banner #c-compatibility .text-compatibility.notChecked { border: 1px solid #EC624B; } .esim-index-index .section-banner #c-compatibility .text-compatibility.notChecked .c-form__icon::before { color: #EC624B; } .esim-index-index .section-banner .u-width-50 { width: 50% !important; } .esim-index-index .section-offers .title-offers { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 40px; /* 9 */ line-height: 2.5rem; /* 9 */ color: #313235; } .esim-index-index .section-offers .btn_dark { background-color: #0B2739; } .esim-index-index .section-offers .f-c-plan_subtitle { margin-top: 5px; } .esim-index-index .section-offers h3.f-c-plan__title.f-c-plan-mb-0 { margin-bottom: 0; } .esim-index-index .section-offers .f-c-plan-arrow:after { font-size: 10px; } .esim-index-index .section-offers .f-c-plan-arrow { top: 50px; width: 20px; height: 20px; background-color: #019DF4; } .esim-index-index .section-offers .f-c-plan-arrow.swiper-button-prev { right: auto; left: -50px; } .esim-index-index .section-offers .f-c-plan-arrow.swiper-button-next { right: -50px; } .esim-index-index .section-offers .f-c-plan-arrow.swiper-button-disabled { background-color: #b6b7b7; } .esim-index-index .section-offers .f-c-plan-arrow::after { color: #fff; } .esim-index-index .section-beneficios .beneficios-esim { box-shadow: -2px 5px 10px #D0D3D4; } .esim-index-index .section-beneficios .b-esim { border-left: 1px solid #f5f5f5; } .esim-index-index .section-compatibles { position: relative; } .esim-index-index .section-compatibles .f-c-plan { padding: 5px; } .esim-index-index .section-compatibles .f-c-plan__content { box-shadow: 0px 2px 4px rgba(11, 39, 57, 0.1); } .esim-index-index .section-compatibles .swiper-button-prevCo, .esim-index-index .section-compatibles .swiper-button-nextCo { width: 20px; height: 20px; background-color: #019DF4; border-radius: 50%; position: absolute; top: 150px; } .esim-index-index .section-compatibles button.swiper-button-prevCo { left: -40px; } .esim-index-index .section-compatibles button.swiper-button-nextCo { right: -40px; } .esim-index-index .section-compatibles .swiper-button-nextCo:after { font-family: swiper-icons; font-size: 10px; text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "next"; position: absolute; color: #fff; font-weight: bold; top: 5px; right: 7px; } .esim-index-index .section-compatibles .swiper-button-prevCo:after { font-family: swiper-icons; font-size: 10px; text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "prev"; position: absolute; color: #fff; font-weight: bold; top: 5px; left: 7px; } .esim-index-index .section-compatibles .banner-compatibles { background-color: #019DF4; padding: 30px 0 60px 0; } .esim-index-index .section-compatibles .dispositivos-compatibles { margin-top: -40px; } .esim-index-index .section-compatibles .dispositivos-compatibles .js-slider-compatibles { padding-bottom: 15px; } .esim-index-index .section-compatibles .dispositivos-compatibles .title_compatible { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ color: #50535A; margin: 20px 20px 0; } .esim-index-index .section-compatibles .dispositivos-compatibles .f-c-plan__toggle-content { margin-top: 15px; } .esim-index-index .section-compatibles .dispositivos-compatibles ul.f-c-plan__benefits { margin-left: 20px; list-style: disc; } .esim-index-index .section-compatibles .dispositivos-compatibles ul.f-c-plan__benefits li { font-weight: 300; border: none; display: block; min-height: auto; padding-bottom: 0px; } .esim-index-index .section-compatibles .dispositivos-compatibles ul.f-c-plan__benefits li span.indicador { font-weight: bold; font-size: 20px; } .esim-index-index .section-compatibles .dispositivos-compatibles span.f-c-plan__toggle-btn { padding-bottom: 15px; display: -webkit-inline-box !important; } .esim-index-index .section-compatibles button.swiper-button-prevCo.swiper-button-disabled { background-color: #B6B7B7; } .esim-index-index .section-compatibles .f-c-plan__toggle-btn::before { display: none; } @media screen and (max-width: 768px) { .esim-index-index .section-compatibles button.swiper-button-prevCo { left: 0px !important; top: 200px; } .esim-index-index .section-compatibles button.swiper-button-nextCo { right: 0px !important; top: 200px; } } .esim-index-index .section-queEs { position: relative; } .esim-index-index .section-queEs .swiperQ { margin: 40px auto; width: 80%; } .esim-index-index .section-queEs .swiper-button-prevQ, .esim-index-index .section-queEs .swiper-button-nextQ { width: 20px; height: 20px; background-color: #019DF4; border-radius: 50%; position: absolute; top: 100px; } .esim-index-index .section-queEs button.swiper-button-prevQ { left: 20px; } .esim-index-index .section-queEs button.swiper-button-nextQ { right: 20px; } .esim-index-index .section-queEs .swiper-button-nextQ:after { font-family: swiper-icons; font-size: 10px; text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "next"; position: absolute; color: #fff; font-weight: bold; top: 5px; right: 7px; } .esim-index-index .section-queEs .swiper-button-prevQ:after { font-family: swiper-icons; font-size: 10px; text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "prev"; position: absolute; color: #fff; font-weight: bold; top: 5px; left: 7px; } .esim-index-index .section-proceso.bg-white { background-color: #fff; } .esim-index-index .section-proceso .title-proceso { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 40px; /* 9 */ line-height: 2.5rem; /* 9 */ color: #019DF4; } .esim-index-index .section-proceso dl.c-filter__list-term.js-target-dropdown { margin-bottom: 5px; border-bottom: 1px solid #efefef; padding-bottom: 5px; } .esim-index-index .section-proceso .sidebar.sidebar-main.terms { border-bottom: none !important; } .esim-index-index .section-tyc { background-color: #fff; } .esim-index-index .section-tyc dt.c-filter__options-title.o-dropdown__btn { border-bottom: 1px solid #e5e5e5; padding: 8px 0; } .esim-index-index .section-tyc .sidebar.sidebar-main.terms { border-bottom: none !important; } .esim-index-index .modals-overlay { pointer-events: none !important; } .esim-index-index .pagebuilder-column:not(.d-flex-row) figure { margin: initial !important; } .esim-index-index .f-c-plan-slide, .esim-index-index .f-c-plan { max-width: none; } .esim-index-index .f-c-plan-slide .f-c-plan__content, .esim-index-index .f-c-plan .f-c-plan__content { padding: 0; } .esim-index-index .f-c-plan-wrap { margin: 0; padding: 0; } @media screen and (max-width: 768px) { .esim-index-index .section-banner { margin-top: 0; } .esim-index-index .section-banner div#c-compatibility { width: 100%; border-radius: 0px; padding: 0px; } .esim-index-index .section-banner div#c-compatibility #form-compatibility { width: 90%; margin: auto; padding-bottom: 1px; } .esim-index-index .section-banner div#c-compatibility #form-compatibility .title-compatibility { margin-top: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 15px; /* 9 */ font-size: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 15px; /* 9 */ line-height: 0.9375rem; /* 9 */ } .esim-index-index .section-banner div#c-compatibility #form-compatibility .c-form__box.u-width-100, .esim-index-index .section-banner div#c-compatibility #form-compatibility .text-compatibility { width: 80% !important; margin-left: 10%; } .esim-index-index .section-offers .title-offers { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 26px; /* 9 */ font-size: 1.625rem; /* 9 */ margin-top: 18px !important; } .esim-index-index .section-offers .f-c-plan__content.u-margin-top-24 { margin-top: 0 !important; } .esim-index-index .section-offers span.f-c-plan__toggle-btn { padding-bottom: 15px; display: -webkit-inline-box !important; } .esim-index-index .section-compatibles { position: relative; } .esim-index-index .section-compatibles .mySwiper { max-width: 88%; margin: -40px auto; } .esim-index-index .section-compatibles .swiper-button-prevCo, .esim-index-index .section-compatibles .swiper-button-nextCo { width: 25px; height: 25px; background-color: #019DF4; border-radius: 50%; position: absolute; top: 50%; } .esim-index-index .section-compatibles button.swiper-button-prevCo { left: 35px; } .esim-index-index .section-compatibles button.swiper-button-nextCo { right: 35px; } .esim-index-index .section-compatibles .swiper-button-nextCo:after { font-family: swiper-icons; font-size: 10px; text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "next"; position: absolute; color: #fff; font-weight: bold; top: 7px; right: 9px; } .esim-index-index .section-compatibles .swiper-button-prevCo:after { font-family: swiper-icons; font-size: 10px; text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; content: "prev"; position: absolute; color: #fff; font-weight: bold; top: 7px; left: 9px; } } .u-width-30 { width: 30%; } .u-margin-top-12 { margin-top: 12px; } .esim-identidad-index .esim-c-form__header__center { display: flex; justify-content: space-between; align-items: center; } .esim-identidad-index .esim-address-subtitle { font-size: 20px; font-weight: 600; } .esim-identidad-index .c-callout-esim { display: block; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; column-gap: 16px; column-gap: 1rem; border: 1px solid #019DF4; background-color: #E6F5FD; padding: 20px 18px; padding: 1.25rem 1.125rem; border-radius: 4px; border-radius: 0.25rem; color: #313235; } .esim-identidad-index .c-callout-esim::before { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: #019DF4; } .esim-identidad-index .c-callout_sm-esim { column-gap: 8px; column-gap: 0.5rem; padding: 16px; padding: 0.5rem; margin-top: 0; font-size: 14px; font-size: 0.875rem; display: flex; flex-direction: row-reverse; align-items: center; } .esim-identidad-index .c-form__field-canvas { margin-bottom: 20px; } @media (max-width: 600px) { .esim-identidad-index .c-form__field-canvas .lg-only { display: none; } } .esim-identidad-index .c-form__field-canvas.field-fechas { -webkit-box-align: normal; -ms-flex-align: normal; -webkit-align-items: normal; -moz-align-items: normal; align-items: normal; margin-bottom: 0px !important; } .esim-identidad-index .c-form__field-canvas div#linea-portar, .esim-identidad-index .c-form__field-canvas div#idNumberSpan { border: none !important; background: none !important; box-shadow: 0 4px 2px -2px #019DF4 !important; } @media (max-width: 600px) { .esim-identidad-index .c-form__field-canvas div#linea-portar, .esim-identidad-index .c-form__field-canvas div#idNumberSpan { margin-bottom: 20px; } } .esim-identidad-index .c-form__actions_left { text-align: left; } @media (max-width: 600px) { .esim-identidad-index .c-form__actions_left { text-align: center; } } .esim-identidad-index .text-tratamiento-datos { justify-content: flex-start; } @media (max-width: 600px) { .esim-identidad-index .text-tratamiento-datos { justify-content: center; } } .esim-identidad-index .sp-tratamiento-datos { text-decoration: underline; cursor: pointer; } .esim-identidad-index .o-message__title_fs24 { font-weight: 500; } @media screen and (max-width: 940px) { .esim-identidad-index .o-message__title_fs24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } } .esim-identidad-index .c-form__field { padding: 12px; background-color: #fff; } .esim-identidad-index .c-form__field input { font-size: 1em; line-height: 24px; } .esim-identidad-index .c-form__field .c-form__select { width: 100%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 5px; /* 9 */ padding-left: 0.3125rem; /* 9 */ } .esim-identidad-index .typeDocument .c-form__icon_select::before { z-index: 2; } .esim-identidad-index .strong { font-weight: bold; } .esim-identidad-index .font-small { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 15px; /* 9 */ font-size: 0.9375rem; /* 9 */ font-weight: 700; } .esim-identidad-index span.c-form__error-text { padding-left: 0 !important; } .esim-identidad-index span.c-form__message-text { padding-left: 0 !important; color: #5CB615; font-size: 0.875rem; width: fit-content; } .esim-identidad-index .errorNumberPortability.msj_fail { background-color: #F8D2B3; border: 1px solid #F28D15; padding: 0px 20px !important; margin-bottom: 10px; } .esim-identidad-index .img-nip { width: 55px; display: block; margin: auto; } .esim-identidad-index .txt-nip { margin: 0 15%; line-height: 1.2em; } .esim-identidad-index .container_code { width: 80%; margin: 0 auto 20px; } .esim-identidad-index .nipTime, .esim-identidad-index .nipSendCode { width: 50%; float: left; } .esim-identidad-index .nipSendCode { text-align: right !important; text-decoration: underline; padding-right: 15px; } .esim-identidad-index .center { text-align: center; } .esim-identidad-index .m-auto { margin: auto; display: block; } .esim-identidad-index .mt-20 { margin-top: 20px; } .esim-identidad-index a.disabled, .esim-identidad-index .eventNone { pointer-events: none !important; } @media (max-width: 739px) { .esim-identidad-index .m-none { display: none !important; } } @media (max-width: 600px) { .esim-identidad-index #modal-nip { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 10px; /* 9 */ padding-left: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 10px; /* 9 */ padding-right: 0.625rem; /* 9 */ } .esim-identidad-index .container_code { width: 100%; } .esim-identidad-index .txt-nip { margin: auto; } .esim-identidad-index .txt-mobile-small * { font-size: 0.8em; } .esim-identidad-index .c-form__code-number { width: 14vw; height: 20vw; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 40px; /* 9 */ font-size: 2.5rem; /* 9 */ } .esim-identidad-index .c-form__title_big { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ text-align: center; } .esim-identidad-index #btnPortar { max-width: 100%; } .esim-identidad-index p.c-form__lead.c-form__lead_gray { text-align: center; } } .esim-identidad-index .modal-tratamiento .modal-inner-wrap { margin-top: 2% !important; } @media (max-width: 600px) { .esim-identidad-index .modal-tratamiento .modal-inner-wrap { margin-top: 10% !important; } } .esim-identidad-index .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago { overflow-y: auto; } .esim-identidad-index .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago .o-modal__footer { text-align: center; } .esim-identidad-index .header-tratamiento-datos { text-align: center; } .esim-identidad-index .header-tratamiento-datos p { width: 70%; margin-left: auto; margin-right: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 26px; /* 9 */ line-height: 1.625rem; /* 9 */ color: #019DF4; } @media (max-width: 600px) { .esim-identidad-index .header-tratamiento-datos p { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 25px; /* 9 */ line-height: 1.5625rem; /* 9 */ } } .esim-identidad-index .o-modal__content { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 15px; /* 9 */ margin-bottom: 0.9375rem; /* 9 */ } .esim-identidad-index .o-modal__content .contenido-tratamiento-datos { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 18px; /* 9 */ line-height: 1.125rem; /* 9 */ text-align: justify; } @media (max-width: 600px) { .esim-identidad-index .o-modal__content .contenido-tratamiento-datos { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 16px; /* 9 */ line-height: 1rem; /* 9 */ } } .esim-identidad-index .o-modal__content .titulo-whatsapp { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ color: #019DF4; font-weight: normal; } .esim-identidad-index .o-modal__footer .btnContinuarTratamiento { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 255px; /* 9 */ min-width: 15.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ height: 40px; /* 9 */ height: 2.5rem; /* 9 */ } @media (max-width: 600px) { .esim-identidad-index .o-modal__footer .btnContinuarTratamiento { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 150px; /* 9 */ min-width: 9.375rem; /* 9 */ } } .esim-identidad-index .c-form__actions_left { text-align: left; } @media screen and (min-width: 740px) { .esim-identidad-index .c-card-checkout-cta { justify-content: center; } } .esim-identidad-index .content-edit-customer-info { display: none; justify-content: end; margin-bottom: 10px; margin-top: 10px; } .esim-identidad-index .content-edit-customer-info span { cursor: pointer; margin: 0 8px; color: #019DF4; text-decoration-line: underline; } .esim-identidad-index .edit-address-info { text-align: right; } .esim-identidad-index .edit-address-info span { cursor: pointer; margin: 0 8px; color: #019DF4; text-decoration-line: underline; } .esim-identidad-index .o-btn.o-btn-modal { margin: 20px auto 0px; } .esim-identidad-index .customer-section.no-edit .content-edit-customer-info, .esim-identidad-index .address-section.no-edit .content-edit-customer-info { display: flex; } .esim-identidad-index .customer-section.no-edit .c-form__box, .esim-identidad-index .address-section.no-edit .c-form__box { pointer-events: none; opacity: 0.4; } .esim-identidad-index .customer-section.no-edit #setConcatAddress, .esim-identidad-index .address-section.no-edit #setConcatAddress { display: block; } .esim-identidad-index #address-section-esim span.select2-selection.select2-selection--single { border: none !important; height: 2rem !important; } .esim-identidad-index #address-section-esim span.select2-selection__rendered { height: auto !important; line-height: 2rem !important; max-width: 95%; } .esim-identidad-index #address-section-esim span.c-form__icon { margin-right: 15px !important; } @media (min-width: 768px) { .esim-identidad-index .address-section.no-edit .toggle-container.showDesktp { display: block !important; height: auto !important; } } @media (max-width: 767px) { .esim-identidad-index .address-section.no-edit .toggle-container:not(.showDesktp) { display: none !important; } } .esim-identidad-index #address-section-esim span.select2-selection.select2-selection--single { border: none !important; height: 2rem !important; } .esim-identidad-index #address-section-esim span.select2-selection__rendered { height: auto !important; line-height: 2rem !important; max-width: 95%; } .esim-identidad-index #address-section-esim span.c-form__icon { margin-right: 15px !important; } .esim-identidad-index .address-section { /*--modal tiendas--*/ } .esim-identidad-index .address-section .center { text-align: center; } .esim-identidad-index .address-section .right { text-align: right; } .esim-identidad-index .address-section .sub-title { color: #858585; margin: -15px auto 35px; } .esim-identidad-index .address-section .fw-700 { font-weight: 700; } .esim-identidad-index .address-section .icon-sim { margin-right: 15px; color: #019DF4; font-weight: 900; } .esim-identidad-index .address-section .icon-sim::before { padding: 0; font-size: 12px; } .esim-identidad-index .address-section .c-radio-sim { background-color: #fff; padding: 25px; width: 90%; border-radius: 8px; font-family: "Telefonica", sans-serif; font-size: 16px; line-height: 24px; } .esim-identidad-index .address-section .c-radio-sim .c-form__icon { right: auto; } .esim-identidad-index .address-section .c-radio-sim .ml-35 { margin-left: 35px; } .esim-identidad-index .address-section #tienda { max-width: 100%; } .esim-identidad-index .address-section .c-selectEntrega { margin-left: 0; margin-top: 0; } .esim-identidad-index .address-section .c-radio-sim.is-field-check { border: 1px solid #019DF4; } .esim-identidad-index .address-section .c-radio-sim.is-field-check .c-form__radio-button[type=radio]::before { transform: scale(1); } .esim-identidad-index .address-section .c-radio-sim.is-field-check input { border: 1px solid #019DF4; } .esim-identidad-index .address-section .c-radio-sim:not(.is-field-check) input { border: 1px solid #B6B7B7; } .esim-identidad-index .address-section .c-radio-sim:not(.is-field-check) .c-form__radio-button[type=radio]::before { transform: scale(0); } .esim-identidad-index .address-section .info-sim { background: #fff; border: none; padding: 20px 35px; font-size: 14px; line-height: 16px; } .esim-identidad-index .address-section .info-sim .c-form__icon { right: unset; } .esim-identidad-index .address-section .info-sim .i-information::before { color: #019DF4; font-weight: 900; } .esim-identidad-index .address-section .info-sim div { margin-left: 30px; } .esim-identidad-index .address-section .c-form__box .c-form__field { background-color: #fff !important; padding: 12px; } .esim-identidad-index .address-section .c-form__box .c-form__field .address_select, .esim-identidad-index .address-section .c-form__box .c-form__field .c-form__select { max-width: 100%; } .esim-identidad-index .address-section .c-form__box .c-form__field .in-detalle-direccion { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 8px; /* 9 */ top: 0.5rem; /* 9 */ } .esim-identidad-index .address-section .c-form__box .c-form__field .lb-detalle-direccion { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -32px; /* 9 */ top: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #019DF4; } .esim-identidad-index .address-section .c-form__box .c-form__field.is-error .lb-detalle-direccion { color: #FF374A; } .esim-identidad-index .address-section .c-form__box .c-form__text { display: block; text-align: left; } .esim-identidad-index .address-section .c-form__box.is-error .c-form__text { display: none; } @media screen and (max-width: 739px) { .esim-identidad-index .address-section .c-form__box.is-error .c-form__text { display: block; } } .esim-identidad-index .address-section .ptoRetiro { border-bottom: 1px solid #E6E6E6; margin-bottom: 20px; } .esim-identidad-index .address-section .tiendaSeleccionada { max-width: 60%; } .esim-identidad-index .address-section .cambiarPto { font-weight: 400; font-size: 16px; line-height: 65px; text-decoration-line: underline; color: #019DF4; padding: 0 20px; cursor: pointer; } .esim-identidad-index .address-section .d-f { display: flex; } .esim-identidad-index .address-section .max-h { max-height: 340px; } .esim-identidad-index .address-section .tiendas_municipio ol { list-style-type: none; } .esim-identidad-index .address-section .tiendas_municipio ol li { padding: 15px; border: 1px solid #D8D8D8; border-radius: 4px; margin-bottom: 10px; cursor: pointer; } .esim-identidad-index .address-section .lugar { font-style: normal; font-weight: 700; font-size: 18px; line-height: 24px; display: flex; align-items: center; color: #50535A; } .esim-identidad-index .address-section .centro { font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; color: #0B2739; display: flex; } .esim-identidad-index .address-section .horario { font-style: normal; font-weight: 400; font-size: 14px; line-height: 18px; color: #86888C; } .esim-identidad-index .address-section .o-modal__footer { margin-top: 15px; } @media screen and (max-width: 739px) { .esim-identidad-index .address-section .lg-input { display: none; } } .esim-identidad-index .address-section .mb-group-input { display: none; } @media screen and (max-width: 739px) { .esim-identidad-index .address-section .mb-group-input { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; } .esim-identidad-index .address-section .mb-group-input .u-mb-width-40 { max-width: 40%; } .esim-identidad-index .address-section .mb-group-input .u-mb-width-25 { max-width: 25%; } .esim-identidad-index .address-section .mb-group-input .mb-input { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 15px; /* 9 */ margin-bottom: 0.9375rem; /* 9 */ } } @media (max-width: 600px) { .esim-identidad-index .address-section .tiendaSeleccionada, .esim-identidad-index .address-section .cambiarPto { width: 100%; margin: 0px !important; max-width: 100%; } .esim-identidad-index .address-section .cambiarPto { text-align: right; } .esim-identidad-index .address-section .d-f { display: block; } .esim-identidad-index .address-section .c-radio-sim { width: 100%; padding: 20px; } .esim-identidad-index .address-section .m-center { text-align: center; } .esim-identidad-index .address-section .info-sim { padding: 20px; } } .esim-identidad-index .address-section #alert_container.is-error { padding: 0.6rem 0.8rem; margin-top: 1rem; } .esim-identidad-index .address-section #alert_container.is-error .c-callout__btn::after { color: #FF374A; } .esim-identidad-index .address-section #setConcatAddress { display: none; } .esim-identidad-index .address-section .o-headline_blue { color: #0B2739; } @media screen and (max-width: 739px) { .esim-identidad-index .address-section #setConcatAddress .c-form__wrap-field { flex-direction: row; } .esim-identidad-index .address-section #setConcatAddress .c-form__wrap-field .i-pencil-strong label { display: none; /* Hide the text "Editar dirección" */ } } .esim-identidad-index .sim-section h2 { color: #313235; } .esim-identidad-index .sim-section .c-entrega { background: #FFFFFF; border-radius: 6px; padding: 20px; margin-bottom: 20px; } .esim-identidad-index .sim-section .c-entrega h2 { margin-bottom: 15px !important; color: #313235; } .esim-identidad-index .sim-section .c-entrega h2.title-2 { text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 26px; /* 9 */ font-size: 1.625rem; /* 9 */ margin-bottom: 0 !important; } @media screen and (max-width: 739px) { .esim-identidad-index .sim-section .c-entrega h2.title-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } } .esim-identidad-index .sim-section .c-entrega .subtitle-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } @media screen and (max-width: 739px) { .esim-identidad-index .sim-section .c-entrega .subtitle-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } } .esim-identidad-index .sim-section .c-entrega .c-form__field-canvas { margin-bottom: 0; } @media screen and (max-width: 739px) { .esim-identidad-index .sim-section .c-entrega .c-form__field-canvas { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } } .esim-identidad-index .sim-section .c-entrega .c-form__radio-button-label { grid-template-columns: 5px auto !important; } .esim-identidad-index .sim-section .c-entrega .c-form__field-canvas.selectEntregar { column-gap: 0; margin-top: 20px !important; } .esim-identidad-index .sim-section .c-entrega .c-form__field-canvas.selectEntregar .c-form__field { padding: 12px !important; color: #019DF4; border: none; width: 0; margin-right: 10px; margin-left: -5px; } .esim-identidad-index .sim-section .c-entrega .c-form__field-canvas.selectEntregar .c-form__icon::before { padding-right: 0; } .esim-identidad-index .sim-section .c-entrega .infoEntregar { font-weight: 400; font-size: 14px; line-height: 20px; } .esim-identidad-index .sim-section .txtDelivery { margin-top: 15px; margin-left: 6%; } .esim-identidad-index .sim-section .datesMonth { margin-bottom: 15px; font-size: 20px; } .esim-identidad-index .sim-section table th, .esim-identidad-index .sim-section table td { text-align: center; } .esim-identidad-index .sim-section .pagination li:hover { cursor: pointer; } .esim-identidad-index .sim-section table tbody tr { display: none; } .esim-identidad-index .sim-section table tbody tr td:not(.line) { cursor: pointer; } .esim-identidad-index .sim-section ul.pagination { list-style-type: none; } .esim-identidad-index .sim-section ul.pagination li { color: #019DF4; margin-top: 45px; } .esim-identidad-index .sim-section .c-form__field-canvas.fechas { column-gap: 0.5rem; } .esim-identidad-index .sim-section .txtND { margin-right: 6%; } .esim-identidad-index .sim-section #days-table .line, .esim-identidad-index .sim-section #days-window .line { background-image: linear-gradient(to top left, #F5F5F5 48%, #C4C4C4, #F5F5F5 52%); } .esim-identidad-index .sim-section #days-table .dateSelected, .esim-identidad-index .sim-section #days-window .dateSelected { background-color: #0B2739; color: #fff; } .esim-identidad-index .sim-section #days-table .firstElement, .esim-identidad-index .sim-section #days-window .firstElement { border-radius: 8px 0px 0 8px; } .esim-identidad-index .sim-section #days-table .lastElement, .esim-identidad-index .sim-section #days-window .lastElement { border-radius: 0px 8px 8px 0; } .esim-identidad-index .sim-section #days-table th, .esim-identidad-index .sim-section #days-window th { padding-bottom: 10px; } .esim-identidad-index .sim-section #days-table tbody, .esim-identidad-index .sim-section #days-window tbody { border-collapse: collapse; border-radius: 8px; border-style: hidden; /* hide standard table (collapsed) border */ box-shadow: 0 0 0 1px #D4D4D4; /* this draws the table border */ } .esim-identidad-index .sim-section #days-table tbody td, .esim-identidad-index .sim-section #days-window tbody td { padding: 10px; color: #AFB1B3; border: 1px solid #D4D4D4; } .esim-identidad-index .sim-section .c-form__field-canvas.concatDir .c-form__field { padding: 5px 12px; } .esim-identidad-index .address-section .c-form__error-text, .esim-identidad-index .sim-section .c-form__error-text { padding-left: 0; } .esim-identidad-index .address-section .c-form__box.u-width-90, .esim-identidad-index .sim-section .c-form__box.u-width-90 { width: 80%; } .esim-identidad-index .address-section .c-form__box.u-width-80, .esim-identidad-index .sim-section .c-form__box.u-width-80 { width: 90%; } .esim-identidad-index .address-section .c-form__box.u-width-45, .esim-identidad-index .sim-section .c-form__box.u-width-45 { width: 45%; } .esim-identidad-index .address-section .c-form__box.u-width-25, .esim-identidad-index .sim-section .c-form__box.u-width-25 { width: 25%; } .esim-identidad-index .address-section .c-form__box.u-width-5, .esim-identidad-index .sim-section .c-form__box.u-width-5 { width: 5%; } @media (max-width: 600px) { .esim-identidad-index .address-section .c-form__box.u-width-80, .esim-identidad-index .address-section .c-form__box.u-width-45, .esim-identidad-index .address-section .c-form__box.u-width-25, .esim-identidad-index .sim-section .c-form__box.u-width-80, .esim-identidad-index .sim-section .c-form__box.u-width-45, .esim-identidad-index .sim-section .c-form__box.u-width-25 { width: 100% !important; } .esim-identidad-index .address-section h2, .esim-identidad-index .sim-section h2 { font-size: 5vw; text-align: center; } } .esim-identidad-index .address-section .c-form__text-box, .esim-identidad-index .sim-section .c-form__text-box { /* 3 */ /* 3 */ /* 5 */ /* 5 */ width: auto; /* 8 */ } .esim-identidad-index #btnIdentidad { text-align: right; } @media screen and (max-width: 739px) { .esim-identidad-index #btnIdentidad { text-align: center; } } .esim-identidad-index .js-timer-seconds, .esim-identidad-index .nipSendCode { font-weight: 700; } .esim-identidad-index .select2-container { display: initial !important; } .esim-identidad-index .c-card-summary, .esim-contrato-index .c-card-summary { position: sticky; top: 10px; background: transparent; border-radius: 0px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 0px; /* 9 */ padding: 0rem; /* 9 */ } .esim-identidad-index .c-card-summary .c-card-summary__item, .esim-contrato-index .c-card-summary .c-card-summary__item { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 16px; /* 9 */ padding-top: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 32px; /* 9 */ padding-right: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 5px; /* 9 */ padding-bottom: 0.3125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 32px; /* 9 */ padding-left: 2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ border-radius: 6px; /* 9 */ border-radius: 0.375rem; /* 9 */ background: #fff; } .esim-identidad-index .c-card-summary__title, .esim-contrato-index .c-card-summary__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } .esim-identidad-index .c-card-summary__title_border, .esim-contrato-index .c-card-summary__title_border { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 0px; /* 9 */ padding-bottom: 0rem; /* 9 */ } .esim-identidad-index .c-card-checkout-cta__btn, .esim-contrato-index .c-card-checkout-cta__btn { background-color: #0B2739; color: #fff; font-weight: 100; } .esim-identidad-index .c-card-checkout-cta__btn::before, .esim-contrato-index .c-card-checkout-cta__btn::before { color: #fff; } .esim-identidad-index .c-card-summary__free-shipping, .esim-contrato-index .c-card-summary__free-shipping { border-bottom: 0px solid transparent; margin-top: 10px; padding-bottom: 0px; display: flex; justify-content: space-between; color: #424B5A; } .esim-identidad-index .c-card-summary-border, .esim-contrato-index .c-card-summary-border { border-bottom: 1px solid #D3D4D3; } .esim-identidad-index .c-card-summary__total, .esim-contrato-index .c-card-summary__total { margin-top: 0px; color: #424B5A; } .esim-identidad-index .details-customer-summary li, .esim-contrato-index .details-customer-summary li { padding: 3px 0; } .esim-identidad-index .c-card-summary__details-customer, .esim-contrato-index .c-card-summary__details-customer { border-bottom: 0px solid transparent; padding-bottom: 2px; } @media (min-width: 740px) and (max-width: 1023px) { .esim-identidad-index .c-card-checkout-cta, .esim-contrato-index .c-card-checkout-cta { justify-content: center; margin: 10px auto 0 auto; } } .esim-identidad-index, .esim-confronta-index, .esim-contrato-index, .esim-thankyoupage-index { font-family: "Telefonica", sans-serif; } .esim-identidad-index button, .esim-identidad-index input, .esim-identidad-index optgroup, .esim-identidad-index select, .esim-identidad-index textarea, .esim-confronta-index button, .esim-confronta-index input, .esim-confronta-index optgroup, .esim-confronta-index select, .esim-confronta-index textarea, .esim-contrato-index button, .esim-contrato-index input, .esim-contrato-index optgroup, .esim-contrato-index select, .esim-contrato-index textarea, .esim-thankyoupage-index button, .esim-thankyoupage-index input, .esim-thankyoupage-index optgroup, .esim-thankyoupage-index select, .esim-thankyoupage-index textarea { font-family: "Telefonica", sans-serif; } @media screen and (max-width: 739px) { .esim-identidad-index .f-c-header-step__brand-inner, .esim-confronta-index .f-c-header-step__brand-inner, .esim-contrato-index .f-c-header-step__brand-inner, .esim-thankyoupage-index .f-c-header-step__brand-inner { text-align: center; } } .esim-identidad-index .page-wrapper .c-header-wrap, .esim-confronta-index .page-wrapper .c-header-wrap, .esim-contrato-index .page-wrapper .c-header-wrap, .esim-thankyoupage-index .page-wrapper .c-header-wrap { position: relative; } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps { width: 100%; height: 5em; display: flex; justify-content: center; align-items: center; background-color: white; } @media screen and (max-width: 739px) { .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps { height: auto; display: block; background-color: transparent; } } @media screen and (max-width: 739px) { .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container { margin-top: 24px; margin-top: 1.5rem; } } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list { column-gap: 76px; column-gap: 4.75rem; } @media screen and (max-width: 739px) { .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list { column-gap: 40px; column-gap: 2.5rem; } } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step { max-width: 76px; max-width: 4.75rem; } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after { top: -25px; width: 76px; width: 4.75rem; } @media screen and (max-width: 739px) { .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step::after { top: 0; width: 34px; width: 2.125rem; } } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type { padding-left: 0.75rem; } @media screen and (max-width: 739px) { .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step:last-of-type { padding-left: 0; } } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step::before { color: #019DF4; } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.current-step .pos-step__title { color: #019DF4; } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::before { border-color: #019DF4; background-color: transparent; content: ""; font-family: "ico-movistar"; color: #019DF4; border: 2px solid #019DF4; border-radius: 50%; } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step.check-step::after { background-color: #019DF4; } .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title { font-family: "Telefonica", sans-serif; display: block; } @media screen and (max-width: 739px) { .esim-identidad-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .esim-confronta-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .esim-contrato-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title, .esim-thankyoupage-index .page-wrapper .c-header-wrap .header-pos-steps .pos-steps-container__list .pos-step__title { display: none; } } .esim-identidad-index span.errorPhone, .esim-confronta-index span.errorPhone, .esim-contrato-index span.errorPhone, .esim-thankyoupage-index span.errorPhone { margin-left: 16%; color: red; } @media screen and (max-width: 600px) { .esim-identidad-index span.errorPhone, .esim-confronta-index span.errorPhone, .esim-contrato-index span.errorPhone, .esim-thankyoupage-index span.errorPhone { margin-left: 0px; color: red; } } .esim-identidad-index footer.modal-footer, .esim-confronta-index footer.modal-footer, .esim-contrato-index footer.modal-footer, .esim-thankyoupage-index footer.modal-footer { border-top: 0 !important; text-align: center !important; padding: 1rem; margin-top: 1rem !important; background: #fff; margin: 0; margin-top: -15px !important; border-radius: 0 0 15px 15px; } .esim-confronta-index .c-form__title_big_esim { font-size: 41px; margin-bottom: 1rem; line-height: 1.1; font-weight: 400; } @media screen and (max-width: 600px) { .esim-confronta-index .c-form__title_big_esim { font-size: 23px; margin-bottom: 1rem; line-height: 1.1; font-weight: 600; } } .esim-confronta-index .c-form_field__confronta-esim { width: 80%; margin: 0 auto; box-shadow: 0 4px 15px -2px rgba(0, 0, 0, 0.1); } @media screen and (max-width: 600px) { .esim-confronta-index .c-form_field__confronta-esim { width: 100%; box-shadow: 0 4px 15px -2px rgba(0, 0, 0, 0.1); } } .esim-confronta-index .c-form__header_esim { margin-left: 8vw; margin-right: 8vw; } @media screen and (max-width: 600px) { .esim-confronta-index .c-form__header_esim { margin-left: 4vw; margin-right: 4vw; } } .esim-confronta-index .line__esim-horizontal { width: 80%; margin-top: 18px; opacity: 0.4; } .esim-confronta-index .step__esim-confronta { font-size: 1.5rem; font-weight: 600; } .esim-confronta-index .c-form__actions_right_esim { text-align: right; } .esim-confronta-index .c-form__btn_full_esim { width: 25%; height: 48px; margin-right: 8vw; } @media screen and (max-width: 600px) { .esim-confronta-index .c-form__btn_full_esim { width: 90%; margin: 0 auto; } } .esim-confronta-index .c-card-checkout-cta__btn { background-color: #0B2739; color: #fff; font-weight: 300; } .esim-confronta-index header .c-form__title_big { font-weight: 700; } .esim-confronta-index header .c-form__lead_gray { font-weight: 400; } @media screen and (max-width: 768px) { .esim-confronta-index header .c-form__title_big { text-align: center; font-size: 24px; } .esim-confronta-index header .c-form__lead_gray { text-align: center; font-size: 14px; } } @media screen and (max-width: 600px) { .esim-contrato-index .c-form__title_big_esim-sm { font-size: 1.75rem !important; } .esim-contrato-index .c-form__lead_left { text-align: left !important; } } .esim-contrato-index .pos-con-container__title_flex { display: flex; justify-content: space-between; align-items: baseline; } .esim-contrato-index .c-card-checkout-cta__btn { background-color: #0B2739; color: #fff; font-weight: 300; } .esim-contrato-index .pos-con-container__title *, .esim-contrato-index .pos-con-container__subtitle, .esim-contrato-index .pos-con-container__info { text-align: left; } .esim-contrato-index #submit-sign-contract { margin: initial; max-width: 225px; } @media screen and (max-width: 768px) { .esim-contrato-index section#firma-contrato { margin-top: 0px; } .esim-contrato-index .pos-con-container__title * { text-align: center; } .esim-contrato-index #submit-sign-contract { max-width: 100%; } } .esim-thankyoupage-index .esim-titleSummary__container { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 24px; /* 9 */ margin-top: 1.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 24px; /* 9 */ margin-bottom: 1.5rem; /* 9 */ } .esim-thankyoupage-index .bloqueInfo { display: flex; justify-content: center; flex-wrap: wrap; flex-direction: row; border-bottom: 1px solid #D3D4D3; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-top: 10px; /* 9 */ padding-top: 0.625rem; /* 9 */ } @media (max-width: 768px) { .esim-thankyoupage-index .bloqueInfo:not(.line) { flex-direction: column; } .esim-thankyoupage-index .bloqueInfo.line .titlebloqueInfo { flex: auto; padding-bottom: 10px; } } .esim-thankyoupage-index .columnbloqueInfo { padding: 10px; box-sizing: border-box; padding-left: 5px; } .esim-thankyoupage-index .titlebloqueInfo { font-size: 18px; font-weight: 700; color: #313235; line-height: 24px; flex: 0 0 30%; } @media (max-width: 768px) { .esim-thankyoupage-index .titlebloqueInfo { padding-bottom: 0; } } .esim-thankyoupage-index .descriptionbloqueInfo { font-size: 1em; list-style: none; flex: 1 1 25%; align-content: center; } @media (max-width: 768px) { .esim-thankyoupage-index .descriptionbloqueInfo { line-height: 20px; } } .esim-thankyoupage-index .d-flex { display: flex; justify-content: center; } .esim-thankyoupage-index .column { display: flex; flex-direction: column; padding: 5px; margin: 0 15px 0 15px; } @media (max-width: 768px) { .esim-thankyoupage-index .column { margin: 0; } } .esim-thankyoupage-index .column.main { width: auto !important; } .esim-thankyoupage-index .row, .esim-thankyoupage-index .row.containerSim { display: flex; flex-direction: row; } .esim-thankyoupage-index h1 { margin-bottom: 0px; } .esim-thankyoupage-index .w-100 { width: 100%; } .esim-thankyoupage-index .w-auto { width: auto; } .esim-thankyoupage-index .text-blue { color: #019DF4; } .esim-thankyoupage-index .text-blue-dark { color: #0B2739; } .esim-thankyoupage-index .font-26 { font-size: 26px; } .esim-thankyoupage-index p.i-information.text-blue { margin-right: 8px; font-size: larger; } .esim-thankyoupage-index .row.containerSim.column-flex.contract { justify-content: center; border-bottom: none; } .esim-thankyoupage-index .modals-overlay { background-color: rgba(11, 39, 57, 0.95); pointer-events: none !important; } .esim-thankyoupage-index .content-btngoBack { margin-top: 20px; margin-left: auto; } @media screen and (max-width: 768px) { .esim-thankyoupage-index .content-btngoBack { margin-left: initial; margin-top: 0px; } } .esim-thankyoupage-index .contentPurchaseSummary.row { column-gap: 30px; } .esim-thankyoupage-index .row.column-flex { border-bottom: 1px solid #D3D4D3; justify-content: flex-start; padding-bottom: 10px; padding-top: 5px; } .esim-thankyoupage-index ul.detailDataClient.detailServices { list-style-type: none; } .esim-thankyoupage-index .containerPrincipal .title-qr { color: #0B2739; font-size: 26px; } @media screen and (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .title-qr { font-size: 24px; } } .esim-thankyoupage-index .containerPrincipal .subtitle-qr { color: #86888C; font-size: 16px; } .esim-thankyoupage-index .containerPrincipal .title-qr-Mobile { color: #0B2739; font-size: 20px; line-height: 2px; } .esim-thankyoupage-index .containerPrincipal .subtitle-qr-mobile { color: #0B2739; font-size: 21px; margin-top: 25px; text-align: left; margin-left: 2rem; text-align: justify; margin-right: 2rem; } .esim-thankyoupage-index .containerPrincipal .bannerTotal { width: 80%; margin: 0px auto; margin-top: 20px; padding: 10px 20px; border-radius: 10px; } @media screen and (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .bannerTotal { width: 100%; } } .esim-thankyoupage-index .containerPrincipal .o-btn { background-color: white; padding: 10px 20px; border-radius: 25px; max-width: 172px; color: black; font-size: 12px; font-weight: 400; } @media screen and (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .o-btn { width: 60%; margin: 10px auto; min-height: 44px; max-width: none; } } .esim-thankyoupage-index .containerPrincipal .messageCongratulations { align-items: center; margin-top: 30px; } .esim-thankyoupage-index .containerPrincipal .titleCongratulations { color: #019DF4; font-weight: 700; font-size: 28px; line-height: 38px; } .esim-thankyoupage-index .containerPrincipal .descriptionCongratulations { color: #424B5A; line-height: 21px; font-size: 20px; font-weight: 400; } .esim-thankyoupage-index .containerPrincipal .containerDirectionDate { margin-top: 30px; justify-content: space-evenly; padding-top: 20px; align-items: center; } .esim-thankyoupage-index .containerPrincipal .titleDirection, .esim-thankyoupage-index .containerPrincipal .titleDate { color: #019DF4; font-weight: 700; font-size: 16px; line-height: 24px; } .esim-thankyoupage-index .containerPrincipal .userDirection, .esim-thankyoupage-index .containerPrincipal .date { color: #424B5A; line-height: 24px; font-size: 14px; font-weight: 400; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary { margin-top: 40px; } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary { margin-top: 4px; } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .titleSummary { font-weight: normal; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ line-height: 32px; text-align: center; color: #424B5A; flex: 1; } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .titleSummary { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 26px; /* 9 */ font-size: 1.625rem; /* 9 */ } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary { width: 80%; margin: 0 auto !important; justify-content: center !important; } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary { width: 100%; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-typ-title img { width: 70%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 16px; /* 9 */ margin-top: 1rem; /* 9 */ } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .title_typ_esim { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ font-weight: bold; text-align: center; color: #019DF4; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .subtitle_typ_esim { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ text-align: center; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .container__fechas { width: 80%; display: flex; justify-content: space-around; align-items: center; margin: 20px auto; padding: 16px; background-color: rgba(1, 157, 244, 0.125); border-radius: 8px; } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .container__fechas { flex-direction: column; align-items: flex-start; gap: 20px; padding-left: 24px; } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .container__fechas__item { display: flex; align-items: center; justify-content: space-around; gap: 16px; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .container__fechas__item .icon { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ color: #019DF4; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .container__fechas__item .item { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .container__fechas__item .item .title { font-weight: bold; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary { width: 85%; display: flex; align-items: flex-start; justify-content: space-around; margin: 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 40px; /* 9 */ margin-bottom: 2.5rem; /* 9 */ } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary { flex-direction: column; width: 95%; } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__left { flex: 3; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__left .contract { background-color: #FFF; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 20px; /* 9 */ padding: 1.25rem; /* 9 */ border-radius: 8px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 20px; /* 9 */ margin-bottom: 1.25rem; /* 9 */ } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__left .contract { margin-left: auto; margin-right: auto; } } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__left .esim-details { background-color: #FFF; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 16px; /* 9 */ padding-left: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 16px; /* 9 */ padding-right: 1rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 16px; /* 9 */ padding-bottom: 1rem; /* 9 */ border-radius: 8px; } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__right { flex: 2; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__right .esim-info { background-color: #FFF; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ border-radius: 8px; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__right .esim-info__total { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 8px; /* 9 */ padding-left: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-right: 8px; /* 9 */ padding-right: 0.5rem; /* 9 */ } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .contentPurchaseSummary .esim-summary__right .esim-info__app { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 16px; /* 9 */ padding: 1rem; /* 9 */ } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .dataClient { margin-right: 10px; margin-left: 10px; background: #EEE; } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .dataClient { margin-left: 0px; margin-right: 0px; padding: 0px; } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .dataClient, .esim-thankyoupage-index .containerPrincipal .purchaseSummary .containerTotal { background: #EEE; } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .dataClient, .esim-thankyoupage-index .containerPrincipal .purchaseSummary .containerTotal { margin-top: 10px; max-width: auto; } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .numberClient, .esim-thankyoupage-index .containerPrincipal .purchaseSummary .serviceClient, .esim-thankyoupage-index .containerPrincipal .purchaseSummary .nameClient, .esim-thankyoupage-index .containerPrincipal .purchaseSummary .numberBased, .esim-thankyoupage-index .containerPrincipal .purchaseSummary .buyDate { padding: 10px; align-items: baseline; border-bottom: 1px solid #D3D4D3; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .monthFree { background: rgba(1, 157, 244, 0.15); border-radius: 6px; width: 115px; text-align: center; height: fit-content; margin: auto 15% auto 5%; } @media (max-width: 768px) { .esim-thankyoupage-index .containerPrincipal .purchaseSummary .monthFree { display: none; } } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .btnPortabilidad { display: flex; background: #FFFFFF; border-radius: 24.5px; border: 1px solid #019DF4; width: 165px; height: 49px; text-align: center; align-items: center; justify-content: center; margin-left: 5%; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .btnPortabilidad p { color: #019DF4; line-height: 14px; font-size: 12px; font-weight: 400; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .containerTotal { background: #FFFFFF; border-radius: 8px; width: 100%; padding: 15px; height: auto; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .titleCount { color: #424B5A; font-size: 16px; font-weight: 700; line-height: 24px; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .btnGOBack { background: #019DF4; border-radius: 60px; display: flex; justify-content: center; align-items: center !important; width: 351px; height: 56px; color: white; text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; margin-top: 30px; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .btnQR { background: #019DF4; border-radius: 60px; display: flex; justify-content: center; align-items: center; width: 251px; height: 48px; color: white; text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; margin: 0 auto; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .link { text-decoration: underline; color: #019DF4; font-weight: 700; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .bannerPublicidad { width: 80%; margin: 0px auto; padding-top: 15px; margin-top: 20px; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .btnPublicidad { display: flex; justify-content: center; align-items: center; width: 75%; height: 49px; background: #FFFFFF; font-size: 12px; font-weight: bold; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .imageAppMovistar { margin-top: 40px; } @media (max-width: 768px) { .esim-thankyoupage-index .mt-3 { margin-top: 30px; } .esim-thankyoupage-index .mr-1 { margin-right: 10px; } .esim-thankyoupage-index .row { display: flex; flex-direction: column; } .esim-thankyoupage-index .row.containerSim { display: flex; flex-direction: row !important; } .esim-thankyoupage-index .column-flex { width: 95%; display: flex; flex-direction: row !important; } .esim-thankyoupage-index .gridPurchase { margin-right: 0px; display: grid; grid-template-columns: repeat(3, 1fr); } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .monthFree { width: auto; height: auto; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .btnPortabilidad p { margin-top: 2%; } .esim-thankyoupage-index .titleRadicado { width: 30% !important; } .esim-thankyoupage-index .buyDate { margin-top: 50px; } .esim-thankyoupage-index .containerPrincipal .purchaseSummary .containerTotal, .esim-thankyoupage-index .containerPrincipal .purchaseSummary .btnGOBack { width: 100%; } .esim-thankyoupage-index .btnPortabilidad { position: relative; top: 45px; width: 100% !important; margin-left: -250px !important; display: block !important; } .esim-thankyoupage-index .bannerPublicidad { width: 100% !important; height: 176px; } .esim-thankyoupage-index .btnPublicidad { margin: 0px auto; margin-top: 20px; } .esim-thankyoupage-index .web-esim { display: none; } .esim-thankyoupage-index .mobile-esim { display: block; } .esim-thankyoupage-index .space-apps-movistar { margin-bottom: 30px; } } @media (min-width: 769px) { .esim-thankyoupage-index .mobile-esim { display: none; } .esim-thankyoupage-index .web-esim { display: block; } } .recuadro-pagoAutomatico-Esim .promo-container { padding: 20px; background: #fff; border-radius: 10px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); width: 80%; margin: auto; margin-top: 30px; } @media (max-width: 768px) { .recuadro-pagoAutomatico-Esim .promo-container { width: 90%; /* Para pantallas pequeñas */ } } .recuadro-pagoAutomatico-Esim .promo-content { display: flex; flex-direction: column; /* Para que el botón quede abajo siempre */ } .recuadro-pagoAutomatico-Esim .promo-left { display: flex; align-items: center; width: 100%; margin-bottom: 15px; } .recuadro-pagoAutomatico-Esim .promo-image img { width: 90px; height: 90px; margin-right: 75px; } .recuadro-pagoAutomatico-Esim .promo-image { flex: 1; } @media (max-width: 768px) { .recuadro-pagoAutomatico-Esim .promo-image { flex: auto; } } .recuadro-pagoAutomatico-Esim .promo-text { flex: 7; } @media (max-width: 768px) { .recuadro-pagoAutomatico-Esim .promo-text { flex: auto; } } .recuadro-pagoAutomatico-Esim .promo-button-div { flex: 2; } @media (max-width: 768px) { .recuadro-pagoAutomatico-Esim .promo-button-div { display: none; } } .recuadro-pagoAutomatico-Esim .promo-button-div-mobile { display: none; } @media (max-width: 768px) { .recuadro-pagoAutomatico-Esim .promo-button-div-mobile { display: block; width: 100%; margin-top: 15px; } } .recuadro-pagoAutomatico-Esim .promo-text p { margin: 0 16px 5px 12px; font-size: 14px; } .recuadro-pagoAutomatico-Esim .promo-text a { display: block; margin: 0 0px 0 12px; font-size: 14px; color: #019DF4; text-decoration: underline; } .recuadro-pagoAutomatico-Esim .promo-text p:first-child { font-weight: bold; font-size: 16px; } .recuadro-pagoAutomatico-Esim .promo-button { background-color: #019DF4; color: white; border: none; padding: 8px 8px; border-radius: 20px; font-size: 14px; cursor: pointer; text-align: center; white-space: nowrap; width: 100%; /* Para que siempre sea ancho completo */ } @media (max-width: 768px) { .recuadro-pagoAutomatico-Esim .promo-button { width: 100%; text-align: center; } .recuadro-pagoAutomatico-Esim .pago-esim-mobile { display: block; margin-top: 20px; } .recuadro-pagoAutomatico-Esim .promo-image img { width: 200px; height: 90px; } .recuadro-pagoAutomatico-Esim .promo-left { margin-bottom: 15px; align-items: flex-start; } } @media (max-width: 768px) { .recuadro-pagoAutomatico-Esim .promo-content { flex-direction: column; align-items: flex-start; } .recuadro-pagoAutomatico-Esim .promo-image img { margin-right: 0; margin-bottom: 20px; width: 200px; height: 90px; } .recuadro-pagoAutomatico-Esim .promo-button { align-self: flex-start; margin-top: 15px; width: 100%; /* Que ocupe toda la línea */ text-align: center; } } .box-validate_second { display: flex !important; gap: 0.5rem; flex-direction: column; align-items: center; } .nip-tooltip-esim { position: absolute; background: black; color: white; padding: 5px; border-radius: 10px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); font-size: 14px; width: 300px; height: 150px; text-align: center; z-index: 9999; top: 50%; } @media (max-width: 330px) { .nip-tooltip-esim { position: absolute; background: black; color: white; padding: 5px; border-radius: 10px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); font-size: 14px; width: 206px; height: 126px; text-align: center; z-index: 9999; top: 53%; } } .close-tooltip-esim { position: absolute; top: -29px; right: 8px; cursor: pointer; font-size: 60px !important; font-weight: 300; } @media (max-width: 400px) { .close-tooltip-esim { position: absolute; top: -26px; right: 14px; cursor: pointer; font-size: 60px !important; font-weight: 300; } } .tooltip-arrow-esim { position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid black; } .c-form__expanded_linea-esim { width: 40vw; } @media (max-width: 600px) { .c-form__expanded_linea-esim { width: 85vw; } } .c-form-esim-lineas { display: flex; justify-content: center; } .c-form_size_title-esim { font-size: 36px; font-weight: 400; } @media (max-width: 600px) { .c-form_size_title-esim { font-size: 2rem; text-align: center !important; margin-bottom: 5px; } } @media (max-width: 600px) { .expanded-btn_esim { padding: 1.2rem; } } .bar-horizontal-esim { margin-bottom: 0; transform: translateX(-50px); } .img-nipidVision { width: 80px; margin: auto; display: block; } .js-timer-btn__underline { color: #0B2739; text-decoration: underline; } .o-message__title_nipidVision { font-size: 2.2rem; font-weight: 300; display: flex; justify-content: center; } .center-nip-idvision { display: flex; justify-content: center; } .center-o-timer { display: flex; flex-direction: column; align-items: center; } @media (max-width: 400px) { .esim-validacion-index .o-modal__content { padding-left: 0 !important; padding-right: 0 !important; } .esim-validacion-index #modal-nip-vision { padding-right: 10px !important; padding-left: 10px !important; } } @media (max-width: 500px) { .esim-validacion-index body { height: 100vh !important; overflow: hidden !important; } .esim-validacion-index .page-wrapper { height: 100vh !important; overflow: hidden !important; } .esim-validacion-index .c-footer { height: 100% !important; } } #modal-qr { padding: 1rem; } #modal-qr .text-modal-content { line-height: 24px; font-size: 18px; } #modal-qr .icon-title-size { font-size: 50px; color: #019DF4; } #modal-qr .o-message__title_esim_qr { font-weight: 400; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 33px; /* 9 */ font-size: 2.0625rem; /* 9 */ } @media screen and (max-width: 940px) { #modal-qr .o-message__title_esim_qr { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } } @media screen and (max-width: 600px) { #modal-qr .esim-label-privacidad { display: block; width: 100%; text-align: center; } } #modal-qr .esim-modal-message { display: flex; align-items: center; justify-content: center; gap: 12px; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ border: 1px solid #F28D15; border-radius: 10px; background-color: #FEF4E8; } @media (max-width: 768px) { #modal-qr .esim-modal-message { align-items: flex-start; } } #modal-qr .esim-modal-message .icon-message { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 24px; /* 9 */ font-size: 1.5rem; /* 9 */ color: #815028; } #modal-qr .esim-modal-message .text-modal-content { text-align: left; } #modal-elegir-plan .text-blue-dark { color: #0B2739; } #modal-elegir-plan .text-title { color: #0B2739; line-height: 40px; } #modal-elegir-plan .icon-title-size { font-size: 50px; color: #019DF4; } #modal-elegir-plan .o-message__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ } #modal-elegir-plan .o-message__subtitle { width: 90%; margin-left: auto; margin-right: auto; } #modal-elegir-plan .font-26 { font-size: 26px; line-height: 30px; } #modal-elegir-plan .text-information { width: 80%; margin-left: auto; margin-right: auto; line-height: 24px; } @media screen and (max-width: 600px) { #modal-elegir-plan .icon-title-size { font-size: 32px; color: #019DF4; } #modal-elegir-plan .text-title { color: #0B2739; line-height: 30px; font-size: 27px !important; } #modal-elegir-plan .text-blue-dark { color: #0B2739; font-size: 15px !important; } } .convergente-index-index, .convergente-porta-index { --checked-color: #019DF4; --color: #999; --bg-color: #e8e8e8; /*---responsive ipad---*/ } .convergente-index-index .search-tabs, .convergente-porta-index .search-tabs { display: none; visibility: hidden; } .convergente-index-index .column.main, .convergente-porta-index .column.main { padding: 0; } .convergente-index-index .tab, .convergente-porta-index .tab { max-width: 70%; border-radius: 8px; margin-top: -26px; padding: 6px 1px; } .convergente-index-index .tab .tab-pospago, .convergente-porta-index .tab .tab-pospago { color: #0B2739; font-weight: bold; background-color: #f5f5f5; flex-grow: 1; flex-basis: 0; cursor: pointer; } .convergente-index-index .tab .tab-pospago.active, .convergente-porta-index .tab .tab-pospago.active { background-color: #0B2739; color: #f5f5f5; } @media screen and (min-width: 2000px) { .convergente-index-index .tab, .convergente-porta-index .tab { max-width: 38%; } } @media screen and (max-width: 768px) { .convergente-index-index .tab, .convergente-porta-index .tab { max-width: 99%; width: 96%; } } .convergente-index-index .o-section, .convergente-porta-index .o-section { margin-bottom: 40px; margin-top: 50px; } .convergente-index-index .o-section.u-margin-top-0, .convergente-porta-index .o-section.u-margin-top-0 { margin-top: 0; } .convergente-index-index div#fija-component, .convergente-index-index div#porta-component, .convergente-porta-index div#fija-component, .convergente-porta-index div#porta-component { width: 100% !important; justify-content: center; } @media screen and (max-width: 1023px) { .convergente-index-index #fija-component, .convergente-porta-index #fija-component { -webkit-box-orient: vertical; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; align-items: flex-start; } } .convergente-index-index .d-flex-row, .convergente-porta-index .d-flex-row { display: flex; flex-direction: row !important; } .convergente-index-index .bg-white, .convergente-porta-index .bg-white { background-color: #FFFFFF; } .convergente-index-index .sidebar.sidebar-main.terms, .convergente-porta-index .sidebar.sidebar-main.terms { padding: 8px 12px 0 12px; margin-top: 0; border-bottom: 1px solid #eeeeee; } .convergente-index-index dl.c-filter__list-term.js-target-dropdown, .convergente-porta-index dl.c-filter__list-term.js-target-dropdown { font-size: 14px; line-height: 18019DF4px; color: #86888C; } .convergente-index-index dd.c-filter__list-content-terms.o-dropdown__content, .convergente-porta-index dd.c-filter__list-content-terms.o-dropdown__content { padding-left: 0; padding-bottom: 0px; } .convergente-index-index dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .convergente-porta-index dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown { margin-bottom: 8px; } .convergente-index-index .is-dropdown-active dd.c-filter__list-content-terms.o-dropdown__content, .convergente-porta-index .is-dropdown-active dd.c-filter__list-content-terms.o-dropdown__content { margin-bottom: 15px; } .convergente-index-index .f-c-plan-arrow.swiper-button-next, .convergente-porta-index .f-c-plan-arrow.swiper-button-next { top: 105%; right: 0px; } .convergente-index-index button.f-c-plan-arrow.swiper-button-prev, .convergente-porta-index button.f-c-plan-arrow.swiper-button-prev { top: 105%; right: 50px; } .convergente-index-index .f-c-plan-slide, .convergente-porta-index .f-c-plan-slide { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ min-width: 256px; /* 9 */ min-width: 16rem; /* 9 */ } .convergente-index-index .f-c-plan-slide article.f-c-plan, .convergente-porta-index .f-c-plan-slide article.f-c-plan { min-width: 100%; } .convergente-index-index #content-component, .convergente-porta-index #content-component { max-width: 828px; } .convergente-index-index #checkout-summary, .convergente-porta-index #checkout-summary { margin-left: 20px; width: 290px; margin-top: 25px; } .convergente-index-index #checkout-summary .c-card-summary_c, .convergente-porta-index #checkout-summary .c-card-summary_c { background-color: white; padding: 1rem; border-radius: 8px; box-shadow: 0px 2px 4px -1px var(--color); } .convergente-index-index #checkout-summary .c-card-summary_c .c-card-summary__title, .convergente-porta-index #checkout-summary .c-card-summary_c .c-card-summary__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 20px; /* 9 */ font-size: 1.25rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 24px; /* 9 */ line-height: 1.5rem; /* 9 */ color: #0B2739; font-weight: 100; text-decoration: underline; text-align: center; } .convergente-index-index #checkout-summary .c-card-summary_c .txt-bold, .convergente-porta-index #checkout-summary .c-card-summary_c .txt-bold { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ font-weight: bold; } .convergente-index-index #checkout-summary .c-card-summary_c .txt-elige, .convergente-porta-index #checkout-summary .c-card-summary_c .txt-elige { color: #313235; font-size: 14px; text-align: center; line-height: 14px; } .convergente-index-index #checkout-summary .c-card-summary_c .txt-Dcto, .convergente-porta-index #checkout-summary .c-card-summary_c .txt-Dcto { background-color: #C5E4F5; border-radius: 8px; padding: 2px 8px; font-size: 12px; color: var(--checked-color); font-weight: bold; line-height: 14px; } .convergente-index-index #checkout-summary .c-card-summary_c .c-card-summary__decos, .convergente-porta-index #checkout-summary .c-card-summary_c .c-card-summary__decos { font-size: 12px; color: #86888C; font-weight: 300; margin-bottom: 0; } .convergente-index-index #checkout-summary .c-card-summary_c .c-card-summary__total, .convergente-porta-index #checkout-summary .c-card-summary_c .c-card-summary__total { margin-top: 10px; } .convergente-index-index #checkout-summary .c-card-summary_c .c-card-summary__total h4, .convergente-porta-index #checkout-summary .c-card-summary_c .c-card-summary__total h4 { color: var(--checked-color); text-transform: none; } .convergente-index-index #checkout-summary .c-card-summary_c .c-card-summary__total .amount, .convergente-porta-index #checkout-summary .c-card-summary_c .c-card-summary__total .amount { color: #313235; font-size: 28px; } .convergente-index-index #checkout-summary button#btnContinuarResumen, .convergente-porta-index #checkout-summary button#btnContinuarResumen { width: 80%; margin-left: 10%; font-size: 15px; padding: 8px; } .convergente-index-index .border-bottom, .convergente-porta-index .border-bottom { border-bottom: 1px solid #d3d4d3; padding-bottom: 8px; } .convergente-index-index .f-c-header-step__content, .convergente-porta-index .f-c-header-step__content { margin-top: 30px; } .convergente-index-index .title-elige, .convergente-porta-index .title-elige { text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 28px; /* 9 */ line-height: 1.75rem; /* 9 */ color: #606060; margin-top: 30px; font-weight: 300; } .convergente-index-index .o-list-steps__step, .convergente-porta-index .o-list-steps__step { max-width: none; } .convergente-index-index .o-list-steps__step::before, .convergente-porta-index .o-list-steps__step::before { border-radius: 50%; border: 1px solid; width: 32px !important; height: 32px !important; min-width: 32px; min-height: 32px; line-height: 16px; } .convergente-index-index .o-list-steps__step::after, .convergente-porta-index .o-list-steps__step::after { top: -25px; } .convergente-index-index span.o-list-steps__txt, .convergente-porta-index span.o-list-steps__txt { font-size: 12px; line-height: 14px; } .convergente-index-index .f-c-plan__header-caption, .convergente-porta-index .f-c-plan__header-caption { border-radius: 10px 10px 0 0; background-color: #0b2739; } .convergente-index-index .f-c-plan__header-caption .f-c-plan_subtitle, .convergente-porta-index .f-c-plan__header-caption .f-c-plan_subtitle { font-size: 12px; font-weight: bold; color: white; background-color: #f28d15; padding: 10px; border-top-left-radius: 7px; border-top-right-radius: 7px; } .convergente-index-index .f-c-plan__header-caption .f-c-plan_subtitle-mg, .convergente-porta-index .f-c-plan__header-caption .f-c-plan_subtitle-mg { font-size: 16px; color: #fff; padding-top: 10px; text-decoration: line-through; } .convergente-index-index .f-c-plan__header-caption img.tooltip_OfferFija, .convergente-porta-index .f-c-plan__header-caption img.tooltip_OfferFija { position: relative; top: -20px; left: 22%; cursor: pointer; } .convergente-index-index .f-c-plan__header-caption .f-c-plan_subtitle2, .convergente-porta-index .f-c-plan__header-caption .f-c-plan_subtitle2 { font-size: 12px; color: #fff; margin-top: -10px; } .convergente-index-index .f-c-plan__header-caption .f-c-plan_megas, .convergente-porta-index .f-c-plan__header-caption .f-c-plan_megas { font-size: 32px; color: #fff; line-height: 40px; padding: 5px; } .convergente-index-index .tooltipOfferFija, .convergente-porta-index .tooltipOfferFija { top: -5px; right: 12px; box-shadow: none; } .convergente-index-index .notSelectdOffer, .convergente-porta-index .notSelectdOffer { font-size: 14px; line-height: 14px; font-weight: 100; color: #E01F6E; display: none; margin-top: 4px; text-align: left; margin-left: 10px; font-weight: 300; } .convergente-index-index article.is-error .f-c-plan__content, .convergente-porta-index article.is-error .f-c-plan__content { border: 2px solid #E01F6E; } .convergente-index-index article.is-error .notSelectdOffer, .convergente-porta-index article.is-error .notSelectdOffer { display: block; } .convergente-index-index .c-filter, .convergente-porta-index .c-filter { margin: 0 auto; } @media screen and (max-width: 768px) { .convergente-index-index .sidebar.sidebar-main.terms dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown, .convergente-porta-index .sidebar.sidebar-main.terms dt.c-filter__options-title.o-dropdown__btn.i-after-chevron-down.js-btn-dropdown { padding-left: 0; } .convergente-index-index .f-c-header-step__content, .convergente-porta-index .f-c-header-step__content { margin-top: 50px; } .convergente-index-index .f-c-header-step__content .o-list-steps, .convergente-porta-index .f-c-header-step__content .o-list-steps { column-gap: 4rem; } .convergente-index-index .f-c-header-step__content .o-list-steps .o-list-steps__step::after, .convergente-porta-index .f-c-header-step__content .o-list-steps .o-list-steps__step::after { left: 9rem; } .convergente-index-index .f-c-header-step__content .o-list-steps .o-list-steps__txt, .convergente-porta-index .f-c-header-step__content .o-list-steps .o-list-steps__txt { display: block; } .convergente-index-index .title-elige, .convergente-porta-index .title-elige { padding: 0 12%; } .convergente-index-index .f-c-wrap.js-MovistarTotal-wrap.swiper-wrapper, .convergente-porta-index .f-c-wrap.js-MovistarTotal-wrap.swiper-wrapper { flex-direction: column; } .convergente-index-index #content-component, .convergente-porta-index #content-component { width: 76%; } .convergente-index-index #content-component header.f-c-plan__header, .convergente-porta-index #content-component header.f-c-plan__header { flex-direction: column; } .convergente-index-index #content-component header.f-c-plan__header .f-c-plan__header-caption, .convergente-porta-index #content-component header.f-c-plan__header .f-c-plan__header-caption { width: 100%; } .convergente-index-index #content-component header.f-c-plan__header .f-c-plan__header-price, .convergente-porta-index #content-component header.f-c-plan__header .f-c-plan__header-price { width: 100%; } .convergente-index-index #content-component .swiper-slide.f-c-plan-slide, .convergente-porta-index #content-component .swiper-slide.f-c-plan-slide { margin-top: 0; margin-bottom: 45px; } .convergente-index-index #content-component .f-c-plan__header::before, .convergente-porta-index #content-component .f-c-plan__header::before { display: none; } .convergente-index-index #content-component .is-selected .f-c-plan__flag, .convergente-porta-index #content-component .is-selected .f-c-plan__flag { padding: 6px; } } @media screen and (max-width: 882px) { .convergente-index-index #checkout-summaryMobile, .convergente-porta-index #checkout-summaryMobile { display: block !important; visibility: visible; background-color: #fff; position: fixed; z-index: 1000; bottom: 0px; width: 100% !important; margin: 0 !important; padding: 10px 25px; border-radius: 8px 8px 0 0; max-width: 100%; } .convergente-index-index #checkout-summaryMobile *, .convergente-porta-index #checkout-summaryMobile * { max-width: 100%; } .convergente-index-index #checkout-summaryMobile h3.c-card-summary__title, .convergente-porta-index #checkout-summaryMobile h3.c-card-summary__title { text-decoration: underline; font-size: 18px; font-weight: 100; margin-bottom: 5px; } .convergente-index-index #checkout-summaryMobile .c-card-summary__title::before, .convergente-porta-index #checkout-summaryMobile .c-card-summary__title::before { position: absolute; right: 22px; top: 18px; color: var(--checked-color); } .convergente-index-index #checkout-summaryMobile .flex-column, .convergente-porta-index #checkout-summaryMobile .flex-column { display: flex; flex-direction: row; justify-content: center; align-items: center; } .convergente-index-index #checkout-summaryMobile .flex-column div, .convergente-porta-index #checkout-summaryMobile .flex-column div { width: 50%; } .convergente-index-index #checkout-summaryMobile .c-card-summary__amount.c-card-summary__total, .convergente-porta-index #checkout-summaryMobile .c-card-summary__amount.c-card-summary__total { flex-direction: column; align-items: baseline; margin-top: 0; } .convergente-index-index #checkout-summaryMobile .c-card-summary__amount.c-card-summary__total .titleAmount, .convergente-porta-index #checkout-summaryMobile .c-card-summary__amount.c-card-summary__total .titleAmount { color: #86888C; font-size: 12px; } .convergente-index-index #checkout-summaryMobile .c-card-summary__amount.c-card-summary__total p.amount, .convergente-porta-index #checkout-summaryMobile .c-card-summary__amount.c-card-summary__total p.amount { font-size: 24px; } .convergente-index-index #checkout-summaryMobile .txt-elige.txt-bold, .convergente-porta-index #checkout-summaryMobile .txt-elige.txt-bold { font-weight: bold; } .convergente-index-index #checkout-summaryMobile .txt-Dcto, .convergente-porta-index #checkout-summaryMobile .txt-Dcto { background-color: #C5E4F5; border-radius: 8px; padding: 2px 8px; font-size: 12px; color: var(--checked-color); font-weight: bold; line-height: 14px; } .convergente-index-index #checkout-summaryMobile .c-card-summary_c.c-card-summary_space-bottom.js-target-summary, .convergente-porta-index #checkout-summaryMobile .c-card-summary_c.c-card-summary_space-bottom.js-target-summary { margin-bottom: 0px; } .convergente-index-index #checkout-summary, .convergente-porta-index #checkout-summary { display: none !important; } } @media screen and (min-width: 883px) { .convergente-index-index #checkout-summaryMobile, .convergente-porta-index #checkout-summaryMobile { display: none !important; } .convergente-index-index #checkout-summary, .convergente-porta-index #checkout-summary { display: block !important; visibility: visible; } } @media screen and (max-width: 768px) { .convergente-index-index .mobile-none, .convergente-porta-index .mobile-none { display: none !important; } .convergente-index-index .web-none, .convergente-porta-index .web-none { display: block !important; } .convergente-index-index #checkout-summaryMobile, .convergente-porta-index #checkout-summaryMobile { display: block !important; } .convergente-index-index .web-none.appMiMovistar, .convergente-porta-index .web-none.appMiMovistar { display: block !important; } } @media screen and (min-width: 769px) { .convergente-index-index .web-none, .convergente-porta-index .web-none { display: none !important; } .convergente-index-index .mobile-none, .convergente-porta-index .mobile-none { display: block !important; } } .convergente-index-index .benefits-porta li:first-of-type, .convergente-porta-index .benefits-porta li:first-of-type { margin: 0; border: 0; width: 100%; } .convergente-porta-index .c-card-summary_c.c-card-summary_space-bottom.js-target-summary { margin-bottom: 50px; } .convergente-porta-index .f-c-plan-slide article.f-c-plan.is-selected { margin-top: 0px; } .convergente-index-index .f-c-plan__toggle-content.js-plan-target, .convergente-porta-index .f-c-plan__toggle-content.js-plan-target { margin-top: 0; } .convergente-index-index .f-c-plan__benefit, .convergente-porta-index .f-c-plan__benefit { border: none; padding: 0; } .convergente-index-index .f-c-plan__benefit .pagebuilder-column-group, .convergente-porta-index .f-c-plan__benefit .pagebuilder-column-group { width: 100%; } .convergente-index-index img.img_mini_offer, .convergente-porta-index img.img_mini_offer { padding: 0; margin-top: 15px; } .convergente-index-index .f-c-plan__content, .convergente-porta-index .f-c-plan__content { padding: 0; border-radius: 12px; background-color: #f5f5f5; } .convergente-index-index span.f-c-plan__tag.o-tag.o-tag_success, .convergente-porta-index span.f-c-plan__tag.o-tag.o-tag_success { width: 100%; border-radius: 0px; background-color: #f28d15; color: #fff; } .convergente-index-index .swiper-slide.f-c-plan-slide, .convergente-porta-index .swiper-slide.f-c-plan-slide { margin-top: 70px; padding-bottom: 15px; } .convergente-index-index .is-selected .f-c-plan__flag, .convergente-porta-index .is-selected .f-c-plan__flag { max-width: 100%; margin: 0 auto; border-radius: 12px 12px 0 0; font-size: 14px; line-height: 18px; background-color: var(--checked-color); color: #fff; width: 100%; display: block; padding: 2px; } .convergente-index-index .is-selected .f-c-plan__content, .convergente-porta-index .is-selected .f-c-plan__content { border-radius: 0 0 12px 12px; } .convergente-index-index .is-selected .f-c-plan__content .f-c-plan__header-caption, .convergente-porta-index .is-selected .f-c-plan__content .f-c-plan__header-caption { border-radius: 0px; } .convergente-index-index .is-selected .f-c-plan__content .f-c-plan__header-caption span.f-c-plan__tag.o-tag.o-tag_success, .convergente-porta-index .is-selected .f-c-plan__content .f-c-plan__header-caption span.f-c-plan__tag.o-tag.o-tag_success { background-color: #e1efff; color: #0b2739; } .convergente-index-index article.is-selected, .convergente-porta-index article.is-selected { border: 2px solid var(--checked-color); border-radius: 15px; margin-top: -24px; } .convergente-index-index article.is-selected .f-c-plan_subtitle, .convergente-porta-index article.is-selected .f-c-plan_subtitle { font-size: 12px; font-weight: bold; color: white; padding-top: 15px; background-color: #f28d15; padding: 10px; border-radius: 0px; } .convergente-index-index .f-c-plan__notify, .convergente-porta-index .f-c-plan__notify { margin: 12px auto; max-width: 88%; background: none; padding: 0; } .convergente-index-index .f-c-plan__value, .convergente-porta-index .f-c-plan__value { color: #FFFFFF; } .convergente-index-index .f-c-plan__value.megas, .convergente-porta-index .f-c-plan__value.megas { font-size: 28px; } .convergente-index-index .f-c-plan__value.subtitle, .convergente-porta-index .f-c-plan__value.subtitle { font-size: 10px; } .convergente-index-index .f-c-plan__content, .convergente-porta-index .f-c-plan__content { background-color: #FFFFFF; padding-bottom: 15px; } .convergente-index-index img.tooltip_OfferFija, .convergente-porta-index img.tooltip_OfferFija { position: relative; top: -42px; left: 38%; cursor: pointer; } .convergente-index-index .tooltipOfferFija, .convergente-porta-index .tooltipOfferFija { position: absolute; top: 15px; max-width: 130px; right: -15px; box-shadow: 0 0 2px 1px var(--color); border-radius: 8px; } .convergente-index-index .f-c-plan__header-price, .convergente-porta-index .f-c-plan__header-price { margin-top: -10px; } .convergente-index-index .f-c-plan__header-price .f-c-plan__tag img, .convergente-porta-index .f-c-plan__header-price .f-c-plan__tag img { margin: 4px; } .convergente-index-index fieldset, .convergente-porta-index fieldset { border: none; margin: auto; padding: 0; } .convergente-index-index fieldset div.c-selected, .convergente-porta-index fieldset div.c-selected { border: 1px solid #d9d9d9; border-radius: 8px; padding: 8px; display: flex; min-height: 50px; align-items: center; } .convergente-index-index fieldset:first-of-type, .convergente-porta-index fieldset:first-of-type { margin-top: 8px; } .convergente-index-index .f-c-plan-radios, .convergente-porta-index .f-c-plan-radios { width: 90%; margin: auto; } .convergente-index-index .f-c-plan-radios fieldset div.c-selected, .convergente-porta-index .f-c-plan-radios fieldset div.c-selected { margin-bottom: 8px; } .convergente-index-index .f-c-plan-radios fieldset div.c-selected label, .convergente-porta-index .f-c-plan-radios fieldset div.c-selected label { color: #313235; text-align: left; width: 90%; } .convergente-index-index .f-c-plan-radios fieldset div.c-selected label.eligeApps, .convergente-porta-index .f-c-plan-radios fieldset div.c-selected label.eligeApps { width: 100%; } .convergente-index-index .f-c-plan-radios fieldset div.c-selected label .pagebuilder-column-group, .convergente-porta-index .f-c-plan-radios fieldset div.c-selected label .pagebuilder-column-group { max-width: 90%; } .convergente-index-index .f-c-plan-radios .complement, .convergente-porta-index .f-c-plan-radios .complement { opacity: 1; appearance: none; -webkit-appearance: none; border: 0.25rem solid #fff; background-color: var(--bg-color); border-radius: 50%; box-shadow: 0 0 0 1px var(--color); width: 20px; height: 20px; cursor: pointer; } .convergente-index-index .f-c-plan-radios .complement:checked, .convergente-porta-index .f-c-plan-radios .complement:checked { box-shadow: 0 0 0 1px var(--checked-color); background-color: var(--checked-color); border-width: 0.25rem; } .convergente-index-index .f-c-plan__benefits li, .convergente-porta-index .f-c-plan__benefits li { width: 90%; margin: 5px auto; border-bottom: 1px solid #eee; padding: 0 8px 8px; min-height: fit-content; } .convergente-index-index .f-c-plan__benefits li .pagebuilder-column, .convergente-porta-index .f-c-plan__benefits li .pagebuilder-column { justify-content: center !important; } .convergente-index-index .f-c-plan__benefits li img, .convergente-porta-index .f-c-plan__benefits li img { vertical-align: middle; } .convergente-index-index .f-c-plan__toggle-content.js-plan-target.is-list-hide, .convergente-porta-index .f-c-plan__toggle-content.js-plan-target.is-list-hide { display: none; } .convergente-index-index .f-c-plan__toggle-btn::after, .convergente-porta-index .f-c-plan__toggle-btn::after { text-decoration: underline; } .convergente-index-index .f-c-plan-decos, .convergente-porta-index .f-c-plan-decos { width: 90%; margin: auto; } .convergente-index-index .decoIncluido, .convergente-porta-index .decoIncluido { background-color: #F5F5F5; border-radius: 8px; margin: auto; margin-top: 10px; display: flex; padding: 2px 8px; justify-content: center; color: #5B5B5B; font-size: 14px; } .convergente-index-index .decoIncluido .u-text-center.u-margin-right-8, .convergente-porta-index .decoIncluido .u-text-center.u-margin-right-8 { margin-bottom: 4px; } .convergente-index-index input#cantidad, .convergente-porta-index input#cantidad { border: none; width: 16px; color: #5B5B5B; font-size: 16px; font-weight: 100; } .convergente-index-index .txtDeco, .convergente-porta-index .txtDeco { font-size: 16px; line-height: 14px; color: #313235; font-weight: bold; text-align: left; width: 68%; margin-right: 2%; } .convergente-index-index .txtDeco span, .convergente-porta-index .txtDeco span { font-size: 12px; line-height: 14px; color: #86888C; font-weight: 100; } .convergente-index-index button.btn.decoMenos, .convergente-index-index button.btn.decoMas, .convergente-porta-index button.btn.decoMenos, .convergente-porta-index button.btn.decoMas { color: var(--checked-color); border: 1px solid var(--checked-color); border-radius: 50%; width: 20px; height: 20px; line-height: 0px; padding: 0; } .convergente-index-index .c-btnsDeco, .convergente-porta-index .c-btnsDeco { width: 30%; justify-content: space-around; display: flex; align-items: baseline; } .convergente-index-index .u-margin-top-4, .convergente-porta-index .u-margin-top-4 { margin-top: 4px; } .convergente-index-index .normalPrice, .convergente-porta-index .normalPrice { text-decoration: line-through; } @media screen and (max-width: 768px) { .convergente-index-index article.f-c-plan, .convergente-porta-index article.f-c-plan { max-width: 100%; } .convergente-index-index article.f-c-plan .f-c-plan__header-caption, .convergente-porta-index article.f-c-plan .f-c-plan__header-caption { border-radius: 10px 10px 0 0px; } .convergente-index-index article.f-c-plan .f-c-plan__price-wrap, .convergente-index-index article.f-c-plan .f-c-plan__price, .convergente-porta-index article.f-c-plan .f-c-plan__price-wrap, .convergente-porta-index article.f-c-plan .f-c-plan__price { padding: 20px 10px; margin-bottom: 0; } .convergente-index-index article.f-c-plan.is-selected, .convergente-porta-index article.f-c-plan.is-selected { margin-top: 0; } .convergente-index-index article.f-c-plan .tooltipOfferFija, .convergente-porta-index article.f-c-plan .tooltipOfferFija { right: 10px; } .convergente-index-index article.f-c-plan .f-c-plan__benefit, .convergente-porta-index article.f-c-plan .f-c-plan__benefit { max-width: 90%; margin: auto; } .convergente-index-index div#checkout-summaryMobile, .convergente-porta-index div#checkout-summaryMobile { background-color: #fff; position: fixed; z-index: 1000; bottom: 0px; width: 100% !important; margin: 0 !important; padding: 10px 25px; border-radius: 8px 8px 0 0; max-width: 100%; } .convergente-index-index div#checkout-summaryMobile *, .convergente-porta-index div#checkout-summaryMobile * { max-width: 100%; } .convergente-index-index div#checkout-summaryMobile h3.c-card-summary__title, .convergente-porta-index div#checkout-summaryMobile h3.c-card-summary__title { text-decoration: underline; font-size: 18px; font-weight: 100; margin-bottom: 5px; } .convergente-index-index div#checkout-summaryMobile .c-card-summary__title::before, .convergente-porta-index div#checkout-summaryMobile .c-card-summary__title::before { position: absolute; right: 22px; top: 18px; color: var(--checked-color); } .convergente-index-index div#checkout-summaryMobile .flex-column, .convergente-porta-index div#checkout-summaryMobile .flex-column { display: flex; flex-direction: row; justify-content: center; align-items: center; } .convergente-index-index div#checkout-summaryMobile .flex-column div, .convergente-porta-index div#checkout-summaryMobile .flex-column div { width: 50%; } .convergente-index-index div#checkout-summaryMobile .c-card-summary__amount.c-card-summary__total, .convergente-porta-index div#checkout-summaryMobile .c-card-summary__amount.c-card-summary__total { flex-direction: column; align-items: baseline; margin-top: 0; } .convergente-index-index div#checkout-summaryMobile .c-card-summary__amount.c-card-summary__total .titleAmount, .convergente-porta-index div#checkout-summaryMobile .c-card-summary__amount.c-card-summary__total .titleAmount { color: #86888C; font-size: 12px; } .convergente-index-index div#checkout-summaryMobile .c-card-summary__amount.c-card-summary__total p.amount, .convergente-porta-index div#checkout-summaryMobile .c-card-summary__amount.c-card-summary__total p.amount { font-size: 24px; } .convergente-index-index div#checkout-summaryMobile .txt-elige.txt-bold, .convergente-porta-index div#checkout-summaryMobile .txt-elige.txt-bold { font-weight: bold; } .convergente-index-index div#checkout-summaryMobile .txt-Dcto, .convergente-porta-index div#checkout-summaryMobile .txt-Dcto { background-color: #C5E4F5; border-radius: 8px; padding: 2px 8px; font-size: 12px; color: var(--checked-color); font-weight: bold; line-height: 14px; } .convergente-index-index div#checkout-summaryMobile .c-card-summary_c.c-card-summary_space-bottom.js-target-summary, .convergente-porta-index div#checkout-summaryMobile .c-card-summary_c.c-card-summary_space-bottom.js-target-summary { margin-bottom: 0px; } .convergente-index-index .pagebuilder-column, .convergente-porta-index .pagebuilder-column { flex-basis: auto; } } .convergente-index-index .f-c-tabs, .convergente-porta-index .f-c-tabs { overflow: initial; } .convergente-index-index .f-c-tabs__subtabs, .convergente-porta-index .f-c-tabs__subtabs { display: none; } .convergente-index-index .f-c-tabs__tab, .convergente-porta-index .f-c-tabs__tab { padding: 10px 8px; } .convergente-index-index .f-c-plan__price-wrap, .convergente-porta-index .f-c-plan__price-wrap { padding: 0 10px; } .convergente-index-index header.f-c-plan__header, .convergente-porta-index header.f-c-plan__header { margin-bottom: 10px; } .convergente-index-index .f-c-tabs__control, .convergente-porta-index .f-c-tabs__control { margin-bottom: 0; top: -27px; } .convergente-index-index .f-c-tabs__description.js-subtab-content, .convergente-porta-index .f-c-tabs__description.js-subtab-content { display: none; } .convergente-index-index .column.main, .convergente-porta-index .column.main { padding: 0; } .convergente-index-index .f-c-plan-slide .f-c-plan__header .f-c-plan_subtitle, .convergente-porta-index .f-c-plan-slide .f-c-plan__header .f-c-plan_subtitle { position: absolute; top: -40px; width: 100%; font-size: 14px; background: #ededed; display: flex; align-items: center; justify-content: center; border-radius: 6px; color: #019df4; padding: 10px 0; } .convergente-index-index h3.f-c-plan__title.f-c-plan-mb-0.center, .convergente-porta-index h3.f-c-plan__title.f-c-plan-mb-0.center { min-height: 96px; display: flex; align-items: center; justify-content: center; flex-direction: column; } .convergente-index-index span.f-c-plan__tag.o-tag.o-tag_success, .convergente-porta-index span.f-c-plan__tag.o-tag.o-tag_success { min-height: 26px; } .convergente-cobertura-index { --checked-color: #019DF4; --color: #999; --bg-color: #e8e8e8; } .convergente-cobertura-index .card-covergente-beetween { display: flex; justify-content: space-between; align-items: end; } .convergente-cobertura-index .c-header-wrap { z-index: 9 !important; } .convergente-cobertura-index .f-c-header-step__brand { margin: initial; } .convergente-cobertura-index .title-lc { width: 100%; } .convergente-cobertura-index .shapeButton { opacity: 1; appearance: none; -webkit-appearance: none; border: 0.2rem solid #fff; background-color: var(--bg-color); border-radius: 50%; box-shadow: 0 0 0 1px var(--color); width: 20px; height: 18px; } .convergente-cobertura-index .shapeButton:checked { box-shadow: 0 0 0 1px var(--checked-color); background-color: var(--checked-color); border-width: 0.2rem; } .convergente-cobertura-index .w-400 .modal-inner-wrap { max-width: 400px; } .convergente-cobertura-index .w-400 .modal-inner-wrap #modal-address-divipola { padding: 5px 20px; } .convergente-cobertura-index .w-400 .modal-inner-wrap #img-cobertura { max-width: 30%; } .convergente-cobertura-index .w-400 .modal-inner-wrap h2 { font-size: 20px; padding: 0 15px; } .convergente-cobertura-index .w-400 .modal-inner-wrap .c-steps__value { font-size: 14px; width: 28px; height: 28px; } .convergente-cobertura-index .w-400 .modal-inner-wrap .dirRadio { column-gap: 0.3rem; padding: 8px 2px; } .convergente-cobertura-index .w-400 .modal-inner-wrap .dirRadio label { text-align: left; font-size: 16px; line-height: 20px; } .convergente-cobertura-index .w-400 .modal-inner-wrap .c-form__icon_select::before { padding: 0; font-size: 10px; } .convergente-cobertura-index .w-400 .modal-inner-wrap #btn-verifyOrch { margin: 20px 0 0; max-width: max-content; } .convergente-cobertura-index figure#img-cobertura { margin: 0 auto 16px; } .convergente-cobertura-index #modal-success { display: block; padding: 0 20px 10px; } .convergente-cobertura-index #modal-success p.o-message__txt.u-text-regular { padding: 0; font-size: 12px; } .convergente-cobertura-index #modal-success a#show-offers-btn { padding: 10px 40px; margin-bottom: 30px; } .convergente-cobertura-index #modal-error { padding: 0 20px 10px; } .convergente-cobertura-index #modal-error .c-botones { display: flex; column-gap: 1rem; } .convergente-cobertura-index #modal-error a.o-btn { width: 200px; } .convergente-cobertura-index #modal-error .error_msg p { font-size: 14px; line-height: 16px; } @media screen and (max-width: 600px) { .convergente-cobertura-index #title-mobile { display: flex; order: 2; margin-bottom: 0; } .convergente-cobertura-index #title-mobile h2 { font-size: 22px; margin-bottom: 0; } .convergente-cobertura-index .c-landing { flex-direction: column; } .convergente-cobertura-index .c-landing form { order: 3; } } .convergente-cobertura-index span.c-form__error-text, .convergente-cobertura-index .error_input { padding-left: 0 !important; text-align: left !important; line-height: 14px !important; font-size: 12px !important; } .convergente-cobertura-index select, .convergente-cobertura-index input { max-width: 90%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .convergente-cobertura-index .f-c-header-step__wrap, .convergente-cobertura-index .o-layout-2-columns { max-width: 960px !important; } .convergente-cobertura-index span.o-list-steps__txt { font-size: 12px; line-height: 14px; } .convergente-cobertura-index fieldset.c-form__fieldset.c-form__field-container { margin-bottom: 1rem; padding: 0; } .convergente-cobertura-index label.c-form__checkbox-label.u-text-left { line-height: 20px; } .convergente-cobertura-index .o-section { margin-top: 0px; margin-bottom: 40px; } .convergente-cobertura-index .c-form__header { margin-top: 20px; margin-bottom: 20px; } .convergente-cobertura-index .c-form__input { font-size: 16px; height: 42px; top: -15px; padding-top: 15px; z-index: 99; width: 100%; max-width: 100%; left: -10px; padding-left: 10px; } .convergente-cobertura-index .c-form__field { padding: 15px 10px 10px 10px; height: 42px; } .convergente-cobertura-index label.c-form__label { padding-left: 10px; font-size: 16px; line-height: 22px; } .convergente-cobertura-index .c-form__input.c-form__input_label-top + .c-form__label, .convergente-cobertura-index .c-form__input:valid + .c-form__label, .convergente-cobertura-index .c-form__input:focus + .c-form__label { top: -1.4rem; } .convergente-cobertura-index .c-form__field-canvas { margin-bottom: 0.6rem; } .convergente-cobertura-index .c-callout.c-callout_sm.c-callout_white.i-information.u-margin-top-0 { padding: 14px !important; font-size: 14px !important; line-height: 18px; } .convergente-cobertura-index form { max-width: 620px; } .convergente-cobertura-index .c-form__checkbox { font-size: 14px; line-height: 18px; } .convergente-cobertura-index .c-form__actions { margin-top: 1rem; } .convergente-cobertura-index span.c-form__icon { width: 10%; } .convergente-cobertura-index .o-identification-card { grid-auto-rows: minmax(200px, auto); } .convergente-cobertura-index form#questions-form { width: 960px !important; max-width: 960px !important; } .convergente-cobertura-index ol#questionList { padding: 30px 50px; } .convergente-cobertura-index ol#questionList li.c-form__item-list { font-size: 16px; padding: 16px 0; } .convergente-cobertura-index ol#questionList li.c-form__item-list .c-form__ordered-list_num-sm .c-form__item-list::before { font-size: 16px; } .convergente-cobertura-index ol#questionList li.c-form__item-list .c-form__inputs-list.c-form__inputs-list_column { font-size: 14px; row-gap: 0.6rem; margin: 20px; } .convergente-cobertura-index .f-c-calendar { padding: 12px; } .convergente-cobertura-index li.f-c-calendar__header_day { font-size: 14px; padding: 0 14px; } .convergente-cobertura-index li.f-c-calendar__grid_day { font-size: 18px; padding: 10px; } .convergente-cobertura-index li.f-c-calendar__header_day { padding: 0 10px !important; } .convergente-cobertura-index #modal-c2c { padding: 0 2rem; } .convergente-cobertura-index #modal-c2c #msjResponseC2C { width: 70% !important; } .convergente-cobertura-index .modal-small .modal-inner-wrap .c-form__icon { right: 15px; } @media (max-width: 768px) { .convergente-cobertura-index .c-form__field-address .c-form__field:nth-of-type(1) { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 130px; /* 9 */ width: 8.125rem; /* 9 */ } } .convergente-cobertura-index .u-hiddenSeccion { display: none; opacity: 0; } .c-definition-list__box.fs-14 { padding: 10px 0px; } .c-form__field-address { margin-top: 0px; } .c-form__field-address .c-form__field:nth-of-type(3), .c-form__field-address .c-form__field.placa_field { width: 35%; } .mb-20 { margin-bottom: 20px; } .m0-5 { margin: 0 5px; top: -8px; position: relative; } .m-10-0 { margin: 10px 0; } .pb-5 { padding: 0 0 5px 0; } .info-enCuenta { font-size: 12px; line-height: 14px; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } .blue { color: #019DF4; } .w-960 { width: 960px; } .fs-14 { font-size: 14px; line-height: 18px; font-weight: 300; } .fs-18 { font-size: 18px; line-height: 22px; font-weight: 300; } .title28 { font-size: 28px; line-height: 32px; font-weight: 300; } a.o-link.open-modal { font-size: 14px; } #modal-terms { padding: 10px; } #modal-terms p { font-size: 14px; line-height: 18px; } #modal-terms .o-modal__text-box { margin-top: -30px; } @media screen and (max-width: 600px) { .mobile-none { display: none !important; } } @media screen and (min-width: 601px) { .web-none { display: none !important; } } /* --------------------- */ @media (min-width: 1024px) and (max-width: 1200px) { .o-identification-card__date { bottom: 51%; left: -27px; } } @media (min-width: 1201px) { .o-identification-card__date { bottom: 47%; left: -35px; } } @media (min-width: 768px) and (max-width: 1023px) { .o-identification-card__date { left: -32px; bottom: 46%; } } .receipt-name.u-text-light { font-weight: bold; color: #6C6D6D; } .sheet { width: 55px; position: absolute; left: 220px; top: 45px; } .text-rdp { font-size: 12px; position: relative; top: -6px; width: 150px; color: #0B2739; background: #BDE4A4; border: 2px solid #5CB615; border-radius: 4px; margin-left: 1px; height: 30px; } .client-name { font-size: 12px; color: #0B2739; position: relative; top: -5px; left: 3px; font-weight: bold; } .Num_contract { border-color: #E2E2E2; border-radius: 5px; font-size: 14px; color: #5D5C5C; background: none; padding: 2px; border: 1.5px solid #BCBCBB; margin-left: 18px; } .receipt-address.c-form__address { position: relative; width: 100%; height: 100px; padding: 1em 1.5em; margin: 2em auto; bottom: 30px; border: 0px solid #f5f5f5ff; border-radius: 10px; box-shadow: -2px 2px 2px #D0D3D4; background: #ffffff; border-color: transparent; } .receipt-address.c-form__address:before { content: ""; position: absolute; top: 0; right: 0; border-width: 0 60px 60px 0; border-style: solid; border-color: #D3D4D3 #f5f5f5ff; border-radius: 5px; box-shadow: -1px 1px 1px #A6ACAF; z-index: 2; } .header-rdp.c-form__address-header { /* Estilos para la cabecera */ text-align: center; font-weight: bold; background: #ffffff; height: 10px; border: 1px solid #ffffff; margin-left: -19px; } .content-rdp.c-form__address-content { /* Estilos para el contenido principal */ margin-top: 12px; height: 46px; padding: 1px; border: 1.5px solid #BCBCBB; border-color: #E2E2E2; width: 200px; border-radius: 4px; margin-left: -15px; } @media screen and (max-width: 600px) { .Num_contract { margin-left: 43px; } .sheet { left: 245px; } .receipt-address.c-form__address { position: relative; top: -300px; padding-top: 10px; } /*#Direccion{ margin-top:145px; } #politi-cobert{ margin-top:-190px; }*/ } /*Fin stylos recibo*/ .c-form__help-text.c-form__help-text_phone { margin-left: 0; font-size: 11px; line-height: 13px; } .select2-container--default .select2-search--dropdown .select2-search__field { border-color: #019DF4 !important; } #select2-departament-container { margin-top: -10px; } .select2.select2-container.select2-container--default { width: 100% !important; } .select2.select2-container.select2-container--default .select2-selection__arrow { margin-top: -10px; } .details-alert { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 8px; /* 9 */ margin-left: 0.5rem; /* 9 */ font-size: 13px; text-align: left; } .details-alert li { text-align: left; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-left: 16px; /* 9 */ margin-left: 1rem; /* 9 */ } .details-alert ul li { list-style-type: disc; } .convergente-cobertura-index .card-covergente-beetween, .convergente-datos-index .card-covergente-beetween { display: flex; justify-content: space-between; align-items: end; } .convergente-cobertura-index .o-list-steps__step::before, .convergente-datos-index .o-list-steps__step::before { width: 32px !important; height: 32px !important; min-width: 32px; min-height: 32px; line-height: 16px; border: 1px solid; } .convergente-cobertura-index .c-card-checkout-cta__btn, .convergente-datos-index .c-card-checkout-cta__btn { background-color: #0B2739; color: #fff; font-weight: 300; } .convergente-cobertura-index .c-card-checkout-cta__btn::before, .convergente-datos-index .c-card-checkout-cta__btn::before { color: #fff; } .convergente-cobertura-index .c-card-summary .c-card-summary__box, .convergente-datos-index .c-card-summary .c-card-summary__box { border-bottom: 1px solid #d3d4d3; padding-bottom: 24px; } .convergente-cobertura-index div#checkout-summary, .convergente-datos-index div#checkout-summary { max-width: 300px; background-color: white; } .convergente-cobertura-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border, .convergente-datos-index div#checkout-summary h3.c-card-summary__title.c-card-summary__title_border { font-size: 20px !important; padding-bottom: 16px; margin-bottom: 16px; } .convergente-cobertura-index div#checkout-summary .c-card-summary__amount h4, .convergente-datos-index div#checkout-summary .c-card-summary__amount h4 { font-size: 14px; line-height: 18px; } .convergente-cobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before, .convergente-datos-index div#checkout-summary .c-card-summary__amount.c-card-summary__amount_before { font-size: 12px; line-height: 16px; margin-bottom: 0; } .convergente-cobertura-index div#checkout-summary ul.c-card-summary__details, .convergente-datos-index div#checkout-summary ul.c-card-summary__details { font-size: 10px; padding-bottom: 0; } .convergente-cobertura-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary, .convergente-datos-index div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary { padding: 1rem; max-width: 100% !important; min-width: 300px; } .convergente-cobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__total, .convergente-datos-index div#checkout-summary .c-card-summary__amount.c-card-summary__total { margin: -15px 0 5px 0; } .convergente-cobertura-index div#checkout-summary .c-card-summary__amount.c-card-summary__decos, .convergente-datos-index div#checkout-summary .c-card-summary__amount.c-card-summary__decos { font-size: 12px; color: #86888C; font-weight: 300; margin: 10px 0; } .convergente-cobertura-index div#checkout-summary .c-card-summary__message.i-information, .convergente-datos-index div#checkout-summary .c-card-summary__message.i-information { font-size: 10px; } .convergente-cobertura-index div#checkout-summary h4.c-card-summary__subtitle, .convergente-datos-index div#checkout-summary h4.c-card-summary__subtitle { margin-bottom: 5px; } .convergente-cobertura-index div#checkout-summary td.c-card-summary__table-cell, .convergente-datos-index div#checkout-summary td.c-card-summary__table-cell { padding-top: 0px; } .convergente-cobertura-index div#checkout-summary .borderDetail, .convergente-datos-index div#checkout-summary .borderDetail { border-top: 1px solid #d3d4d3; border-bottom: 1px solid #d3d4d3; padding: 10px 0; } .convergente-cobertura-index div#checkout-summary .mb-10, .convergente-datos-index div#checkout-summary .mb-10 { margin-bottom: 10px; } @media only screen and (max-width: 767px) { .convergente-cobertura-index div#checkout-summary, .convergente-datos-index div#checkout-summary { width: 100%; margin-top: 0; max-width: 100% !important; } .convergente-cobertura-index div#checkout-summary.c-card-checkout-cta-view, .convergente-datos-index div#checkout-summary.c-card-checkout-cta-view { display: none; } } .convergente-thankspage-index #container-thankupage { width: 80% !important; max-width: 1141px; margin: 0 auto; text-align: center; } @media only screen and (max-width: 767px) { .convergente-thankspage-index #container-thankupage { width: 90% !important; } } @media only screen and (max-width: 767px) { .convergente-thankspage-index .web-none-c { display: none !important; } } @media only screen and (min-width: 768px) { .convergente-thankspage-index .mobile-none-c { display: none !important; } } .convergente-thankspage-index .blockTextosThankyouPage p span { color: #0B2739; font-weight: 300; } .convergente-thankspage-index .blockTextosThankyouPage .detailsPlan { display: flex; border-bottom: 1px solid #D3D4D3; color: #313235; } .convergente-thankspage-index .blockTextosThankyouPage .detailsPlan :first-child { font-weight: 700; } .convergente-thankspage-index .blockTextosThankyouPage .detailsPlan span { width: 100%; margin: 10px 0; } .convergente-thankspage-index .color-primary { color: #0B2739; } .convergente-thankspage-index .wrap-radio { display: flex; justify-content: center; } .convergente-thankspage-index .wrap-radio .c-form__radio { background: transparent; margin-left: 0; } @media screen and (min-width: 740px) { .convergente-cobertura-index .o-list-steps, .convergente-datos-index .o-list-steps, .convergente-thankspage-index .o-list-steps { column-gap: 4.875rem; } } @media (min-width: 740px) and (max-width: 1023px) { .convergente-cobertura-index .c-card-checkout-cta, .convergente-datos-index .c-card-checkout-cta, .convergente-thankspage-index .c-card-checkout-cta { justify-content: center; margin: 10px auto 0 auto; } } .convergente-datos-index figcaption.o-identification-card__lastnames.text-img-lastNames { top: 40%; left: 10%; display: block; font-size: 10px; font-weight: 700; padding: 0 8px; line-height: 1.2; width: auto; height: auto; text-align: justify; text-transform: uppercase; position: absolute; } .convergente-datos-index figcaption.o-identification-card__names.text-img-names { top: 54%; left: 10%; display: block; font-weight: 700; padding: 0 8px; line-height: 1.2; width: auto; height: auto; text-align: justify; text-transform: uppercase; font-size: 10px; } .convergente-datos-index figcaption.o-identification-card__number { top: 27%; left: 21%; display: block; font-size: 12px; font-weight: 700; padding: 0 8px; line-height: 1.2; } @media (min-width: 740px) and (max-width: 1023px) { .convergente-datos-index figcaption.o-identification-card__lastnames.text-img-lastNames { top: 35%; width: 46%; height: 1.2vh; } .convergente-datos-index figcaption.o-identification-card__names.text-img-names { top: 50%; width: 46%; height: 1.2vh; } } @media (min-width: 1024px) { .convergente-datos-index figcaption.o-identification-card__lastnames.text-img-lastNames { top: 32%; width: 46%; height: 1.2vh; } .convergente-datos-index figcaption.o-identification-card__names.text-img-names { top: 45%; width: 46%; height: 1.2vh; } .convergente-datos-index figcaption.o-identification-card__number { top: 22%; } } .convergente-datos-index .focus-card-input { border: 2px solid #5CB615; border-radius: 5px; padding: 0 5px; } @media (min-width: 1201px) { .convergente-datos-index figcaption.o-identification-card__lastnames.text-img-lastNames { top: 35%; width: 46%; height: 1.2vh; } .convergente-datos-index figcaption.o-identification-card__names.text-img-names { top: 50%; width: 46%; height: 1.2vh; } .convergente-datos-index figcaption.o-identification-card__number { top: 25%; } } .convergente-datos-index #ExpCard { border: 2px solid green; margin-top: 10px; border-radius: 5px; height: 20px; width: 10em; margin-left: 120px; } .convergente-datos-index .ui-datepicker-calendar td a { margin-left: 0px; text-align: center; color: #0B2739; } .convergente-datos-index .ui-datepicker-unselectable span { position: relative; right: 7px; text-align: center; } .convergente-datos-index .ui-datepicker-calendar .ui-state-active { border-radius: 30%; padding-right: 10px; background-color: blue; color: white; } @media screen and (max-width: 600px) { .convergente-datos-index #ExpCard { margin-left: 150px; } } .two-colums-grid { display: grid; gap: 25px; grid-template-columns: 1fr 1fr; } .w-100px { width: 100px !important; } @media screen and (max-width: 600px) { .two-colums-grid { grid-template-columns: 1fr; } } .tracking-index-index .tyc, .tracking-tracking-index .tyc { display: none; } .tracking-index-index .carrousel-brands, .tracking-tracking-index .carrousel-brands { display: none; visibility: hidden; } .tracking-index-index .form-tracking, .tracking-index-index .page-tracking, .tracking-tracking-index .form-tracking, .tracking-tracking-index .page-tracking { background: #fff; border-radius: 18px; padding: 54px 100px; margin-top: 64px; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2); } .tracking-index-index .form-tracking .title, .tracking-index-index .page-tracking .title, .tracking-tracking-index .form-tracking .title, .tracking-tracking-index .page-tracking .title { font-weight: 300; text-align: center; } .tracking-index-index .form-tracking .title div, .tracking-index-index .page-tracking .title div, .tracking-tracking-index .form-tracking .title div, .tracking-tracking-index .page-tracking .title div { font-size: 40px; line-height: 48px; margin: 16px 0; } .tracking-index-index .form-tracking .title p, .tracking-index-index .page-tracking .title p, .tracking-tracking-index .form-tracking .title p, .tracking-tracking-index .page-tracking .title p { font-size: 18px; line-height: 24px; } .tracking-index-index .form-tracking .section-form, .tracking-index-index .page-tracking .section-form, .tracking-tracking-index .form-tracking .section-form, .tracking-tracking-index .page-tracking .section-form { max-width: 500px; text-align: center; margin: auto; margin-top: 16px; } .tracking-index-index .form-tracking .section-form .c-form__field, .tracking-index-index .page-tracking .section-form .c-form__field, .tracking-tracking-index .form-tracking .section-form .c-form__field, .tracking-tracking-index .page-tracking .section-form .c-form__field { padding-top: 1rem; padding-bottom: 0.6rem; } .tracking-index-index .modal-inner-wrap, .tracking-tracking-index .modal-inner-wrap { max-width: 500px !important; } .tracking-index-index #modal-error-default .o-message__title_bold, .tracking-tracking-index #modal-error-default .o-message__title_bold { font-size: 32px; line-height: 40px; font-weight: 300; } .tracking-index-index #modal-error-default .o-message__txt, .tracking-tracking-index #modal-error-default .o-message__txt { font-size: 16px; line-height: 24px; font-weight: 400; } .tracking-index-index #modal-error-default .o-modal__content, .tracking-tracking-index #modal-error-default .o-modal__content { margin-top: 0; padding-top: 0; } .tracking-index-index .page-tracking, .tracking-tracking-index .page-tracking { padding: 54px; } .tracking-index-index .page-tracking .go-back-link, .tracking-tracking-index .page-tracking .go-back-link { font-size: 16px; line-height: 24px; font-weight: 400; } .tracking-index-index .page-tracking .go-back-link span, .tracking-tracking-index .page-tracking .go-back-link span { text-decoration: underline; } .tracking-index-index .page-tracking .i-arrow-left:before, .tracking-tracking-index .page-tracking .i-arrow-left:before { content: ""; font-size: 10px; } .tracking-index-index .page-tracking .o-list-steps, .tracking-tracking-index .page-tracking .o-list-steps { column-gap: 150px; } .tracking-index-index .page-tracking .o-list-steps__step::after, .tracking-tracking-index .page-tracking .o-list-steps__step::after { width: 150px; } .tracking-index-index .page-tracking .c-information, .tracking-tracking-index .page-tracking .c-information { background-color: #f6f6f6; padding: 16px; border-radius: 8px; display: flex; max-width: 84%; margin: 12px auto; } .tracking-index-index .page-tracking .c-information i, .tracking-tracking-index .page-tracking .c-information i { color: #019BEF; margin-right: 10px; } .tracking-index-index .page-tracking .c-information p, .tracking-tracking-index .page-tracking .c-information p { font-size: 16px; line-height: 24px; font-weight: 400; } .tracking-index-index .page-tracking hr, .tracking-tracking-index .page-tracking hr { color: #eeeeee; max-width: 80%; margin: 24px auto; border-color: #eeeeee; opacity: 0.3; border-width: 1.3px; } .tracking-index-index .page-tracking .c-data, .tracking-tracking-index .page-tracking .c-data { max-width: 90%; margin: auto; } .tracking-index-index .page-tracking .c-data .title-data, .tracking-tracking-index .page-tracking .c-data .title-data { font-size: 18px; line-height: 24px; font-weight: 600; } .tracking-index-index .page-tracking .c-data .dataCustomer, .tracking-index-index .page-tracking .c-data .dataOrder, .tracking-tracking-index .page-tracking .c-data .dataCustomer, .tracking-tracking-index .page-tracking .c-data .dataOrder { justify-content: start; } .tracking-index-index .page-tracking .c-data .dataCustomer, .tracking-tracking-index .page-tracking .c-data .dataCustomer { border-right: 1.5px solid #eee; } .tracking-index-index .page-tracking .c-data .dataOrder, .tracking-tracking-index .page-tracking .c-data .dataOrder { padding-left: 20px; } .tracking-index-index .page-tracking table th, .tracking-index-index .page-tracking table td, .tracking-tracking-index .page-tracking table th, .tracking-tracking-index .page-tracking table td { text-align: left; font-size: 16px; line-height: 24px; font-weight: 400; } .tracking-index-index .page-tracking table th, .tracking-tracking-index .page-tracking table th { padding-right: 20px; } .tracking-index-index .page-tracking a.linkMas, .tracking-tracking-index .page-tracking a.linkMas { color: #019DF4; font-size: 14px; text-decoration: underline; } .tracking-index-index .page-tracking .dataOrder th, .tracking-tracking-index .page-tracking .dataOrder th { padding-right: 100px; } .tracking-index-index .page-tracking .pos-step__title, .tracking-tracking-index .page-tracking .pos-step__title { text-align: center; } .tracking-index-index .page-tracking .o-list-steps__step::before, .tracking-tracking-index .page-tracking .o-list-steps__step::before { min-width: 1.5rem; min-height: 1.5rem; } .tracking-index-index .page-tracking .o-list-steps__step.is-check::before, .tracking-tracking-index .page-tracking .o-list-steps__step.is-check::before { font-size: 1.5rem; } .tracking-index-index .page-tracking .o-list-steps__step.active::before, .tracking-tracking-index .page-tracking .o-list-steps__step.active::before { background-color: #019BEF; color: #fff; } @media only screen and (max-width: 768px) { .tracking-index-index, .tracking-tracking-index { background: #fff !important; } .tracking-index-index .form-tracking, .tracking-index-index .page-tracking, .tracking-tracking-index .form-tracking, .tracking-tracking-index .page-tracking { border-radius: 0px; padding: 54px 0px; margin-top: 0px; box-shadow: none; width: 100%; } .tracking-index-index .form-tracking .title, .tracking-index-index .page-tracking .title, .tracking-tracking-index .form-tracking .title, .tracking-tracking-index .page-tracking .title { font-weight: 300; } .tracking-index-index .form-tracking .title div, .tracking-index-index .page-tracking .title div, .tracking-tracking-index .form-tracking .title div, .tracking-tracking-index .page-tracking .title div { font-size: 28px; line-height: 32px; } .tracking-index-index .form-tracking .title p, .tracking-index-index .page-tracking .title p, .tracking-tracking-index .form-tracking .title p, .tracking-tracking-index .page-tracking .title p { font-size: 16px; line-height: 24px; } .tracking-index-index .modal-content, .tracking-tracking-index .modal-content { margin-top: 160px; } .tracking-index-index .page-tracking .o-list-steps, .tracking-tracking-index .page-tracking .o-list-steps { column-gap: 10px; } .tracking-index-index .page-tracking .o-list-steps__step::after, .tracking-tracking-index .page-tracking .o-list-steps__step::after { width: 10px; } .tracking-index-index .page-tracking .c-information, .tracking-tracking-index .page-tracking .c-information { max-width: 100%; } .tracking-index-index .page-tracking hr, .tracking-tracking-index .page-tracking hr { max-width: 100%; } .tracking-index-index .page-tracking .c-data, .tracking-tracking-index .page-tracking .c-data { max-width: 100%; flex-direction: column; } .tracking-index-index .page-tracking .c-data .dataCustomer, .tracking-tracking-index .page-tracking .c-data .dataCustomer { border-right: none; } .tracking-index-index .page-tracking .c-data .dataOrder, .tracking-tracking-index .page-tracking .c-data .dataOrder { border-top: 1.5px solid #eee; margin-top: 24px; padding-top: 24px; } .tracking-index-index .page-tracking div#Head-prepo, .tracking-tracking-index .page-tracking div#Head-prepo { margin: 20px 0; width: 100%; } .tracking-index-index .page-tracking div#Head-prepo .o-list-steps, .tracking-tracking-index .page-tracking div#Head-prepo .o-list-steps { column-gap: 15px; } .tracking-index-index .page-tracking div#Head-prepo .o-list-steps__step, .tracking-tracking-index .page-tracking div#Head-prepo .o-list-steps__step { flex-grow: 1; flex-basis: 0; } .tracking-index-index .page-tracking div#Head-prepo .o-list-steps__step::after, .tracking-tracking-index .page-tracking div#Head-prepo .o-list-steps__step::after { width: 40px; top: -15px; right: -30px; } } @media only screen and (max-width: 768px) { .tracking-index-index { background: #fff !important; } } .c-simple-header__item_empleado { display: flex; align-items: center; justify-content: right; gap: 0.5rem; } .c-simple-header__subitem_empleado { flex: 1; display: flex; flex-direction: column; align-items: flex-end; font-size: 12px; } .price-box.price-tier_price { display: none !important; } .empleado-button_alerta { background: white; width: 25px; height: 25px; border-radius: 50%; font-size: 8px; display: flex; justify-content: center; align-items: center; position: absolute; right: 10px; top: 10px; } .empleado-container_alerta { background: #FEF4E8; border: 1px solid #F28D15; border-radius: 12px; position: relative; margin-bottom: 1rem; } .empleado-title__size { font-size: 40px; font-weight: 480; margin-top: 2em; } .empleado-box_separator { gap: 1rem !important; } .empleado-subtitle { font-size: 18px; text-align: left; margin-bottom: 20px; } .empleado-fieldset-height { height: 60px; } .empleado__thankpage-title { text-align: center !important; font-size: 2.375rem !important; color: #019DF4 !important; font-weight: 450 !important; } .empleado__resumenbox-radius { padding: 1rem; background-color: white; border-radius: 16px; } .empleado__flex-space-between { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; } .empleados__cuotas-container { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; background-color: #f9f9f9; padding: 16px; align-items: center; border-radius: 8px; } .empleados__cuotas-item { text-align: left; } .empleado__valor-cuota { font-size: 1.5em; } .empleado__valor-total { font-size: 1.2em; font-weight: bold; } .empleado-advice { display: flex !important; gap: 1rem !important; } .empleados__cuotas-footer { grid-column: 1/-1; /* Ocupa toda la fila */ font-size: 0.9em; color: #666; text-align: left; border-top: 1px solid #eaeaea; } .empleado__title-code { font-size: 24px; margin-bottom: 5px; } .empleado__width-coutas { width: 70%; margin-left: 2rem; } .empleado-box_separator-coutas { border-right: 1px solid #eaeaea; } .empleado-subtitle-coutas { font-size: 25px; margin-bottom: 5px; margin-top: 2rem; text-align: left; } .empleado__mt-4 { margin-top: 4rem; } .empleado__c-form__code { width: 60%; margin: 0; } .empleado__icon_separation { margin-top: 12px; } .empleado-form__error-text { width: fit-content; margin-top: 4px; margin-top: 0.25rem; padding-left: 16px; padding-left: 1rem; font-size: 14px; font-size: 0.875rem; color: #FF374A; float: left !important; } @media screen and (max-width: 600px) { #empleado-descuento-nomina .c-form__title_big { font-size: 2.2rem !important; font-weight: 350 !important; text-align: left !important; } .empleado-break_line { width: 100% !important; margin: 0 auto !important; } .empleado-box_separator { gap: 0rem; flex-direction: column; } .empleado-width { width: 100% !important; margin-bottom: 0 !important; } .empleado__c-form__code { width: 100%; margin: 0; } .empleado-advice { gap: 0rem; align-items: center; } .empleado__mt-4 { margin-top: 0rem; width: 100%; text-align: center; } .empleados__cuotas-container { display: grid; grid-template-columns: 1fr; gap: 15px; background-color: #f9f9f9; } .empleados__cuotas-item__movil { justify-self: center; align-self: center; border-bottom: 1px solid #eaeaea !important; padding-bottom: 5px; } .empleado__width-coutas { width: 69%; margin-left: 0rem; justify-self: center; align-self: center; } .empleado-box_separator-coutas { border: none; } .empleados__cuotas-footer { border: none !important; } .empleado__valor-cuota { font-size: 1.5em; text-align: center !important; } .empleado__icon_separation { margin-top: 0px; display: flex; gap: 0.4rem; text-align: left; } .empleado__center-item { margin: 0 auto !important; } .empleado-subtitle-coutas { font-size: 1.9rem !important; font-weight: 300 !important; margin-bottom: 5px; margin-top: 2rem; text-align: left; } .empleado__c-form__code { width: 100%; margin: 0; } .empleado-advice { gap: 0rem; align-items: center; } .empleado__mt-4 { margin-top: 0rem; width: 100%; text-align: center; } .empleados__cuotas-container { display: grid; grid-template-columns: 1fr; gap: 15px; background-color: #f9f9f9; } .empleados__cuotas-item__movil { justify-self: center; align-self: center; border-bottom: 1px solid #eaeaea !important; padding-bottom: 5px; } .empleado__width-coutas { width: 69%; margin-left: 0rem; justify-self: center; align-self: center; } .empleado-box_separator-coutas { border: none; } .empleados__cuotas-footer { border: none !important; } .empleado__valor-cuota { font-size: 1.5em; text-align: center !important; } .empleado__icon_separation { margin-top: 0px; display: flex; gap: 0.4rem; text-align: left; } .empleado__center-item { margin: 0 auto !important; } .empleado-subtitle-coutas { font-size: 1.9rem !important; font-weight: 300 !important; margin-bottom: 5px; margin-top: 2rem; text-align: left; } } .idvision-confronta-index .c-form__title_big_idvision { font-size: 41px; margin-bottom: 1rem; line-height: 1.1; font-weight: 400; } @media screen and (max-width: 600px) { .idvision-confronta-index .c-form__title_big_idvision { font-size: 23px; margin-bottom: 1rem; line-height: 1.1; font-weight: 600; } } .idvision-confronta-index .c-form_field__confronta-idvision { width: 80%; margin: 0 auto; box-shadow: 0 4px 15px -2px rgba(0, 0, 0, 0.1); } @media screen and (max-width: 600px) { .idvision-confronta-index .c-form_field__confronta-idvision { width: 100%; box-shadow: 0 4px 15px -2px rgba(0, 0, 0, 0.1); } } .idvision-confronta-index .c-form__header_idvision { margin-left: 8vw; margin-right: 8vw; } @media screen and (max-width: 600px) { .idvision-confronta-index .c-form__header_idvision { margin-left: 4vw; margin-right: 4vw; } } .idvision-confronta-index .line__idvision-horizontal { width: 80%; margin-top: 18px; opacity: 0.4; } .idvision-confronta-index .step__idvision-confronta { font-size: 1.5rem; font-weight: 600; } .idvision-confronta-index .c-form__actions_right_idvision { text-align: right; } .idvision-confronta-index .c-form__btn_full_idvision { width: 25%; height: 48px; margin-right: 8vw; } @media screen and (max-width: 600px) { .idvision-confronta-index .c-form__btn_full_idvision { width: 90%; margin: 0 auto; } } .idvision-confronta-index .c-card-checkout-cta__btn { background-color: #0B2739; color: #fff; font-weight: 300; } .idvision-confronta-index header .c-form__title_big { font-weight: 700; } .idvision-confronta-index header .c-form__lead_gray { font-weight: 400; } @media screen and (max-width: 768px) { .idvision-confronta-index header .c-form__title_big { text-align: center; font-size: 24px; } .idvision-confronta-index header .c-form__lead_gray { text-align: center; font-size: 14px; } } .idvision-index-index .modal-content { border-radius: 15px; } .idvision-index-index .o-modal__content { padding: 0 10px; } @media screen and (max-width: 768px) { .idvision-index-index .o-message__title_nipidVision { font-size: 25px; } } @media screen and (max-width: 768px) { .idvision-index-index .c-form__code-number { width: 50px !important; height: 60px !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 30px; /* 9 */ font-size: 1.875rem; /* 9 */ } } .idvision-index-index #errors-modal-gen { background: #fff !important; padding: 2%; border-radius: 15px; outline: 3px solid #fff; } .movistartotal-pospago-index .header_container_movistartotal, .movistartotal-contrato-index .header_container_movistartotal { margin-bottom: 10px; display: flex; justify-content: space-between; align-items: baseline; } .movistartotal-pospago-index .c-typeDelivery_subcontainer, .movistartotal-contrato-index .c-typeDelivery_subcontainer { display: flex; justify-content: space-between; align-items: center; } .movistartotal-pospago-index .width_movistartotal, .movistartotal-contrato-index .width_movistartotal { width: 90%; } .movistartotal-pospago-index .porta_movistaltotal_container, .movistartotal-contrato-index .porta_movistaltotal_container { display: flex; justify-content: space-between; gap: 10%; align-items: baseline; margin-top: 10px; } .movistartotal-pospago-index .box_container_movistartotal, .movistartotal-contrato-index .box_container_movistartotal { height: 65px; display: flex; align-items: center; background-color: #fff; border-radius: 6px; border: 1px solid #019BEF; padding: 1rem; } .movistartotal-pospago-index .box_separator_radio_MT, .movistartotal-contrato-index .box_separator_radio_MT { display: grid; grid-template-columns: auto 1fr auto; align-items: center; width: 100%; padding: 10px; } .movistartotal-pospago-index .box_container_movistartotal_esim, .movistartotal-contrato-index .box_container_movistartotal_esim { display: flex; justify-content: space-around; align-items: center; margin: 2rem 0rem 3rem 0rem; } .movistartotal-pospago-index .box_container_movistartotal_esim .titleboxImage, .movistartotal-contrato-index .box_container_movistartotal_esim .titleboxImage { font-size: 19px; font-weight: 700; text-align: left; } .movistartotal-pospago-index .iconCheckMovistartotal, .movistartotal-contrato-index .iconCheckMovistartotal { width: 40px; height: 40px; margin-top: 10px; margin-left: 10px; } .movistartotal-pospago-index .deliveryAddress_movistartotal, .movistartotal-contrato-index .deliveryAddress_movistartotal { flex: 1; background-color: white !important; padding-left: 0 !important; } .movistartotal-pospago-index .deliveryAddress_movistartotal p, .movistartotal-contrato-index .deliveryAddress_movistartotal p { font-weight: 300 !important; font-size: 16px !important; line-height: 16px !important; } .movistartotal-pospago-index .icon-info-color_movistartotal, .movistartotal-contrato-index .icon-info-color_movistartotal { color: #FF374A; font-size: 18px; } .movistartotal-pospago-index .porta_btn_movistaltotal, .movistartotal-contrato-index .porta_btn_movistaltotal { width: 207px !important; } .movistartotal-pospago-index .pos-con-container__submit_MT, .movistartotal-contrato-index .pos-con-container__submit_MT { text-align: right; width: 100%; margin-top: 1.25rem; } .movistartotal-pospago-index .o-message__title_fs24, .movistartotal-contrato-index .o-message__title_fs24 { font-weight: 500; font-size: 32px !important; } @media screen and (max-width: 740px) { .movistartotal-pospago-index .o-message__title_fs24, .movistartotal-contrato-index .o-message__title_fs24 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ } } .movistartotal-pospago-index strong, .movistartotal-contrato-index strong { font-weight: 600; } .movistartotal-pospago-index .o-layout-2-columns, .movistartotal-contrato-index .o-layout-2-columns { width: 95% !important; max-width: 960px !important; margin: 0 auto; } @media only screen and (min-width: 1023px) { .movistartotal-pospago-index .o-layout-2-columns #checkout-summary, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary { margin-top: -150px; margin-bottom: 30px; } } @media only screen and (max-width: 1023px) { .movistartotal-pospago-index .o-layout-2-columns .c-card-checkout-cta.movistarTotal, .movistartotal-contrato-index .o-layout-2-columns .c-card-checkout-cta.movistarTotal { justify-content: center; } .movistartotal-pospago-index .o-layout-2-columns header, .movistartotal-contrato-index .o-layout-2-columns header { order: 1; } } .movistartotal-pospago-index .o-layout-2-columns div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .movistartotal-contrato-index .o-layout-2-columns div#checkout-summary .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal { max-width: 100% !important; min-width: 300px; } .movistartotal-pospago-index .o-section, .movistartotal-contrato-index .o-section { margin-top: 5px !important; } .movistartotal-pospago-index .c-form__header, .movistartotal-contrato-index .c-form__header { margin-top: 20px !important; } @media only screen and (max-width: 1023px) { .movistartotal-pospago-index #checkout-summary, .movistartotal-contrato-index #checkout-summary { order: 1; margin-top: 20px; } } .movistartotal-pospago-index .subTitleDir, .movistartotal-contrato-index .subTitleDir { color: #019DF4; text-align: left; font-size: 14px; } .movistartotal-pospago-index .txt-comment-additional, .movistartotal-contrato-index .txt-comment-additional { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding: 10px; /* 9 */ padding: 0.625rem; /* 9 */ resize: none; border-radius: 5px; border: 1px solid #B6B7B7; box-shadow: 1px 1px 1px #B6B7B7; color: #50535A; } .movistartotal-pospago-index .msjContent, .movistartotal-contrato-index .msjContent { font-size: 14px !important; } .movistartotal-pospago-index .address-client-portabilidad.no-edit .edit-customer-data, .movistartotal-contrato-index .address-client-portabilidad.no-edit .edit-customer-data { display: flex; } .movistartotal-pospago-index .address-client-portabilidad.no-edit .c-form__box, .movistartotal-contrato-index .address-client-portabilidad.no-edit .c-form__box { pointer-events: none; opacity: 0.4; } .movistartotal-pospago-index .address-client-portabilidad.address-client-movistartotal, .movistartotal-contrato-index .address-client-portabilidad.address-client-movistartotal { background: white; display: flex; gap: 20px; border-radius: 8px; padding: 15px 0; } .movistartotal-pospago-index .fechas-footer, .movistartotal-contrato-index .fechas-footer { margin: 15px 0 !important; } .movistartotal-pospago-index #submit-sign-contract, .movistartotal-contrato-index #submit-sign-contract { margin-right: 0px; } @media screen and (max-width: 768px) { .movistartotal-pospago-index #submit-sign-contract, .movistartotal-contrato-index #submit-sign-contract { margin: 0px !important; } } .movistartotal-pospago-index .c-form__box .c-form__field, .movistartotal-contrato-index .c-form__box .c-form__field { background-color: #fff !important; padding: 16px; } .movistartotal-pospago-index .c-form__box .c-form__field .address_select, .movistartotal-pospago-index .c-form__box .c-form__field .c-form__select, .movistartotal-contrato-index .c-form__box .c-form__field .address_select, .movistartotal-contrato-index .c-form__box .c-form__field .c-form__select { max-width: 100%; } .movistartotal-pospago-index .c-form__box .c-form__field .in-detalle-direccion, .movistartotal-contrato-index .c-form__box .c-form__field .in-detalle-direccion { position: relative; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: 8px; /* 9 */ top: 0.5rem; /* 9 */ } .movistartotal-pospago-index .c-form__box .c-form__field .lb-detalle-direccion, .movistartotal-contrato-index .c-form__box .c-form__field .lb-detalle-direccion { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ top: -32px; /* 9 */ top: -2rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ color: #019DF4; } .movistartotal-pospago-index .c-form__box .c-form__field.is-error .lb-detalle-direccion, .movistartotal-contrato-index .c-form__box .c-form__field.is-error .lb-detalle-direccion { color: #FF374A; } .movistartotal-pospago-index .c-form__box .c-form__text, .movistartotal-contrato-index .c-form__box .c-form__text { display: block; text-align: left; } .movistartotal-pospago-index .c-form__box.is-error .c-form__text, .movistartotal-contrato-index .c-form__box.is-error .c-form__text { display: none; } @media screen and (max-width: 739px) { .movistartotal-pospago-index .c-form__box.is-error .c-form__text, .movistartotal-contrato-index .c-form__box.is-error .c-form__text { display: block; } } .movistartotal-pospago-index .u-width-90, .movistartotal-contrato-index .u-width-90 { width: 90%; } .movistartotal-pospago-index .u-width-80, .movistartotal-contrato-index .u-width-80 { width: 80%; } .movistartotal-pospago-index .u-width-40, .movistartotal-contrato-index .u-width-40 { width: 40%; } .movistartotal-pospago-index .u-width-30, .movistartotal-contrato-index .u-width-30 { width: 30%; } .movistartotal-pospago-index .u-width-25, .movistartotal-contrato-index .u-width-25 { width: 25%; } .movistartotal-pospago-index .u-width-5, .movistartotal-contrato-index .u-width-5 { width: 5%; } .movistartotal-pospago-index .c-entrega, .movistartotal-contrato-index .c-entrega { background: #ffffff; border-radius: 6px; padding: 20px; } .movistartotal-pospago-index .c-entrega h2, .movistartotal-contrato-index .c-entrega h2 { margin-bottom: 15px !important; font-weight: 500; } .movistartotal-pospago-index .c-entrega h2.title-2, .movistartotal-contrato-index .c-entrega h2.title-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 48px; /* 9 */ margin-top: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 24px; /* 9 */ padding-left: 1.5rem; /* 9 */ margin-bottom: 0 !important; } .movistartotal-pospago-index .c-entrega .subtitle-2, .movistartotal-contrato-index .c-entrega .subtitle-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-left: 24px; /* 9 */ padding-left: 1.5rem; /* 9 */ } .movistartotal-pospago-index .c-entrega .c-form__field-canvas, .movistartotal-contrato-index .c-entrega .c-form__field-canvas { margin-bottom: 0; } @media screen and (max-width: 739px) { .movistartotal-pospago-index .c-entrega .c-form__field-canvas, .movistartotal-contrato-index .c-entrega .c-form__field-canvas { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } } .movistartotal-pospago-index .c-entrega .c-form__radio-button-label, .movistartotal-contrato-index .c-entrega .c-form__radio-button-label { grid-template-columns: 5px auto !important; } .movistartotal-pospago-index .c-entrega .c-form__field-canvas.selectEntregar, .movistartotal-contrato-index .c-entrega .c-form__field-canvas.selectEntregar { column-gap: 0; margin-top: 20px; } .movistartotal-pospago-index .c-entrega .c-form__field-canvas.selectEntregar .c-form__field, .movistartotal-contrato-index .c-entrega .c-form__field-canvas.selectEntregar .c-form__field { padding: 12px !important; color: #019df4; border: none; width: 0; margin-right: 10px; margin-left: -5px; } .movistartotal-pospago-index .c-entrega .c-form__field-canvas.selectEntregar .c-form__icon::before, .movistartotal-contrato-index .c-entrega .c-form__field-canvas.selectEntregar .c-form__icon::before { padding-right: 0; } .movistartotal-pospago-index .c-entrega .infoEntregar, .movistartotal-contrato-index .c-entrega .infoEntregar { font-weight: 400; font-size: 14px; line-height: 20px; } .movistartotal-pospago-index .datesMonth, .movistartotal-contrato-index .datesMonth { margin-bottom: 15px; font-size: 20px; } .movistartotal-pospago-index table th, .movistartotal-pospago-index table td, .movistartotal-contrato-index table th, .movistartotal-contrato-index table td { text-align: center; } .movistartotal-pospago-index .pagination li:hover, .movistartotal-contrato-index .pagination li:hover { cursor: pointer; } .movistartotal-pospago-index table tbody tr, .movistartotal-contrato-index table tbody tr { display: none; } .movistartotal-pospago-index table tbody tr td:not(.line), .movistartotal-contrato-index table tbody tr td:not(.line) { cursor: pointer; } .movistartotal-pospago-index ul.pagination, .movistartotal-contrato-index ul.pagination { list-style-type: none; } .movistartotal-pospago-index ul.pagination li, .movistartotal-contrato-index ul.pagination li { color: #019df4; margin-top: 45px; } .movistartotal-pospago-index .c-form__field-canvas.fechas, .movistartotal-contrato-index .c-form__field-canvas.fechas { column-gap: 0.5rem; } .movistartotal-pospago-index .txtND, .movistartotal-contrato-index .txtND { margin-right: 6%; } .movistartotal-pospago-index #days-table .line, .movistartotal-pospago-index #days-window .line, .movistartotal-contrato-index #days-table .line, .movistartotal-contrato-index #days-window .line { background-image: linear-gradient(to top left, #f5f5f5 48%, #f5f5f5, #f5f5f5 52%); color: #86888C; } .movistartotal-pospago-index #days-table .dateSelected, .movistartotal-pospago-index #days-window .dateSelected, .movistartotal-contrato-index #days-table .dateSelected, .movistartotal-contrato-index #days-window .dateSelected { background-color: #008EDD; color: #fff; } .movistartotal-pospago-index #days-table .firstElement, .movistartotal-pospago-index #days-window .firstElement, .movistartotal-contrato-index #days-table .firstElement, .movistartotal-contrato-index #days-window .firstElement { border-radius: 8px 0px 0 8px; } .movistartotal-pospago-index #days-table .lastElement, .movistartotal-pospago-index #days-window .lastElement, .movistartotal-contrato-index #days-table .lastElement, .movistartotal-contrato-index #days-window .lastElement { border-radius: 0px 8px 8px 0; } .movistartotal-pospago-index #days-table th, .movistartotal-pospago-index #days-window th, .movistartotal-contrato-index #days-table th, .movistartotal-contrato-index #days-window th { padding-bottom: 10px; } .movistartotal-pospago-index #days-table tbody, .movistartotal-pospago-index #days-window tbody, .movistartotal-contrato-index #days-table tbody, .movistartotal-contrato-index #days-window tbody { border-collapse: collapse; border-radius: 8px; border-style: hidden; /* hide standard table (collapsed) border */ box-shadow: 0 0 0 1px #008EDD; /* this draws the table border */ } .movistartotal-pospago-index #days-table tbody td, .movistartotal-pospago-index #days-window tbody td, .movistartotal-contrato-index #days-table tbody td, .movistartotal-contrato-index #days-window tbody td { padding: 10px; color: #008EDD; border: 1px solid #008EDD; background-color: #80CEF9; } .movistartotal-pospago-index .fechas-footer, .movistartotal-contrato-index .fechas-footer { display: grid; gap: 10px; width: max-content; color: #86888C; margin: 20px; } .movistartotal-pospago-index .fechas-footer .content-info-dates, .movistartotal-contrato-index .fechas-footer .content-info-dates { display: flex; gap: 10px; align-items: center; padding: 0 20px; } .movistartotal-pospago-index .fechas-round-icon, .movistartotal-contrato-index .fechas-round-icon { width: 20px; height: 20px; display: inline-block; border-radius: 50%; } .movistartotal-pospago-index .fechas-footer-contenedor, .movistartotal-contrato-index .fechas-footer-contenedor { display: flex; width: 600px; padding: 0 20px; gap: 10px; } .movistartotal-pospago-index .gris, .movistartotal-contrato-index .gris { background-color: #F5F5F5; } .movistartotal-pospago-index .azul-claro, .movistartotal-contrato-index .azul-claro { background-color: #80CEF9; } .movistartotal-pospago-index .azul-oscuro, .movistartotal-contrato-index .azul-oscuro { background-color: #008EDD; } .movistartotal-pospago-index .msgRetiroTienda, .movistartotal-contrato-index .msgRetiroTienda { display: grid; grid-template-columns: 30px 1fr; align-items: center; padding: 10px 20px; gap: 10px; font-size: 14px; } .movistartotal-pospago-index .fs-24, .movistartotal-contrato-index .fs-24 { font-size: 1.3rem !important; } @media (max-width: 600px) { .movistartotal-pospago-index .fs-24, .movistartotal-contrato-index .fs-24 { font-size: 1.3rem !important; text-align: center; font-weight: 600; } } .movistartotal-pospago-index .fs-24 strong, .movistartotal-contrato-index .fs-24 strong { font-weight: 600; } .movistartotal-pospago-index .center, .movistartotal-contrato-index .center { text-align: center; } .movistartotal-pospago-index .m-auto, .movistartotal-contrato-index .m-auto { margin: auto; display: block; } .movistartotal-pospago-index .mt-20, .movistartotal-contrato-index .mt-20 { margin-top: 20px; } .movistartotal-pospago-index .m-auto.mt-20.txt-mobile-small, .movistartotal-contrato-index .m-auto.mt-20.txt-mobile-small { display: flex !important; align-items: center !important; } .movistartotal-pospago-index .pos-con-container__info, .movistartotal-contrato-index .pos-con-container__info { margin-top: 10px !important; } .movistartotal-pospago-index .o-link, .movistartotal-contrato-index .o-link { cursor: pointer; } .movistartotal-pospago-index #modal-nip .o-modal__content, .movistartotal-contrato-index #modal-nip .o-modal__content { padding: 10px 5px; } .movistartotal-pospago-index #modal-ordenes-pendientes .icon-title-warning-size, .movistartotal-contrato-index #modal-ordenes-pendientes .icon-title-warning-size { font-size: 50px; color: #FF374A; } @media screen and (max-width: 600px) { .movistartotal-pospago-index #modal-ordenes-pendientes .icon-title-warning-size, .movistartotal-contrato-index #modal-ordenes-pendientes .icon-title-warning-size { font-size: 32px; } } .movistartotal-pospago-index #modal-ordenes-pendientes .o-link, .movistartotal-contrato-index #modal-ordenes-pendientes .o-link { text-decoration: none; } .movistartotal-pospago-index .c-form__input.c-form__input_label-top, .movistartotal-pospago-index .c-form__input:valid, .movistartotal-pospago-index .c-form__input:focus, .movistartotal-contrato-index .c-form__input.c-form__input_label-top, .movistartotal-contrato-index .c-form__input:valid, .movistartotal-contrato-index .c-form__input:focus { position: initial !important; } @media screen and (max-width: 600px) { .movistartotal-pospago-index .box_container_movistartotal_esim, .movistartotal-contrato-index .box_container_movistartotal_esim { flex-direction: column; margin: 1rem 0rem 3rem 0rem; } .movistartotal-pospago-index .width_movistartotal, .movistartotal-contrato-index .width_movistartotal { width: 100%; } .movistartotal-pospago-index .porta_movistaltotal_container, .movistartotal-contrato-index .porta_movistaltotal_container { flex-direction: column; } .movistartotal-pospago-index .porta_movistaltotal_container_sub1, .movistartotal-contrato-index .porta_movistaltotal_container_sub1 { width: 80%; margin: 0 auto; } .movistartotal-pospago-index .porta_movistaltotal_container_sub2, .movistartotal-contrato-index .porta_movistaltotal_container_sub2 { flex: 1; width: 100%; margin-bottom: 10px; } .movistartotal-pospago-index .fechas-footer-contenedor, .movistartotal-contrato-index .fechas-footer-contenedor { display: flex; width: 350px; } .movistartotal-pospago-index .title-mb_movistartotal, .movistartotal-contrato-index .title-mb_movistartotal { font-size: 22px !important; text-align: center !important; } .movistartotal-pospago-index .porta_btn_movistaltotal, .movistartotal-contrato-index .porta_btn_movistaltotal { max-width: 100% !important; width: 100% !important; } .movistartotal-pospago-index .address-client-movistartotal, .movistartotal-contrato-index .address-client-movistartotal { margin-top: 20px; } .movistartotal-pospago-index .c-form__box.u-width-80, .movistartotal-pospago-index .c-form__box.u-width-45, .movistartotal-pospago-index .c-form__box.u-width-25, .movistartotal-contrato-index .c-form__box.u-width-80, .movistartotal-contrato-index .c-form__box.u-width-45, .movistartotal-contrato-index .c-form__box.u-width-25 { width: 100% !important; } .movistartotal-pospago-index h2, .movistartotal-contrato-index h2 { font-size: 5vw; text-align: center; } .movistartotal-pospago-index .c-form__field-canvas.fechas, .movistartotal-pospago-index .c-form__field-canvas.selectEntregar, .movistartotal-contrato-index .c-form__field-canvas.fechas, .movistartotal-contrato-index .c-form__field-canvas.selectEntregar { flex-direction: inherit; } .movistartotal-pospago-index .c-form__field-canvas.fechas .c-form__box.u-width-80, .movistartotal-pospago-index .c-form__field-canvas.selectEntregar .c-form__box.u-width-80, .movistartotal-contrato-index .c-form__field-canvas.fechas .c-form__box.u-width-80, .movistartotal-contrato-index .c-form__field-canvas.selectEntregar .c-form__box.u-width-80 { width: 90% !important; } .movistartotal-pospago-index .c-fechas, .movistartotal-contrato-index .c-fechas { padding: 12px; } .movistartotal-pospago-index .txtDelivery, .movistartotal-contrato-index .txtDelivery { line-height: 20px; text-align: center; margin-left: 0 !important; font-size: 13px; } } .movistartotal-pospago-index #modal-compatibilidad-esim .text-blue-dark, .movistartotal-contrato-index #modal-compatibilidad-esim .text-blue-dark { color: #0B2739; } .movistartotal-pospago-index #modal-compatibilidad-esim .text-title, .movistartotal-contrato-index #modal-compatibilidad-esim .text-title { color: #0B2739; line-height: 40px; } .movistartotal-pospago-index #modal-compatibilidad-esim .icon-title-size, .movistartotal-contrato-index #modal-compatibilidad-esim .icon-title-size { font-size: 50px; color: #019DF4; } .movistartotal-pospago-index #modal-compatibilidad-esim .o-message__title, .movistartotal-contrato-index #modal-compatibilidad-esim .o-message__title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 32px; /* 9 */ font-size: 2rem; /* 9 */ } .movistartotal-pospago-index #modal-compatibilidad-esim .o-message__subtitle, .movistartotal-contrato-index #modal-compatibilidad-esim .o-message__subtitle { width: 90%; margin-left: auto; margin-right: auto; } .movistartotal-pospago-index #modal-compatibilidad-esim .font-26, .movistartotal-contrato-index #modal-compatibilidad-esim .font-26 { font-size: 26px; line-height: 30px; } .movistartotal-pospago-index #modal-compatibilidad-esim .text-information, .movistartotal-contrato-index #modal-compatibilidad-esim .text-information { width: 80%; margin-left: auto; margin-right: auto; line-height: 24px; } @media screen and (max-width: 600px) { .movistartotal-pospago-index #modal-compatibilidad-esim .icon-title-size, .movistartotal-contrato-index #modal-compatibilidad-esim .icon-title-size { font-size: 32px; color: #019DF4; } .movistartotal-pospago-index #modal-compatibilidad-esim .text-title, .movistartotal-contrato-index #modal-compatibilidad-esim .text-title { color: #0B2739; line-height: 30px; font-size: 27px !important; } .movistartotal-pospago-index #modal-compatibilidad-esim .text-blue-dark, .movistartotal-contrato-index #modal-compatibilidad-esim .text-blue-dark { color: #0B2739; font-size: 15px !important; } } .movistartotal-pospago-index #modal-direccion-pospago .c-form__field, .movistartotal-contrato-index #modal-direccion-pospago .c-form__field { padding: 20px 12px !important; } .movistartotal-thankyoupage-index .container_header_MT { text-align: center; width: 63%; margin: 0 auto; } .movistartotal-thankyoupage-index .title_header_MT { margin-bottom: 20px; color: #313235; line-height: normal; } .movistartotal-thankyoupage-index .container_Card_subtitle_MT { display: flex; gap: 1rem; margin-top: 2rem; justify-content: center; } .movistartotal-thankyoupage-index .card_subtitle_MT { background: #E6F5FD; gap: 1rem; display: flex; justify-content: flex-start; padding: 0.5rem; border-radius: 7px; flex-grow: 1; } .movistartotal-thankyoupage-index .card_subtitle_MT div:first-child { display: flex; align-items: center; } .movistartotal-thankyoupage-index .sim_MT_typ .card_subtitle_MT { background: #E6F5FD; gap: 1rem; display: flex; justify-content: flex-start; padding: 0.5rem; border-radius: 7px; flex-grow: 1; } .movistartotal-thankyoupage-index .sim_MT_typ .card_subtitle_MT div:first-child { display: flex; align-items: center; } .movistartotal-thankyoupage-index .card_subtitleicon_MT { display: flex; align-items: center; font-size: 35px; color: #019BEF !important; } .movistartotal-thankyoupage-index .container_footer_MT { display: flex; align-items: center; justify-content: space-around; } .movistartotal-thankyoupage-index .title_footer_MT { font-size: 32px; font-weight: 500; color: black; } .movistartotal-thankyoupage-index .container_Card_footer_MT { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; flex: 40%; } .movistartotal-thankyoupage-index .Card_footer_MT { background: #E6F5FD; gap: 1rem; align-items: center; display: flex; justify-content: flex-start; padding: 0.5rem; border-radius: 7px; box-shadow: 1px 1px 9px rgba(0, 0, 0, 0.1); color: #0B2739; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .Card_footer_MT div:first-child { width: 40%; } } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .Card_footer_MT { font-size: 14px; gap: 0.813rem; } } .movistartotal-thankyoupage-index .container_resumen_MT { display: flex; gap: 60px; } .movistartotal-thankyoupage-index .resumen_MT { padding: 16px 24px; background: white; flex: 60%; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .resumen_MT { padding: 10px 8px; } } .movistartotal-thankyoupage-index .box_resumen_MT { grid-template-rows: auto auto auto; } .movistartotal-thankyoupage-index .box_Card_MT { display: grid; grid-template-columns: 180px 1fr; padding: 1rem; border-bottom: 1px solid #D3D4D3; gap: 20px; align-items: start; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .box_Card_MT { grid-template-columns: 110px 1fr; padding: 0.625rem; gap: 10px; } } .movistartotal-thankyoupage-index .box_Card_MT p:first-child { font-weight: bold; color: #313235; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .box_Card_MT p:first-child { font-size: 13px; } } .movistartotal-thankyoupage-index .box_Card_MT:last-child { border-bottom: none; } .movistartotal-thankyoupage-index .box_Card_MT p:nth-child(2) { word-wrap: break-word; overflow-wrap: break-word; white-space: normal; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .box_Card_MT p:nth-child(2) { font-size: 13px; } } .movistartotal-thankyoupage-index .container_subtotal_MT { padding: 1rem; background: white; margin-top: 2rem; border-radius: 8px; } .movistartotal-thankyoupage-index .subtotal_MT { display: flex; justify-content: space-between; border-bottom: 1px solid; padding: 0.5rem; } .movistartotal-thankyoupage-index .subtotal_MT p:first-child { font-size: 18px; font-weight: 800; } .movistartotal-thankyoupage-index .subtotal_information_MT { display: flex; align-items: center; gap: 20px; padding: 0.5rem; } .movistartotal-thankyoupage-index .resumen_subtotal_MT { flex: 30; } .movistartotal-thankyoupage-index .color_MT { color: #019BEF; } .movistartotal-thankyoupage-index .btn-experience-MT { background: white; border: 1px solid #019BEF; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .btn-experience-MT { display: none; } } .movistartotal-thankyoupage-index .c-card-detail__btn { margin-bottom: 15px !important; } .movistartotal-thankyoupage-index .o-section.o-canvas { margin-bottom: 40px !important; } .movistartotal-thankyoupage-index .container_footer_btnMT { text-align: center; margin-top: 25px; } .movistartotal-thankyoupage-index .title_MT { text-align: center; margin-bottom: 25px; font-weight: 500; font-size: 32px; color: #313235; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .title_MT { font-size: 28px; } } .movistartotal-thankyoupage-index .container-thankspage.o-section { margin: 10px auto !important; } .movistartotal-thankyoupage-index #contentMobile { display: none !important; } .movistartotal-thankyoupage-index #contentDesk { display: block !important; } @media screen and (max-width: 740px) { .movistartotal-thankyoupage-index .container_Card_subtitle_MT { flex-direction: column; } .movistartotal-thankyoupage-index .container_footer_MT { flex-direction: column; gap: 25px; } .movistartotal-thankyoupage-index .container_header_MT { width: 100%; } .movistartotal-thankyoupage-index .title_footer_MT { font-size: 23px; text-align: center; } .movistartotal-thankyoupage-index .container_resumen_MT { flex-direction: column; gap: 0px; } .movistartotal-thankyoupage-index .container_subtotal_MT { order: 1; } .movistartotal-thankyoupage-index .resumen_subtotal_MT { flex: 30; display: flex; flex-direction: column; } .movistartotal-thankyoupage-index .img-order { order: 2; margin-top: 30px; } .movistartotal-thankyoupage-index #beneficioeSim { display: none !important; } .movistartotal-thankyoupage-index #contentDesk { display: none !important; } .movistartotal-thankyoupage-index #contentMobile { display: block !important; } } .movistartotal-thankyoupage-index .hidden { display: none !important; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal { max-width: 300px !important; width: 300px; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary { background-color: #fff; padding: 1rem 2rem; margin-top: 15px; } @media only screen and (max-width: 1022px) { .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal { display: none; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal.is-summary-show, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal.is-summary-show, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal.is-summary-show, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal.is-summary-show, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal.is-summary-show, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal.is-summary-show, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary.c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal.is-summary-show { display: block; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 10px; /* 9 */ margin-bottom: 0.625rem; /* 9 */ } } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary .section-summary, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary .section-summary, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary .section-summary, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary .section-summary, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary .section-summary, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary .section-summary, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary .section-summary { padding: 0px; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__title, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__title, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__title, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__title, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__title, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__title, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__title { color: #0B2739; font-weight: bold; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ padding-bottom: 10px; /* 9 */ padding-bottom: 0.625rem; /* 9 */ } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount h4, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount h4, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount h4, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount h4, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount h4, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount h4, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount h4 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ line-height: normal; color: #0B2739; font-weight: 600; margin-bottom: 2px !important; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount .amount, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount .amount, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount .amount, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount .amount, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount .amount, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount .amount, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount .amount { font-weight: 600; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__details .li-details, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__details .li-details, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__details .li-details, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__details .li-details, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__details .li-details, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__details .li-details, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__details .li-details { color: #0B2739; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address_title, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address_title, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address_title, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address_title, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address_title, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address_title, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address_title { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 13px; /* 9 */ font-size: 0.8125rem; /* 9 */ font-weight: bold; color: #0B2739; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address { display: flex; flex-direction: row; color: #0B2739 !important; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 6px; /* 9 */ margin-top: 0.375rem; /* 9 */ } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details { flex-direction: column; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:first-child, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:first-child, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:first-child, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:first-child, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:first-child, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:first-child, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:first-child { flex: 2; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:not(:first-child), .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:not(:first-child), .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:not(:first-child), .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:not(:first-child), .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:not(:first-child), .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:not(:first-child), .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details:not(:first-child) { flex: 1; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details .c-card-summary__amount, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details .c-card-summary__amount, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details .c-card-summary__amount, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details .c-card-summary__amount, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details .c-card-summary__amount, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details .c-card-summary__amount, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__address .c-card-summary__address__details .c-card-summary__amount { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 0px; /* 9 */ margin-top: 0rem; /* 9 */ } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos { display: flex; justify-content: space-between; align-items: center; margin-bottom: 3px; font-size: 12px !important; color: #0B2739; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos .mark, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos .mark, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos .mark, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos .mark, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos .mark, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos .mark, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__amount_datos .mark { font-weight: bold; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure { flex-wrap: wrap; color: #0B2739; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure > *, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure > *, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure > *, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure > *, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure > *, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure > *, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure > * { flex: 1; min-width: 0; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__img, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__img, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__img, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__img, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__img, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__img, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__img { flex: 0 0 auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ max-height: 33px; /* 9 */ max-height: 2.0625rem; /* 9 */ } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__lead, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__lead, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__lead, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__lead, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__lead, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__lead, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure .o-item-selected__lead { flex: 1; text-align: right; font-weight: 600; } .hogar-cobertura-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure span, .hogar-servicios-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure span, .hogar-datos-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure span, .hogar-agendar-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure span, .hogar-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure span, .movistartotal-pospago-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure span, .movistartotal-contrato-index .o-layout-2-columns #checkout-summary.c-card-summary__wrap.movistarTotal .c-card-summary__box .o-item-selected__figure span { flex: 1; text-align: center; } @media only screen and (max-width: 741px) { .hogar-cobertura-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal, .hogar-servicios-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal, .hogar-datos-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal, .hogar-agendar-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal, .hogar-contrato-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal, .movistartotal-pospago-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal, .movistartotal-contrato-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal { position: fixed; top: 100%; left: 0; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); width: 100%; box-shadow: 0px 0px 20px #00000069; z-index: 100; border-radius: 4px 4px 0 0 !important; background-color: #019DF4; color: #fff; } .hogar-cobertura-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select, .hogar-servicios-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select, .hogar-datos-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select, .hogar-agendar-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select, .hogar-contrato-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select, .movistartotal-pospago-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select, .movistartotal-contrato-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); transition: transform 0.3s ease; } .hogar-cobertura-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select::before, .hogar-servicios-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select::before, .hogar-datos-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select::before, .hogar-agendar-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select::before, .hogar-contrato-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select::before, .movistartotal-pospago-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select::before, .movistartotal-contrato-index .c-card-checkout-cta.movistarTotal > .c-card-checkout-cta__btn.js-summary-btn.movistarTotal .c-form__icon_select::before { position: static; background-color: #fff; color: #313235; border-radius: 100%; padding: 8px !important; } .hogar-cobertura-index .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show .c-form__icon_select, .hogar-servicios-index .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show .c-form__icon_select, .hogar-datos-index .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show .c-form__icon_select, .hogar-agendar-index .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show .c-form__icon_select, .hogar-contrato-index .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show .c-form__icon_select, .movistartotal-pospago-index .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show .c-form__icon_select, .movistartotal-contrato-index .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show .c-form__icon_select { -webkit-transform: rotate(0deg) !important; -ms-transform: rotate(0deg) !important; transform: rotate(0deg) !important; } .hogar-cobertura-index #checkout-summary > .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-servicios-index #checkout-summary > .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-datos-index #checkout-summary > .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-agendar-index #checkout-summary > .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .hogar-contrato-index #checkout-summary > .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .movistartotal-pospago-index #checkout-summary > .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal, .movistartotal-contrato-index #checkout-summary > .c-card-summary.c-card-summary_space-bottom.js-target-summary.movistarTotal { position: fixed; top: 100%; left: 50%; -webkit-transform: translate(-50%, -110%); -ms-transform: translate(-50%, -110%); transform: translate(-50%, -110%); width: 100%; z-index: 99; box-shadow: 0px 0px 100px #00000029; border-radius: 15px 15px 0 0; } } .hogar-cobertura-index .contentMovistarTotal, .hogar-servicios-index .contentMovistarTotal, .hogar-datos-index .contentMovistarTotal, .hogar-agendar-index .contentMovistarTotal, .hogar-contrato-index .contentMovistarTotal, .movistartotal-pospago-index .contentMovistarTotal, .movistartotal-contrato-index .contentMovistarTotal { display: flex; align-items: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 5px; /* 9 */ margin-bottom: 0.3125rem; /* 9 */ } .hogar-cobertura-index .titlePopUpMovistarTotal, .hogar-servicios-index .titlePopUpMovistarTotal, .hogar-datos-index .titlePopUpMovistarTotal, .hogar-agendar-index .titlePopUpMovistarTotal, .hogar-contrato-index .titlePopUpMovistarTotal, .movistartotal-pospago-index .titlePopUpMovistarTotal, .movistartotal-contrato-index .titlePopUpMovistarTotal { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 28px; /* 9 */ font-size: 1.75rem; /* 9 */ line-height: normal; color: #0B2739; } @media only screen and (max-width: 741px) { .hogar-cobertura-index .titlePopUpMovistarTotal, .hogar-servicios-index .titlePopUpMovistarTotal, .hogar-datos-index .titlePopUpMovistarTotal, .hogar-agendar-index .titlePopUpMovistarTotal, .hogar-contrato-index .titlePopUpMovistarTotal, .movistartotal-pospago-index .titlePopUpMovistarTotal, .movistartotal-contrato-index .titlePopUpMovistarTotal { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ } } .hogar-cobertura-index .subtitlePopUpMovistarTotal p, .hogar-servicios-index .subtitlePopUpMovistarTotal p, .hogar-datos-index .subtitlePopUpMovistarTotal p, .hogar-agendar-index .subtitlePopUpMovistarTotal p, .hogar-contrato-index .subtitlePopUpMovistarTotal p, .movistartotal-pospago-index .subtitlePopUpMovistarTotal p, .movistartotal-contrato-index .subtitlePopUpMovistarTotal p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: #313235; } @media only screen and (max-width: 741px) { .hogar-cobertura-index .subtitlePopUpMovistarTotal p, .hogar-servicios-index .subtitlePopUpMovistarTotal p, .hogar-datos-index .subtitlePopUpMovistarTotal p, .hogar-agendar-index .subtitlePopUpMovistarTotal p, .hogar-contrato-index .subtitlePopUpMovistarTotal p, .movistartotal-pospago-index .subtitlePopUpMovistarTotal p, .movistartotal-contrato-index .subtitlePopUpMovistarTotal p { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } .hogar-cobertura-index .contentStepsPopUpMovistarTotal, .hogar-servicios-index .contentStepsPopUpMovistarTotal, .hogar-datos-index .contentStepsPopUpMovistarTotal, .hogar-agendar-index .contentStepsPopUpMovistarTotal, .hogar-contrato-index .contentStepsPopUpMovistarTotal, .movistartotal-pospago-index .contentStepsPopUpMovistarTotal, .movistartotal-contrato-index .contentStepsPopUpMovistarTotal { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ color: #313235; } @media only screen and (max-width: 741px) { .hogar-cobertura-index .contentStepsPopUpMovistarTotal, .hogar-servicios-index .contentStepsPopUpMovistarTotal, .hogar-datos-index .contentStepsPopUpMovistarTotal, .hogar-agendar-index .contentStepsPopUpMovistarTotal, .hogar-contrato-index .contentStepsPopUpMovistarTotal, .movistartotal-pospago-index .contentStepsPopUpMovistarTotal, .movistartotal-contrato-index .contentStepsPopUpMovistarTotal { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 14px; /* 9 */ font-size: 0.875rem; /* 9 */ } } .hogar-cobertura-index .c-callout_white::before, .hogar-servicios-index .c-callout_white::before, .hogar-datos-index .c-callout_white::before, .hogar-agendar-index .c-callout_white::before, .hogar-contrato-index .c-callout_white::before, .movistartotal-pospago-index .c-callout_white::before, .movistartotal-contrato-index .c-callout_white::before { color: #019DF4 !important; } .hogar-cobertura-index .c-callout_sm, .hogar-servicios-index .c-callout_sm, .hogar-datos-index .c-callout_sm, .hogar-agendar-index .c-callout_sm, .hogar-contrato-index .c-callout_sm, .movistartotal-pospago-index .c-callout_sm, .movistartotal-contrato-index .c-callout_sm { align-items: center !important; } .hogar-cobertura-index .c-form__header-flex h2#title, .hogar-servicios-index .c-form__header-flex h2#title, .hogar-datos-index .c-form__header-flex h2#title, .hogar-agendar-index .c-form__header-flex h2#title, .hogar-contrato-index .c-form__header-flex h2#title, .movistartotal-pospago-index .c-form__header-flex h2#title, .movistartotal-contrato-index .c-form__header-flex h2#title { white-space: normal !important; word-break: break-word; overflow-wrap: break-word; max-width: 500px; text-align: left; } .hogar-cobertura-index .c-card-checkout-cta.movistarTotal, .hogar-datos-index .c-card-checkout-cta.movistarTotal, .hogar-agendar-index .c-card-checkout-cta.movistarTotal, .hogar-contrato-index .c-card-checkout-cta.movistarTotal { order: 1; justify-content: center; } .hogar-cobertura-index .c-card-checkout-cta.movistarTotal .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show, .hogar-datos-index .c-card-checkout-cta.movistarTotal .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show, .hogar-agendar-index .c-card-checkout-cta.movistarTotal .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show, .hogar-contrato-index .c-card-checkout-cta.movistarTotal .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 2px; /* 9 */ margin-bottom: 0.125rem; /* 9 */ } .hogar-servicios-index .c-card-checkout-cta.movistarTotal { order: 4; justify-content: center; } @media only screen and (max-width: 1023px) { .hogar-servicios-index .c-card-checkout-cta.movistarTotal { order: 1; } } .hogar-servicios-index .c-card-checkout-cta.movistarTotal .c-card-checkout-cta__btn.js-summary-btn.movistarTotal.is-summary-show { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 2px; /* 9 */ margin-bottom: 0.125rem; /* 9 */ } .portabilidadmovistar-portabilidad-identidad .c-card-summary__amount, .portabilidadmovistar-portabilidad-sim .c-card-summary__amount, .portabilidadmovistar-portabilidad-contrato .c-card-summary__amount { 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; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ color: #313235; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__amount h4, .portabilidadmovistar-portabilidad-sim .c-card-summary__amount h4, .portabilidadmovistar-portabilidad-contrato .c-card-summary__amount h4 { margin-right: 0; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-right: 8px; /* 9 */ margin-right: 0.5rem; /* 9 */ } .portabilidadmovistar-portabilidad-identidad .c-card-summary__amount h4.mark.title, .portabilidadmovistar-portabilidad-sim .c-card-summary__amount h4.mark.title, .portabilidadmovistar-portabilidad-contrato .c-card-summary__amount h4.mark.title { font-size: 22px !important; line-height: 24px; font-weight: 400; margin-bottom: 10px !important; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__amount h4.mark.subtitle, .portabilidadmovistar-portabilidad-sim .c-card-summary__amount h4.mark.subtitle, .portabilidadmovistar-portabilidad-contrato .c-card-summary__amount h4.mark.subtitle { font-weight: 400; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__amount small, .portabilidadmovistar-portabilidad-sim .c-card-summary__amount small, .portabilidadmovistar-portabilidad-contrato .c-card-summary__amount small { padding: 3px 5px; border-radius: 6px; background: #EDEDED; color: #606060; font-size: 12px; line-height: 15px; font-weight: 600; text-align: center; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__amount.c-card-summary__total, .portabilidadmovistar-portabilidad-sim .c-card-summary__amount.c-card-summary__total, .portabilidadmovistar-portabilidad-contrato .c-card-summary__amount.c-card-summary__total { color: #019DF4 !important; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__details, .portabilidadmovistar-portabilidad-sim .c-card-summary__details, .portabilidadmovistar-portabilidad-contrato .c-card-summary__details { padding-bottom: 13px; list-style: disc; padding-left: 10px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__details .li-details, .portabilidadmovistar-portabilidad-sim .c-card-summary__details .li-details, .portabilidadmovistar-portabilidad-contrato .c-card-summary__details .li-details { max-width: 100%; font-style: normal; font-weight: normal; font-size: 11px; line-height: 15px; color: #313235; text-align: left; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__free-shipping, .portabilidadmovistar-portabilidad-sim .c-card-summary__free-shipping, .portabilidadmovistar-portabilidad-contrato .c-card-summary__free-shipping { border-bottom: 1px solid #D3D4D3; padding-bottom: 20px; display: flex; justify-content: space-between; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__details-customer, .portabilidadmovistar-portabilidad-sim .c-card-summary__details-customer, .portabilidadmovistar-portabilidad-contrato .c-card-summary__details-customer { padding-bottom: 21px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__details-customer .title__details-customer, .portabilidadmovistar-portabilidad-sim .c-card-summary__details-customer .title__details-customer, .portabilidadmovistar-portabilidad-contrato .c-card-summary__details-customer .title__details-customer { font-size: 22px; margin: 12px 0; color: #313235; font-weight: 400; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__details-customer .details-customer-summary, .portabilidadmovistar-portabilidad-sim .c-card-summary__details-customer .details-customer-summary, .portabilidadmovistar-portabilidad-contrato .c-card-summary__details-customer .details-customer-summary { display: flex; font-size: 14px; justify-content: space-between; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__address-detail, .portabilidadmovistar-portabilidad-sim .c-card-summary__address-detail, .portabilidadmovistar-portabilidad-contrato .c-card-summary__address-detail { padding: 21px 0; border-bottom: 1px solid #D3D4D3; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__address-detail .c-card-summary__title-content, .portabilidadmovistar-portabilidad-sim .c-card-summary__address-detail .c-card-summary__title-content, .portabilidadmovistar-portabilidad-contrato .c-card-summary__address-detail .c-card-summary__title-content { display: flex; justify-content: space-between; margin-bottom: 9px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__address-detail .c-card-summary__title-content .mark, .portabilidadmovistar-portabilidad-sim .c-card-summary__address-detail .c-card-summary__title-content .mark, .portabilidadmovistar-portabilidad-contrato .c-card-summary__address-detail .c-card-summary__title-content .mark { font-style: normal; font-weight: 400; font-size: 13px; line-height: 21px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__address-detail .c-card-summary__content, .portabilidadmovistar-portabilidad-sim .c-card-summary__address-detail .c-card-summary__content, .portabilidadmovistar-portabilidad-contrato .c-card-summary__address-detail .c-card-summary__content { display: flex; justify-content: flex-start; width: 284px; gap: 18px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__address-detail .c-card-summary__content li, .portabilidadmovistar-portabilidad-sim .c-card-summary__address-detail .c-card-summary__content li, .portabilidadmovistar-portabilidad-contrato .c-card-summary__address-detail .c-card-summary__content li { list-style: none; font-style: normal; font-weight: 700; font-size: 9.275px; line-height: 13px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__address-detail .c-card-summary__content .direction, .portabilidadmovistar-portabilidad-sim .c-card-summary__address-detail .c-card-summary__content .direction, .portabilidadmovistar-portabilidad-contrato .c-card-summary__address-detail .c-card-summary__content .direction { width: 97px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary, .portabilidadmovistar-portabilidad-sim .c-card-summary, .portabilidadmovistar-portabilidad-contrato .c-card-summary { border: 1px solid #D3D4D3; } .portabilidadmovistar-portabilidad-identidad .c-card-summary .c-card-summary__box, .portabilidadmovistar-portabilidad-sim .c-card-summary .c-card-summary__box, .portabilidadmovistar-portabilidad-contrato .c-card-summary .c-card-summary__box { border-bottom: none; padding-bottom: 0; } @media screen and (max-width: 739px) { .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-sim .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-identidad .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-confronta .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-contrato .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-sim .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-identidad .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-confronta .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-contrato .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-sim .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-identidad .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-confronta .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-contrato .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn { background-color: #0B2739; color: #fff; flex-direction: row; font-size: 4.5vw; } .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-sim .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-identidad .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-confronta .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-contrato .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-sim .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-identidad .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-confronta .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-contrato .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-sim .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-identidad .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-confronta .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-contrato .c-card-checkout-cta__btn-plan, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-plan { font-weight: bold; } .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-sim .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-identidad .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-confronta .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-contrato .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-sim .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-identidad .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-confronta .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-contrato .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-sim .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-identidad .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-confronta .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-contrato .c-card-checkout-cta__btn-img img, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn-img img { width: 25vw; } .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-sim .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-identidad .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-confronta .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-contrato .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-identidad .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-sim .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-identidad .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-confronta .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-contrato .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-sim .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-sim .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-identidad .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-confronta .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-contrato .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-contrato .pospago-portabilidad-thankyoupage .c-card-checkout-cta__btn .i-chevron-down { color: #019DF4; } } .portabilidadmovistar-portabilidad-identidad .c-card-summary__amount_before, .portabilidadmovistar-portabilidad-sim .c-card-summary__amount_before, .portabilidadmovistar-portabilidad-contrato .c-card-summary__amount_before { font-weight: 400; font-size: 14px; color: #50535A; margin-bottom: 15px; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__title_border, .portabilidadmovistar-portabilidad-sim .c-card-summary__title_border, .portabilidadmovistar-portabilidad-contrato .c-card-summary__title_border { padding-bottom: 10px !important; } .portabilidadmovistar-portabilidad-identidad .c-card-summary__title, .portabilidadmovistar-portabilidad-sim .c-card-summary__title, .portabilidadmovistar-portabilidad-contrato .c-card-summary__title { margin-bottom: 18px !important; } .portabilidadmovistar-portabilidad-identidad .iconSummary, .portabilidadmovistar-portabilidad-sim .iconSummary, .portabilidadmovistar-portabilidad-contrato .iconSummary { width: 40px; height: 40px; } .portabilidadmovistar-portabilidad-identidad #checkout-summary ul, .portabilidadmovistar-portabilidad-sim #checkout-summary ul, .portabilidadmovistar-portabilidad-contrato #checkout-summary ul { list-style: none; } .portabilidadmovistar-portabilidad-identidad #checkout-summary ul li, .portabilidadmovistar-portabilidad-sim #checkout-summary ul li, .portabilidadmovistar-portabilidad-contrato #checkout-summary ul li { padding-left: 30px; background: url(../images/modals/modal-icon-check.png) no-repeat left center; background-size: 15px; margin-bottom: 10px; } @media screen and (min-width: 1023px) { .portabilidadmovistar-portabilidad-identidad .c-card-summary, .portabilidadmovistar-portabilidad-sim .c-card-summary, .portabilidadmovistar-portabilidad-contrato .c-card-summary { padding: 1rem 1.5rem !important; } .portabilidadmovistar-portabilidad-identidad #checkout-summary, .portabilidadmovistar-portabilidad-sim #checkout-summary, .portabilidadmovistar-portabilidad-contrato #checkout-summary { margin-top: 40px; } } @media screen and (max-width: 1023px) { .portabilidadmovistar-portabilidad-identidad .c-card-checkout-cta, .portabilidadmovistar-portabilidad-sim .c-card-checkout-cta, .portabilidadmovistar-portabilidad-contrato .c-card-checkout-cta { justify-content: center !important; margin: 10px auto 0; } .portabilidadmovistar-portabilidad-identidad .c-card-checkout-cta .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-sim .c-card-checkout-cta .c-card-checkout-cta__btn, .portabilidadmovistar-portabilidad-contrato .c-card-checkout-cta .c-card-checkout-cta__btn { background-color: #0B2739; color: #fff; } .portabilidadmovistar-portabilidad-identidad .c-card-checkout-cta .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-sim .c-card-checkout-cta .c-card-checkout-cta__btn .i-chevron-down, .portabilidadmovistar-portabilidad-contrato .c-card-checkout-cta .c-card-checkout-cta__btn .i-chevron-down { color: #019DF4; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); transition: transform 0.3s ease; } .portabilidadmovistar-portabilidad-identidad .c-card-summary.is-summary-show, .portabilidadmovistar-portabilidad-sim .c-card-summary.is-summary-show, .portabilidadmovistar-portabilidad-contrato .c-card-summary.is-summary-show { padding: 1rem 1.5rem !important; } .portabilidadmovistar-portabilidad-identidad .c-card-checkout-cta__btn.js-summary-btn.is-summary-show .i-chevron-down, .portabilidadmovistar-portabilidad-sim .c-card-checkout-cta__btn.js-summary-btn.is-summary-show .i-chevron-down, .portabilidadmovistar-portabilidad-contrato .c-card-checkout-cta__btn.js-summary-btn.is-summary-show .i-chevron-down { -webkit-transform: rotate(180deg) !important; -ms-transform: rotate(180deg) !important; transform: rotate(180deg) !important; } .portabilidadmovistar-portabilidad-identidad .pagebuilder-column.contentIconSummary, .portabilidadmovistar-portabilidad-sim .pagebuilder-column.contentIconSummary, .portabilidadmovistar-portabilidad-contrato .pagebuilder-column.contentIconSummary { flex-basis: 45px; } } .portabilidadmovistar-portabilidad-identidad .o-section { margin-top: 0px !important; } .portabilidadmovistar-portabilidad-identidad .pospago__space-progress-circle { font-size: 32px; font-weight: 400; line-height: 40px; margin-bottom: 0.2rem; } @media screen and (max-width: 768px) { .portabilidadmovistar-portabilidad-identidad .pospago__space-progress-circle { font-size: 28px; } } .portabilidadmovistar-portabilidad-identidad .c_form_title { font-weight: 400; } .portabilidadmovistar-portabilidad-identidad .c_form_subtitle { font-weight: 400; line-height: 24px; font-size: 18px; color: #737578; } .portabilidadmovistar-portabilidad-identidad .c-form__header-flex { justify-content: end; width: 20%; } .portabilidadmovistar-portabilidad-identidad label.c-form__radio-button-label-sim { display: flex; gap: 6px; align-items: anchor-center; } .portabilidadmovistar-portabilidad-identidad .img_type_sim { width: 40px; } .portabilidadmovistar-portabilidad-identidad span.sp-tratamiento-datos, .portabilidadmovistar-portabilidad-identidad .colorPrimary { color: #019df4; } .portabilidadmovistar-portabilidad-identidad #tratamiento { width: 20px; } .portabilidadmovistar-portabilidad-identidad .c-radio-sim.is-field-check { border: 2px solid #019bef; background-color: #E6F5FD; } .portabilidadmovistar-portabilidad-identidad .c-form__btn { width: 187px; height: 48px; } @media (max-width: 768px) { .portabilidadmovistar-portabilidad-identidad .c-form__box.u-width-100.c-radio-sim.c-form__field.u-maxwidth-50 { max-width: 100%; } .portabilidadmovistar-portabilidad-identidad .c-form__actions_right { width: 100%; } .portabilidadmovistar-portabilidad-identidad #btnContinuar { max-width: 100%; width: 100%; } .portabilidadmovistar-portabilidad-identidad .c-form__fieldset .c-form__field-canvas { flex-direction: column-reverse; } } .portabilidadmovistar-portabilidad-identidad #modal-compatibilidad-esim .titleModalCompatibilidaeSIM { font-weight: 400; line-height: normal; } @media screen and (max-width: 739px) { .portabilidadmovistar-portabilidad-identidad #modal-compatibilidad-esim .titleModalCompatibilidaeSIM { margin-bottom: 0; } .portabilidadmovistar-portabilidad-identidad #modal-compatibilidad-esim .titleModalCompatibilidaeSIM p > span { font-size: 24px !important; } } .portabilidadmovistar-portabilidad-identidad #modal-nip .o-message__title { color: #313235; } .portabilidadmovistar-portabilidad-identidad #modal-nip .txt-nip { color: #0B2739; } .portabilidadmovistar-portabilidad-identidad #errors-modal-gen h3#h3-information.isGreen { color: #5CB615 !important; } .portabilidadmovistar-portabilidad-identidad #errors-modal-gen .o-btn.isGreen { background-color: #5CB615; } .portabilidadmovistar-portabilidad-identidad .nip-tooltip-esim { position: absolute; background-color: #fff; color: #313235; padding: 20px; text-align: left; border-radius: 10px; width: 300px; height: 210px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); font-size: 13px !important; z-index: 9999; top: 40%; left: 1%; } @media (max-width: 768px) { .portabilidadmovistar-portabilidad-identidad .nip-tooltip-esim p { font-size: 8px !important; } } .portabilidadmovistar-portabilidad-identidad .nip-tooltip-esim .tooltip-arrow-esim { left: 30%; border-top: 10px solid #fff; } @media (max-width: 768px) { .portabilidadmovistar-portabilidad-identidad .nip-tooltip-esim { padding: 10px; font-size: 12px !important; width: 206px; height: 126px; text-align: center; z-index: 9999; top: 53%; } } .portabilidadmovistar-portabilidad-identidad #section-esim h2 { color: #313235; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega { background: #FFFFFF; border-radius: 6px; padding: 20px; margin-bottom: 20px; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega h2 { margin-bottom: 15px !important; color: #313235; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega h2.title-2 { text-align: center; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 26px; /* 9 */ font-size: 1.625rem; /* 9 */ margin-bottom: 0 !important; } @media screen and (max-width: 739px) { .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega h2.title-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .subtitle-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-bottom: 8px; /* 9 */ margin-bottom: 0.5rem; /* 9 */ text-align: left; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 16px; /* 9 */ font-size: 1rem; /* 9 */ } @media screen and (max-width: 739px) { .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .subtitle-2 { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 12px; /* 9 */ font-size: 0.75rem; /* 9 */ } } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .c-form__field-canvas { margin-bottom: 0; } @media screen and (max-width: 739px) { .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .c-form__field-canvas { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .c-form__radio-button-label { grid-template-columns: 5px auto !important; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .c-form__field-canvas.selectEntregar { column-gap: 0; margin-top: 20px !important; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .c-form__field-canvas.selectEntregar .c-form__field { padding: 12px !important; color: #019DF4; border: none; width: 0; margin-right: 10px; margin-left: -5px; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .c-form__field-canvas.selectEntregar .c-form__icon::before { padding-right: 0; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-entrega .infoEntregar { font-weight: 400; font-size: 14px; line-height: 20px; } .portabilidadmovistar-portabilidad-identidad #section-esim .txtDelivery { margin-top: 15px; margin-left: 6%; } .portabilidadmovistar-portabilidad-identidad #section-esim .datesMonth { margin-bottom: 15px; font-size: 20px; } .portabilidadmovistar-portabilidad-identidad #section-esim table th, .portabilidadmovistar-portabilidad-identidad #section-esim table td { text-align: center; } .portabilidadmovistar-portabilidad-identidad #section-esim .pagination li:hover { cursor: pointer; } .portabilidadmovistar-portabilidad-identidad #section-esim table tbody tr { display: none; } .portabilidadmovistar-portabilidad-identidad #section-esim table tbody tr td:not(.line) { cursor: pointer; } .portabilidadmovistar-portabilidad-identidad #section-esim ul.pagination { list-style-type: none; } .portabilidadmovistar-portabilidad-identidad #section-esim ul.pagination li { color: #019DF4; margin-top: 45px; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-form__field-canvas.fechas { column-gap: 0.5rem; } .portabilidadmovistar-portabilidad-identidad #section-esim .txtND { margin-right: 6%; } .portabilidadmovistar-portabilidad-identidad #section-esim #days-table .line, .portabilidadmovistar-portabilidad-identidad #section-esim #days-window .line { background-image: linear-gradient(to top left, #F5F5F5 48%, #C4C4C4, #F5F5F5 52%); } .portabilidadmovistar-portabilidad-identidad #section-esim #days-table .dateSelected, .portabilidadmovistar-portabilidad-identidad #section-esim #days-window .dateSelected { background-color: #0B2739; color: #fff; } .portabilidadmovistar-portabilidad-identidad #section-esim #days-table .firstElement, .portabilidadmovistar-portabilidad-identidad #section-esim #days-window .firstElement { border-radius: 8px 0px 0 8px; } .portabilidadmovistar-portabilidad-identidad #section-esim #days-table .lastElement, .portabilidadmovistar-portabilidad-identidad #section-esim #days-window .lastElement { border-radius: 0px 8px 8px 0; } .portabilidadmovistar-portabilidad-identidad #section-esim #days-table th, .portabilidadmovistar-portabilidad-identidad #section-esim #days-window th { padding-bottom: 10px; } .portabilidadmovistar-portabilidad-identidad #section-esim #days-table tbody, .portabilidadmovistar-portabilidad-identidad #section-esim #days-window tbody { border-collapse: collapse; border-radius: 8px; border-style: hidden; /* hide standard table (collapsed) border */ box-shadow: 0 0 0 1px #D4D4D4; /* this draws the table border */ } .portabilidadmovistar-portabilidad-identidad #section-esim #days-table tbody td, .portabilidadmovistar-portabilidad-identidad #section-esim #days-window tbody td { padding: 10px; color: #AFB1B3; border: 1px solid #D4D4D4; } .portabilidadmovistar-portabilidad-identidad #section-esim .c-form__field-canvas.concatDir .c-form__field { padding: 5px 12px; } .portabilidadmovistar-portabilidad-identidad div#modal-nip { padding: 0px; } .portabilidadmovistar-portabilidad-identidad div#modal-nip h2 { font-size: 36px; line-height: 48px; font-weight: 300; } .portabilidadmovistar-portabilidad-identidad div#modal-nip .center.txt-nip { max-width: 80%; padding-left: 20%; } span.sp-tratamiento-datos { cursor: pointer; color: #019df4; } .dataAddress { font-size: 18px; color: #313235; font-weight: 600; text-align: left; background-color: #E6F5FD; padding: 8px 16px; border-radius: 8px; margin-bottom: 24px; } .sim_title { font-size: 32px; font-weight: 400; line-height: 40px; } .type_sim_title { font-size: 18px; font-weight: 400; line-height: 24px; } .type_sim_desc { font-size: 16px; font-weight: 400; line-height: 24px; min-height: 48px; } .color1 { color: #313235; } .color2 { color: #737578; } .colorPrimary { color: #019df4; } .u-width-80 { width: 80%; } .u-maxwidth-50 { max-width: 50%; } /* Modal Tratamiento de datos */ .modal-tratamiento .modal-inner-wrap { margin-top: 2% !important; } @media (max-width: 768px) { .modal-tratamiento .modal-inner-wrap { margin-top: 10% !important; } } .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago { overflow-y: auto; } .modal-tratamiento .modal-inner-wrap #tratamiento-datos-pospago .o-modal__footer { text-align: center; } .header-tratamiento-datos { text-align: center; } .header-tratamiento-datos p { width: 70%; margin-left: auto; margin-right: auto; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 22px; /* 9 */ font-size: 1.375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 10px; /* 9 */ margin-top: 0.625rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 26px; /* 9 */ line-height: 1.625rem; /* 9 */ color: #019DF4; } @media (max-width: 768px) { .header-tratamiento-datos p { width: 90%; /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ font-size: 18px; /* 9 */ font-size: 1.125rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 15px; /* 9 */ margin-top: 0.9375rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ line-height: 25px; /* 9 */ line-height: 1.5625rem; /* 9 */ } } section.eventNone { opacity: 0.6; } .portabilidadmovistar-portabilidad-identidad .header-pos-steps .pos-steps-container__list .pos-step::before, .portabilidadmovistar-portabilidad-sim .header-pos-steps .pos-steps-container__list .pos-step::before, .portabilidadmovistar-portabilidad-contrato .header-pos-steps .pos-steps-container__list .pos-step::before { background-color: #fff; color: #6B6C6F; border: 1.5px solid #6B6C6F; } .portabilidadmovistar-portabilidad-identidad .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-sim .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-contrato .header-pos-steps .pos-steps-container__list .pos-step.current-step::before { background-color: #019DF4; color: #fff !important; border: 1px solid #019DF4; } @media screen and (min-width: 740px) { .portabilidadmovistar-portabilidad-identidad .o-list-steps__step, .portabilidadmovistar-portabilidad-sim .o-list-steps__step, .portabilidadmovistar-portabilidad-contrato .o-list-steps__step { max-width: 5.875rem; } .portabilidadmovistar-portabilidad-identidad .o-list-steps__step::after, .portabilidadmovistar-portabilidad-sim .o-list-steps__step::after, .portabilidadmovistar-portabilidad-contrato .o-list-steps__step::after { top: -20px; } } @media screen and (max-width: 739px) { .portabilidadmovistar-portabilidad-identidad .f-c-header-step__content, .portabilidadmovistar-portabilidad-sim .f-c-header-step__content, .portabilidadmovistar-portabilidad-contrato .f-c-header-step__content { margin-top: 1.5rem; } .portabilidadmovistar-portabilidad-identidad .header-pos-steps .pos-steps-container__list .pos-step::before, .portabilidadmovistar-portabilidad-sim .header-pos-steps .pos-steps-container__list .pos-step::before, .portabilidadmovistar-portabilidad-contrato .header-pos-steps .pos-steps-container__list .pos-step::before { background-color: transparent; color: #6B6C6F; border: 0px solid transparent; } .portabilidadmovistar-portabilidad-identidad .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-sim .header-pos-steps .pos-steps-container__list .pos-step.current-step::before, .portabilidadmovistar-portabilidad-contrato .header-pos-steps .pos-steps-container__list .pos-step.current-step::before { background-color: transparent; color: #019DF4; border: 0px solid transparent; } .portabilidadmovistar-portabilidad-identidad .header-pos-steps .pos-steps-container__list .pos-step .pos-step__title, .portabilidadmovistar-portabilidad-sim .header-pos-steps .pos-steps-container__list .pos-step .pos-step__title, .portabilidadmovistar-portabilidad-contrato .header-pos-steps .pos-steps-container__list .pos-step .pos-step__title { display: none; } } .portabilidadmovistar-portabilidad-contrato .o-section { margin-top: 0px !important; } .portabilidadmovistar-portabilidad-contrato .c_form_title { font-weight: 400 !important; } .portabilidadmovistar-portabilidad-contrato .c_form_subtitle { font-weight: 400; line-height: 24px; font-size: 18px; color: #737578; } .portabilidadmovistar-portabilidad-contrato .pos-con-container__contract { justify-content: flex-start; width: auto !important; column-gap: 10px; margin-bottom: 30px; } .portabilidadmovistar-portabilidad-contrato .c-form__btn { width: 187px; height: 48px; } .portabilidadmovistar-portabilidad-thankyoupage #thank-you-page { width: 90%; max-width: 1141px; margin: 0 auto; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage #thank-you-page { width: 90%; } } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content_title .pagebuilder-column-line { display: block !important; margin-bottom: 15px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_title .pagebuilder-column-line .pagebuilder-column { width: 100% !important; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content_head { display: flex; align-items: center; justify-content: space-around; background-color: #E6F5FD; padding: 10px; border-radius: 8px; margin: auto; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content_head { flex-direction: column; align-items: flex-start; padding: 15px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_head .card_info_section:nth-child(2) { margin-top: 20px; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content_head .card_info_section { display: flex; flex-direction: row; align-items: center; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_head .card_info_section span { color: #019DF4; font-size: 35px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_head .card_info_section .card_info_text { text-align: left; margin-left: 20px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_head .card_info_section .card_info_text h4 { margin: 0; font-size: 18px; color: #50535A; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_head .card_info_section .card_info_text p { margin: 5px 0 0; font-size: 16px; color: #50535A; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content_head .card_info_section .card_info_text h4 { font-size: 15px; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount { display: flex; justify-content: space-between; background-color: #fff; border-radius: 8px; padding: 10px; border: 1px solid #DDDDDD; margin: 15px 0; flex-wrap: nowrap; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .icon-container { margin: 10px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .icon-container img { max-width: 100%; height: auto; display: block; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .text-container { margin: 0 10px; text-align: left; font-size: 14px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .text-container p { margin-top: 0; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .text-container p:first-of-type { font-weight: bold; color: #313235; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .text-container p:last-of-type { color: #6B6C6F; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .text-container a { color: #019DF4; text-decoration: none; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .c-form__btn { width: 26%; height: 48px; font-size: 12px; align-self: center; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount { flex-wrap: wrap; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .icon-container { flex: 1 1 1%; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .text-container { flex: 1 1 45%; } .portabilidadmovistar-portabilidad-thankyoupage .card_content_discount .c-form__btn { width: 100%; max-width: 100%; margin-top: 15px; flex: 1 1 100%; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content { display: flex; flex-direction: row; justify-content: center; margin-top: 30px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne { width: 50%; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card_content_contrato { display: flex; flex-direction: row; justify-content: center; background-color: #fff; border-radius: 8px; padding: 15px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card_content_contrato .icon-container-contrato { margin-right: 20px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen { margin: 35px 0; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen { background-color: #fff; border-radius: 8px; padding: 15px; margin-bottom: 15px; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section { display: flex; justify-content: start; align-items: center; font-size: 18px; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section { font-size: 16px !important; display: block; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section .card-content-resumen-texto { color: #313235; font-weight: 700; width: 40%; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section .card-content-resumen-texto { width: 100%; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section .card-content-resumen-value { width: 60%; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section .card-content-resumen-value { width: 100%; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section .card-content-resumen-value.cardSmall { display: flex; flex-direction: row; justify-content: space-between; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-section .card-content-resumen-value.cardSmall .cardSmall_content { background-color: #019DF426; border-radius: 6px; color: #0B2739; font-size: 14px; padding: 5px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne .card-content-resumen .card-content-resumen-title-recogerTienda { margin-bottom: 16px; color: #313235; font-size: 18px; font-weight: 700; padding: 5px 0; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo { width: 40%; margin-left: 5%; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo { margin-left: 0%; } } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps { background-color: #fff; border-radius: 8px; padding: 30px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-total { display: flex; justify-content: space-between; font-size: 16px; color: #424B5A; font-weight: 700; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-alert { display: flex; align-items: flex-start; margin-bottom: 20px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-alert img { margin-right: 15px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-info { display: flex; align-items: flex-start; margin-bottom: 20px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-info .card-content-info-text p:first-child { font-weight: 700; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-info .card-content-info-img { margin-right: 15px; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-apps { display: flex; justify-content: space-between; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo .card-content-resumen-apps .card-content-apps img { max-width: 45%; } } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card_content { flex-direction: column; } .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contentOne, .portabilidadmovistar-portabilidad-thankyoupage .card_content .card_contenttwo { width: 100%; } } .portabilidadmovistar-portabilidad-thankyoupage .card-content-border { border-bottom: 1px solid #D8D8D8; margin: 15px 0; } @media screen and (max-width: 767px) { .portabilidadmovistar-portabilidad-thankyoupage .card-content-border { padding: 0px 15px; } } .portabilidadmovistar-portabilidad-thankyoupage #modal-typ-esim .titleModaltypeSIM { font-weight: 400; line-height: normal; } @media screen and (max-width: 739px) { .portabilidadmovistar-portabilidad-thankyoupage #modal-typ-esim .titleModaltypeSIM { margin-bottom: 10px; } .portabilidadmovistar-portabilidad-thankyoupage #modal-typ-esim .titleModaltypeSIM p > span { font-size: 24px !important; } } .portabilidadmovistar-portabilidad-thankyoupage .hidden { display: none !important; } .modal-information.unificacionPorta .o-modal__header { text-align: center; } .modal-information.unificacionPorta .img-logo { /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ width: 48px; /* 9 */ width: 3rem; /* 9 */ /* 3 */ /* 3 */ /* 6 determina las unidades (px o rem)*/ /* 6 retorna el valor numérico*/ /* 7 */ margin-top: 32px; /* 9 */ margin-top: 2rem; /* 9 */ } .modal-information.unificacionPorta .i-information { color: red; text-align: center; font-size: 50px; } .modal-information.unificacionPorta .i-information span { display: none; } .modal-information.unificacionPorta .message-principal { font-size: 32px; font-weight: 400; color: #0b2739; text-align: center; line-height: 40px; } .modal-information.unificacionPorta .message-number { font-size: 16px; font-weight: 400; line-height: 24px; color: #50535a; margin-top: 20px; margin-bottom: 25px; } .modal-information.unificacionPorta p { font-size: 28px; line-height: 40px; text-align: center; color: #0b2739; } .modal-information.unificacionPorta .input-phone { margin: 0px auto; width: 304px; height: 52px; border: 1px solid #019df4; } @media (max-width: 600px) { .modal-information.unificacionPorta .input-phone { width: auto; } } .modal-information.unificacionPorta .titleInfo { font-family: Telefonica; font-size: 24px; font-weight: 300; line-height: 30px; letter-spacing: 0em; text-align: center; color: #019df4; } @media (max-width: 600px) { .modal-information.unificacionPorta .titleInfo { font-family: Telefonica; font-size: 20px; font-weight: 300; line-height: 27px; letter-spacing: 0em; text-align: center; color: #0b2739; } } .modal-information.unificacionPorta .subTitleInfo { font-family: Telefonica; font-size: 24px; font-weight: 300; line-height: 30px; letter-spacing: 0em; text-align: center; color: #019df4; } @media (max-width: 600px) { .modal-information.unificacionPorta .subTitleInfo { font-family: Telefonica; font-size: 16px; font-weight: 300; line-height: 21px; letter-spacing: 0em; text-align: center; color: #0b2739; } } .modal-information.unificacionPorta .link { text-decoration: underline; display: block; text-align: center; padding-left: 45%; padding-top: 2%; } .modal-information.unificacionPorta .close { text-align: right; padding-right: 2%; } .modal-information.unificacionPorta .container-terms { display: flex; justify-content: center; width: 66%; margin-left: 17%; margin-right: 17%; } @media (max-width: 600px) { .modal-information.unificacionPorta .container-terms { margin-left: 5%; margin-right: 5%; width: auto; } } .modal-information.unificacionPorta .terms-text { font-size: 14px; font-weight: 400; line-height: 20px; color: #50535a; text-align: left; } .modal-information.unificacionPorta .link-terms { text-decoration: underline; color: #019df4; } .modal-information.unificacionPorta .container-center { display: flex; justify-content: center; } .modal-information.unificacionPorta .text-information { font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; color: #50535a; width: 90%; margin: 0px auto; padding-top: 15px; } .modal-information.unificacionPorta .text-information .c-whatsapp span { font-weight: bold; color: #5CB615; text-decoration: underline; } .modal-information.unificacionPorta .o-modal__footer { margin-top: 10px !important; } .modal-information.unificacionPorta #btnCustomErrorModal .icon-left { padding-right: 8px; vertical-align: middle; } @media (max-width: 600px) { .modal-information.unificacionPorta .i-information { font-size: 30px; } .modal-information.unificacionPorta .message-principal { font-size: 20px; font-weight: 300; line-height: 26px; } .modal-information.unificacionPorta .message-number { font-size: 13px; line-height: 20px; font-weight: 400; } .modal-information.unificacionPorta .terms-text { font-size: 14px; line-height: 20px; font-weight: 400; } .modal-information.unificacionPorta p { font-size: 15px; line-height: 20px; } .modal-information.unificacionPorta footer.modal-footer { margin-top: -15px; z-index: -1; } } .portabilidadmovistar-portabilidad-sim .c-radio-sim { padding: 16px; background-color: white !important; } .portabilidadmovistar-portabilidad-sim .c-form__radio-button-label-sim { display: flex; } .portabilidadmovistar-portabilidad-sim .c-form__radio-button-label-sim .c-form__radio-button { margin-top: 5px; } .portabilidadmovistar-portabilidad-sim .c-form__field.icon { padding: 0; border: 0; width: 30px; } .portabilidadmovistar-portabilidad-sim .c-form__field.icon .c-form__icon::before { padding-right: 0px; margin-right: 5px; } .portabilidadmovistar-portabilidad-sim .c-callout__yellow { background-color: #FEF4E8; } .portabilidadmovistar-portabilidad-sim .select2-container--default .select2-selection--single { background-color: #fff; border: none; border-radius: 0; } .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field { padding: 4px 8px; } .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field span.select2.select2-container { margin-top: 24px; } .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field span.select2.select2-container span.select2-selection__rendered { margin-top: -10px; padding-left: 0px; } .portabilidadmovistar-portabilidad-sim .c-form__box .c-form__field .c-form__label.label { top: -25px; padding-left: 8px; } .portabilidadmovistar-portabilidad-sim .select2-container--open .select2-dropdown { left: 8px; } @media (max-width: 768px) { .portabilidadmovistar-portabilidad-sim .c-form__fieldset .c-form__field-canvas { flex-direction: column-reverse; } .portabilidadmovistar-portabilidad-sim div#boxBtn { width: 100%; } .portabilidadmovistar-portabilidad-sim .c-form__field-canvas.c-selectTitular { flex-direction: row; } .portabilidadmovistar-portabilidad-sim .c-form__field-canvas.c-selectTitular .c-radio-simTitular { width: 50%; max-width: 50%; } }