.eterfy-brand-fix {
    margin-top: 19.71vh;
}

.league-complete-main-container-fix {
    margin-top: 20.15vh;
}

.light {
    --toggle-sliders: #8F42E5;
    --celeste: #5199f7;
    --gris-claro: #707070;
    --button-grey: #2d3d50;
    --toogle-bg-pop-up-bg: #E6E7E8;
    --toggle-background: #262626;
    --popup-background: #262626;
    --background: white;
    --background-overlay: #000000CC;
    --error: #E5425B;
    --error-opacity: #4E161F;
    --correcto: #33CC3A;
    --white-button-hover: #B4D2FF;
    --white-button-pressed: #718095;
    --back-button-hover: #707070;
    --question-pressed: #5E2B97;
    --degradado-1: #CA36F4;
    --degradado-2: #802AC7;
    --degradado-3: #6DDAFB;
    --boton-inicio: #F;
    --color-texto-1: black;
    --color-text-button: white;
    --color-switch: white;
    --instruction-carrousel-container: #E6E7E8;
    --clock-text-color: white;
    -webkit-tap-highlight-color: transparent;
    --placeholder-claro: #00000060;
    --survey-pressed: #2D3D50;
    --menu-header-bar: #8F42E5;
}

/*TODO: toggle-sliders se usa en el header del menu, ameo por favor*/
.dark {
    --toggle-sliders: #8F42E5;
    --celeste: #5199f7;
    --gris-claro: #707070;
    --button-grey: #2d3d50;
    --toogle-bg-pop-up-bg: #262626;
    --toggle-background: #262626;
    --popup-background: #262626;
    --background: #000;
    --background-overlay: #000000CC;
    --error: #E5425B;
    --error-opacity: #4E161F;
    --correcto: #33CC3A;
    --white-button-hover: #B4D2FF;
    --white-button-pressed: #718095;
    --back-button-hover: #707070;
    --question-pressed: #5E2B97;
    --degradado-1: #CA36F4;
    --degradado-2: #802AC7;
    --degradado-3: #6DDAFB;
    --boton-inicio: #F;
    --color-texto-1: white;
    --color-text-button: white;
    --color-switch: white;
    --instruction-carrousel-container: #262626;
    --clock-text-color: white;
    -webkit-tap-highlight-color: transparent;
    --placeholder-claro: #ffffff60;
    --survey-pressed: #2D3D50;
    --menu-header-bar: #8F42E5;
}

.trivia_crack_v1{
    --background: #8B34F8;
    --screen-background: white;
    --toggle-sliders: #8F42E5;
    --celeste: #5199f7;
    --gris-claro: #707070;
    --button-grey: #121212;
    --toogle-bg-pop-up-bg: #E6E7E8;
    --toggle-background: #262626;
    --popup-background: #262626;
    --background-overlay: #000000CC;
    --error: #E5425B;
    --error-opacity: #4E161F;
    --correcto: #33CC3A;
    --white-button-hover: #303030;
    --white-button-pressed: #505050;
    --back-button-hover: #707070;
    --question-pressed: #2D3D50;
    --boton-inicio: #F;
    --color-texto-1: black;
    --color-text-button: white;
    --color-switch: black;
    --instruction-carrousel-container: #E6E7E8;
    --clock-text-color: white;
    -webkit-tap-highlight-color: transparent;
    --placeholder-claro: #00000060;
    --degradado-1: #CA36F4;
    --degradado-2: #802AC7;
    --survey-pressed: #8F42E5;
    --menu-header-bar: #8F42E5;
}

.naranja_x {
    --primary-1: #50007F;
    --primary-2: #FE4F02;
    --degradado-1-naranja: #50007F;
    --degradado-2-naranja: #50007F;
    --degradado-3-naranja: #FE5000;
    --degradado-1: #50007F;
    --degradado-2: #50007F;
    --degradado-3: #FE5000;
    --toggle-sliders: #50007F;
    --menu-header: #E8E8E8;
    --celeste: #5199f7;
    --gris-claro: #707070;
    --button-grey: #2d3d50;
    --toogle-bg-pop-up-bg: #E6E7E8;
    --toggle-background: #262626;
    --popup-background: #262626;
    --background: white;
    --background-overlay: #000000CC;
    --error: #E5425B;
    --error-opacity: #4E161F;
    --correcto: #33CC3A;
    --white-button-hover: #B4D2FF;
    --white-button-pressed: #718095;
    --back-button-hover: #707070;
    --question-pressed: #5E2B97;
    --boton-inicio: #4C2770;
    --color-texto-1: #333;
    --color-texto-2: white;
    --color-text-button: white;
    --color-switch: white;
    --instruction-carrousel-container: #D1D1D1;
    --clock-background: #E6E7E8;
    --clock-text-color: white;
    -webkit-tap-highlight-color: transparent;
    --placeholder-claro: #00000060;
    --survey-pressed: #2D3D50;
}

* {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-overflow-scrolling: auto;
}

html {
    height: 100%;
    width: 100%;
    overflow:hidden;
    position: fixed;
}

body {
    height: 100%;
    width: 100%;
    position: fixed;
    overflow: hidden;
    margin: 0;
}

button {
    outline: none;
    border: none;
}

input:-webkit-autofill,
input:-webkit-autofill:focus {
    color: var(--color-texto-1) !important;
    -webkit-transition: background-color 0s 600000s, color 0s 600000s;
    transition: background-color 0s 600000s, color 0s 600000s;
}

:-ms-input-placeholder {
    color: var(--color-texto-1);
    opacity: 1;
}

::placeholder {
    color: var(--color-texto-1);
    opacity: 1;
}

::-moz-placeholder {
    color: white;
}

#root {
    height: 100%;
    width: 100%;
    /*background-image: url("https://assets.eterfy.etermax.com/static/naranjax/template/avatar.png");*/
    /*background-image: url("https://assets.eterfy.etermax.com/static/naranjax/template/ready.png");*/
    /*background-image: url("https://assets.eterfy.etermax.com/static/naranjax/template/instrucciones_1.png");*/
    /*background-image: url("https://assets.eterfy.etermax.com/static/naranjax/template/pregunta.jpg");*/
    background-size: contain;
}

.max-size {
    height: 100%;
    width: 100%;
}

.max-width {
    width: 100%;
}

.max-height {
    height: 100%;
}

.display-style {
    display: flex;
    width: 100%;
    height: 100%;
    transform: translate3d(0, 0, 0);
}

.hidden {
    display: none !important;
}

.invisible {
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
    pointer-events: none !important;
}

.no-select {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

.unclickable {
    pointer-events: none;
}

.flex-row {
    display: flex;
    align-items: center;
    justify-content: center;
}

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

.flex-row-space-around {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.flex-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.flex-column-start {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.flex-column-end {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
}

.flex-column-space-evenly {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

.flex-column-space-between {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.app-background {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    display: flex;
    justify-content: center;
    background-color: var(--background);
    transition: background 1s ease-in-out;
}

.trivia_crack_v1 .app-background{
    background-color: white;
}

.trivia_crack_v1 .app-background.welcome{
    background-color: var(--background);
}

.screen {
    background: transparent;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-family: "SegoeRegular", serif;
}

.screen-header {
    width: 100%;
    height: 8.73vh;
    height: 8.73svh;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.cta .screen-header{
    justify-content: end;
    z-index: 1;
}

/*TODO: checkear tamaño contra figma*/
.screen-content {
    /*width: 36.2vh;*/
    /*width: 36.2svh;*/
    width: 100%;
    height: 84.5vh;
    height: 84.5svh;
}

.screen-footer {
    background-color: transparent;
    /*width: 36.2vh;*/
    /*width: 36.2svh;*/
    width: 100vw;
    width: 100svw;
    height: 6.76vh;
    height: 6.76svh;
}

.full-screen-component {
    z-index: 1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.powered-by-etermax {
    width: 56%;
    height: 43%;
    z-index: 1;
    background-image: url(/fb04dcb6/static/media/powered_by_etermax.89b8e254b02c841031df.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.powered-by-preguntados {
    width: 22.11vh;
    width: 22.11svh;
    height: 3.09vh;
    height: 3.09svh;
    z-index: 0;
    background-image: url(/fb04dcb6/static/media/powered_by_preguntados_dark.7d7e62317b851a74cdb8.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.footer{
    width: 56%;
    height: 43%;
}

.trivia_crack_v1 .powered-by-preguntados{
    background-image: url(/fb04dcb6/static/media/powered_by_preguntados_light.cd48272a2f03070c55c6.svg);
}

.pt .powered-by-preguntados {
    background-image: url(/fb04dcb6/static/media/powered_by_preguntados.6bd84a45a859fd3d1ea5.webp);
}

.en .powered-by-preguntados {
    background-image: url(/fb04dcb6/static/media/powered_by_preguntados.b0525643078c0a7b447e.webp);
}

.light .question .powered-by-preguntados,
.light .cta .powered-by-preguntados {
    background-image: url(/fb04dcb6/static/media/powered_by_preguntados_light.cd48272a2f03070c55c6.svg);
}

.light .question .powered-by-etermax {
    background-image: url(/fb04dcb6/static/media/powered_by_etermax_black.0f16f3cfea76e0db7a46.svg);
}

.trivia-crack-logo {
    display: block;
    height: 10.8%;
    width: 44.8%;
    margin-bottom: 1vh;
    background-image: url(/fb04dcb6/static/media/preguntados_logo.fcb06e45142888988106.webp);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.pt .trivia-crack-logo {
    background-image: url(/fb04dcb6/static/media/preguntados_logo.d0a6fa537b5bd80d6c16.webp);
}

.en .trivia-crack-logo {
    background-image: url(/fb04dcb6/static/media/preguntados_logo.5de52d0d30a26c614bc4.webp);
}

.wide-button {
    height: 6vh;
    height: 6svh;
    width: 35.22vh;
    width: 35.22svh;
    border-radius: 5vh;
    border-radius: 5svh;
    color: var(--color-text-button);
    font-family: "SegoeBL", serif;
    font-size: 1.9vh;
    font-size: 1.9svh;
    background: linear-gradient(185deg, var(--degradado-1) -123.22%, var(--degradado-2) 27.53%, var(--degradado-3) 181.45%) no-repeat;
    background-size: 100%;
    cursor: pointer;
}

.trivia_crack_v1 .wide-button{
    background: var(--button-grey)
}

.wide-button:hover {
    background: var(--white-button-hover);
}

.wide-button:active {
    background: var(--white-button-pressed);
}

.wide-button[disabled] {
    background: var(--button-grey);
    color: white;
    cursor: default;
}

.wide-button-small {
    width: 28vh;
    width: 28svh;
    height: 5.6vh;
    height: 5.6svh;
}

.back-button {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 3.5vh;
    width: 3.5svh;
    height: 3.5vh;
    height: 3.5svh;
    margin: auto;
    background-image: url(/fb04dcb6/static/media/back_arrow_icon.817ae4f51e43162f7b60.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    cursor: pointer;
}

.check {
    width: 2.1vh;
    width: 2.1svh;
    height: 2.1vh;
    height: 2.1svh;
    margin-right: 1vh;
    margin-right: 1svh;
}

.linear-gradient-bubble {
    background: linear-gradient(225deg, var(--degradado-1) 4.46%, var(--degradado-2) 53.69%, var(--degradado-3) 103.32%) no-repeat;
    background-size: cover;
}

.trivia_crack_v1 .linear-gradient-bubble {
    background: var(--toggle-sliders);
    background-size: cover;
}

.degrade-circle {
    position: absolute;
    margin-top: 15.82vh;
    margin-top: 15.82svh;
    height: 112vh;
    height: 112svh;
    height: 112dvh;
    width: 112vh;
    width: 112svh;
    border-radius: 50%;
    background: linear-gradient(270deg, var(--degradado-1) 0%, var(--degradado-2) 46.46%, var(--degradado-3) 93.3%);
    filter: blur(4vh);
    filter: blur(4svh);
    filter: blur(4dvh);
}

.trivia_crack_v1 .degrade-circle {
    background: var(--screen-background);
    margin-top: 12vh;
    margin-top: 12svh;
    filter: none;
}

.degrade-bottom-circle {
    position: absolute;
    height: 77.6vh;
    height: 77.6svh;
    width: 77.6vh;
    width: 77.6svh;
    bottom: -62%;
    background: linear-gradient(270deg, var(--degradado-1) 0%, var(--degradado-2) 46.46%, var(--degradado-3) 93.3%);
    background-size: cover;
    filter: blur(4vh);
    border-radius: 50%;
}

.fade-enter .container {
    opacity: 0;
    transform: scale(0.6);
}

.fade-enter-active .container {
    opacity: 0.6;
    transform: scale(1.05);
}

.fade-enter-done .container {
    opacity: 1;
}

.fade-exit .container {
    opacity: 1;
}

.fade-exit-active .container {
    opacity: 0;
    transform: scale(0.6);
}

.fade-enter-active .container,
.fade-enter-done .container,
.fade-exit-active .container {
    transition: opacity 350ms, transform 350ms, scale 350ms;
}

.general-loading{
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    z-index: 1;
    background-color: #00000040;
}

.card-enter-animation {
    animation: card-enter-animation 0.3s ease-out;
}

@keyframes card-enter-animation {
    0% {
        transform: scale(0.6);
        opacity: 0;
    }
    80% {
        transform: scale(1.05);
        opacity: 0.6;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@media (orientation: landscape) {
    .display-style {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
    }

    .degrade-bottom-circle {
        position: absolute;
        height: 77.6vh;
        height: 77.6svh;
        width: 100%;
        width: 100%;
        bottom: -68%;
        background: linear-gradient(270deg, var(--degradado-1) 0%, var(--degradado-2) 46.46%, var(--degradado-3) 93.3%);
        background-size: cover;
        filter: blur(4vh);
        border-radius: 50%;
    }

    .degrade-circle{
        height: 117.56vh;
        height: 117.56svh;
        width: 122vw;
        width: 122svw;
    }
}

@media (min-aspect-ratio: 45.21/100) {
    .screen {
        width: 45.21vh;
        width: 45.21svh;
        margin: 0 auto;
    }
}

.skeleton {
    --main-panel-color: #262A34;
}

.skeleton .app-background {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #ffffff;
}

.skeleton .screen {
    background-color: var(--background);
    width: 100%;
    height: 100%;
}

.skeleton .title,
.skeleton .loading-content .line {
    color: #262a34;
}

.skeleton #loading-icon {
    background-color: #262a34;
}

.skeleton-line {
    width: 40%;
    opacity: 0.75;
    height: 1em;
    border-radius: 0.2vh;
    border-radius: 0.2svh;
    animation: skeleton-loading 1s linear infinite alternate;
    display: none;
}

.skeleton .screen-footer {
    display: none;
}

@keyframes skeleton-loading {
    0% {
        background-color: #656876;
    }
    100% {
        background-color: #262a34;
    }
}

.icon {
    height: 2.7vh;
    height: 2.7svh;
    width: 2.7vh;
    width: 2.7svh;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.small-icon {
    height: 2vh;
    height: 2svh;
    width: 2vh;
    width: 2svh;
}

.medium-icon {
    height: 4.4vh;
    height: 4.4svh;
    width: 4.4vh;
    width: 4.4svh;
}

.big-icon {
    height: 8vh;
    height: 8svh;
    width: 8vh;
    width: 8svh;
}

#loading-icon {
    height: 10.6vh;
    height: 10.6svh;
    width: 10.6vh;
    width: 10.6svh;
    -webkit-mask: url(/fb04dcb6/static/media/loading_icon.811bacae23eaf85d7814.svg) center/cover no-repeat;
            mask: url(/fb04dcb6/static/media/loading_icon.811bacae23eaf85d7814.svg) center/cover no-repeat;
    background: #ffffff;
    animation: spin 2s linear infinite;
}

.loading #loading-icon{
    background-color: #262a34;
}

.play-locked-icon {
    height: 6.7vh;
    height: 6.7svh;
    width: 6.7vh;
    width: 6.7svh;
    background-image: url(/fb04dcb6/static/media/willy_think.cf275ad28fe6bf25a664.svg);
    margin-bottom: 1.3vh;
    margin-bottom: 1.3svh;
}

.warning-icon {
    width: 5vh;
    width: 5svh;
    height: 5vh;
    height: 5svh;
    background-image: url(/fb04dcb6/static/media/warning.99313852702e6e263c07.svg);
}

.edit-icon {
    background-image: url(/fb04dcb6/static/media/Edit_Icon.953a3f3f26b1fc216bf2.svg);
}

.user-icon {
    height: 7vh;
    height: 7svh;
    width: 7vh;
    width: 7svh;
    margin: 1vh;
    margin: 1svh;
    background-image: url(data:image/png;base64,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);
}

.lock-open-icon {
    height: 9.2vh;
    height: 9.2svh;
    width: 7.8vh;
    width: 7.8svh;
    background-image: url(/fb04dcb6/static/media/lock.3f805d3302a21632c3cb.svg);
}

.timer-icon {
    background-image: url(/fb04dcb6/static/media/timer_icon.773543f26297f0ac70e3.svg);
}

.welcome-container .instructions-icon {
    background-image: url(/fb04dcb6/static/media/instructions_icon.24545b503d8638371ffe.svg);
}

.instructions-icon {
    margin-right: 1.2vh;
    margin-right: 1.2svh;
    background-image: url(/fb04dcb6/static/media/instructions_icon_black.35909e81c8c5f47680d2.svg);
}

#first-instructions-icon {
    background-image: url(/fb04dcb6/static/media/hourglass_icon.b60962b2f9357b0975cc.svg);
}

#second-instructions-icon {
    background-image: url(/fb04dcb6/static/media/trophy_icon.27e84181f4120d96bcbb.svg);
}

#third-instructions-icon {
    background-image: url(/fb04dcb6/static/media/calendar_icon.42f98ab33b059f700690.svg);
}

.league-completed-icon {
    height: 9.8vh;
    height: 9.8svh;
    width: 7.5vh;
    width: 7.5svh;
    background-image: url(/fb04dcb6/static/media/trophy_icon.27e84181f4120d96bcbb.svg);
    margin: 5% 0;
}

.eterfy-edit-input-icon {
    position: absolute;
    width: 2vh;
    width: 2svh;
    height: 2vh;
    height: 2svh;
    right: 1.35vh;
    right: 1.35svh;
}

.search-icon {
    background-image: url(/fb04dcb6/static/media/search_icon.7ee5a3b4ff197b501e07.svg);
    background-size: cover;
    background-repeat: no-repeat;
}

.next-icon {
    height: 5.6vh;
    height: 5.6svh;
    width: 4.4vh;
    width: 4.4svh;
    background-image: url(/fb04dcb6/static/media/next.dcd9248b61181a920eda.svg);
    z-index: 2;
    cursor: pointer;
}

.back-icon {
    height: 5.6vh;
    height: 5.6svh;
    width: 4.4vh;
    width: 4.4svh;
    background-image: url(/fb04dcb6/static/media/back.6cc8588a3b2f5f050735.svg);
    z-index: 2;
    cursor: pointer;
}

.team-avatar-icon {
    background-image: url(/fb04dcb6/static/media/teams_avatar_icon.919164b93f995e918112.svg);
}

.show-password-icon {
    background-image: url(/fb04dcb6/static/media/password_view_icon.97c7541616755c8870ce.svg);
}

.hide-password-icon {
    background-image: url(/fb04dcb6/static/media/password_hide_icon.d1bb36013594fa67979a.svg);
}

.branded-star-icon {
    height: 2.7vh;
    height: 2.7svh;
    width: 2.8vh;
    width: 2.8svh;
    background-image: url(/fb04dcb6/static/media/branded_star.34b43e9b2ffe8dfc3952.svg);
}

.welcome-teams-icon {
    height: 7vh;
    height: 7svh;
    width: 7vh;
    width: 7svh;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAAA9CAMAAADCiyrYAAABg1BMVEVHcExqVwRlVAQ5MQA6MgA3MQA7MwAwMAA7MgA4MAA3MAA3MAA5MQA8NABlVAU+NQA7MgBgUAN0YAd6ZAlDOQBhUARaTARgTwSj4v//ySne9f9Hs+YptPURTWwnr+44MAFwk6Ynruxpj6L2wSYHQmBjUwV9ZQsosvPsuiRpWQoMSGhOtudehprYrCCWehP/4Ya/mBqNchAJPVeCbBAlpuLisyEXSmWd3v3C7f/Oox0ZSVpzXgdcvuyC0fdsxvBSqdMno91fTwNqXxc1ZHsoWHJMQAKkhBW1kRoolskmqearixtYUQ4ySjMlhbEknth3yvH/2GSr5f9ANwGdfxPV8/9WSAVRUhpatuEqkL+P2PpVfpNSdH1eZjsoYXsbU3FBSiJNgpsiSEao0czHpzf9zDv/3nk7fploZi1rjZNLl7thcl4qbotYSQN4oq7/007qvjiKw945ZWtsfWNpb0S06P+CutSR0vBnrMx3iG2vw6X7xSjZtUJinbqHucdtgneZ1/S9rlrIMEMmAAAAGHRSTlMA68fiuy9HEIIg0PCjcfiRYeD68G15kPiKxtE7AAAD3klEQVRIx+2W6VPaahSHZVFQcOly2wQMEbJIAkkIICpBdhBkdUPrvmu12na67/3Te94EFeZOIvbTnTv+ZpxhBh/O+p5z+voe9KD/nfoH/xIctJueRGRRjLAm89h94WFTZBa/1tTCY3P/feCRebxb/ojZ1iNsM4mU//DLwcGXhVBIEKbaLrD/9JatEeHr4QGm6rK626owrBbHgrkH+qlCUb8xbMblWlnEsI8XMZ7e32VCiA89upMe4Cj8cBpbcYFWwH4jT9M8Ed/lUAwh852eU/jUAbKNBOanU2HACSKeQQ4Unxln7ZEANrD3Gu1C4Se3aQIpVkHVkAeMcPvy0dXXz9fGkfPY3MuwihN0BTJIPTEyPnIkNeVLLXKX6z3CX6Su8TDjh/Tb9XFn8Vh6vfqpbX1GrV1DxWNxPkzvs+D+Y33jzJXUZPf3sMVbGkuC87GaZ9LjLREtlJmneviYDMZbfB7DFmdmFjUaC5zQsdLk+Djw0TiYp3SLbz2UjuV9IvwRu1UjEKd3gEa4t1SB6Fk9/HlTajJxgt++pV+4X9Lh+ngbj1aheAs6tRtgm9LrCvQIfXJNzwVSMYIuqzTCt8F7YVQHj0iSsAtp5sNvEDs9lwgk9rZ3YulJRCP8goG3a9bLnCSFqqhDcyqcTCYC7kAuv7Pu8ai0N01noHQmnZYTjyWxShOxvZu0ud2Iz3s1Olo3xo+uxCp/Q4MHScTncxdepGia4I1wGW9+q/K5Xx11mwM+9TY/6fWWo+n6DsEY4OyR9K0V/4B1KgF8rq6mrhytx7MwtfRwBdJayXXRUHgwv96uXLoWgcJZdQr3isJxLtiNT6Poa1rfeMpv4c0u69S9fwl6qnjWjWOAu2uedt+1IHRFb2I4wDX/u24a5c693sZL6B8yenvL+QpehPjjX6kL1NpvZgu+L1p0pywpw4M87Ywc0e5USY3ccyLC15z+uLEg86HPN1mHrgm413ybpXQZyr6ehdQWl/R3rp1E42h56/LDm0YjmVhbW/v0PRicmPAFgxsbm7ABcIpxGoxKS6GIpvHWxkbQB9iET/sDPLjJwaSiFNJo4Q+QqwLaZtlNH6gTP89CXLi4ZDfcE06SQdtolts668TPszKFwioMGa9p2xCZUffpPHd6fjaB5Pv5josg07hYcNx1q9gs5OqyttDFLMOcZhkuMo8s4xRbcNx9Y4D9gnJzmExR7Q9UkSMdvVwoNitJrrJC121ChZQCOdTjfTPsgB9Q5Fm/xgrzLLdEkqO9Hjd9NicJKjCMwioKkwGWtN7ntOobHB4ib2UZvf91ODhmtyLZh//2snzQf1R/AEd33naALOvcAAAAAElFTkSuQmCC);
}

.round-completed-icon {
    background-image: url(/fb04dcb6/static/media/hourglass_icon.b60962b2f9357b0975cc.svg);
}

.welcome-image {
    background-image: url(/fb04dcb6/static/media/welcome_cup.f0bbf581ba7de672445a.svg);
}

@font-face {
    font-family: "SegoeBL";
    src: url(/fb04dcb6/static/media/segoe-ui-bold.b00928e669b804136004.ttf) format("truetype");
}

@font-face {
    font-family: "SegoeRegular";
    src: url(/fb04dcb6/static/media/segoe-ui.45472284dc36b2486ce2.ttf) format("truetype");
}

/*naranjax*/
@font-face {
    font-family: 'Gibson';
    font-weight: normal;
    src: url(/fb04dcb6/static/media/Gibson-Regular.fb0d8ea0a4e06015d9ec.otf) format("opentype");
}

@font-face {
    font-family: 'Gibson';
    font-weight: 500;
    src: url(/fb04dcb6/static/media/Gibson-Medium.d3c8624c56f632dd81d6.otf) format("opentype");
}

@font-face {
    font-family: 'Gibson';
    font-weight: 400;
    src: url(/fb04dcb6/static/media/Gibson-Regular.fb0d8ea0a4e06015d9ec.otf) format("opentype");
}

.title {
    font-family: "SegoeBL", serif;
    color: var(--color-texto-1);
    font-size: 4.29vh;
    font-size: 4.29svh;
    text-align: left;
    line-height: 1.3;
    white-space: pre-line;
}

.line {
    margin: 0;
    font-size: 1.8vh;
    font-size: 1.8svh;
    color: var(--color-texto-1);
}

.welcome-content .title,
.league-completed-content .title {
    text-align: center;
    color: var(--color-text-button);
}

.loading-content .line,
.welcome-content .line,
.question-content .line {
    color: var(--color-text-button);
}

.trivia_crack_v1 .title {
    text-align: center;
    color: var(--color-texto-1);
}

.trivia_crack_v1 .line{
    color: var(--color-texto-1);
}

.bold {
    font-family: "GibsonBold", serif;
}

.small {
    font-size: 1.6vh;
    font-size: 1.6svh;
}

.medium {
    font-size: 2vh;
    font-size: 2svh;
}

.large {
    font-size: 2.2vh;
    font-size: 2.2svh;
}

.extra-large {
    font-size: 2.63vh;
    font-size: 2.63svh;
}

.popup-title {
    margin-top: 2vh;
    margin-top: 2svh;
    font-size: 2.6vh;
    font-size: 2.6svh;
    margin-bottom: 2vh;
    margin-bottom: 2svh;
    text-align: center;
}

.input-title {
    width: 100%;
    color: #fafafa;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    box-sizing: border-box;
    padding: 0 0.2vh 0.2vh 0.4vh
}

.input-error {
    width: 100%;
    font-size: 1.4vh;
    color: var(--error);
    text-align: right;
}

.popup {
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
}

.popup-background {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--background-overlay);
    height: 100%;
    width: 100%;
    animation: popup-enter-animation 0.3s ease-out;
}

.popup-content {
    width: 38.4vh;
    width: 38.4svh;
    height: 27.9%;
    margin-top: 29.9vh;
    margin-top: 29.9svh;
    z-index: 1;
    background: var(--button-grey);
    border-radius: 1.1vh;
    border-radius: 1.1svh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 2.2vh;
    padding: 2.2svh;
    box-sizing: border-box;
    animation: popup-enter-animation 0.3s ease-out;
}

@keyframes popup-enter-animation {
    0% {
        transform: scale(0.6);
        opacity: 0;
    }
    80% {
        transform: scale(1.05);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.popup-layout {
    display: flex;
    flex-direction: column;
    padding: 0 8%;
    height: 70%;
}

.galaxy, .trivia_crack_v1 {
    --animation-timer: 0.3s;
    --animation-timer2: 1.25s;
    --menu-animation-timer: 0.5s;
    --menu-animation-delay: 0.4s;
    --cta-animation-timer: 1.2s;
    --cta-image-animation: 1s;
    --mode-animation-timer: 0.4s;
    --avatar-animation-timer: 0.8s;
    --avatar-in-animation-timer: 0.3s;
}

.scale-in-ver-top {
    animation: scale-in-ver-top var(--animation-timer) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@keyframes scale-in-ver-top {
    0% {
        transform: scaleY(0);
        transform-origin: 100% 0%;
        opacity: 1;
    }
    100% {
        transform: scaleY(1);
        transform-origin: 100% 0%;
        opacity: 1;
    }
}

.slide-out-right {
    animation: slide-out-right var(--animation-timer2) cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.trivia_crack_v1 .slide-out-right {
    animation: fake-animation var(--animation-timer2) cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@keyframes slide-out-right {
    0% {
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        transform: translateX(100%);
        opacity: 1;
    }
}

.slide-out-left {
    animation: slide-out-left var(--animation-timer2) cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.trivia_crack_v1 .slide-out-left {
    animation: fake-animation var(--animation-timer2) cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@keyframes slide-out-left {
    0% {
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        transform: translateX(-100%);
        opacity: 1;
    }
}

.slide-in-right {
    animation: slide-in-right var(--animation-timer2) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.trivia_crack_v1 .slide-in-right {
    animation: fake-animation var(--animation-timer2) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@keyframes slide-in-right {
    0% {
        transform: translateX(150%);
        opacity: 1;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

.slide-in-left {
    animation: slide-in-left var(--animation-timer2) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.trivia_crack_v1 .slide-in-left {
    animation: fake-animation var(--animation-timer2) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@keyframes slide-in-left {
    0% {
        transform: translateX(-150%);
        opacity: 1;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}







.scale-in-center {
    animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@keyframes scale-in-center {
    0% {
        transform: scale(0);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}


.scale-out-center {
    animation: scale-out-center 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}
@keyframes scale-out-center {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(0);
        opacity: 1;
    }
}


.fade-in-right {
    animation: fade-in-right 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

.fade-in-left {
    animation: fade-in-left 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes fade-in-right {
    0% {
        transform: translateX(50px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}
@keyframes fade-in-left {
    0% {
        transform: translateX(-50px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}


.gummyAnimation{
    animation: gummyMove 0.5s cubic-bezier(0.87, 0, 0.13, 1) forwards;
}

.gummyAnimation.move-back{
    animation: gummyBack 0.5s cubic-bezier(0.87, 0, 0.13, 1) forwards;
}

@keyframes gummyMove {
    0% {
        left: 0%;
        width: 50%;
    }
    40% {
        left: 0%;
        width: 99%;
    }
    60% {
        left: 50%;
        width: 50%;
    }
    75% {
        left: 49%;
        width: 51%;
    }
    100% {
        left: 50%;
        width: 50%;
    }
}

@keyframes gummyBack {
    0% {
        left: 50%;
        width: 50%;
    }
    40% {
        left: 0%;
        width: 99%;
    }
    60% {
        left: 0%;
        width: 50%;
    }
    75% {
        left: 0%;
        width: 51%;
    }
    100% {
        left: 0%;
        width: 50%;
    }
}

.carousel-card.slide-out-left {
    animation: slide-out-left-instructions 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}
@keyframes slide-out-left-instructions {
    0% {
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        transform: translateX(-100%);
        opacity: 0;
    }
}

.carousel-card.slide-in-right {
    animation: slide-in-right-instructions 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}
@keyframes slide-in-right-instructions {
    0% {
        transform: translateX(100%);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}



@keyframes fake-animation {
    from {
        opacity: 1;
    }
    to {
        opacity: 1;
    }
}

.naranja_x {
    font-family: "Gibson", serif;
}

/*Instructions Start*/
.naranja_x .instructions-content {
    height: 77.7vh;
    height: 77.7svh;
    width: 38.2vh;
    width: 38.2svh;
}

.naranja_x .instructions-item{
    background-color: transparent;
    border: 1px solid var(--instruction-carrousel-container);
    border-radius: 2vh;
    border-radius: 2svh;
}

.naranja_x .instructions-container .title{
    margin-top: 0.7vh;
    margin-top: 0.7svh;
    margin-left: 2vh;
    margin-left: 2svh;
}

.naranja_x .instructions-container .wide-button{
    width: 35.94vh;
    width: 35.94svh;
}
.naranja_x .instructions-carousel-container{
    margin-top: 12vh;
    margin-top: 12svh;
}

.naranja_x .carousel-card {
    background-color: transparent;
    border: 1px solid var(--instruction-carrousel-container);
    border-radius: 4vh;
    border-radius: 4svh;
}

.naranja_x .third-carousel-card-icon{
    height: 10vh;
    height: 10svh;
    width: 10vh;
    width: 10svh;
    margin-left: 4.5vh;
    margin-left: 4.5svh;
    margin-top: 4.18vh;
    margin-top: 4.18svh;
    background-image: url(/fb04dcb6/static/media/calendar_bell.7143a234d7d1ab0567a7.svg);
}

.naranja_x .instructions-line{
    font-family: "Gibson", serif;
    width: 26.18vh;
    width: 26.18svh;
    margin-left: 2.46vh;
    margin-left: 2.46svh;
}
/*Instructions End*/

/*Server Error Start*/
.naranja_x .server-error-content{
    margin-top: 25.6vh;
    margin-top: 25.6svh;
    align-items: start;
}

.naranja_x .server-error-panel{
    background-color: transparent;
    border: 1px solid var(--instruction-carrousel-container);
    border-radius: 4vh;
    border-radius: 4svh;
    width: 38.3vh;
    width: 38.3svh;
    height: 44vh;
    height: 44svh;
}
.naranja_x .server-error-icon-container{
    margin-top: -4.5vh;
    margin-top: -4.5svh;
}
/*Server Error End*/

/*Index Start*/
.naranja_x .screen-header {
    height: 7.6svh;
    height: 7.6vh;
}

.naranja_x .powered-by-preguntados {
    width: 22.64vh;
    width: 22.64svh;
    height: 3.15vh;
    height: 3.15svh;
}

.naranja_x .question .powered-by-preguntados{
    background-image: url(/fb04dcb6/static/media/powered_by_preguntados_light.cd48272a2f03070c55c6.svg);
}

.naranja_x .wide-button{
    background: var(--primary-1);
    color: var(--color-texto-2);
    border-radius: 1.7vh;
    border-radius: 1.7svh;
    width: 35.94vh;
    width: 35.94svh;
}

.naranja_x .linear-gradient-bubble {
    background: var(--primary-2);
}

.naranja_x .degrade-circle{
    background: linear-gradient(245deg, var(--degradado-1-naranja) 0%, var(--degradado-2-naranja) 40.86%, var(--degradado-3-naranja) 100%);
}

.naranja_x .welcome .degrade-circle{
    background: url(/fb04dcb6/static/media/background.ccdf6fc071a121ed8f0c.jpg) no-repeat center;
    margin: auto;
    height: 100%;
    border-radius: 0;
    filter: none;
    width: 100%;
    background-size: cover;
}

.naranja_x .loading .degrade-circle{
    background: transparent;
}

.naranja_x .degrade-bottom-circle{
    background: linear-gradient(245deg, var(--degradado-1-naranja) 0%, var(--degradado-2-naranja) 40.86%, var(--degradado-3-naranja) 100%);
}

.naranja_x .screen-footer {
    margin-top: 1.5vh;
    margin-top: 1.5svh;
}

.naranja_x .welcome #loading-icon{
    background-color: white;
}
/*Index End*/

/*Header Start*/
.naranja_x .sound-on-icon.mask{
    -webkit-mask-image: url(/fb04dcb6/static/media/sound_on.e1481b2ff7f023a9c406.svg);
    mask-image: url(/fb04dcb6/static/media/sound_on.e1481b2ff7f023a9c406.svg);
    margin-left: 14vh;
}
.naranja_x .sound-off-icon.mask{
    -webkit-mask-image: url(/fb04dcb6/static/media/sound_off.a750f4c000d11a92c77b.svg);
    mask-image: url(/fb04dcb6/static/media/sound_off.a750f4c000d11a92c77b.svg);
    margin-left: 14vh;
}

.naranja_x .sound-off-icon.mask{
    -webkit-mask-image: url(/fb04dcb6/static/media/sound_off.a750f4c000d11a92c77b.svg);
    mask-image: url(/fb04dcb6/static/media/sound_off.a750f4c000d11a92c77b.svg);
}
.naranja_x .sound-on-icon {
    background-color: var(--primary-1);
    width: 3.48vh;
    width: 3.48svh;
    height: 3.45vh;
    height: 3.45svh;
    margin-bottom: 0;
    margin-right: 1.2vh;
    margin-right: 1.2svh;
}

.naranja_x .sound-off-icon {
    background-color: var(--primary-1);
    width: 3.48vh;
    width: 3.48svh;
    height: 3.45vh;
    height: 3.45svh;
    margin-bottom: 0;
    margin-right: 1.2vh;
    margin-right: 1.2svh;
}

.naranja_x .logo{
    background-image: url(/fb04dcb6/static/media/logo.2a0580c42bf5ddd2c4e5.svg);
    height: 3.7vh;
    height: 3.7svh;
    width: 16.2vh;
    margin-left: 3.36vh;
    width: 16.2svh;
    margin-bottom: 0.65vh;
    flex-grow: unset;
}

.naranja_x .welcome-logo{
    background-image: none;
}

/*Header End*/

/*Answer Start*/
.naranja_x .question-screen-answers-container{
    margin-top: 2.85vh;
    margin-top: 2.85svh;
    width: 36.2vh;
    width: 36.2svh;
}
/*Answer End*/

/*Menu Start*/
.naranja_x .burger-menu {
    background-image: url(/fb04dcb6/static/media/Burguer_Menu_Light.605ac8883a62b17bd1ce.svg);
}

.naranja_x .menu{
    background: var(--color-texto-2);
    color: var(--color-texto-1);
    width: 33.3vh;
    width: 33.3svh;
    /*height: auto;*/
    height: 42.8vh;
    height: 42.8svh;
    border-radius: 1.8vh 0vh 1.8vh 6vh;
    border-radius: 1.8svh 0vh 1.8svh 6svh;
    padding-bottom: 6vh;
    padding-bottom: 6svh;
}
.naranja_x .menu-header {
    height: 6.45vh;
    height: 6.45svh;
    background-color: var(--menu-header);
}

.naranja_x .menu-title {
    font-family: Gibson;
    font-weight: 500;
    font-size: 2.68vh;
    font-size: 2.68svh;
    margin-top: 1.8vh;
    margin-top: 1.8svh;
    margin-left: 4.5vh;
    margin-left: 4.5svh;
    line-height: 2.68vh;
    line-height: 2.68svh;
}

.naranja_x .menu-close-icon {
    width: 4.3vh;
    width: 4.3svh;
    height: 4.3vh;
    height: 4.3svh;
    background-image: url(/fb04dcb6/static/media/cross-icon.a11b33faa81c932a786a.svg);
    margin-right: 0.85vh;
    margin-right: 0.85svh;
    margin-top: 1.07vh;
    margin-top: 1.07svh;
    margin-bottom: 1.07vh;
    margin-bottom: 1.07svh;
}
.naranja_x .menu-option {
    height: 2.57vh;
    height: 2.57svh;
    margin-bottom: 3vh;
    margin-bottom: 3svh;
}

.naranja_x .menu-option:last-child {
    margin-bottom: 0;
}
.naranja_x .menu-option-description {
    font-size: 2.14vh;
    font-size: 2.14svh;
    font-family: Gibson;
    font-weight: 500;
    line-height: 2.14vh;
    line-height: 2.14svh;
    height: 2.57vh;
    height: 2.57svh;
}
.naranja_x .menu-option-icon {
    width: 2.57vh;
    width: 2.57svh;
    height: 2.57vh;
    height: 2.57svh;
    margin-right: 1.71vh;
    margin-right: 1.71svh;
    margin-left: 4.5vh;
    margin-left: 4.5svh;
}
.naranja_x .menu-option-icon-second {
    background-image: url(/fb04dcb6/static/media/sound_on.e1481b2ff7f023a9c406.svg);
}
.naranja_x .menu-option-icon-second-disabled {
    background-image: url(/fb04dcb6/static/media/sound_off.a750f4c000d11a92c77b.svg);
}
.naranja_x .menu-option-icon-third {
    background-image: url(/fb04dcb6/static/media/instructions.2c751eb5972b512e8a2a.svg);
}
.naranja_x .menu-option-icon-fourth {
    background-image: url(/fb04dcb6/static/media/ranking.683fa3eda5efc56886e6.svg);
}
.naranja_x .menu-option-icon-fifth {
    background-image: url(/fb04dcb6/static/media/fquestions.9e0866e7716cfb60886d.svg);
}

.naranja_x .menu-option-icon-sixth {
    background-image: url(/fb04dcb6/static/media/exit.3dba1429d97a47034484.svg);
}
/*Menu End*/

/*Ready Start*/
.naranja_x .ready-screen-content {
    height: 77.65vh;
    height: 77.65svh;
}
.naranja_x .ready-main-container {
    margin-top: 15.45svh;
    margin-top: 15.45vh;
    align-self: baseline;
    margin-left: auto;
    margin-right: auto;
}
.naranja_x .ready-title {
    margin-top: 1.3vh;
    margin-top: 1.3svh;
    font-family: "Gibson", serif;
    font-weight: 500;
    font-size: 4.29vh;
    font-size: 4.29svh;
}
.naranja_x .ready-subtitle {
    margin-top: 2vh;
    margin-top: 2svh;
    font-size: 2.14vh;
    font-size: 2.14svh;
    font-family: "Gibson", serif;
    font-weight: 400;
    font-size: 2.14vh;
    font-size: 2.14svh;
}
/*Ready End*/

/*Countdown Start*/
.naranja_x .countdown.linear-gradient-bubble {
    background: var(--primary-1) !important;
    background-size: cover;
}
/*Countdown End*/

/*Question Start*/
.naranja_x .question-screen-question-container {
    margin-top: 2.3vh;
    margin-top: 2.3svh;
    height: 40.5vh;
    height: 40.5svh;
}
.naranja_x .question-screen-question-image {
    height: 26.95vh;
    height: 26.95svh;
}

.naranja_x .question-screen-default-image-1 {
    background-image: url(/fb04dcb6/static/media/question-default-1.b17f1f998269d631b0d5.svg);
}

.naranja_x .question-screen-default-image-2 {
    background-image: url(/fb04dcb6/static/media/question-default-2.b818c65d72befa8c4ff2.svg);
}

.naranja_x .question-header-container {
    margin-bottom: 0vh ;
    margin-bottom: 0svh ;
    margin-top: 2.58vh;
    margin-top: 2.58svh;
}
.naranja_x .question-header {
    font-family: Gibson;
    font-weight: 500;
    font-size: 1.85vh;
    font-size: 1.85svh;
}
.naranja_x .clock-background{
    background-color: var(--clock-background);
}
.naranja_x .clock-second-layer {
    background-color: var(--background);
}
.naranja_x .progress-pivot {
    background-color: var(--primary-2);
}
.naranja_x .question-screen-question {
    width: 44vh;
    width: 44svh;
}

.naranja_x .question-screen-answer{
    background-color: var(--toogle-bg-pop-up-bg);
    color: var(--color-texto-1);
    border-radius: 1.6vh;
    border-radius: 1.6svh;
}
.naranja_x .question-screen-answer:active{
    background-color: var(--primary-1);
    color: var(--color-texto-2)
}
.naranja_x .question-screen-wrong-answer {
    background-color: #ee303b;
    color: var(--color-texto-2)
}
.naranja_x .question-screen-correct-answer{
    background-color: #33CC3A;
    color: var(--color-texto-2)
}
.naranja_x path{
    stroke: var(--primary-2);
}

.naranja_x .clock-first-layer, .naranja_x .clock-third-layer{
    background: var(--primary-1) no-repeat;
}

@media (hover: hover) and (pointer: fine) {
    .naranja_x .question-screen-answer:hover {
        background-color: var(--primary-1);
        color: var(--color-texto-2)
    }
}

.naranja_x .answer-feedback-timeout .answer-feedback-decoration{
    background-image: url(/fb04dcb6/static/media/tail_naranja.0938b72390fc4799780c.svg);
    bottom: -1.081vh;
    bottom: -1.081svh;
}
/*Question End*/

/*Avatar Start*/
.naranja_x .avatar-selection-content {
    height: 77.7vh;
    height: 77.7svh;
}
.naranja_x .avatar-selection-container {
    margin-top: 5.9vh;
    margin-top: 5.9svh;
}
.naranja_x .avatar-selection-panel {
    margin-top: 13.4vh;
    margin-top: 13.4svh;
}
.naranja_x .avatar-container{
    width: 25.08vh;
    width: 25.08svh;
}
.naranja_x .avatar-icon {
    height: 16vh;
    height: 16svh;
    width: 16vh;
    width: 16svh;
    margin: auto;
}
.naranja_x .avatar-next-icon {
    background-image: url(/fb04dcb6/static/media/Next_arrow.72b6fc9c99c027492a1b.svg);
}
.naranja_x .avatar-prev-icon {
    background-image: url(/fb04dcb6/static/media/Next_arrow.72b6fc9c99c027492a1b.svg);
}
.naranja_x .avatar-selection-content .wide-button{
    color: var(--color-texto-2);
}
/*Avatar End*/


/*Ranking Start*/
.naranja_x .ranking-avatar-icon-container{
    background: var(--primary-2);
}
.naranja_x .ranking-avatar-icon-individual{
    width: 12.8vh;
    width: 12.8svh;
    height: 12.8vh;
    height: 12.8svh;
    margin-top: 3.4vh;
    margin-top: 3.4svh;
    margin-left: 3.2vh;
    margin-left: 3.2svh;
}
/*Ranking End*/

/*League Completed Start*/
.naranja_x .league-complete-main-container-fix {
    margin-top: 18vh;
}

.naranja_x .league-completed-avatar-image{
    width: 16.1vh;
    width: 16.1svh;
    height: 16.1vh;
    height: 16.1svh;
    margin-top: 7vh;
    margin-top: 7svh;
}

.naranja_x .league-completed-content .wide-button {
    background: var(--background);
    color: var(--primary-1);
    width: 16.3vh;
    width: 16.3svh;
}

.naranja_x .league-completed-content .message {
    height: auto;
    font-family: Gibson;
    font-size: 2.14vh;
    font-size: 2.14svh;
    font-weight: 400;
}

.naranja_x .league-buttons-container{
    display: flex;
    justify-content: space-between;
    width: 33.8vh;
}

.naranja_x .wide-button.sign-out{
    background-color: var(--primary-1);
    color: var(--background);
}
/*League Completed End*/

/*Welcome Start*/
.naranja_x .eterfy-brand{
    background: transparent url("/fb04dcb6/static/media/Isologo%20Naranja%20X.692197f814735fcaff0b.svg") no-repeat;
    background-size: contain;
}
.naranja_x .welcome-content .wide-button {
    background: white;
    color: var(--boton-inicio);
}

.naranja_x .wide-button:disabled::before {
    border-radius: 1.7svh;
    border-radius: 1.7vh;
}
/*Welcome End*/

/*Score Start*/
.naranja_x .score-icon-container{
    background: var(--primary-2);
}

.naranja_x .score-buttons-container .wide-button{
    width: 31.15vh;
    width: 31.15svh;
}
/*Score End*/

/*Font Start*/
.naranja_x .title,
.naranja_x .score-title
{
    line-height: 1.1;
    font-family: "Gibson", serif;
    font-weight: 500;
}

.naranja_x .ranking-name-container{
    font-family: "Gibson", serif;
    font-weight: 500;
    font-size: 2.57vh;
    font-size: 2.57svh;
}

.naranja_x .line,
.naranja_x .carousel-card-text,
.naranja_x .wide-button,
.naranja_x .avatar-name-animation,
.naranja_x .score-message,
.naranja_x .server-error-texts .message,
.naranja_x .close-app-popup-message
{
    font-family: "Gibson", serif;
    font-weight: 400;
    font-size: 2.14vh;
    font-size: 2.14svh;
}

.naranja_x .ranking-position-title,
.naranja_x .ranking-row-name
{
    font-family: "Gibson", serif;
    font-weight: 400;
}

.naranja_x .ranking-position-user,
.naranja_x .ranking-row-font-top,
.naranja_x .close-app-popup-title
{
    font-family: "Gibson", serif;
    font-weight: 500;
}

.naranja_x .ranking-position-user{
    font-family: "Gibson", serif;
    font-weight: 500;
    font-size: 3.43vh;
    font-size: 3.43svh;
}

.naranja_x .question-screen-question-text,
.naranja_x .question-screen-answer,
.naranja_x .question
{
    font-family: "Gibson", serif;
    font-weight: 500;
    font-size: 2.14vh;
    font-size: 2.14svh;
}

.naranja_x .answer{
    font-family: "Gibson", serif;
    font-weight: 400;
    font-size: 1.6vh;
    font-size: 1.6svh;
    line-height: normal;
    margin-bottom: 3vh;
    margin-bottom: 3svh;
}
/*Font End*/

/*Animation Start*/
.naranja_x {
    --animation-timer: 0.3s;
}
/*Animation End*/

.signin-container {
    height: 72.3vh;
    height: 72.3svh;
    justify-content: flex-end;
    margin-bottom: 15%;
}

.signin-tabs-panel {
    width: 100%;
    height: 100%;
}

.signin-tab-buttons {
    position: relative;
    width: 100%;
    height: 6%;
    display: flex;
    border-radius: 1.1vh 1.1vh 0 0;
    border-radius: 1.1svh 1.1svh 0 0;
}

.signin-tab-button {
    flex-basis: 49%;
    justify-content: center;
    color: var(--color-texto-1);
    font-family: "SegoeBL", serif;
    font-size: 1.89vh;
    font-size: 1.89svh;
    cursor: pointer;
}

.signin-tabs {
    width: 100%;
    height: 94%;
}

.signin-tab {
    width: 100%;
    height: 100%;
}

.signin-panel {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    background-color: var(--main-panel-color);
    border-radius: 1.1vh;
    border-radius: 1.1svh;
}

.signin-panel-quick {
    border-radius: 0 0 1.1vh 1.1vh;
    border-radius: 0 0 1.1svh 1.1svh;
}

.signin-separator {
    display: block;
    width: 87.2%;
    border-bottom: 0.1vh solid #263434;
}

.signin-brand-logo {
    height: 21.2%;
    width: 75.6%;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.signin-welcome-text {
    max-height: 25%;
    width: 87.2%;
    overflow: hidden;
}

.signin-form {
    width: 87.2%;
    height: 27%;
}

.signin-button {
    margin-bottom: 3%;
}

.signin-signup-title {
    margin-right: 0.5vh;
    margin-right: 0.5svh;
}

.tab {
    position: relative;
    width: 50%;
    height: 100%;
    background: none;
    color: var(--color-texto-1);
    font-family: "SegoeBL", serif;
    font-size: 1.89vh;
    font-size: 1.89svh;
    cursor: pointer;
}

.active {
    color: var(--color-text-button);
}

.eterfy-input-container {
    overflow: hidden;
    position: relative;
    height: 100%;
    border-radius: 0.5vh;
    border-radius: 0.5svh;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
}

.eterfy-input {
    height: 100%;
    background-color: transparent;
    border: 2px solid var(--gris-claro);
    border: 2px solid var(--gris-claro);
    color: var(--color-texto-1);
    border-radius: 4vh;
    border-radius: 4svh;
    width: 100%;
    box-sizing: border-box;
    padding-left: 3.47vh;
    padding-left: 3.47svh;
    font-family: "SegoeRegular", serif;
    font-size: 1.68vh;
    font-size: 1.68svh;
}

.eterfy-input:-ms-input-placeholder{
    color: var(--placeholder-claro);
}

.eterfy-input::placeholder{
    color: var(--placeholder-claro);
}

.eterfy-input:focus {
    outline: none
}

.eterfy-input::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

.eterfy-input-invalid {
    border: 0.2vh solid var(--error);
    border-radius: 4vh;
    border-radius: 4svh;
    color: var(--error);
}

.eterfy-input-not-border{
    border: none;
}

.eterfy-input-not-border:-ms-input-placeholder {
    color: var(--error);
}

.eterfy-input-not-border::placeholder {
    color: var(--error);
}

.eterfy-input-invalid:-ms-input-placeholder {
    color: var(--error);
}

.eterfy-input-invalid::placeholder {
    color: var(--error);
}

.input-icon {
    width: 2vh;
    width: 2svh;
    height: 1.57vh;
    height: 1.57svh;
    margin-left: 1.47vh;
    margin-left: 1.47svh;
    background-size: cover;
    background-repeat: no-repeat;
    display: none;
}

.extraData-icon-container{
    width: 3.47vh;
    width: 3.47svh;
    height: 100%;
}

.extraData .input-icon {
    height: 2vh;
    height: 2svh;
    margin-left: 1.58vh;
    margin-left: 1.58svh;
    margin-top: 1.3vh;
    margin-top: 1.3svh;
    display: block;
    background-image: url(/fb04dcb6/static/media/pencil-sharp.afb4b6f585d60bc6f6e4.svg);
}

.date .input-icon {
    display: block;
    background-image: url(/fb04dcb6/static/media/calendar-icon.c36fbc6ccda40f78d427.svg);
}

input::-webkit-credentials-auto-fill-button {
    width: 0px;
    height: 0px;
}

.sso-popup-content {
    width: 37.54vh;
    width: 37.54svh;
    height: 46vh;
    height: 46svh;
    background: var(--popup-background);
    border-radius: 3vh;
    border-radius: 3svh;
    color: var(--color-texto-1);
}

.trivia_crack_v1 .sso-popup-content {
    width: 37.54vh;
    width: 37.54svh;
    height: 46vh;
    height: 46svh;
    background: white;
    border-radius: 3vh;
    border-radius: 3svh;
    color: var(--color-texto-1);
}

.sso-popup-icon-container {
    height: 18.08vh;
    height: 18.08svh;
    width: 17.66vh;
    width: 17.66svh;
    display: flex;
    margin-top: -10vh;
    margin-top: -10svh;
}

.sso-popup-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .sso-popup-icon-container.mask {
    border-radius: 3vh;
    border-radius: 3svh;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.sso-popup-icon {
    background-image: url(/fb04dcb6/static/media/sso_popup_icon.1a0c47b521fa38eae3f8.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 10.92vh;
    height: 10.92svh;
    width: 7.82vh;
    width: 7.82svh;
    margin-top: 4.2vh;
    margin-top: 4.2svh;
    margin-left: 5.2vh;
    margin-left: 5.2svh;
}

.trivia_crack_v1 .sso-popup-icon{
    margin: auto;
}

.sso-popup-title {
    font-family: "SegoeBL", "serif";
    font-size: 2.62vh;
    font-size: 2.62svh;
    height: 3.47vh;
    height: 3.47svh;
    width: 100%;
    text-align: center;
    color: var(--color-texto-1);
    margin-top: 2.3vh;
    margin-top: 2.3svh;
}

.sso-popup-message {
    font-family: "SegoeRegular", "serif";
    font-size: 2.10vh;
    font-size: 2.10svh;
}

.sso-popup-buttons {
    margin-top: 3.15vh;
    margin-top: 3.15svh;
    width: 33.12vh;
    width: 33.12svh;
}

.signin-content .sso-popup-buttons .wide-button,
.sso-popup-content .sso-popup-buttons .wide-button {
    width: 15.98vh;
    width: 15.98svh;
}

.signin-content .wide-button.back,
.sso-popup-content .wide-button.back {
    background: var(--button-grey);
}

.trivia_crack_v1 .signin-content .wide-button.back {
    background: var(--toogle-bg-pop-up-bg);
    color: var(--color-texto-1);
}

.signin-terms-container {
    font-family: "SegoeRegular", "serif";
    font-size: 1.47vh;
    font-size: 1.47svh;
    margin-top: 0.94vh;
    margin-top: 0.94svh;
    display: flex;
    flex-direction: row;
}

.sso-popup-check-error {
    background-color: var(--error-opacity);
    border-radius: 50%;
    border: 1px solid var(--error);
    -webkit-appearance: none;
    width: 2.1vh;
    width: 2.1svh;
    height: 2.1vh;
    height: 2.1svh;
    margin-right: 1vh;
    margin-right: 1svh;
}

.sso-popup-line-error {
    color: var(--error);
    font-family: "SegoeRegular", "serif";
    font-size: 1.47vh;
    font-size: 1.47svh;
}

.sso-terms{
    margin-top: 2.28vh;
    margin-top: 2.28svh;
}

.sso-popup-container{
    height: 27.23vh;
    height: 27.23svh;
    width: 33.12vh;
    width: 33.12svh;
}

.search-mail-content {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100%;
    margin-top: 32.07vh;
    margin-top: 32.07svh;
}

.search-mail-popup {
    width: 37.54vh;
    width: 37.54svh;
    height: 36.28vh;
    height: 36.28svh;
    border-radius: 3vh;
    border-radius: 3svh;
    background: var(--toogle-bg-pop-up-bg);
}

.search-mail-content .search-mail-popup .wide-button {
    width: 29.55vh;
    width: 29.55svh;
    margin-top: 2.31vh;
    margin-top: 2.31svh;
}

.search-mail-main-container {
    display: flex;
    width: 31.3vh;
    width: 31.3svh;
    height: 9.78vh;
    height: 9.78svh;
    align-items: center;
    flex-direction: column;
    margin-top: 1.57vh;
    margin-top: 1.57svh;
}

.search-mail-icon-container {
    margin-top: -7vh;
    margin-top: -7svh;
}

.search-mail-icon-container.mask {
    width: 17.66vh;
    width: 17.66svh;
    height: 18.08vh;
    height: 18.08svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .search-mail-icon-container.mask{
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.search-mail-icon {
    background: url(/fb04dcb6/static/media/SearchMail.4a764b09a95a095a9e1b.svg) no-repeat;
    background-size: contain;
    height: 6.77vh;
    height: 6.77svh;
    width: 10.13vh;
    width: 10.13svh;
    margin-top: 6.1vh;
    margin-top: 6.1svh;
    margin-left: 4.6vh;
    margin-left: 4.6svh;
}

.trivia_crack_v1 .search-mail-icon{
    margin: auto;
}

.search-mail-title {
    font-family: "SegoeBL", "serif";
    font-size: 2.62vh;
    font-size: 2.62svh;
    color: var(--color-texto-1);
}

.search-mail-subtitle {
    font-family: "SegoeRegular", "serif";
    font-size: 2.10vh;
    font-size: 2.10svh;
    color: var(--color-texto-1);
    width: 34.17vh;
    width: 34.17svh;
    margin-top: 0.63vh;
    margin-top: 0.63svh;
}

.verify-mail-content {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100%;
    margin-top: 27.02vh;
    margin-top: 27.02svh;
}

.verify-mail-popup {
    width: 37.54vh;
    width: 37.54svh;
    height: 40.48vh;
    height: 40.48svh;
    border-radius: 3vh;
    border-radius: 3svh;
    background: var(--toogle-bg-pop-up-bg);
}

.verify-mail-content .wide-button {
    width: 29.55vh;
    width: 29.55svh;
    color: white;
    margin-top: 3.05vh;
    margin-top: 3.05svh;
}

.verify-mail-main-container {
    display: flex;
    width: 34.17vh;
    width: 34.17svh;
    height: 10.51vh;
    height: 10.51vh;
    align-items: center;
    flex-direction: column;
    margin-top: 1.04vh;
    margin-top: 1.04svh;
}

.verify-mail-title {
    font-family: "SegoeBL", "serif";
    font-size: 2.62vh;
    font-size: 2.62svh;
    color: var(--color-texto-1);
}

.verify-mail-subtitle {
    font-family: "SegoeRegular", "serif";
    font-size: 2.10vh;
    font-size: 2.10svh;
    color: var(--color-texto-1);
    width: 34.17vh;
    width: 34.17svh;
    margin-top: 1.36vh;
    margin-top: 1.36svh;
}

.verify-mail-icon-container {
    background: linear-gradient(225deg, var(--degradado-1) 0%, var(--degradado-2) 49.80%, var(--degradado-3) 100%) no-repeat;
    background-size: 100%;
    margin-top: -11.36vh;
    margin-top: -11.36svh;
}

.verify-mail-icon-container.mask {
    width: 17.56vh;
    width: 17.56svh;
    height: 18.08vh;
    height: 18.08svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .verify-mail-icon-container.mask {
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.verify-mail-icon {
    background: url(/fb04dcb6/static/media/VerifyMail.6a57808b233c697cc8fe.svg) no-repeat;
    background-size: contain;
    height: 8.42vh;
    height: 8.42svh;
    width: 10.73vh;
    width: 10.73svh;
    margin-top: 4.8vh;
    margin-top: 4.8svh;
    margin-left: 4.2vh;
    margin-left: 4.2svh;
}

.sso-signin-popup-content {
    width: 37.54vh;
    width: 37.54svh;
    height: 40.48vh;
    height: 40.48svh;
}

.sso-signin-popup-popup {
    width: 100%;
    height: 100%;
    border-radius: 3vh;
    border-radius: 3svh;
    background: var(--toogle-bg-pop-up-bg);
}

.sso-signin-popup-content .wide-button {
    width: 29.55vh;
    width: 29.55svh;
    color: white;
    margin-top: 3.05vh;
    margin-top: 3.05svh;
}

.sso-signin-popup-main-container {
    display: flex;
    width: 34.17vh;
    width: 34.17svh;
    height: 10.51vh;
    height: 10.51svh;
    align-items: center;
    flex-direction: column;
    margin-top: 1.88vh;
    margin-top: 1.88svh;
}

.sso-signin-popup-title {
    font-family: "SegoeBL", "serif";
    font-size: 2.62vh;
    font-size: 2.62svh;
    color: var(--color-texto-1);
}

.sso-signin-popup-subtitle {
    font-family: "SegoeRegular", "serif";
    font-size: 2.10vh;
    font-size: 2.10svh;
    color: var(--color-texto-1);
    width: 34.17vh;
    width: 34.17svh;
    margin-top: 1.36vh;
    margin-top: 1.36svh;
}

.sso-signin-popup-icon-container {
    margin-top: -3.36vh;
    margin-top: -3.36svh;
}

.sso-signin-popup-icon-container.mask {
    width: 17.56vh;
    width: 17.56svh;
    height: 18.08vh;
    height: 18.08svh;
    margin-top: -10vh;
    margin-top: -10svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .sso-signin-popup-icon-container.mask{
    border-radius: 50vh;
    border-radius: 50svh;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.sso-signin-popup-icon {
    background: url(/fb04dcb6/static/media/register_icon.c00eed4b301fd4e06831.svg) no-repeat;
    background-size: contain;
    height: 9.14vh;
    height: 9.14svh;
    width: 9.3vh;
    width: 9.3svh;
    margin-top: 4.8vh;
    margin-top: 4.8svh;
    margin-left: 5.78vh;
    margin-left: 5.78svh;
}

.trivia_crack_v1 .sso-signin-popup-icon{
    margin: auto;
    margin-left: 5.5vh;
    margin-left: 5.5svh;
}

.sso-register-success-content {
    width: 37.54vh;
    width: 37.54svh;
    height: 39.4vh;
    height: 39.4svh;
}

.sso-register-success-popup {
    width: 100%;
    height: 100%;
    border-radius: 4vh;
    border-radius: 4svh;
    background: var(--toogle-bg-pop-up-bg);
}

.sso-register-success-content .sso-register-success-popup .wide-button {
    width: 29.55vh;
    width: 29.55svh;
}

.sso-register-success-popup .wide-button{
    margin-top: 3.26vh;
    margin-top: 3.26svh;
}

.sso-register-success-main-container {
display: flex;
width: 33vh;
height: 9.88vh;
height: 9.88svh;
height: 9.88svh;
align-items: center;
flex-direction: column;
margin-top: 1.89vh;
margin-top: 1.89svh;
}

.sso-register-success-icon-container {
    margin-top: -10vh;
    margin-top: -10svh;
}

.sso-register-success-icon-container.mask {
width: 17.56vh;
width: 17.56svh;
height: 18.08vh;
height: 18.08svh;
-webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
}

.trivia_crack_v1 .sso-register-success-icon-container.mask{
border-radius: 50%;
background-repeat: no-repeat;
background-size: contain;
-webkit-mask-image: none;
mask-image: none;
display: flex;
}

.sso-register-success-icon {
background: url(/fb04dcb6/static/media/register_icon.c00eed4b301fd4e06831.svg) no-repeat;
background-size: contain;
height: 9.15vh;
height: 9.15svh;
width: 9.34vh;
width: 9.34svh;
margin-top: 4.46vh;
margin-top: 4.46svh;
margin-left: 5.78vh;
margin-left: 5.78svh;
}

.trivia_crack_v1 .sso-register-success-icon{
margin: auto;
}

.sso-register-success-title {
font-family: "SegoeBL", "serif";
font-size: 2.62vh;
font-size: 2.62svh;
color: var(--color-texto-1);
}

.sso-register-success-subtitle {
font-family: "SegoeRegular", "serif";
font-size: 2.10vh;
font-size: 2.10svh;
color: var(--color-texto-1);
width: 34.17vh;
width: 34.17svh;
margin-top: 0.63vh;
margin-top: 0.63svh;
}

.button-text{
font-family: "SegoeRegular", "serif";
font-size: 1.68vh;
font-size: 1.68svh;
}

.google-icon {
background-image: url(/fb04dcb6/static/media/Logo_Google.28f8aa95cfb5abe5ee65.svg);
background-size: cover;
background-repeat: no-repeat;
width: 2.58vh;
width: 2.58svh;
height: 2.64vh;
height: 2.64svh;
margin-right: 1.3vh;
margin-right: 1.3svh;
}

@layer components {
    .basic-row {
        color: var(--color-texto-1);
        width: 16.72vh;
        width: 16.72svh;
        height: 4.84vh;
        height: 4.84svh;
        border-radius: 4vh;
        border-radius: 4svh;
        border: 2px solid var(--gris-claro);
        display: flex;
        align-items: center;
    }

    .basic-row-label {
        width: 29%;
        height: 100%;
        display: flex;
        align-items: center;
        padding-left: 1.5vh;
        padding-left: 1.5svh;
        border-right: #4D4E60 solid 0.1vh;
        border-right: #4D4E60 solid 0.1svh;
    }

    .basic-row-label-required {
        color: red;
        font-size: 1.3rem;
        margin-left: 0.3rem;
    }

    .basic-row-input {
        width: 100%;
    }

    .basic-row-input-open-button {
        width: 2vh;
        width: 2svh;
        height: 2vh;
        height: 2svh;
    }

    .custom-dropdown {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .custom-dropdown-button {
        cursor: pointer;
    }

    .custom-dropdown-button-arrow{
        width: 1.05vh;
        width: 1.05svh;
        height: 0.63vh;
        height: 0.63svh;
        margin-right: 1.47vh;
        margin-right: 1.47svh;
        background-image: url(/fb04dcb6/static/media/down-arrow.1852bb2ce67ec3720519.svg);
        background-repeat: no-repeat;
        background-size: contain;
    }

    .trivia_crack_v1 .custom-dropdown-button-arrow{
        background-image: url(/fb04dcb6/static/media/down_arrow_light.d39a4072c4a1f24418b0.svg);
    }

    .custom-dropdown-button-icon-country{
        width: 2vh;
        width: 2svh;
        height: 2vh;
        height: 2svh;
        margin-left: 1.47vh;
        margin-left: 1.47svh;
        margin-right: 1vh;
        margin-right: 1svh;
        background-image: url(/fb04dcb6/static/media/Country_Icon.6403004b7109387f6bcc.svg);
        background-repeat: no-repeat;
        background-size: contain;
    }

    .custom-dropdown-button-icon-gender{
        height: 1.99vh;
        height: 1.99svh;
        width: 1.78vh;
        width: 1.78svh;
        margin-left: 1.68vh;
        margin-left: 1.68svh;
        margin-right: 1.15vh;
        margin-right: 1.15svh;
        background-image: url(/fb04dcb6/static/media/Gender_Icon.eda205d2700ef86a3281.svg);
        background-repeat: no-repeat;
        background-size: contain;
    }

    .custom-dropdown-content {
        display: none;
        position: absolute;
        width: 16.72vh;
        width: 16.72svh;
        height: 22vh;
        height: 22svh;
        color: var(--color-texto-1);
        z-index: 1;
    }

    .trivia_crack_v1 .custom-dropdown-content{
        color: var(--color-text-button);
    }

    .custom-dropdown-content-visible {
        display: flex;
        flex-direction: column;
    }

    .custom-dropdown-input {
        padding: 0.9vh;
        padding: 0.9svh;
    }

    .custom-dropdown-options {
        width: 100%;
        height: auto;
        overflow: scroll;
        background: var(--toggle-sliders);
        border-radius: 2.4vh;
        border-radius: 2.4svh;
    }

    .custom-dropdown-option {
        margin: 1vh;
        margin: 1svh;
        cursor: pointer;
    }

    .custom-dropdown-options.search{
        width: 100%;
        height: 100%;
        overflow: scroll;
        background: var(--toggle-sliders);
        border-radius: 0 0 2vh 2vh;
        border-radius: 0 0 2svh 2svh;
    }

    .custom-dropdown-option.search{
        height: 2.6vh;
        height: 2.6svh;
        text-align: left;
        margin-left: 1.47vh;
        margin-left: 1.47svh;
        cursor: pointer;
    }

    .custom-dropdown-option:hover {
        background-color: var(--question-pressed);
    }

    .custom-dropdown-modal {
        position: fixed;
        inset: 0;
    }

    .custom-dropdown-modal ~ * {
        z-index: 2;
    }

    .custom-dropdown-search {
        height: 6vh;
        height: 6svh;
        background: var(--toggle-sliders);
        border-radius: 2vh 2vh 0 0;
        border-radius: 2svh 2svh 0 0;
        width: 100%;
    }

    .custom-dropdown-search input{
        font-family: "SegoeRegular", serif;
        font-size: 1.68vh;
        font-size: 1.68svh;
        text-align: center;
        background: none;
        border: none;
        outline: none;
        color: var(--color-text-button);
        height: 100%;
        width: 13vh;
        width: 13svh;
    }

    .search-icon{
        margin-left: 0.5vh;
        margin-left: 0.5svh;
        width: 1.68vh;
        width: 1.68svh;
        height: 1.68vh;
        height: 1.68svh;
    }
}

.signup-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    flex-grow: 1;
}

.signup-container {
    height: 100%;
    width: 100%;
    gap: 1vh;
    gap: 1svh;
}

.signin-content .signup-container .title {
    height: 5.57vh;
    height: 5.57svh;
    width: 100%;
    margin-top: 2.31vh;
    margin-top: 2.31svh;
}

.signup-content .signup-container .inputs-container {
    height: 43vh;
    height: 43svh;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 1.68vh;
    font-size: 1.68svh;
}

.signin-content .signup-container .quick-inputs-container {
    height: 29.54vh;
    height: 29.54svh;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 1.68vh;
    font-size: 1.68svh;
}

.full-screen-component .signup-content {
    height: 86.9%;
}

.full-screen-component .signup-container {
    height: 92.9%;
}

.signup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.signup-content .title {
    font-size: 4.2vh;
    font-size: 4.2svh;
    font-family: "SegoeBL", serif;
    height: 5.57vh;
    height: 5.57svh;
    width: 100%;
    text-align: center;
    color: var(--color-texto-1);
    margin-top: 1.5vh;
    margin-top: 1.5svh;
}

.signup-panel {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    border-radius: 0 0 1.1vh 1.1vh;
    border-radius: 0 0 1.1svh 1.1svh;
    background-color: transparent;
}

.full-screen-component .signup-panel {
    height: 93%;
    border-radius: 1.1vh;
    border-radius: 1.1svh;
}

.signup-brand-logo {
    height: 21.2%;
    width: 75.6%;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.signup-welcome-text {
    font-size: 4vh;
    font-size: 4svh;
    font-family: "SegoeBL";
    height: 12vh;
    height: 12svh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

.check {
    background-color: #707070;
    border-radius: 50%;
    border: 1px solid #ddd;
    -webkit-appearance: none;
}

.eterfy-input-invalid .check {
    background-color: var(--error-opacity);
    opacity: 10;
    border-radius: 50%;
    border: 1px solid var(--error);
    -webkit-appearance: none;
}

.check:checked {
    background-color: var(--toggle-sliders);
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAABPklEQVR4AbVU222EMBA0gQ8QP6SCUEJK4Dqhg5QQUkGuA18HV8IpFaSE0AFIvBHg7Eh2RHy2L5GSlRbWr5nx7gJjf2Sea3EYhnRZlhRxEARlFEUl+421bZsTyIVcaP5BnpvO3BlUcN/3OYUl+SEMw3s44m3b3ujNx3E8CyESqxLa8ApWUvRo24PrSmUX5rgO5KfshoFI7s1NTMgJdwFM0/SslHRdd+r7/v3bhqqqEjA0TZPdABEEUEjiDGOyh70aNZko6ftk6iAm8gAPqlK9rusXMI3PdLgmsMM8z09UrYL8JY7jgrlMR1eVoRxUuhL9FlfF0ZOtwEwgcp1fJXvP4OohjUTYupwRw1E2W2oDkT2Eax+ZyyQY2DhyhurBEWNO5uzEfmKQbPloMZeZzjh/I1BC7CliKn3peV7N/ts+AZhUfVLWJZ00AAAAAElFTkSuQmCC);
    background-size: contain;
    border-color: var(--gris-claro);
}

.signup-form {
    width: 100%;
    gap: 1vh;
    gap: 1svh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.signup-extra-info-panel .eterfy-input {
    text-align: start;
    text-align-last: start;
    padding-left: 0;
    border: none;
    margin-left: 1vh;
    margin-left: 1svh;
}

.link {
    text-decoration: underline;
    cursor: pointer;
    margin: 0;
    font-family: "SegoeBL", serif;
    font-size: 1.47vh;
    font-size: 1.47svh;
    color: var(--celeste);
}

.signup-input-date input[type="date"]::-webkit-calendar-picker-indicator {
    background-image: none;
    display: block;
}

.signup-input-country select {
    -webkit-appearance: none;
    appearance: none;
    background: url(/fb04dcb6/static/media/country-icon.35faf16fb68df210d0cb.svg) no-repeat 10% 50%;

}

.signup-input-gender select {
    -webkit-appearance: none;
    appearance: none;
    background: url(/fb04dcb6/static/media/down-arrow.1852bb2ce67ec3720519.svg) no-repeat calc(100% - 2.4vh) 50%;
    background: url(/fb04dcb6/static/media/down-arrow.1852bb2ce67ec3720519.svg) no-repeat calc(100% - 2.4svh) 50%;
}

input[type=date]::-webkit-datetime-edit-text {
    -webkit-appearance: none;
    display: none;
}

input[type=date]::-webkit-datetime-edit-month-field {
    -webkit-appearance: none;
    display: none;
}

input[type=date]::-webkit-datetime-edit-day-field {
    -webkit-appearance: none;
    display: none;
}

input[type=date]::-webkit-datetime-edit-year-field {
    -webkit-appearance: none;
    display: none;
}

.signup-input-panel {
    width: 16.72vh;
    width: 16.72svh;
    height: 4.84vh;
    height: 4.84svh;
}

.signup-extra-info-panel .flex-row-space-between {
    margin-bottom: 2.1vh;
    margin-bottom: 2.1svh;
}

.signup-accept-container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin-top: 1.5vh;
    margin-top: 1.5svh;
}

.condition-container {
    width: 100%;
    height: 6.52vh;
    height: 6.52svh;
    margin-top: 0.42vh;
    margin-top: 0.42svh;
    margin-left: 1.47vh;
    margin-left: 1.47svh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    font-size: 1.47vh;
    font-size: 1.47svh;
    color: var(--color-texto-1);
}

.adult-container {
    width: 100%;
    height: 2vh;
    height: 2svh;
    text-align: center;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.terms-container {
    width: 100%;
    height: 100%;
    margin-top: 0.95vh;
    margin-top: 0.95svh;
    display: flex;
    flex-direction: row;
    text-align: start;
    align-items: center;
    border: 0;
}

.signup-content .action-buttons {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.signup-extra-info-panel {
    height: 11.67vh;
    height: 11.67svh;
    width: 35.23vh;
    width: 35.23svh;
}

.signup-accept-container.terms {
    display: flex;
    flex-direction: column;
    align-items: baseline;
}

.adult-container.eterfy-input-invalid {
    color: var(--error);
    border: 0;
}

.signup-content .wide-button {
    color: var(--color-text-button);
}


.dynamic-fields-container {
    width: 35.23vh;
    width: 35.23svh;
    display: flex;
    flex-wrap: wrap;
    gap: 2.1vh;
    gap: 2.1svh;
}

.optional-field-item {
    width: 16.565vh;
    width: 16.565svh;
}

.rmdp-input{
    height: 100% !important;
    width: 100%;
    border: none !important;
    background: transparent;
    color: white;
    text-align: start;
    padding: 0 !important;
    margin: 0 !important;
    border-radius:0 !important;
    font-size: 1.68vh;
    font-size: 1.68svh;
}

.rmdp-container {
    margin-left: 1vh;
    margin-left: 1svh;
    width: 9.67vh;
    width: 9.67svh;
}

.eterfy-input-invalid .rmdp-container .rmdp-input{
    color: var(--error);
}

.eterfy-input-invalid .rmdp-container .rmdp-input:-ms-input-placeholder{
    color: var(--error);
}

.eterfy-input-invalid .rmdp-container .rmdp-input::placeholder{
    color: var(--error);
}

.trivia_crack_v1 .rmdp-input {
    color: black;
}

.galaxy-calendar.rmdp-wrapper,
.galaxy-calendar .rmdp-month-picker,
.galaxy-calendar .rmdp-year-picker,
.galaxy-calendar .rmdp-time-picker div input,
.rmdp-container .galaxy-calendar.ep-arrow::after {
    background-color: var(--toggle-sliders);
    color: var(--color-texto-1);
}

.galaxy-calendar .rmdp-day:not(.rmdp-deactive),
.galaxy-calendar .rmdp-time-picker div .rmdp-am,
.galaxy-calendar .rmdp-header-values,
.galaxy-calendar .rmdp-panel-header {
    color: var(--color-texto-1);
}

.trivia_crack_v1 .galaxy-calendar .rmdp-day:not(.rmdp-deactive),
.trivia_crack_v1 .galaxy-calendar .rmdp-time-picker div .rmdp-am,
.trivia_crack_v1 .galaxy-calendar .rmdp-header-values,
.trivia_crack_v1 .galaxy-calendar .rmdp-panel-header
{
    color: var(--color-text-button);
}

.galaxy-calendar .rmdp-day.rmdp-range {
    color: var(--color-texto-1);
}

.galaxy-calendar .rmdp-panel-body li {
    color: var(--color-texto-1);
}

.galaxy-calendar .rmdp-day.rmdp-deactive,
.galaxy-calendar .rmdp-day.rmdp-disabled {
    color: var(--color-texto-1);
}

.rmdp-container .galaxy-calendar.ep-arrow[direction="top"] {
    border-bottom: 1px solid #312f2f;
}

.rmdp-container .galaxy-calendar.ep-arrow[direction="left"] {
    border-right: 1px solid #312f2f;
}

.rmdp-container .galaxy-calendar.ep-arrow[direction="right"] {
    border-left: 1px solid #312f2f;
}

.rmdp-container .galaxy-calendar.ep-arrow[direction="bottom"] {
    border-top: 1px solid #312f2f;
}

.galaxy-calendar .rmdp-week-day {
    color: var(--color-texto-1);
}

.trivia_crack_v1 .galaxy-calendar .rmdp-week-day {
    color: var(--color-text-button);
}

.galaxy-calendar .rmdp-arrow {
    border: solid var(--color-texto-1);
    border-width: 0 2px 2px 0;
    margin-top: 0px;
}

.trivia_crack_v1 .galaxy-calendar .rmdp-arrow {
    border: solid var(--color-text-button);
    border-width: 0 2px 2px 0;
    margin-top: 0px;
}

.galaxy-calendar .rmdp-arrow-container{
    align-items: center;
}

.galaxy-calendar .rmdp-arrow-container:hover {
    background-color: var(--degradado-1);
}

.galaxy-calendar .rmdp-day.rmdp-today span {
    background-color: var(--gris-claro);
}

.galaxy-calendar .rmdp-day.rmdp-selected span:not(.highlight) {
    background-color: var(--degradado-1);
}

.galaxy-calendar .rmdp-day:not(.rmdp-disabled):not(.rmdp-day-hidden) span:hover{
    background-color: var(--degradado-1);
}


.mail-unverified-content {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 70.8%;
    margin-top: 23.87vh;
    margin-top: 23.87svh;
}
.mail-unverified-content .input-panel{
    width: 100%;
    margin-top: 2vh;
    margin-top: 2svh;
    margin-bottom: 0;
}

.mail-unverified-popup {
    width: 37.5vh;
    width: 37.5svh;
    height: 40vh;
    height: 40svh;
    border-radius: 3vh;
    border-radius: 3svh;
    background: var(--toogle-bg-pop-up-bg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.mail-unverified-main-container {
    display: flex;
    width: 31.3vh;
    width: 31.3svh;
    height: 17vh;
    height: 17svh;
    align-items: center;
    flex-direction: column;
    margin-top: 14vh;
    margin-top: 14svh;
}

.mail-unverified-action-buttons {
    height: 6vh;
    height: 6svh;
    width: 33.8vh;
    width: 33.8svh;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.mail-unverified-action-buttons .wide-button {
    height: 5.89vh;
    height: 5.89svh;
    width: 16.3vh;
    width: 16.3svh;
}

.mail-unverified-action-buttons .wide-button.back {
    background: var(--button-grey);
}

.mail-unverified-action-buttons .wide-button.back {
    background: var(--gris-claro);
}

.mail-unverified-action-buttons .wide-button.back:hover {
    background: var(--back-button-hover);
}

.mail-unverified-action-buttons .wide-button.back:active {
    background: var(--back-button-hover);
}

.mail-unverified-action-buttons .wide-button:disabled {
    background: var(--button-grey);
    color: white;
}

.mail-unverified-action-buttons .wide-button.back {
    background: var(--button-grey);
}

.mail-unverified-popup .popup-title{
    margin-top: 1.6vh;
    margin-top: 1.6svh;
    margin-bottom: 0.8vh;
    margin-bottom: 0.8svh;
}

.mail-unverified-icon{
    background: url(/fb04dcb6/static/media/mail_unverified_icon.fb534d613287e359fd93.svg) no-repeat;
    background-size: contain;
    height: 7vh;
    height: 7svh;
    width: 10vh;
    width: 10svh;
    margin-top: 6vh;
    margin-top: 6svh;
    margin-left: 4.6vh;
    margin-left: 4.6svh;
}

.terms-title {
    font-family: "SegoeBL", serif;
    text-align: center;
    font-size: 3.1545vh;
    font-size: 3.1545svh;
    height: 4.2vh;
    height: 4.2svh;
    text-align: initial;
}

.terms-content .title {
    height: 9.9vh;
    height: 9.9svh;
    justify-content: flex-start;
    margin-top: 6.06vh;
    margin-top: 6.06svh;
    width: 36.06vh;
    width: 36.06svh;
}

.terms-subtitle {
    font-size: 2.1vh;
    font-size: 2.1svh;
    font-family: "SegoeRegular", serif;
    text-align: center;
    margin-top: 0.7vh;
    margin-top: 0.7svh;
    line-height: 2.6vh;
    line-height: 2.6svh;
    text-align: initial;
}

.terms-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 37.54vh;
    width: 37.54svh;
}

.terms-content .wide-button {
    margin-top: 6.02vh;
    margin-top: 6.02svh;
}

.termsAndCondition {
    color: var(--color-texto-1);
    font-size: 1.3vh;
    font-size: 1.3svh;
    font-family: "SegoeRegular", serif;
    text-align: justify;
    height: 41.5vh;
    height: 41.5svh;
    background-color: var(--toogle-bg-pop-up-bg);
    border-radius: 4vh;
    border-radius: 4svh;
    padding: 3vh 1.77vh 3vh 2.26vh;
    padding: 3svh 1.77svh 3svh 2.26svh;
    margin-top: 2.52vh;
    margin-top: 2.52svh;
}

.termsAndConditionLinks {
    color: var(--celeste);
}

.termsAndCondition > p{
    height: 100%;
    overflow-y: scroll;
    width: 100%;
    scrollbar-width: thin;
    padding-right: 1.54vh;
    padding-right: 1.54svh;
    scrollbar-color: var(--toggle-sliders) black;
}

p::-webkit-scrollbar {
    width: 1vh;
    width: 1svh;
}

p::-webkit-scrollbar-thumb {
    background-color: var(--toggle-sliders);
    border-radius: 2vh;
    border-radius: 2svh;
}

p::-webkit-scrollbar-track {
    background-color: var(--background);
}

.trivia_crack_v1 p::-webkit-scrollbar-track {
    background-color: var(--button-grey);
}

.terms-content-title {
    font-size: 3.15vh;
    font-size: 3.15svh;
    font-family: 'SegoeBL', serif;
    height: 10.6vh;
    height: 10.6svh;
    width: 100%;
    text-align: center;
    color: var(--color-texto-1);
    margin-top: 6.06vh;
    margin-top: 6.06svh;
}

.signin-screen-content {
    height: 76vh;
    height: 76svh;
    width: 36.2vh;
    width: 36.2svh;
    margin:auto;
}

.signin-content {
    flex-grow: 1;
}

.signin-container {
    height: 72.3vh;
    height: 72.3svh;
    justify-content: flex-end;
    margin-bottom: 15%;
    width: 35.22vh;
    width: 35.22svh;
}

.signin-tabs-panel {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.signin-tab-buttons {
    height: 5.88vh;
    height: 5.88svh;
    width: 35.22vh;
    width: 35.22svh;
    background-size: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20vh;
    border-radius: 20svh;
    margin-top: 3.74vh;
    margin-top: 3.74svh;
    background-color: var(--toogle-bg-pop-up-bg);
}

.signin-tab-button {
    flex-basis: 49%;
    justify-content: center;
    color: var(--color-texto-1);
    font-family: "SegoeBL", serif;
    font-size: 1.89vh;
    font-size: 1.89svh;
    cursor: pointer;
}

/*.signin-tab-button-active {
    background-color: var(--toggle-sliders);
    border-radius: 20vh;
    border-radius: 20svh;
    height: 90%;
    color: white;

    position: absolute;
    width: 50%;
    transition: left 0.3s ease-in-out;
}*/

.signin-tab-button-active {
    background-color: var(--toggle-sliders);
    border-radius: 20vh;
    height: 90%;
    color: white;
    position: absolute;
    width: 50%;
}











.signin-panel-quick{
    background: transparent;
    justify-content: flex-start;
}

.signin-tabs {
    width: 100%;
    height: 94%;
}

.signin-tab {
    width: 100%;
    height: 100%;
}

.signin-panel {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    background-color: var(--main-panel-color);
    border-radius: 1.1vh;
    border-radius: 1.1svh;
}

.signin-panel-quick {
    border-radius: 0 0 1.1vh 1.1vh;
    border-radius: 0 0 1.1svh 1.1svh;
}

.signin-separator {
    display: none;
}

.signin-splash {
    display: block;
    height: 11.5%;
    width: 52.9%;
    background-image: url(/fb04dcb6/static/media/characters.1fae462454e6cb50ba86.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.signin-brand-logo {
    height: 21.2%;
    width: 75.6%;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.signin-welcome-text {
    max-height: 25%;
    width: 87.2%;
    overflow: hidden;
}

.signin-form {
    width: 100%;
}

.signin-signup-title {
    margin-right: 0.5vh;
    margin-right: 0.5svh;
}

.signin-forgot-password .link{
    font-family: "SegoeRegular", serif;
}

.signin-content .title {
    font-size: 4.2vh;
    font-size: 4.2svh;
    font-family: 'SegoeBL', serif;
    width: 100%;
    text-align: center;
    color: var(--color-texto-1);
    margin-top: 6.7vh;
    margin-top: 6.7svh;
}

.survey.signin-content .title{
    margin-top: 16vh;
    margin-top: 16svh;
}

.signin-content .subtitle {
    font-size: 2.63vh;
    font-size: 2.63svh;
    font-family: 'SegoeRegular', serif;
    color: var(--color-texto-1);
    text-align: center;
}

.signin-content .inputs-container {
    height: 16.2vh;
    height: 16.2svh;
    width: 100%;
    margin-top: 5.05vh;
    margin-top: 5.05svh;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.input-panel {
    width: 35.23vh;
    width: 35.23svh;
    height: 6vh;
    height: 6svh;
    margin-bottom: 1.5vh;
    margin-bottom: 1.5svh;
}

.signin-content .signin-forgot-password {
    text-align: end;
    width: 35.23vh;
    width: 35.23svh;
    height: 2vh;
    height: 2svh;
    font-size: 1.47vh;
    font-size: 1.47svh;
}

.signin-content .action-buttons {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.signin-content .wide-button{
    color: var(--color-text-button);
}

.signin-content .wide-button:disabled {
    background: var(--button-grey);
}

.or-line {
    font-family: SegoeBL, serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.68vh;
    font-size: 1.68svh;
    color: var(--color-texto-1);
    height: 5.15vh;
    height: 5.15svh;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

.ssoLogin-component{
    height: 5.89vh;
    height: 5.89svh;
    width: 35.23vh;
    width: 35.23svh;
    border-radius: 5vh;
    border-radius: 5svh;
    overflow: hidden;
    background-color: white;
}

.trivia_crack_v1 .ssoLogin-component{
    border: 2px solid;
}

.ssoLogin-button-container{
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.termsAndCondition-texts {
    text-align: center;
    display: flex;
    align-items: start;
    margin-left: 2.31vh;
    margin-left: 2.31svh;
}

.terms-and-condition-check {
    font-family: "SegoeRegular", serif;
    font-size: 1.47vh;
    font-size: 1.47svh;
}

.signin-title {
    color: white;
    font-family: "SegoeBL", serif;
    text-align: center;
    height: 5.6vh;
    height: 5.6svh;
}

.signin-subtitle {
    color: white;
    font-size: large;
    font-family: "SegoeRegular", serif;
    text-align: center;
}

.reset-password-content {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100%;
    margin-top: 23.87vh;
    margin-top: 23.87svh;
}
.reset-password-content .input-panel{
    width: 100%;
    margin-top: 2vh;
    margin-top: 2svh;
    margin-bottom: 0;
}

.reset-password-action-buttons {
    height: 6vh;
    height: 6svh;
    width: 33.8vh;
    width: 33.8svh;
    margin-top: 3.33vh;
    margin-top: 3.33svh;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.signin-content .reset-password-action-buttons .wide-button {
    height: 5.89vh;
    height: 5.89svh;
    width: 16.3vh;
    width: 16.3svh;
}

.signin-content .reset-password-action-buttons .wide-button.back {
    background: var(--button-grey);
    color: var(--color-text-button);
}

.trivia_crack_v1 .signin-content .reset-password-action-buttons .wide-button.back {
    background: var(--gris-claro);
}

.signin-content .reset-password-action-buttons .wide-button.back:hover {
    background: var(--back-button-hover);
}

.signin-content .reset-password-action-buttons .wide-button.back:active {
    background: var(--back-button-hover);
}

.signin-content .reset-password-action-buttons .wide-button:disabled {
    background: var(--button-grey);
    color: white;
}

.popup-overlay{
    background: var(--background-overlay);
    width: 100%;
    height: 100%;
}
.reset-password-popup {
    width: 37.5vh;
    width: 37.5svh;
    height: 45.27vh;
    height: 45.27svh;
    border-radius: 3vh;
    border-radius: 3svh;
    background: var(--toogle-bg-pop-up-bg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.reset-password-icon-container.mask {
    width: 18vh;
    width: 18svh;
    height: 18.1vh;
    height: 18.1svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    margin-bottom: -13.84vh;
    margin-bottom: -13.84svh;
}

.trivia_crack_v1 .reset-password-icon-container.mask{
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
    z-index: 1;
}

.reset-password-icon {
    background: url(/fb04dcb6/static/media/Icon_Password_Recovery.e4983b297573bc102903.svg) no-repeat;
    background-size: contain;
    height: 10.32vh;
    height: 10.32svh;
    width: 8.46vh;
    width: 8.46svh;
    margin-top: 4vh;
    margin-top: 4svh;
    margin-left: 5.42vh;
    margin-left: 5.42svh;
}

.trivia_crack_v1 .reset-password-icon {
    margin: auto;
}

.reset-password-main-container {
    display: flex;
    width: 31.3vh;
    width: 31.3svh;
    height: 17.5vh;
    height: 17.5svh;
    align-items: center;
    flex-direction: column;
    margin-top: 15.4vh;
    margin-top: 15.4svh;
}
.reset-password-title {
    color: var(--color-texto-1);
    font-family: "SegoeBL", serif;
    font-size: 2.68vh;
    font-size: 2.68svh;
    font-style: inherit;
    line-height: normal;
}

.reset-password-subtitle{
    color: var(--color-texto-1);
    text-align: center;
    font-family: "SegoeRegular", serif;
    font-size: 2.14vh;
    font-size: 2.14svh;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 0.95vh;
    margin-top: 0.95svh;
}

.recovery-mail .eterfy-input{
    height: 5.86vh;
    height: 5.86svh;
}


.reset-password-content {
    height: 70.8%;
}

.reset-password-container {
    width: 100%;
    height: 69%;
}

.reset-password-panel {
    width: 100%;
    height: 80.5%;
    background-color: var(--main-panel-color);
    border-radius: 1.1vh;
    border-radius: 1.1svh;
}

.reset-password-message {
    width: 80%;
    text-align: left;
}

.reset-password-border {
    height: 5.6vh;
    height: 5.6svh;
    width: 87.2%;
    border: solid 0.1vh #28292b;
    border: solid 0.1svh #28292b;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.reset-password-input-panel {
    height: 6.6vh;
    height: 6.6svh;
    width: 87.2%;
}

.welcome-content {
    width: 36.2vh;
    width: 36.2svh;
    margin:auto;
    height: 76vh;
    height: 76svh;
}

.welcome-content .subtitle-content {
    margin-top: 2.3vh;
    margin-top: 2.3svh;
}

.trivia_crack_v1 .title-content{
    margin-top: 3vh;
    margin-top: 3svh;
}

.trivia_crack_v1 .subtitle-content{
    margin-top: 1vh;
    margin-top: 1svh;
}

.eterfy-brand {
    width: 25.5vh;
    width: 25.5svh;
    height: 10.1vh;
    height: 10.1svh;
    margin-top: 19.71vh;
    margin-top: 19.71svh;
    background: transparent url(/fb04dcb6/static/media/Eterfy_Logo.4f3b1b66106d23b3eee6.svg) no-repeat;
    background-size: contain;
}

/*.trivia_crack_v1 .eterfy-brand{
    width: 15vh;
    width: 15svh;
    height: 6vh;
    height: 6svh;
    margin-top: 11vh;
    margin-top: 11svh;
    background: transparent url("../../../assets/images/preguntados/Eterfy_Logo.svg") no-repeat;
    background-size: contain;
}*/

.trivia_crack_v1 .eterfy-brand{
    margin-top: 4vh;
    margin-top: 4svh;
    margin-bottom: 0;
    background-image: var(--logo-light);
}

.welcome-content .wide-button {
    background: white;
    color: var(--degradado-2);
}

.trivia_crack_v1 .welcome-content .wide-button {
    background: black;
    color: white;
}


.welcome-content .wide-button:hover {
    background: var(--white-button-hover);
}

.welcome-content .wide-button:active {
    background: var(--white-button-pressed);
}



.clicked {
    animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

@keyframes scale-up-center {
    0% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}

.welcome-content .wide-button:disabled {
    color: white;
    transition: background-color 0.3s ease-in-out;
}

.welcome-content .wide-button:disabled::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #707070;
    border-radius: 3vh;
    border-radius: 3svh;
    animation: expandCircle .4s ease-in-out forwards;
    z-index: -1;
}

@keyframes expandCircle {
    0% {
        width: 0;
        height: 100%;
        opacity: 1;
    }
    100% {
        width: 100%;
        height: 100%;
        opacity: 1;
    }
}

.welcome-center-image{
    width: 21.4vh;
    width: 21.4svh;
    height: 17vh;
    height: 17svh;
    margin-top: 3.36vh;
    margin-top: 3.36svh;
    background: url(/fb04dcb6/static/media/Welcome_Characters.9a98b7840de01a494dfe.png) no-repeat;
    background-size: contain;
}

.server-error-content {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.server-error-container {
    width: 100%;
    height: 66.3%;
}

.server-error-info {
    width: 70%;
    height: 15%;
    overflow: hidden;
}

.server-error-message {
    width: 70%;
    height: 24%;
    overflow: hidden;
}

.server-error-panel {
    width: 37.53vh;
    width: 37.53svh;
    height: 40vh;
    height: 40svh;
    background-color: var(--toogle-bg-pop-up-bg);
    opacity: 0.9;
    border-radius: 4vh;
    border-radius: 4svh;
}

.server-error-icon-container {
    height: 18.08vh;
    height: 18.08svh;
    width: 17.65vh;
    width: 17.65svh;
    margin-top: -7.57vh;
    margin-top: -7.57svh;
    margin-bottom: 2.4vh;
    margin-bottom: 2.4svh;
}



.server-error-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .server-error-icon-container.mask {
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.server-error-icon {
    height: 8.9vh;
    height: 8.9svh;
    width: 9.43vh;
    width: 9.43svh;
    margin-left: 4.8vh;
    margin-left: 4.8svh;
    margin-top: 4.62vh;
    margin-top: 4.62svh;
    background-image: url(/fb04dcb6/static/media/warning.30b482f30f81ac7c6d77.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.trivia_crack_v1 .server-error-icon{
    margin: auto;
}

.server-error-texts{
    height: 14.1vh;
    height: 14.1svh;
    width: 32.28vh;
    width: 32.28svh;
    color: var(--color-texto-1);
}

.server-error-texts .title{
    font-family: "SegoeBL", serif;
    font-size: 2.6vh;
    font-size: 2.6svh;
    text-align: center;
}

.server-error-texts .message{
    font-family: "SegoeRegular", serif;
    font-size: 2.1vh;
    font-size: 2.1svh;
    margin-top: 2.1vh;
    margin-top: 2.1svh;
}

.server-error-buttons-container {
    margin-top: 2.4vh;
    margin-top: 2.4svh;
}

.loading-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

.team-selection-content {
    width: 36.2vh;
    width: 36.2svh;
    margin: auto;
    height: 76vh;
    height: 76svh;
    color: var(--color-texto-1);
}

.team-selection-container .title {
    font-family: "SegoeBL", serif;
    width: 100%;
    text-align: left;
    font-size: 4.2vh;
    font-size: 4.2svh;
    line-height: 1.3;
}

.team-selection-container .subtitle {
    font-family: "SegoeRegular", serif;
    margin-top: 1vh;
    margin-top: 1svh;
    width: 31vh;
    width: 31svh;
    height: 11.1vh;
    height: 11.1svh;
    text-align: left;
    font-size: 2.6vh;
    font-size: 2.6svh;
}

.team-selection-main-container {
    width: 100%;
    margin-top: 4.9vh;
    margin-top: 4.9svh;
}

.team-selection-panel {
    margin-top: 1vh;
    margin-top: 1svh;
    width: 100%;
    border-radius: 1.1vh;
    border-radius: 1.1svh;
    display: flex;
    justify-content: center;
}

.teams-slider {
    position: relative;
    width: 130%;
    height: 51%;
}

.team-container {
    height: 24.5vh;
    height: 24.5svh;
    width: 24.08vh;
    width: 24.08svh;
    margin-inline: 3vh;
    margin-inline: 3svh;
}
.trivia_crack_v1 .team-container {
    margin-inline: 0
}

.team-icon-small-circle {
    position: absolute;
    width: 3.2vh;
    width: 3.2svh;
    height: 3.2vh;
    height: 3.2svh;
    /*z-index: 1;*/
    top: -0.3vh;
    top: -0.3svh;
    left: 9.8vh;
    left: 9.8svh;
}

.team-icon-small-circle.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Circulo_Chico.65a4c8692bd1c16c756b.svg);
    mask-image: url(/fb04dcb6/static/media/Circulo_Chico.65a4c8692bd1c16c756b.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.team-icon-container {
    display: flex;
    height: 100%;
    width: 100%;
}
.trivia_crack_v1 .team-icon-container {
    height: unset;
    width: unset;
}

.team-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/icon_container_avatar.d009ed307a20de0a4245.svg);
    mask-image: url(/fb04dcb6/static/media/icon_container_avatar.d009ed307a20de0a4245.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .team-icon-container.mask {
    background: transparent;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
}

.team-icon {
    background-repeat: no-repeat;
    background-size: contain;
    height: 20vh;
    height: 20svh;
    width: 20vh;
    width: 20svh;
    margin-top: 0.8vh;
    margin-top: 0.8svh;
    margin-left: 2.7vh;
    margin-left: 2.7svh;
}

.trivia_crack_v1 .team-icon{
   margin: 0;
}

.team-next-icon {
    background-image: url(/fb04dcb6/static/media/Next_Arrow.7fcc1c7902b98c5c9d4e.svg);
    height: 5.46vh;
    height: 5.46svh;
    width: 5.46vh;
    width: 5.46svh;
    z-index: 1;
    cursor: pointer;
}

.trivia_crack_v1 .team-next-icon {
    height: 2vh;
    height: 2svh;
    width: 2vh;
    width: 2svh;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAVCAYAAACt4nWrAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACGSURBVHgB7ZPRCYAgEIb/aJFG6LFHN9MNagNnaIOapE2yE3xQDOzojII++NAH+U/vEOChSUeOqICLtKXDLXg0pAr7nuzIGYIYMF/w+gLZkLk9j1mQzmAI6yoRflZAxQXuhhcLdOSGtH8S+g+XDUbSajc3EEL/wY8HWwjxvWDUDPZM5H41+AAfOXyDcEGgxQAAAABJRU5ErkJggg==);
}

.team-prev-icon {
    background-image: url(/fb04dcb6/static/media/Next_Arrow.7fcc1c7902b98c5c9d4e.svg);
    height: 5.46vh;
    height: 5.46svh;
    width: 5.46vh;
    width: 5.46svh;
    z-index: 1;
    cursor: pointer;
    transform: rotate(180deg);
}

.trivia_crack_v1 .team-prev-icon {
    height: 2vh;
    height: 2svh;
    width: 2vh;
    width: 2svh;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAVCAYAAACt4nWrAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACGSURBVHgB7ZPRCYAgEIb/aJFG6LFHN9MNagNnaIOapE2yE3xQDOzojII++NAH+U/vEOChSUeOqICLtKXDLXg0pAr7nuzIGYIYMF/w+gLZkLk9j1mQzmAI6yoRflZAxQXuhhcLdOSGtH8S+g+XDUbSajc3EEL/wY8HWwjxvWDUDPZM5H41+AAfOXyDcEGgxQAAAABJRU5ErkJggg==);
}

.team-avatar-container {
    height: 75%;
    width: 100%;
    position: relative;
}

.team-name-container {
    font-family: "SegoeRegular", serif;
    color: var(--color-texto-1);
    margin-top: 4.7vh;
    margin-top: 4.7svh;
    font-size: 2.6vh;
    font-size: 2.6svh;
}

.team-selection-content .wide-button {
    color: var(--color-text-button);
}

.team-avatar-icon-position {
    position: absolute;
    top: -37%;
    left: 50%;
    transform: translateX(-50%);
}

.team-selection-searchbar {
    width: 88%;
    height: 4vh;
    height: 4svh;
    z-index: 10;
}


.team-aux-container {
    display: none;
    position: absolute;
    z-index: -2;
    left: 5.5vh;
    left: 5.5svh;
}

.team-aux-container.team-icon-small-circle {
    left: 1vh;
    left: 1svh;
}

.team-aux-container_z {
    display: flex;
    z-index: 0;
}

.galaxy, .trivia_crack_v1 {
    --team-out: 0.8s;
    --team-in: 0.8s;
    --team-in-delay: 0.4s;
}

.team-out-left {
    animation: team-out-left var(--team-out) cubic-bezier(.51,0,.54,.68) both;
}


@keyframes team-out-left {
    0%, 8.7% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(12vw);
        transform: translateX(12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    91.3%{
        transform: translateX(-83.2vw);
        transform: translateX(-83.2svw);
    }
    100% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
}


.team-out-left-circle {
    animation: team-out-left-circle var(--team-out) cubic-bezier(.51,0,.54,.68) both;
}


@keyframes team-out-left-circle {
    0% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(12vw);
        transform: translateX(12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    85%{
        transform: translateX(-83.2vw);
        transform: translateX(-83.2svw);
    }
    100% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
}


.team-in-right {
    animation: team-in-right var(--team-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--team-in-delay) both;
}


@keyframes team-in-right {
    0%, 8.7% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
    30%{
        transform: translateX(88vw);
        transform: translateX(88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    80%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
    }
    100% {
        transform: translateX(0);
    }
}



.team-in-right-circle {
    animation: team-in-right-circle var(--team-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--team-in-delay) both;
}


@keyframes team-in-right-circle {
    0% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
    30%{
        transform: translateX(88vw);
        transform: translateX(88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    70%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
        left: 1vh;
        left: 1svh;
    }
    100% {
        transform: translateX(0.6vw);
        transform: translateX(0.6svw);
        left: 1vh;
        left: 1svh;
    }
}







.team-out-right {
    animation: team-out-right var(--team-out) cubic-bezier(.51,0,.54,.68) both;
}


@keyframes team-out-right {
    0% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    85%{
        transform: translateX(83.2vw);
        transform: translateX(83.2svw);
    }
    100% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
}


.team-out-right-circle {
    animation: team-out-right-circle var(--team-out) cubic-bezier(.51,0,.54,.68) both;
}


@keyframes team-out-right-circle {
    0%, 8.7% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    91.3%{
        transform: translateX(83.2vw);
        transform: translateX(83.2svw);
    }
    100% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
}


.team-in-left {
    animation: team-in-left var(--team-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--team-in-delay) both;
}


@keyframes team-in-left {
    0% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
    30%{
        transform: translateX(-88vw);
        transform: translateX(-88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    70%{
        transform: translateX(12vw);
        transform: translateX(12svw);
    }
    100% {
        transform: translateX(0);
    }
}


.team-in-left-circle {
    animation: team-in-left-circle var(--team-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--team-in-delay) both;
}


@keyframes team-in-left-circle {
    0%, 8.7% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
    30%{
        transform: translateX(-88vw);
        transform: translateX(-88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    80%{
        transform: translateX(12vw);
        transform: translateX(12svw);
        left: 1vh;
        left: 1svh;
    }
    100% {
        transform: translateX(0.6vw);
        transform: translateX(0.6svw);
        left: 1vh;
        left: 1svh;
    }
}
















@media (orientation: landscape) {


    @keyframes team-out-left {
        0%, 8.7% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(5vh);
            transform: translateX(5svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        100% {
            transform: translateX(-38vh);
            transform: translateX(-38svh);
            opacity: 0;
        }
    }


    @keyframes team-out-left-circle {
        0% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(5vh);
            transform: translateX(5svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        100% {
            transform: translateX(-45vh);
            transform: translateX(-45svh);
            opacity: 0;
        }
    }


    @keyframes team-in-right {
        0%, 8.7% {
            opacity: 0;
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
        }
        30%{
            opacity: 0;
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        50% {
            display: block;
        }
        80%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        100% {
            transform: translateX(0);
            opacity: 1;
        }
    }


    @keyframes team-in-right-circle {
        0% {
            opacity: 0;
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
        }
        8.7%{
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        30% {
            opacity: 0;
        }
        50% {
            display: block;
        }
        80%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        100% {
            transform: translateX(0.27vh);
            transform: translateX(0.27svh);
            left: 1vh;
            left: 1svh;
            opacity: 1;
        }
    }


    @keyframes team-out-right {
        0% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        85%{
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        100% {
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
            opacity: 0;
        }
    }


    @keyframes team-out-right-circle {
        0%, 8.7% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        91.3%{
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        100% {
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
            opacity: 0;
        }
    }


    @keyframes team-in-left {
        0% {
            opacity: 0;
            transform: translateX(-34.3vh);
            transform: translateX(-34.3svh);
        }
        30%{
            opacity: 0;
            transform: translateX(-39vh);
            transform: translateX(-39svh);
        }
        50% {
            display: block;
        }
        70%{
            transform: translateX(2vh);
            transform: translateX(2svh);
        }
        100% {
            transform: translateX(0);
            opacity: 1;
        }
    }


    @keyframes team-in-left-circle {
        0%, 8.7% {
            opacity: 0;
            transform: translateX(-34.3vh);
            transform: translateX(-34.3svh);
        }
        30%{
            opacity: 0;
            transform: translateX(-39vh);
            transform: translateX(-39svh);
        }
        50% {
            display: block;
        }
        80%{
            transform: translateX(2vh);
            transform: translateX(2svh);
        }
        100% {
            transform: translateX(0.27vh);
            transform: translateX(0.27svh);
            left: 1vh;
            left: 1svh;
            opacity: 1;
        }
    }
}




.dark-light-selection-content {
    width: 36.2vh;
    width: 36.2svh;
    margin:auto;
    height: 76vh;
    height: 76svh;
}

.dark-light-selection-container {
    height: 100%;
}

.dark-light-selection-container .title {
    font-family: "SegoeBL", serif;
    color: var(--color-texto-1);
    text-align: start;
    font-size: 4.2vh;
    font-size: 4.2svh;
    line-height: 1.3;
}

.dark-light-selection-main-container {
    width: 100%;
    margin-top: 4.9vh;
    margin-top: 4.9svh;
}

.dark-light-selection-panel {
    margin-top: 13.2vh;
    margin-top: 13.2svh;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.dark-light-icon-container {
    height: 24.5vh;
    height: 24.5svh;
    width: 24.08vh;
    width: 24.08svh;
}

.dark-light-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.d-dark-light-icon {
    position: relative;
    background-image: url(/fb04dcb6/static/media/dark_icon.b768c14e9f1d2e16e526.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 11.18vh;
    height: 11.18svh;
    width: 10vh;
    width: 10svh;
    margin-top: 6.73vh;
    margin-top: 6.73svh;
    margin-left: 8.24vh;
    margin-left: 8.24svh;
}

.l-dark-light-icon {
    position: relative;
    background-image: url(/fb04dcb6/static/media/Light_Icon.075c8d3f0f99bf6c755a.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 11.21vh;
    height: 11.21svh;
    width: 11.21vh;
    width: 11.21svh;
    margin-top: 6.73vh;
    margin-top: 6.73svh;
    margin-left: 7.22vh;
    margin-left: 7.22svh;
}

.dark-light-icon {
    background-repeat: no-repeat;
    background-size: contain;
}

.dark-light-selection-container .wide-button{
    color: var(--color-text-button);
}

.dark-light-switch {
    color: white;
    margin-top: 5.04vh;
    height: 5.89vh;
}






/* Contenedor principal (asegura posición relativa y máscara) */
.dark-light-icon-container {
    position: relative; /* Necesario para posicionar los íconos de forma absoluta */
    height: 24.5vh;
    height: 24.5svh;
    width: 24.08vh;
    width: 24.08svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

/* Íconos superpuestos (posición absoluta dentro del contenedor) */
.d-dark-light-icon, .l-dark-light-icon {
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
}

/* Posición y tamaño del ícono oscuro (originalmente con margin-top y margin-left) */
.d-dark-light-icon {
    background-image: url(/fb04dcb6/static/media/dark_icon.b768c14e9f1d2e16e526.svg);
    height: 11.18vh;
    height: 11.18svh;
    width: 10vh;
    width: 10svh;
}

/* Posición y tamaño del ícono claro (originalmente con margin-top y margin-left) */
.l-dark-light-icon {
    background-image: url(/fb04dcb6/static/media/Light_Icon.075c8d3f0f99bf6c755a.svg);
    height: 11.21vh;
    height: 11.21svh;
    width: 11.21vh;
    width: 11.21svh;
}

.mode-fade-in-bottom {
    animation: mode-fade-in-bottom var(--mode-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) 0.2s both;
}
@keyframes mode-fade-in-bottom {
    0%,20% {
        transform: translateY(20vh);
        transform: translateY(20svh);
    }
    80% {
        transform: translateY(-1vh);
        transform: translateY(-1svh);
    }
    100% {
        transform: translateY(0);
    }
}

.mode-fade-in-top {
    animation: mode-fade-in-top var(--mode-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) 0.2s both;
}
@keyframes mode-fade-in-top {
    0%, 20% {
        transform: translateY(-20vh);
        transform: translateY(-20svh);
    }
    80% {
        transform: translateY(1vh);
        transform: translateY(1svh);
    }
    100% {
        transform: translateY(0);
    }
}

.bounce {
    animation: bounce 0.4s cubic-bezier(.71,-0.01,.97,.8) both;
}
@keyframes bounce {
    0% {
        transform: translateY(0vh);
        transform: translateY(0svh);
    }
    80%,99% {
        transform: translateY(2vh);
        transform: translateY(2svh);
    }
    100% {
        transform: translateY(0);
    }
}


.mode-fade-out-bottom {
    animation: mode-fade-out-bottom var(--mode-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes mode-fade-out-bottom {
    0% {
        transform: translateY(0);
    }
    20% {
        transform: translateY(-1vh);
        transform: translateY(-1svh);
    }
    100% {
        transform: translateY(20vh);
        transform: translateY(20svh);

    }
}

.mode-fade-out-top {
    animation: mode-fade-out-top var(--mode-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes mode-fade-out-top {
    0% {
        transform: translateY(0);
    }
    20% {
        transform: translateY(1vh);
        transform: translateY(1svh);
    }
    100% {
        transform: translateY(-20vh);
        transform: translateY(-20svh);

    }
}

.switch {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 15.96vh;
    width: 15.96svh;
    height: 5.89vh;
    height: 5.89svh;
    margin-top: 5.2vh;
    margin-top: 5.2svh;
}

.switch input {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    cursor: pointer;
}

.slider {
    width: 100%;
    height: 100%;
    display: flex;
    cursor: pointer;
    margin: 0;
    background-color: var(--toggle-background);
    transition: 0.4s;
    border-radius: 10vh;
    border-radius: 10svh;
}

.slider:before {
    display: flex;
    content: "";
    height: 4.62vh;
    height: 4.62svh;
    width: 4.62vh;
    width: 4.62svh;
    margin: 0.63vh 0 0.63vh 0.63vh;
    margin: 0.63svh 0 0.63svh 0.63svh;
    background-color: var(--color-switch);
    transition: 0.4s;
    border-radius: 50%;
}

input:checked + .slider {
    background-color: var(--toggle-sliders);
}

input:checked + .slider:before {
    transform: translateX(10.1vh);
    transform: translateX(10.1svh);
}

.dark-text {
    font-family: "SegoeRegular", serif;
    font-size: 1.9vh;
    font-size: 1.9svh;
    color: var(--color-switch);
    width: 4.2vh;
    width: 4.2svh;
    margin-left: 2vh;
    margin-left: 2svh;
    transition: 0.4s;
    line-height: 1;
}

.light-text {
    font-family: "SegoeRegular", serif;
    font-size: 1.9vh;
    font-size: 1.9svh;
    color: var(--color-switch);
    width: 4.2vh;
    width: 4.2svh;
    margin-left: -1.15vh;
    margin-left: -1.15svh;
    transition: 0.4s;
    line-height: 1;
}

.ready-screen-content {
    width: 100%;
    height: 76vh;
    height: 76svh;
}

.ready-container {
    height: 100%;
}

.ready-main-container {
    margin-top: 13.8vh;
    margin-top: 13.8svh;
}

.trivia_crack_v1 .ready-main-container {
    margin-top: 10.3vh;
    margin-top: 10.3svh;
}


.ready-icon-container {
    height: 18.5vh;
    height: 18.5svh;
    width: 18.1vh;
    width: 18.1svh;
}

.ready-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .ready-icon-container.mask {
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.ready-icon {
    background-image: url(/fb04dcb6/static/media/Ready_Icon.902dea7fa4542120549a.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 9.66vh;
    height: 9.66svh;
    width: 10.85vh;
    width: 10.85svh;
    margin-top: 3.7vh;
    margin-top: 3.7svh;
    margin-left: 4.14vh;
    margin-left: 4.14svh;
}

.trivia_crack_v1 .ready-icon{
    margin: auto;
}

.ready-title {
    font-family: "SegoeBL", serif;
    margin-top: 2.3vh;
    margin-top: 2.3svh;
    width: 34vh;
    width: 34svh;
    height: 5.57vh;
    height: 5.57svh;
    color: var(--color-texto-1);
    font-size: 4.2vh;
    font-size: 4.2svh;
}


.ready-subtitle {
    font-family: "SegoeRegular", serif;
    margin-top: 1vh;
    margin-top: 1svh;
    width: 36vh;
    width: 36vh;
    height: 7vh;
    height: 7svh;
    color: var(--color-texto-1);
    font-size: 2.63vh;
    font-size: 2.63svh;
}

.ready-container .wide-button{
    color: var(--color-text-button);
}

.ready-center-image{
    width: 19vh;
    width: 19svh;
    height: 17.5vh;
    height: 17.5svh;
    margin-top: 3.4vh;
    margin-top: 3.4svh;
    background: url(/fb04dcb6/static/media/Car.0fae1d1a9cf12441a972.svg) no-repeat;
    background-size: contain;
}

.frequency-questions-container {
    height: 76vh;
    height: 76svh;
    width: 40.69vh;
    width: 40.69svh;
    margin: auto;
}

.frequency-main-container{
    margin-top: 3.96vh;
    margin-top: 3.96svh;
}

.frequency-questions-container .title {
    color: var(--color-texto-1);
    font-family: "SegoeBL", serif;
    font-size: 4.2vh;
    font-size: 4.2svh;
    height: 10.3vh;
    height: 10.3svh;
    width: 100%;
    text-align: start;
    margin-left: 2.73vh;
    margin-left: 2.73svh;
}

.frequency-questions-container .wide-button{
    color: var(--color-text-button);
}

.question {
    font-family: "SegoeBL", serif;
    font-size: 2.1vh;
    font-size: 2.1svh;
    color: var(--toggle-sliders);
    text-align: start;
}

.show-answer .question{
    color: var(--color-texto-1);
}

.question-arrow {
    background: var(--toggle-sliders) no-repeat;
    background-size: 100%;
}

.show-answer .question-arrow{
    background: var(--color-texto-1) no-repeat;
}

.question-arrow.mask {
    width: 3.26vh;
    width: 3.26svh;
    height: 3.26vh;
    height: 3.26svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/question_arrow.f30b340064760959d40f.svg);
    mask-image: url(/fb04dcb6/static/media/question_arrow.f30b340064760959d40f.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    transition: 0.3s;
}

.show-answer .question-arrow.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/question_arrow.f30b340064760959d40f.svg);
    mask-image: url(/fb04dcb6/static/media/question_arrow.f30b340064760959d40f.svg);
    transform: rotate(90deg);
    transition: 0.3s;
}

.question-section {
    display: flex;
    margin-bottom: 1.47vh;
    margin-bottom: 1.47svh;
    cursor: pointer;
}

.frequency-questions-panel {
    width: 40.69vh;
    width: 40.69svh;
    height: 49.1vh;
    height: 49.1svh;
    background-color: var(--toogle-bg-pop-up-bg);
    border-radius: 5vh;
    border-radius: 5svh;
    margin-top: 2.73vh;
    margin-top: 2.73svh;
}

.frecuency-question-scroll {
    height: 42.5vh;
    height: 42.5svh;
    width: 36.71vh;
    width: 36.71svh;
    overflow-y: scroll;
    scrollbar-width: thin;
    padding-right: 1.54vh;
    padding-right: 1.54svh;
    scrollbar-color: var(--toggle-sliders) black;
}

.frecuency-question-scroll::-webkit-scrollbar {
    width: 1vh;
    width: 1svh;
}

.frecuency-question-scroll::-webkit-scrollbar-thumb {
    background-color: var(--toggle-sliders);
    border-radius: 2vh;
    border-radius: 2svh;
}

.frecuency-question-scroll::-webkit-scrollbar-track {
    background-color: var(--background);
    border-radius: 2vh;
    border-radius: 2svh;
}

.answer {
    color: var(--color-texto-1);
    font-family: "SegoeRegular", serif;
    font-size: 1.68vh;
    font-size: 1.68svh;
    text-align: start;
    margin-left: 3.26vh;
    margin-left: 3.26svh;
}

.profile-content {
    height: 77vh;
    height: 77svh;
    width: 100%;
    margin: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4.17vh;
    margin-top: 4.17svh;
    margin-bottom: 2.41vh;
    margin-bottom: 2.41svh;
}

.profile-content .title,
.profile-content-team .title {
    font-family: "SegoeBL", serif;
    font-size: 4.2vh;
    font-size: 4.2svh;
    color: var(--color-texto-1);
    height: 5.57vh;
    height: 5.57svh;
    text-align: start;
    width: 35.12vh;
    width: 35.12svh;
}

.profile-form .input-panel {
    height: 5.78vh;
    height: 5.78svh;
}

.profile-form .disabled {
    cursor: not-allowed;
}

.profile-form .title {
    font-family: "SegoeRegular", serif;
    font-size: 1.68vh;
    font-size: 1.68svh;
    color: var(--color-texto-1);
    height: 2.2vh;
    height: 2.2svh;
    text-align: start;
    width: 35.12vh;
    width: 35.12svh;
    margin-left: 2.36vh;
    margin-left: 2.36svh;
}

.profile-info-icon-content{
    height: 19vh;
    height: 19svh;
    width: 100%;
    margin-top: 1.78vh;
    margin-top: 1.78svh;
    display: flex;
}

.profile-info-icon-container.mask {
    height: 18.08vh;
    height: 18.08svh;
    width: 17.65vh;
    width: 17.65svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-size: contain;
            mask-size: contain;
}

.trivia_crack_v1 .profile-info-icon-container.mask {
    background: transparent;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.profile-info-icon {
    background-image: url(/fb04dcb6/static/media/non-avatar-profile.38274400d82c7ab2ce1f.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: 13.21vh;
    height: 13.21svh;
    width: 13.21vh;
    width: 13.21svh;
    margin-left: 2.78vh;
    margin-left: 2.78svh;
    margin-top: 2.76vh;
    margin-top: 2.76svh;
}

.trivia_crack_v1 .profile-info-icon {
    background-image: url(/fb04dcb6/static/media/edit_profile_no_avatar.3090e2be07185beeb09e.svg);
}

.profile-panel {
    height: 31.75vh;
    height: 31.75svh;
    width: 35.12vh;
    width: 35.12svh;
    margin-top: 1.78vh;
    margin-top: 1.78svh;
}

.profile-info {
    height: 2.20vh;
    height: 2.20svh;
}

.profile-name {
    font-family:"SegoeRegular", serif;
    font-size: 1.68vh;
    font-size: 1.68svh;
    color: var(--color-texto-1);
    margin: 1.57vh 0 0;
    margin: 1.57svh 0 0;
}

.profile-form {
    width: 100%;
    height: 100%;
}

.profile-input-panel {
    width: 100%;
    height: 5.78vh;
    height: 5.78svh;
}

.profile-buttons{
    height: 5.88vh;
    height: 5.88svh;
    width: 35.12vh;
    width: 35.12svh;
    margin-top: 3.05vh;
    margin-top: 3.05svh;
}

.profile-content-team .profile-buttons{
    margin-top: 2.83vh;
    margin-top: 2.83svh;
}

.profile-buttons .wide-button {
    height: 100%;
    width: 15.98vh;
    width: 15.98svh;
}

.profile-buttons .wide-button.cancel{
    background: var(--button-grey);
}

.profile-buttons .wide-button.cancel:hover{
    background: var(--back-button-hover);
}

.profile-buttons .wide-button.cancel:active{
    background: var(--back-button-hover);
}

.profile-form-button {
    height: 6.5vh;
    height: 6.5svh;
    width: 16vh;
    width: 16svh;
}

.profile-form-button-cancel{
    border: solid 2px #000000;
    color: #000000;
    background: transparent;
}

.profile-form .input-panel #name::after {
    content: "";
    position: absolute;
    width: 2.1vh;
    width: 2.1svh;
    height: 2.1vh;
    height: 2.1svh;
    right: 0;
    margin-right: 1.94vh;
    margin-right: 1.94svh;
    translate: 0% -50%;
    background: url(/fb04dcb6/static/media/Edit_Icon.953a3f3f26b1fc216bf2.svg) no-repeat;
    background-size: contain;
}

.profile-form .input-panel .max-size{
    position: absolute;
    height: 5.78vh;
    height: 5.78svh;
    width: 35.23vh;
    width: 35.23svh;
}

.edit-profile-content {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100%;
    margin-top: 32.07vh;
    margin-top: 32.07svh;
}

.edit-profile-popup {
    width: 33.05vh;
    width: 33.05svh;
    height: 35vh;
    height: 35svh;
    border-radius: 4vh;
    border-radius: 4svh;
    background: var(--toogle-bg-pop-up-bg);
}

.edit-profile-content .edit-profile-popup .wide-button {
    width: 29.55vh;
    width: 29.55svh;
    margin-top: 2.31vh;
    margin-top: 2.31svh;
    margin-bottom: 4.25vh;
    margin-bottom: 4.25svh;
}


.edit-profile-main-container {
    display: flex;
    width: 31.3vh;
    width: 31.3svh;
    height: 9.78vh;
    height: 9.78svh;
    align-items: center;
    flex-direction: column;
    margin-top: 1.57vh;
    margin-top: 1.57svh;
}

.edit-profile-icon-container {
    margin-top: -3.36vh;
    margin-top: -3.36svh;
}

.edit-profile-icon-container.mask {
    width: 15.54vh;
    width: 15.54svh;
    height: 18.08vh;
    height: 18.08svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .edit-profile-icon-container.mask {
    border-radius: 50vh;
    border-radius: 50svh;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.edit-profile-icon {
    background: url(/fb04dcb6/static/media/Profile_Check_Icon.c393b9baf3f9d700baa6.svg) no-repeat;
    background-size: contain;
    height: 8vh;
    height: 8svh;
    width: 8.23vh;
    width: 8.23svh;
    margin-top: 3.93vh;
    margin-top: 3.93svh;
    margin-left: 5vh;
    margin-left: 5svh;
}

.edit-profile-title {
    font-family: "SegoeBL", "serif";
    font-size: 2.62vh;
    font-size: 2.62svh;
    color: var(--color-texto-1);
}

.edit-profile-subtitle {
    font-family: "SegoeRegular", "serif";
    font-size: 2.10vh;
    font-size: 2.10svh;
    color: var(--color-texto-1);
    width: 34.17vh;
    width: 34.17svh;
    margin-top: 0.63vh;
    margin-top: 0.63svh;
}

.edit-avatar-icon {
    right: 15vh;
    top: 21vh;
    width: 2vh;
    height: 2vh;
    position: absolute;
    z-index: 2;
    background-image: url(/fb04dcb6/static/media/Edit_Icon.953a3f3f26b1fc216bf2.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    cursor: pointer;
}

.avatar-selection-content {
    width: 36.2vh;
    width: 36.2svh;
    margin: auto;
    height: 76vh;
    height: 76svh;
    color: var(--color-texto-1);
}



.avatar-selection-container .title{
    width: 100%;
    height: 11.1vh;
    height: 11.1svh;
    text-align: left;
    font-size: 4.2vh;
    font-size: 4.2svh;
    font-family: "SegoeBL", serif;
}

.avatar-selection-container {
    margin-top: 4.9vh;
    margin-top: 4.9svh;
    width: 100%;
}


.avatar-selection-panel {
    margin-top: 12.1vh;
    margin-top: 12.1svh;
    width: 100%;
    border-radius: 1.1vh;
    border-radius: 1.1svh;
    display: flex;
    justify-content: center;
}


.avatars-slider-profile {
    position: relative;
    width: 130%;
    height: 100%;
}

.avatar-container {
    height: 100%;
    width: 24.08vh;
    width: 24.08svh;
    margin-inline: 3vh;
    margin-inline: 3svh;
}

.avatar-icon-small-circle-profile {
    position: absolute;
    width: 2.7vh;
    width: 2.7svh;
    height: 2.7vh;
    height: 2.7svh;
    top: 0.1vh;
    top: 0.1svh;
    left: 14.8vh;
    left: 14.8svh;
}

.avatar-icon-small-circle-profile.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Circulo_Chico.65a4c8692bd1c16c756b.svg);
    mask-image: url(/fb04dcb6/static/media/Circulo_Chico.65a4c8692bd1c16c756b.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.avatar-icon-container {
    display: flex;
    height: 17vh;
    height: 17svh;
    width: 18vh;
    width: 18svh;
}

.avatar-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/icon_container_avatar.d009ed307a20de0a4245.svg);
    mask-image: url(/fb04dcb6/static/media/icon_container_avatar.d009ed307a20de0a4245.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.hidden {
    display: none;
}

.trivia_crack_v1 .avatar-icon-container.mask {
    background: transparent;
}

.trivia_crack_v1 .avatar-icon-small-circle-profile {
    background: transparent;
}

.avatar-icon-profile {
    height: 14vh;
    height: 14svh;
    width: 14vh;
    width: 14svh;
    margin-top: 0.8vh;
    margin-top: 0.8svh;
    margin-left: 2.4vh;
    margin-left: 2.4svh;
}

.trivia_crack_v1 .avatar-icon{
    width: 100%;
    height: 100%;
    margin: 0;
}


.avatar-next-icon {
    height: 5.46vh;
    height: 5.46svh;
    width: 5.46vh;
    width: 5.46svh;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(/fb04dcb6/static/media/Next_Arrow.7fcc1c7902b98c5c9d4e.svg);
}

.trivia_crack_v1 .avatar-next-icon {
    height: 2vh;
    height: 2svh;
    width: 5.46vh;
    width: 5.46svh;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAVCAYAAACt4nWrAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACGSURBVHgB7ZPRCYAgEIb/aJFG6LFHN9MNagNnaIOapE2yE3xQDOzojII++NAH+U/vEOChSUeOqICLtKXDLXg0pAr7nuzIGYIYMF/w+gLZkLk9j1mQzmAI6yoRflZAxQXuhhcLdOSGtH8S+g+XDUbSajc3EEL/wY8HWwjxvWDUDPZM5H41+AAfOXyDcEGgxQAAAABJRU5ErkJggg==);
}


.avatar-prev-icon {
    height: 5.46vh;
    height: 5.46svh;
    width: 5.46vh;
    width: 5.46svh;
    cursor: pointer;
    transform: rotate(180deg);
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(/fb04dcb6/static/media/Next_Arrow.7fcc1c7902b98c5c9d4e.svg);
}

.trivia_crack_v1 .avatar-prev-icon {
    height: 2vh;
    height: 2svh;
    width: 5.46vh;
    width: 5.46svh;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAVCAYAAACt4nWrAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACGSURBVHgB7ZPRCYAgEIb/aJFG6LFHN9MNagNnaIOapE2yE3xQDOzojII++NAH+U/vEOChSUeOqICLtKXDLXg0pAr7nuzIGYIYMF/w+gLZkLk9j1mQzmAI6yoRflZAxQXuhhcLdOSGtH8S+g+XDUbSajc3EEL/wY8HWwjxvWDUDPZM5H41+AAfOXyDcEGgxQAAAABJRU5ErkJggg==);
}

.avatar-name-animation{
    font-family: "SegoeRegular", serif;
    color: var(--color-texto-1);
    margin-top: 4.7vh;
    margin-top: 4.7svh;
    font-size: 2.6vh;
    font-size: 2.6svh;
    animation-name: avatar-name;
    animation-duration: 1000ms;
    animation-timing-function: linear;
}

.avatar-selection-content .wide-button{
    color: var(--color-text-button);
}

.trivia_crack_v1 .avatar-selection-content .wide-button{
    color: var(--color-text-button);
}

.avatar-avatar-container {
    height: 75%;
    width: 100%;
    position: relative;
}

.avatar-avatar-animation{
    animation-name: avatar-intro;
    animation-duration: 600ms;
    animation-timing-function: linear;
}

.avatar-avatar {
    height: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 0.4vh solid white;
    border: 0.4svh solid white;
    box-sizing: border-box;
    font-size: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(136deg, rgb(255 255 255) 0%, rgb(112 110 110) 35%, rgb(0 0 0) 100%);
    margin: auto;
}

.avatar-avatar-icon-position {
    position: absolute;
    top: -37%;
    left: 50%;
    transform: translateX(-50%);
}

.avatar-selection-searchbar {
    width: 88%;
    height: 4vh;
    height: 4svh;
    z-index: 10;
}


.avatar-aux-container {
    display: none;
    position: absolute;
    z-index: -2;
    left: 8vh;
    left: 8svh;
}

.avatar-aux-container.avatar-icon-small-circle-profile {
    left: 1vh;
    left: 1svh;
}

.avatar-aux-container_z {
    display: flex;
    z-index: 0;
}

.galaxy, .trivia_crack_v1 {
    --avatar-out: 0.8s;
    --avatar-out-trivia: 0.6s;
    --avatar-in: 0.8s;
    --avatar-in-trivia: 0.6s;
    --avatar-in-delay: 0.4s;
}

.avatar-out-left {
    animation: avatar-out-left var(--avatar-out) cubic-bezier(.51,0,.54,.68) both;
}


@keyframes avatar-out-left {
    0%, 8.7% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(12vw);
        transform: translateX(12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    91.3%{
        transform: translateX(-83.2vw);
        transform: translateX(-83.2svw);
    }
    100% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
}


.avatar-out-left-circle {
    animation: avatar-out-left-circle var(--avatar-out) cubic-bezier(.51,0,.54,.68) both;
}


@keyframes avatar-out-left-circle {
    0% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(12vw);
        transform: translateX(12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    85%{
        transform: translateX(-83.2vw);
        transform: translateX(-83.2svw);
    }
    100% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
}


.avatar-in-right {
    animation: avatar-in-right var(--avatar-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--avatar-in-delay) both;
}


@keyframes avatar-in-right {
    0%, 8.7% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
    30%{
        transform: translateX(88vw);
        transform: translateX(88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    80%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
    }
    100% {
        transform: translateX(0vw);
    }
}



.avatar-in-right-circle {
    animation: avatar-in-right-circle var(--avatar-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--avatar-in-delay) both;
}


@keyframes avatar-in-right-circle {
    0% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
    30%{
        transform: translateX(88vw);
        transform: translateX(88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    70%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
        left: 3.7vh;
        left: 3.7svh;
    }
    100% {
        transform: translateX(0vw);
        transform: translateX(0svw);
        left: 3.7vh;
        left: 3.7svh;
    }
}







.avatar-out-right {
    animation: avatar-out-right var(--avatar-out) cubic-bezier(.51,0,.54,.68) both;
}

/*.trivia_crack_v1  .avatar-out-right {*/
/*    -webkit-animation: slide-out-right var(--animation-timer) cubic-bezier(0.550, 0.085, 0.680, 0.530) both;*/
/*    animation: slide-out-right var(--animation-timer) cubic-bezier(0.550, 0.085, 0.680, 0.530) both;*/
/*}*/


@keyframes avatar-out-right {
    0% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    85%{
        transform: translateX(83.2vw);
        transform: translateX(83.2svw);
    }
    100% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
}


.avatar-out-right-circle {
    animation: avatar-out-right-circle var(--avatar-out) cubic-bezier(.51,0,.54,.68) both;
}


@keyframes avatar-out-right-circle {
    0%, 8.7% {
        transform: translateX(0);
    }
    30%{
        transform: translateX(-12vw);
        transform: translateX(-12svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    91.3%{
        transform: translateX(83.2vw);
        transform: translateX(83.2svw);
    }
    100% {
        transform: translateX(76vw);
        transform: translateX(76svw);
    }
}


.avatar-in-left {
    animation: avatar-in-left var(--avatar-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--avatar-in-delay) both;
}

/*.trivia_crack_v1 .avatar-in-left {*/
/*    -webkit-animation: slide-in-left var(--animation-timer) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;*/
/*    animation: slide-in-left var(--animation-timer) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;*/
/*}*/


@keyframes avatar-in-left {
    0% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
    30%{
        transform: translateX(-88vw);
        transform: translateX(-88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    70%{
        transform: translateX(12vw);
        transform: translateX(12svw);
    }
    100% {
        transform: translateX(0);
    }
}


.avatar-in-left-circle {
    animation: avatar-in-left-circle var(--avatar-in) cubic-bezier(0.43, 0.36, 0.24, 1) var(--avatar-in-delay) both;
}


@keyframes avatar-in-left-circle {
    0%, 8.7% {
        transform: translateX(-76vw);
        transform: translateX(-76svw);
    }
    30%{
        transform: translateX(-88vw);
        transform: translateX(-88svw);
    }
    50% {
        opacity: 1;
        display: block;
    }
    80%{
        transform: translateX(12vw);
        transform: translateX(12svw);
        left: 1vh;
        left: 1svh;
    }
    100% {
        transform: translateX(0vw);
        transform: translateX(0svw);
        left: 3.7vh;
        left: 3.7svh;
    }
}
















@media (orientation: landscape) {


    @keyframes avatar-out-left {
        0%, 8.7% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(5vh);
            transform: translateX(5svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        100% {
            transform: translateX(-38vh);
            transform: translateX(-38svh);
            opacity: 0;
        }
    }


    @keyframes avatar-out-left-circle {
        0% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(5vh);
            transform: translateX(5svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        100% {
            transform: translateX(-45vh);
            transform: translateX(-45svh);
            opacity: 0;
        }
    }


    @keyframes avatar-in-right {
        0%, 8.7% {
            opacity: 0;
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
        }
        30%{
            opacity: 0;
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        50% {
            display: block;
        }
        80%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        100% {
            transform: translateX(0);
            opacity: 1;
        }
    }


    @keyframes avatar-in-right-circle {
        0% {
            opacity: 0;
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
        }
        8.7%{
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        30% {
            opacity: 0;
        }
        50% {
            display: block;
        }
        80%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        100% {
            transform: translateX(0vh);
            transform: translateX(0svh);
            left: 4vh;
            left: 4svh;
            opacity: 1;
        }
    }


    @keyframes avatar-out-right {
        0% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        85%{
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        100% {
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
            opacity: 0;
        }
    }


    @keyframes avatar-out-right-circle {
        0%, 8.7% {
            transform: translateX(0);
        }
        30%{
            transform: translateX(-2vh);
            transform: translateX(-2svh);
        }
        50% {
            opacity: 1;
            display: block;
        }
        91.3%{
            transform: translateX(39vh);
            transform: translateX(39svh);
        }
        100% {
            transform: translateX(34.3vh);
            transform: translateX(34.3svh);
            opacity: 0;
        }
    }


    @keyframes avatar-in-left {
        0% {
            opacity: 0;
            transform: translateX(-34.3vh);
            transform: translateX(-34.3svh);
        }
        30%{
            opacity: 0;
            transform: translateX(-39vh);
            transform: translateX(-39svh);
        }
        50% {
            display: block;
        }
        70%{
            transform: translateX(2vh);
            transform: translateX(2svh);
        }
        100% {
            transform: translateX(0);
            opacity: 1;
        }
    }


    @keyframes avatar-in-left-circle {
        0%, 8.7% {
            opacity: 0;
            transform: translateX(-34.3vh);
            transform: translateX(-34.3svh);
        }
        30%{
            opacity: 0;
            transform: translateX(-39vh);
            transform: translateX(-39svh);
        }
        50% {
            display: block;
        }
        80%{
            transform: translateX(2vh);
            transform: translateX(2svh);
        }
        100% {
            transform: translateX(0vh);
            transform: translateX(0svh);
            left: 4vh;
            left: 4svh;
            opacity: 1;
        }
    }
}




.instructions-content {
    height: 76vh;
    height: 76svh;
    width: 36.2vh;
    width: 36.2svh;
    margin: auto;
}

.instructions-container {
    height: 100%;
}

.instructions-main-container {
    width: 100%;
    margin-top: 3vh;
    margin-top: 3svh;
}

.instructions-panel {
    height: 51.73vh;
    height: 51.73svh;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 2.5vh;
    margin-top: 2.5svh;
}

.instructions-line {
    font-family: "SegoeRegular", serif;
    color: var(--color-texto-1);
    font-size: 1.8vh;
    font-size: 1.8svh;
    width: 27.13vh;
    width: 27.13svh;
    height: 12.62vh;
    height: 12.62svh;
    margin-left: 1.68vh;
    margin-left: 1.68svh;
    padding-right: 1vh;
    padding-right: 1svh;
    text-align: left;
}

.instructions-icon-container.mask {
    width: 7.36vh;
    width: 7.36svh;
    height: 7.36vh;
    height: 7.36svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    margin-left: -2.2vh;
    margin-left: -2.2svh;
}

.trivia_crack_v1 .instructions-icon-container.mask{
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.first-instructions-icon {
    background-image: url(/fb04dcb6/static/media/clock_icon_instruction.ee5197e7622ce42d7cb0.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 4.49vh;
    height: 4.49svh;
    width: 4.56vh;
    width: 4.56svh;
    margin-top: 1.57vh;
    margin-top: 1.57svh;
    margin-left: 1.47vh;
    margin-left: 1.47svh;
}

.second-instructions-icon {
    background-image: url(/fb04dcb6/static/media/medal_icon.eebfbeb6e9a28c295406.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 4.7vh;
    height: 4.7svh;
    width: 4.1vh;
    width: 4.1svh;
    margin-top: 1.35vh;
    margin-top: 1.35svh;
    margin-left: 1.9vh;
    margin-left: 1.9svh;
}

.third-instructions-icon {
    background-image: url(/fb04dcb6/static/media/calendar_instructions_Icon.e35f2482225151d58447.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 3.76vh;
    height: 3.76svh;
    width: 3.75vh;
    width: 3.75svh;
    margin-top: 1.68vh;
    margin-top: 1.68svh;
    margin-left: 1.89vh;
    margin-left: 1.89svh;
}

.instructions-accept-container{
    display: flex;
    align-items: center;
    margin-top: 7%
}

.instructions-check {
    width: 2.5vh;
    width: 2.5svh;
    height: 2.5vh;
    height: 2.5svh;
    margin-right: 1vh;
    margin-right: 1svh;
}

.instructions {
    display: flex;
    align-items: center;
}

.instructions-item {
    height: 16.72vh;
    height: 16.72svh;
    width: 35.12vh;
    width: 35.12svh;
    background-color: var(--instruction-carrousel-container);
    border-radius: 3vh;
    border-radius: 3svh;
    margin-bottom: 1.16vh;
    margin-bottom: 1.16svh;
}

.instructions-container .title {
    font-family: "SegoeBL", serif;
    color: var(--color-texto-1);
    width: 100%;
    text-align: left;
    margin-bottom: 0vh;
    margin-bottom: 0svh;
    height: 5.57vh;
    height: 5.57svh;
    font-size: 4.2vh;
    font-size: 4.2svh;
    margin-top: 0;
}

.instructions-container .wide-button{
    width: 100%;
    color: var(--color-text-button);
}

.instructions-carousel-container {
    height: 42.9vh;
    height: 42.9svh;
    width: 100%;
    margin-top: 10vh;
    margin-top: 10svh;
}

.carousel-card {
    height: 36.48vh;
    height: 36.48svh;
    width: 100%;
    background-color: var(--instruction-carrousel-container);
    border-radius: 3vh;
    border-radius: 3svh;
    color: var(--color-texto-1);
}

.carousel-points {
    width: 6.1vh;
    width: 6.1svh;
    height: 1.47vh;
    height: 1.47svh;
    margin-top: 4.94vh;
    margin-top: 4.94svh;
}

.carousel-point {
    height: 1.47vh;
    height: 1.47svh;
    width: 1.47vh;
    width: 1.47svh;
    background-color: var(--gris-claro);
    border-radius: 1vh;
    border-radius: 1svh;
}

.carousel-point.current {
    height: 1.47vh;
    height: 1.47svh;
    width: 1.47vh;
    width: 1.47svh;
    background-color: var(--toggle-sliders);
    border-radius: 1vh;
    border-radius: 1svh;
}

.carousel-card-text {
    height: 17.03vh;
    height: 17.03svh;
    width: 32.8vh;
    width: 32.8svh;
    font-family:"SegoeRegular", serif;
    font-size: 2.1vh;
    font-size: 2.1svh;
}

.carousel-card-icon-container {
    height: 18.08vh;
    height: 18.08svh;
    width: 17.65vh;
    width: 17.65svh;
    margin-top: -6vh;
    margin-top: -6svh;
    margin-bottom: 3.46vh;
    margin-bottom: 3.46svh;
}

.carousel-card-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .carousel-card-icon-container.mask {
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.first-carousel-card-icon {
    background-image: url(/fb04dcb6/static/media/clock_icon_instruction.ee5197e7622ce42d7cb0.svg);
    height: 10.78vh;
    height: 10.78svh;
    width: 10.96vh;
    width: 10.96svh;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: 3.66vh;
    margin-left: 3.66svh;
    margin-top: 3.89vh;
    margin-top: 3.89svh;
}

.trivia_crack_v1 .first-carousel-card-icon{
    margin: auto;
}

.second-carousel-card-icon {
    background-image: url(/fb04dcb6/static/media/medal_icon.eebfbeb6e9a28c295406.svg);
    height: 10.84vh;
    height: 10.84svh;
    width: 8.19vh;
    width: 8.19svh;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: 5.15vh;
    margin-left: 5.15svh;
    margin-top: 4.14vh;
    margin-top: 4.14svh;
}

.trivia_crack_v1 .second-carousel-card-icon{
    margin: auto;
}

.third-carousel-card-icon {
    background-image: url(/fb04dcb6/static/media/calendar_instructions_Icon.e35f2482225151d58447.svg);
    height: 9.75vh;
    height: 9.75svh;
    width: 9.73vh;
    width: 9.73svh;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: 4.5vh;
    margin-left: 4.5svh;
    margin-top: 3.94vh;
    margin-top: 3.94svh;
}

.trivia_crack_v1 .third-carousel-card-icon{
    margin: auto;
}

.question-content {
    font-family: "SegoeBL", "serif";
    font-size: 3.4vh;
    font-size: 3.4svh;
    /*height: 78.92vh;*/
    color: var(--clock-text-color);
}

.question-container {
    width: 100%;
    height: 100%;
}

.question-header-container {
    width: 40vh;
    width: 40svh;
    height: 2.57vh;
    height: 2.57svh;
    display: flex;
    justify-content: space-between;
    margin-top: 1.78vh;
    margin-top: 1.78svh;
    margin-bottom: 1.61vh;
    margin-bottom: 1.61svh;
    color: var(--color-texto-1);
}



.question-header {
    display: flex;
    align-items: center;
    font-family: "SegoeRegular", serif;
    font-size: 1.93vh;
    font-size: 1.93svh;
}


.question-score {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-family: "SegoeBL", serif;
    font-size: 2.14vh;
    font-size: 2.14svh;
}

.question-timer-container {
    height: 10.1vh;
    height: 10.1svh;
    width: 10.1vh;
    width: 10.1svh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.clock-background {
    width: 100%;
    height: 100%;
    background-color: var(--popup-background);
    display: flex;
    align-items: center;
    justify-content: center;
}

.trivia_crack_v1 .clock-background{
    background-color: var(--instruction-carrousel-container);
}


.clock-background.mask {
    height: 10.1vh;
    height: 10.1svh;
    width: 10.1vh;
    width: 10.1svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.clock-first-layer {
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, var(--degradado-1) 0%, var(--degradado-2) 100%) no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.clock-first-layer.mask {
    height: 9.1vh;
    height: 9.1svh;
    width: 9.1vh;
    width: 9.1svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.clock-second-layer {
    width: 100%;
    height: 100%;
    background-color: var(--popup-background);
    display: flex;
    align-items: center;
    justify-content: center;
}

.trivia_crack_v1 .clock-second-layer {
    background-color: var(--instruction-carrousel-container);
}


.progress-pivot {
    width: 10%;
    height: 10%;
    background-color: white;
    border-radius: 50%;
}


.clock-second-layer.mask {
    height: 8.1vh;
    height: 8.1svh;
    width: 8.1vh;
    width: 8.1svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.clock-third-layer {
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, var(--degradado-1) 0%, var(--degradado-2) 100%) no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.clock-third-layer.mask {
    height: 7.2vh;
    height: 7.2svh;
    width: 7.2vh;
    width: 7.2svh;
    -webkit-mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    mask-image: url(/fb04dcb6/static/media/Clock_Circle.8e7bc41f18923676aa84.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.clock-countdown {
    font-size: 3.2vh;
    font-size: 3.2svh;
    width: 3.97vh;
    width: 3.97svh;
    height: 4.61vh;
    height: 4.61svh;
    text-align: center;
}

.question-timer-shake {
    animation: shake-animation 300ms ease-in-out infinite;
}

.question-screen-question {
    height: 100%;
    width: 43.67vh;
    width: 43.67svh;
    position: relative;
    border-radius: 5vh;
    border-radius: 5svh;
    overflow: hidden;
}

.question-timer {
    width: 85.6%;
    height: 41.7%;
    border-radius: 0.6vh;
    border-radius: 0.6svh;
    margin-left: 1.2vh;
    margin-left: 1.2svh;
    background-color: rgba(255, 255, 255, 0.4);
    border: solid 0.1vh #ffffff;
}

.question-screen-answer {
    position: relative;
    height: 100%;
    width: 100%;
    text-align: center;
    border-radius: 3.3vh;
    border-radius: 3.3svh;
    color: #ffffff;
    background-color: var(--toggle-sliders);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: visible;
    font-family: "SegoeBL", "serif";
    font-size: 1.89vh;
    font-size: 1.89svh;
    cursor: pointer;
}

.trivia_crack_v1 .question-screen-answer{
    background-color: var(--instruction-carrousel-container);
}


.question-screen-answer:active{
    background-color: var(--button-grey)
}

.trivia_crack_v1 .question-screen-answer:active{
    background-color: var(--question-pressed);
    color: var(--color-text-button)
}


@media (hover: hover) and (pointer: fine) {
    .question-screen-answer:hover {
        background-color: var(--button-grey);
    }

    .trivia_crack_v1 .question-screen-answer:hover {
        background-color: var(--question-pressed);
        color: var(--color-text-button)
    }
}

.question-screen-wrong-answer{
    background-color: #ee303b;
}

.question-screen-correct-answer{
    background-color: #33CC3A;
}

.survey-screen-answer-pressed{
    background-color: var(--survey-pressed);
}

.trivia_crack_v1 .question-screen-wrong-answer, .question-screen-wrong-answer{
    background-color: #ee303b;
    color: var(--color-text-button)
}


.trivia_crack_v1 .question-screen-correct-answer, .question-screen-correct-answer{
    background-color: #33CC3A;
    color: var(--color-text-button)
}


.question-screen-answer[disabled] {
    pointer-events: none;
}

@keyframes shake-animation {
    25% {
        transform: translate(4px, 1px) scale(1.1) rotate(5deg);
    }

    75% {
        transform: translate(-4px, 1px) scale(1.1) rotate(-5deg);
    }

    0%, 50%, 100% {
        transform: translate(0, -1px) scale(1) rotate(0);
    }
}

@keyframes score-animation {
    70% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}

.clock-container {
    position: relative;
    height: 10.1vh;
    height: 10.1svh;
    width: 10.1vh;
    width: 10.1svh;
    margin-top: -5vh;
    margin-top: -5svh;
}

.clock-progress-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.progress-pivot {
    position: absolute;
    width: 1.01vh;
    width: 1.01svh;
    height: 1.01vh;
    height: 1.01svh;
    background-color: white;
    border-radius: 50%;
    margin-top: 0.7vh;
    margin-top: 0.7svh;
    z-index: 4;
}

.pivot-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    animation: circleAnimation linear normal;
}

@keyframes circleAnimation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

svg {
    width: 100%;
    margin: 1vh;
    margin: 1svh;
}

path {
    position: absolute;
    stroke: white;
    stroke-width: 1.2vh;
    stroke-width: 1.2svh;
    stroke-dasharray: 288;
    stroke-linecap: round;
    transform: rotateX(180deg);
    transform: rotatez(180deg);
    fill: none;
    transform-origin: 50px 50px;
    animation-direction: reverse;
    animation: pathStroke normal linear;
    animation-delay: 0s;
}


@keyframes pathStroke {
    100% {
        stroke-dashoffset: 0;
    }
    0% {
        stroke-dashoffset: 288;
    }
}

.question-timer-animation-paused {
    animation-play-state: paused;
}

.question-screen-question-container {
    height: 40.128vh;
    height: 40.128svh;
    width: 100%;
    position: relative;
    z-index: 0;
}

.branded-question-tag {
    max-width: 100%;
    height: 5.90vh;
    height: 5.90svh;
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    border-bottom-left-radius: 3vh;
}

.branded-container-logo {
    width: auto;
    padding: 0.8vh 2.14vh 0.8vh 2.89vh;
    padding: 0.8svh 2.14svh 0.8svh 2.89svh;
}

.branded-question-logo {
    height: 100%;
    width: auto;
    /*contain: content;*/
}

.branded-question-star {
    width: 7.83vh;
    width: 7.83svh;
    background: linear-gradient(#AE7509, #D3B03F, #C89D36);
    border-bottom-left-radius: 3vh;
}

.branded-question-icon-animation-spawn {
    animation: branded-question-star-spawn 500ms cubic-bezier(0.57, 0.54, 0.54, 1.67);
}

.branded-question-icon-animation-rotate {
    animation: branded-question-star-rotate 3s linear infinite;
}

@keyframes branded-question-star-spawn {
    0% {
        scale: 0;
    }
    100% {
        scale: 1;
    }
}

@keyframes branded-question-star-rotate {
    100% {
        transform: rotate(360deg);
    }
}

.question-screen-question-image {
    width: 100%;
    height: 26.61vh;
    height: 26.61svh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 5vh;
    border-radius: 5svh;
}

.question-screen-default-image-1 {
    background-image: url(/fb04dcb6/static/media/Question_image_galaxy-01.91d2e50408173d8233eb.png);
}

.question-screen-default-image-2 {
    background-image: url(/fb04dcb6/static/media/Question_image_galaxy-02.9ea30c6047db7f0416fb.png);
}


.question-screen-question-text {
    width: 31.65vh;
    width: 31.65svh;
    height: 11.93vh;
    height: 11.93svh;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    font-family: "SegoeBL", "serif";
    font-size: 1.91vh;
    font-size: 1.91svh;
    color: var(--color-texto-1);
    margin-top: 0.5vh;
    margin-top: 0.5svh;
    text-align: center;
}

.question-screen-answers-container {
    width: 35.329vh;
    width: 35.329svh;
    height: 28.86vh;
    height: 28.86svh;
    display: flex;
    flex-direction: column;
    margin-top: 3.54vh;
    margin-top: 3.54svh;
}

.question-screen-answer-container {
    width: 100%;
    height: 6.7vh;
    height: 6.7svh;
    margin-bottom: 1.577vh;
    margin-bottom: 1.577svh;
    display: flex;
    justify-content: center;
}

.question-screen-answer-container:last-child {
    margin-bottom: 0;
}

.enter-animation {
    animation: answerIn 1s ease-out backwards;
}

.enter-animation:nth-child(1) {
    animation-delay: 0s;
}

.enter-animation:nth-child(2) {
    animation-delay: 0.2s;
}

.enter-animation:nth-child(3) {
    animation-delay: 0.4s;
}

.enter-animation:nth-child(4) {
    animation-delay: 0.6s;
}

@keyframes answerIn {
    0% {
        transform: scale(0);
    }
    40% {
        transform: scale(1.1);
    }
    60% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}

.answer-feedback-container {
    position: absolute;
    height: 4vh;
    height: 4svh;
    right: 0;
    top: -1.8vh;
    top: -1.8svh;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.6vh;
    font-size: 1.6svh;
    background-color: #ffffff;
    border-radius: 3.3vh;
    border-radius: 3.3svh;
    padding: 0 1.1vh;
    padding: 0 1.1svh;
}

.answer-feedback-correct{
    border: 0.2vh solid #00d689;
    border: 0.2svh solid #00d689;
}

.answer-feedback-wrong{
    border: 0.2vh solid #ee303b;
    border: 0.2svh solid #ee303b;
}

.answer-feedback-timeout{
    border: 0.2vh solid #ff8400;
    border: 0.2svh solid #ff8400;
}

.answer-feedback-decoration {
    position: absolute;
    width: 2vh;
    width: 2svh;
    height: 1.2vh;
    height: 1.2svh;
    bottom: -1.1vh;
    bottom: -1.1svh;
    left: 2vh;
    left: 2svh;
    background-image: url(/fb04dcb6/static/media/error-tail.ee7c634cac4d23ca3eab.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.answer-feedback-animation {
    animation: answerFeedbackIn 0.3s ease-out both;
}

.correct-answer{
    color: #00d689;
}

.wrong-answer {
    color: #ee303b;
}

.timeout-answer {
    color: #ff8400;
}

@keyframes answerFeedbackIn {
    0% {
        transform: translateY(50%);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}


.close-app-popup-background{
    width: 100%;
    height: 100%;
    background-color: var(--background-overlay);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
}

.close-app-popup{
    position: absolute;
    top: 32.5vh;
    top: 32.5svh;
    height: 44vh;
    height: 44svh;
    width: 38.3vh;
    width: 38.3svh;
    background-color: var(--background);
    border-radius: 3vh;
    border-radius: 3svh;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.close-app-popup-container {
    height: 18.08vh;
    height: 18.08svh;
    width: 17.65vh;
    width: 17.65svh;
    background: var(--primary-2) no-repeat;
    background-size: 100%;
    margin-top: -4.5vh;
    margin-top: -4.5svh;
}

.close-app-popup-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.close-app-popup-icon {
    background-image: url(/fb04dcb6/static/media/closeApp1.bd87d250ee2dcb35f1d5.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 9vh;
    height: 9svh;
    width: 9vh;
    width: 9svh;
    margin-top: 4.5vh;
    margin-top: 4.5svh;
    margin-left: 5vh;
    margin-left: 5svh;
}

.close-app-popup-exit-icon {
    background-image: url(/fb04dcb6/static/media/closeApp2.e01b89dd0a362c608154.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 9vh;
    height: 9svh;
    width: 9vh;
    width: 9svh;
    margin-top: 5.3vh;
    margin-top: 5.3svh;
    margin-left: 6vh;
    margin-left: 6svh;
}

.close-app-popup-text-container {
    margin-top: 2.4vh;
    margin-top: 2.4svh;
    height: 11.2vh;
    height: 11.2svh;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.close-app-popup-title {
    font-family: "SegoeBL", serif;
    font-size: 2.68vh;
    font-size: 2.68svh;
    color: var(--color-texto-1);
}

.close-app-popup-message {
    font-family: "SegoeRegular", serif;
    font-size: 2.1vh;
    font-size: 2.1svh;
    margin-top: 3vh;
    margin-top: 3svh;
    color: var(--color-texto-1);
    width: 90%;
}

.close-app-popup-buttons-container{
    display: flex;
    justify-content: space-between;
    margin-top: 5.47vh;
    margin-top: 5.47svh;
    width: 33.8vh;
    width: 33.8svh;
}

.naranja_x .close-app-popup-buttons-container .wide-button{
    width: 16.3vh;
    width: 16.3svh;
}

.naranja_x .close-app-popup-buttons-container .wide-button.log-out{
    background-color: var(--background);
    color: var(--primary-1);
    border: 0.2vh solid var(--primary-1);
    border: 0.2svh solid var(--primary-1);
}

.survey-answer-stack{
    width: 100%;
    height: 34.4vh;
    height: 34.4svh;
}

.survey-stack-arrow{
    width: 2.14vh;
    width: 2.14svh;
    height: 1.3vh;
    height: 1.3svh;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(/fb04dcb6/static/media/survey_arrow.32463112f18492ef3116.svg);
}

.light .survey-stack-arrow{
    width: 2.14vh;
    width: 2.14svh;
    height: 1.3vh;
    height: 1.3svh;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB+SURBVHgBpc5RDcAgDATQzsHmoBKQhBQcTMKkTAISJgEH2+jSD3IZIS1NLpBCX0o0Lq65NEyTxQo9mimUAZtC+Wcz96aIFe0FvZvQtSYDFpp3RLPOuDATipgkUr8i/JXZrf1wGrAeKsYiD7sD66EHQSORvRIYX6OQD2vRW84XvaNPRheWbRAAAAAASUVORK5CYII=);
}

.survey-stack-arrow.down{
    transform: rotate(180deg);
}

.survey-stack-arrow.disable{
    background-image: url(/fb04dcb6/static/media/survey_disable_arrow.1a72d13af1a9712ab089.svg);
}

.survey-question-screen-answers-container{
    width: 35.329vh;
    width: 35.329svh;
    height: 25.85vh;
    height: 25.85svh;
    margin-top: 2.3vh;
    margin-top: 2.3svh;
    margin-bottom: 2.3vh;
    margin-bottom: 2.3svh;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-behavior: smooth;
}

.survey-question-screen-answers-container::-webkit-scrollbar {
    display: none;
}

.survey-question-screen-answers-container .question-screen-answer-container{
    width: 100%;
    height: 6vh;
    height: 6svh;
    margin-bottom: 1.6vh;
    margin-bottom: 1.6svh;
    display: flex;
    justify-content: center;
}

.survey-screen-answer-pressed{
    background-color: var(--survey-pressed);
}

.teams-ranking {
}

div {
    white-space: pre-wrap;
}

.ranking-content {
    height: 76vh;
    height: 76svh;
}

.ranking-main-container {
    width: 39.72vh;
    width: 39.72svh;
    margin-top: 3.58vh;
    margin-top: 3.58svh;
}

.no-avatar .title {
    font-size: 4.2vh;
    font-size: 4.2svh;
    font-family: 'SegoeBL', serif;
    width: 100%;
    text-align: center;
    color: var(--color-texto-1);
    margin-top: 6.7vh;
    margin-top: 6.7svh;
}

.no-avatar .subtitle {
    font-size: 2.63vh;
    font-size: 2.63svh;
    font-family: 'SegoeRegular', serif;
    color: var(--color-texto-1);
    text-align: center;
    margin-top: 1.15vh;
    margin-top: 1.15svh;
    margin-bottom: 9.01vh;
    margin-bottom: 9.01svh;
}

.no-avatar .ranking-main-container .subtitle {
    margin-bottom: 4.71vh;
    margin-bottom: 4.71svh;
}

.ranking-container {
    width: 100%;
    height: 33.33vh;
    height: 33.33svh;
}

.ranking-score-container {
    width: 12.93vh;
    width: 12.93svh;
    height: 100%;
}

.ranking-avatar-container {
    height: 15.65vh;
    height: 15.65svh;
    width: 15.28vh;
    width: 15.28svh;
    margin-left: 6.28vh;
    margin-left: 6.28svh;
}

.ranking-avatar-container-team {
    width: 100%;
}

.ranking-avatar-container-individual {
    width: 100%;
    margin-bottom: 3.21vh;
    margin-bottom: 3.21svh;
}

.ranking-avatar-score-container-individual {
    height: 17.86vh;
    height: 17.86svh;
    width: 100%;
    display: flex;
    margin-top: 3vh;
    margin-top: 3svh;
}

.ranking-avatar-individual {
    width: 18.4vh;
    width: 18.4svh;
    height: 18.7vh;
    height: 18.7svh;
    margin-left: 6.44vh;
    margin-left: 6.44svh;
}

.ranking-avatar-icon-container {
    height: 100%;
    width: 100%;
    background: linear-gradient(225deg, var(--degradado-1) 4.46%, var(--degradado-2) 53.69%, var(--degradado-3) 103.32%) no-repeat;
    background-size: 100%;
}

.trivia_crack_v1 .ranking-avatar-icon-container {
    background: linear-gradient(225deg, var(--degradado-1) 4.46%, var(--degradado-2) 53.69%, var(--degradado-3) 103.32%) no-repeat;
}


.ranking-avatar-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .ranking-avatar-icon-container.mask {
    background: transparent;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
}

.trivia_crack_v1 .ranking-avatar-icon-container.mask.teams-icon {
    border-radius: 50%;
    background: var(--toggle-sliders);
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.ranking-avatar-icon-team {
    height: 12.5vh;
    height: 12.5svh;
    width: 12.5vh;
    width: 12.5svh;
    margin-top: 1.15vh;
    margin-top: 1.15svh;
    margin-left: 1.7vh;
    margin-left: 1.7svh;
    background-repeat: no-repeat;
    background-size: contain;
}

.trivia_crack_v1 .teams-icon .ranking-avatar-icon-team {
    margin: auto;
}

.ranking-avatar-icon {
    height: 12.5vh;
    height: 12.5svh;
    width: 12.5vh;
    width: 12.5svh;
    margin-top: 1.15vh;
    margin-top: 1.15svh;
    margin-left: 1.7vh;
    margin-left: 1.7svh;
    background-repeat: no-repeat;
    background-size: contain;
}

.trivia_crack_v1 .ranking-avatar-icon{
    margin: auto;
    width: 100%;
    height: 100%;
}

.ranking-avatar-icon-individual {
    background-repeat: no-repeat;
    background-size: contain;
    height: 15.3vh;
    height: 15.3svh;
    width: 15.3vh;
    width: 15.3svh;
    margin-top: 1.4vh;
    margin-top: 1.4svh;
    margin-left: 2vh;
    margin-left: 2svh;
}

.trivia_crack_v1 .ranking-avatar-icon-individual{
    margin: auto;
}



.ranking-player-position {
    height: 2.55vh;
    height: 2.55svh;
    font-family: "SegoeRegular", "serif";
    font-size: 1.91vh;
    font-size: 1.91svh;
    color: var(--color-texto-1);
    margin-top: 0.106vh;
    margin-top: 0.106svh;
    margin-bottom: 1.08vh;
    margin-bottom: 1.08svh;
}

.player-position {
    font-family: "SegoeBL", "serif";
}

.teams-ranking .ranking-container {
    height: 73.37vh;
    height: 73.37svh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

.ranking-brand-logo {
    display: none;
}

.ranking-tabs {
    width: 100%;
    height: 100%;
    border-radius: 0 0 1.1vh 1.1vh;
    border-radius: 0 0 1.1svh 1.1svh;
    background-color: transparent;
}

.teams-ranking .ranking-tabs {
    height: 100%;
    width: 100%;
    border-radius: 0 0 1.1vh 1.1vh;
    border-radius: 0 0 1.1svh 1.1svh;
    background-color: transparent;
}

.ranking-tab {
    width: 100%;
    height: 100%;
}

.ranking-component {
    height: 100%;
    width: 100%;
    color: var(--color-texto-1);
    font-family: "SegoeRegular", "serif";
    font-size: 1.91vh;
    font-size: 1.91svh;
}

.ranking-line {
    color: #fafafa;
}

.ranking-row:last-child {
    border: none;
}

.ranking-row-position {
    font-family: "SegoeBL", serif;
    height: 2.55vh;
    height: 2.55svh;
    margin-left: 1vh;
    margin-left: 1svh;
    text-align: start;
}

.ranking-non-top-row-position {
    font-family: "SegoeRegular", serif;
    color: var(--gris-claro);
    flex-basis: 10%;
}

.ranking-row-avatar {
    width: 1.91vh;
    width: 1.91svh;
    height: 1.91vh;
    height: 1.91svh;
    margin-left: 0.59vh;
    margin-left: 0.59svh;
    background-size: contain;
    background-repeat: no-repeat;
}

.ranking-name-container {
    font-family: "SegoeBL", "serif";
    font-size: 2.55vh;
    font-size: 2.55svh;
    text-align: left;
    color: var(--color-texto-1);
    height: 3.40vh;
    height: 3.40svh;
    width: 100%;
}

.ranking-avatar-score-container {
    height: 17.19vh;
    height: 17.19svh;
    width: 100%;
    display: flex;
    margin-top: 1.6vh;
    margin-top: 1.6svh;
}

.ranking-position-title {
    font-family: "SegoeRegular", "serif";
    font-size: 1.9vh;
    font-size: 1.9svh;
    color: var(--color-texto-1);
    height: 2.98vh;
    height: 2.98svh;
}

.ranking-position-user {
    font-family: "SegoeBL", "serif";
    font-size: 3.4vh;
    font-size: 3.4svh;
    color: var(--color-texto-1);
    height: 5.35vh;
    height: 5.35svh;
}

.ranking-row-name {
    font-family: "SegoeRegular", "serif";
    color: var(--gris-claro);
    flex-basis: 59%;
    text-align: left;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    margin-left: 1.06vh;
    margin-left: 1.06svh;
}

.ranking-row-score {
    font-family: "SegoeRegular", "serif";
    color: var(--gris-claro);
    flex-basis: 22%;
    text-align: end;
    margin-right: 1.59vh;
    margin-right: 1.59svh;
}

.ranking-row-font-top {
    font-family: "SegoeBL", "serif";
    color: var(--color-texto-1);
}

.ranking-tabs-panel {
    width: 100%;
}

.teams-ranking .ranking-tabs-panel {
    height: 33.44vh;
    height: 33.44svh;
    margin-top: 1.29vh;
    margin-top: 1.29svh;
}

/*.ranking-tab-buttons {*/
/*    width: 28.02vh;*/
/*    width: 28.02svh;*/
/*    height: 4.86vh;*/
/*    height: 4.86svh;*/
/*    display: flex;*/
/*    background-color: var(--toogle-bg-pop-up-bg);*/
/*    border-radius: 3vh;*/
/*    border-radius: 3svh;*/
/*    margin: 1.44vh auto;*/
/*    margin: 1.44svh auto;*/
/*    color: var(--color-texto-1);*/
/*}*/

.ranking-tab-buttons {
    position: relative;
    width: 28.02vh;
    width: 28.02svh;
    height: 4.86vh;
    height: 4.86svh;
    background-size: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3vh;
    border-radius: 3svh;
    margin: 1.44vh auto;
    margin: 1.44svh auto;
    background-color: var(--toogle-bg-pop-up-bg);
    color: var(--color-texto-1);
}
.ranking-tab-buttons-active-tab {
    background-color: var(--toggle-sliders);
    border-radius: 20vh;
    height: 90%;
    position: absolute;
    width: 50%;
}

.ranking-tab-button {
    font-family: "SegoeBL", "serif";
    font-size: 1.70vh;
    font-size: 1.70svh;
    flex-basis: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    cursor: pointer;
}

.ranking-tab-button-active {
    width: 15.27vh;
    width: 15.27svh;
    height: 4.86vh;
    height: 4.86svh;
    background-color: var(--toggle-sliders);
    border-radius: 3vh;
    border-radius: 3svh;
    color: var(--color-text-button);
}

.no-avatar .ranking-tab-buttons {
    margin-bottom: 5.72vh;
    margin-bottom: 5.72svh;
}

.ranking-table {
    width: 39.72vh;
    width: 39.72svh;
    height: 74.6%;
    background-color: #03b543;
    border-radius: 1.1vh;
    border-radius: 1.1svh;
    overflow: hidden;
}

.ranking-table-container {
    background-color: transparent;
}

.ranking-table-position {
    height: 42.14vh;
    height: 42.14svh;
}

.ranking-row {
    display: flex;
    align-items: center;
    justify-content: left;
    text-align: center;
    width: 100%;
    margin-top: 0.85vh;
    margin-top: 0.85svh;
    height: 2.55vh;
    height: 2.55svh;
}

.ranking-top-position {
    font-family: "SegoeBL", "serif";
}

.ranking-table .ranking-row {
    height: 9.7%;
}

.ranking-player-score .ranking-row {
    height: 100%;
}

.ranking-player-score {
    width: 100%;
    height: 2.9vh;
    height: 2.9svh;
    border-radius: 1.1vh;
    border-radius: 1.1svh;
}

.ranking-highlight-looser {
    height: 3.4vh;
    height: 3.4svh;
    border-radius: 1.17vh;
    border-radius: 1.17svh;
}

.round-completed-content {
    height: 68.45vh;
    height: 68.45svh;
    margin-top: 6.06vh;
    margin-top: 6.06svh;
    margin-bottom: 8.2vh;
    margin-bottom: 8.2svh;
}

.round-completed-content .title {
    font-family: "SegoeBL", serif;
    font-size: 4.2vh;
    font-size: 4.2svh;
    text-align: start;
    color: var(--color-texto-1);
}

.round-completed-container {
    width: 37.54vh;
    width: 37.54svh;
    height: 48.05vh;
    height: 48.05svh;
}

.round-completed-panel {
    width: 100%;
    height: 31.86vh;
    height: 31.86svh;
    background-color: var(--popup-background);
    border-radius: 5vh;
    border-radius: 5svh;
    margin-top: 14.82vh;
    margin-top: 14.82svh;
}

.round-completed-texts{
    height: 14.4vh;
    height: 14.4svh;
    font-family:"SegoeRegular", serif;
    color: var(--color-texto-1);
    font-size: 2.1vh;
    font-size: 2.1svh;
}

.round-completed-message {
    width: 30.81vh;
    width: 30.81svh;
}

.round-completed-texts .link{
    color: var(--toggle-sliders);
    font-family:"SegoeRegular", serif;
    font-size: 2.1vh;
    font-size: 2.1svh;
}

.league-completed-content {
    height: 76vh;
    height: 76svh;
    width: 36.2vh;
    width: 36.2svh;
    margin: auto;
    color: var(--color-text-button);
}

.league-complete-main-container{
    margin-top: 20.15vh;
    margin-top: 20.15svh;
}

.survey-league-complete-main-container{
    margin-top: 30vh;
    margin-top: 30svh;
}

.trivia_crack_v1 .league-complete-main-container{
    margin-top: 16vh;
    margin-top: 16svh;
}

.league-completed-content .title {
    font-family: "SegoeBL", "serif";
    font-size: 4.20vh;
    font-size: 4.20svh;
    height: 10.30vh;
    height: 10.30svh;
}

.league-completed-content .message {
    font-family: "SegoeRegular", "serif";
    font-size: 2.52vh;
    font-size: 2.52svh;
    height: 10.09vh;
    height: 10.09svh;
    /*width: 37vh;*/
    /*width: 37svh;*/
    margin-top: 1.68vh;
    margin-top: 1.68svh;
}

.league-completed-avatar-image {
    width: 21vh;
    width: 21svh;
    height: 21vh;
    height: 21svh;
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: 1.57vh;
    margin-top: 1.57svh;
}


.league-completed-avatar-winner-image{
    background-image: url(/fb04dcb6/static/media/asset_ganador.680a5812d9e2ff4ebd78.png);
    width: 37vh;
    width: 37svh;
    height: 23vh;
    height: 23svh;
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: 1.5vh;
    margin-top: 1.5svh;
    margin-left: -4vh;
    margin-left: -4svh;
}

.league-completed-content .wide-button{
    background: white;
    color: var(--degradado-2);
}

.trivia_crack_v1 .league-completed-content .wide-button{
    background: var(--button-grey);
    color: var(--color-text-button);
}

@media (hover: hover) {
    .league-completed-content .wide-button:hover{
        background: var(--white-button-hover);
    }
}

.league-completed-content .wide-button:active{
    background: var(--white-button-pressed);
}

.league-completed-brand-logo {
    height: 23%;
    width: 58.4%;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.league-completed-line {
    font-size: 2.4vh;
    font-size: 2.4svh;
}

.league-completed-separator {
    width: 81.2%;
    border-bottom: 0.1vh solid #28292b;
    border-bottom: 0.1svh solid #28292b;
}

.trivia_crack_v1 .league-completed-title-container{
    color: var(--color-texto-1);
}

.play-locked-screen-content {
    height: 76vh;
    height: 76svh;
}

.play-locked-container {
    width: 100%;
    height: 72.7%;
    align-items: flex-start;
    margin-top: 20.15vh;
    margin-top: 20.15svh;
}

.play-locked-panel {
    height: 77.3%;
    width: 100%;
    border-radius: 1.1vh;
    border-radius: 1.1svh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 11% 0 6% 0;
    box-sizing: border-box;
}

.play-locked-message {
    width: 75.6%;
    height: 20%;
    overflow: hidden;
}

.title-center {
    font-family: "SegoeBL", serif;
    color: var(--color-texto-1);
    font-size: 4.2vh;
    font-size: 4.2svh;
}

.league-not-started-screen-content {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.league-not-started-panel {
    width: 37.53vh;
    width: 37.53svh;
    height: 43vh;
    height: 43svh;
    background-color: var(--toogle-bg-pop-up-bg);
    opacity: 0.9;
    border-radius: 3vh;
    border-radius: 3svh;
}

.league-not-started-panel .title {
    font-family: "SegoeBL", serif;
    font-size: 2.62vh;
    font-size: 2.62svh;
    color: var(--color-texto-1);
    margin: 2vh 0 0;
    margin: 2svh 0 0;
    text-align: center;
}

.league-not-started-message {
    font-family: "SegoeRegular", serif;
    font-size: 2.1vh;
    font-size: 2.1svh;
    color: var(--color-texto-1);
    margin: 1.36vh 0 0;
    margin: 1.36svh 0 0;
}

.league-not-started-panel .wide-button{
    width: 29.54vh;
    width: 29.54svh;
    margin-top: 8vh;
    margin-top: 8svh;
}

@media (hover: hover) {
    .league-not-started-panel .wide-button:hover {
        background-color: var(--button-grey);
    }
}

.league-not-started-panel .wide-button:active {
    background: var(--button-grey);
}

.league-not-started-icon-container {
    height: 18.08vh;
    height: 18.08svh;
    width: 17.65vh;
    width: 17.65svh;
    margin-top: -8vh;
    margin-top: -8svh;
}

.league-not-started-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .league-not-started-icon-container.mask {
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.league-not-started-icon {
    background-image: url(/fb04dcb6/static/media/calendar_bell_icon.e19d5ff619f7029147a4.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 8.28vh;
    height: 8.28svh;
    width: 10.51vh;
    width: 10.51svh;
    margin-top: 5.15vh;
    margin-top: 5.15svh;
    margin-left: 4.2vh;
    margin-left: 4.2svh;
}

.trivia_crack_v1 .league-not-started-icon{
    margin: auto;
}

.countdown.mask {
    width: 24vh;
    width: 24svh;
    height: 24.2vh;
    height: 24.2svh;
    -webkit-mask-image: url(data:image/png;base64,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);
    mask-image: url(data:image/png;base64,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);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.countdown-numbers {
    font-family: "SegoeBL", serif;
    height: 100%;
    width: 100%;
    font-size: 19vh;
    font-size: 19svh;
    color: white;
    margin-top: -2vh;
    margin-top: -2svh;
    text-align: center;
}



.score-popup-background {
    position: absolute;
    background: var(--background-overlay);
    height: 100%;
    width: 100%;
    animation: popup-enter-animation 0.3s ease-out;
}

.score-popup-content {
    width: 37.54vh;
    width: 37.54svh;
    height: 42.79vh;
    height: 42.79svh;
    background-color: var(--toogle-bg-pop-up-bg);
    border-radius: 3vh;
    border-radius: 3svh;
    margin-top: 31.12vh;
    margin-top: 31.12svh;
    color: var(--color-texto-1);
}

.score-icon-container {
    height: 18.08vh;
    height: 18.08svh;
    width: 17.65vh;
    width: 17.65svh;
    background: linear-gradient(225deg, var(--degradado-1) 0%, var(--degradado-2) 49.80%, var(--degradado-3) 100%) no-repeat;
    background-size: 100%;
    margin-top: -7.57vh;
    margin-top: -7.57svh;
}

.trivia_crack_v1 .score-icon-container{
    background: var(--toggle-sliders);
}

.score-icon-container.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    mask-image: url(/fb04dcb6/static/media/Icon_Container.647a83a9b86bffd0bc9a.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.trivia_crack_v1 .score-icon-container.mask {
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    display: flex;
}

.score-icon {
    background-image: url(/fb04dcb6/static/media/medal_icon.eebfbeb6e9a28c295406.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 10.84vh;
    height: 10.84svh;
    width: 8.19vh;
    width: 8.19svh;
    margin-top: 3.88vh;
    margin-top: 3.88svh;
    margin-left: 5.17vh;
    margin-left: 5.17svh;
}

.trivia_crack_v1 .score-icon{
    margin: auto;
}

.score-buttons-container .wide-button{
    width: 29.54vh;
    width: 29.54svh;
    color: var(--color-text-button);
    margin-top: 2.42vh;
    margin-top: 2.42svh;
}

.score-text-container {
    margin-top: 1.46vh;
    margin-top: 1.46svh;
    height: 18.92vh;
    height: 18.92svh;
    text-align: center;
}

.score-title {
    font-family: "SegoeBL", serif;
    font-size: 4.2vh;
    font-size: 4.2svh;
    color: var(--color-texto-1);
}

.score-message {
    font-family: "SegoeRegular", serif;
    font-size: 2.62vh;
    font-size: 2.62svh;
    margin-top: 1.287vh;
    margin-top: 1.287svh;
    color: var(--color-texto-1);
}

.score-text {
    height: 8.58vh;
    height: 8.58svh;
    font-family: "SegoeBL", "serif";
    font-size: 6.43vh;
    font-size: 6.43svh;
    color: var(--color-texto-1);
}

.logo {
    height: 5.19vh;
    height: 5.19svh;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left;
    margin-left: 3.36vh;
    margin-left: 3.36svh;
    flex-grow: 1;
}

.dark .logo {
    background-image: var(--logo-dark);
}

.light .logo{
    background-image: var(--logo-light);
}

.trivia_crack_v1 .logo {
    background-image: var(--logo-light);
}

.trivia_crack_v1 .logo.welcome-logo {
    background-image: var(--logo-dark);
}

.welcome-logo{
    background-image: var(--logo-dark);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 22.7vh;
    width: 22.7svh;
    height: 21.5vh;
    height: 21.5svh;
    margin-top: 4.14vh;
    margin-top: 4.14svh;
    margin-bottom: 3.2vh;
    margin-bottom: 3.2svh;
}

.sound-on-icon.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Sound_On_Icon.63a1498877848925c094.svg);
    mask-image: url(/fb04dcb6/static/media/Sound_On_Icon.63a1498877848925c094.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}



.sound-off-icon.mask {
    -webkit-mask-image: url(/fb04dcb6/static/media/Sound_Off_Icon.e598afd2b11181926a54.svg);
    mask-image: url(/fb04dcb6/static/media/Sound_Off_Icon.e598afd2b11181926a54.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    margin-left: 14vh;
}


.sound-on-icon {
    height: 3.4vh;
    height: 3.4svh;
    width: 3.4vh;
    width: 3.4svh;
    align-items: flex-end;
    background-color: var(--color-texto-1);
    margin-right: 2.66vh;
    margin-right: 2.66svh;
    cursor: pointer;
    margin-bottom: 1.41vh;
    margin-bottom: 1.41svh;
}

.sound-off-icon {
    height: 3.4vh;
    height: 3.4svh;
    width: 3.4vh;
    width: 3.4svh;
    align-items: flex-end;
    background-color: var(--color-texto-1);
    margin-right: 2.66vh;
    margin-right: 2.66svh;
    cursor: pointer;
    margin-bottom: 1.41vh;
    margin-bottom: 1.41svh;
}

.close-app-icon{
    background-image: url(/fb04dcb6/static/media/cross.ce708a170e06bbb4c3a5.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 3.48vh;
    width: 3.48svh;
    height: 3.48vh;
    height: 3.48svh;
    margin-right: 3vh;
    margin-right: 3svh;
}

.burger-menu {
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    cursor: pointer;
}

.burger-menu-container {
    height: 5.04vh;
    height: 5.04svh;
    width: 5.04vh;
    width: 5.04svh;
    margin-right: 2.1vh;
    margin-right: 2.1svh;
}

.dark .burger-menu {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACPSURBVHgB7daxCcMwEIXhUwRCZbJBNssM2SDZICtkMnsEdwIhkK8wrnQufS7+r1HxENxd9UQAAICfYAW11ldr7RdCuIuvOcb4SSn9R6G5QCll0ucpF6BHXHLOj1F2sz713r0vv9NZFiszF9Ct3/rM4mwb/isAAAzQhc5AF/JEFwIAHKELnYEu5IkuBADAla2OWVBHm/H5WwAAAABJRU5ErkJggg==);
}

.light .burger-menu, .trivia_crack_v1 .burger-menu {
    background-image: url(/fb04dcb6/static/media/Burguer_Menu_Light.605ac8883a62b17bd1ce.svg);
}

.menu-background {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: var(--background-overlay);
    right: 0;
    top: 0;
    z-index: 1;
    transition: 0.4s;
}

.menu {
    position: absolute;
    height: 43.6vh;
    height: 43.6svh;
    width: 32.7vh;
    width: 32.7svh;
    background: linear-gradient(204deg, var(--degradado-1) -38.68%, var(--degradado-2) 54.11%, var(--degradado-3) 147.65%);
    right: 2.31vh;
    right: 2.31svh;
    top: 2.31vh;
    top: 2.31svh;
    z-index: 2;
    border-radius: 2vh 0 2vh 6.6vh;
    border-radius: 2svh 0 2svh 6.6svh;
    color: var(--color-text-button);
    transition: 0.4s;
}

.trivia_crack_v1 .menu{
    height: 38.6vh;
    height: 38.6svh;
    background: var(--screen-background);
    color: var(--color-texto-1);
}

.trivia_crack_v1 .menu-with-ranking{
    height: 44.11vh;
    height: 44.11svh;
}

.menu-with-ranking {
    height: 50.11vh;
    height: 50.11svh;
}

.menu-header {
    width: 100%;
    height: 5.52vh;
    height: 5.52svh;
    /*background-color: var(--toggle-sliders);*/
    background-color: var(--menu-header-bar);
    opacity: 0.50;
    mix-blend-mode: multiply;
    word-wrap: break-word;
    border-top-left-radius: 2vh;
    border-top-left-radius: 2svh;
}

.trivia_crack_v1 .menu-header{
    opacity: 1;
}

.menu-title {
    height: 3.57vh;
    height: 3.57svh;
    width: 7.15vh;
    width: 7.15svh;
    font-family: "SegoeBL", serif;
    font-size: 2.62vh;
    font-size: 2.62svh;
}

.menu-header-bar-text {
    position: absolute;
    z-index: 3;
    width: 100%;
    height: 3.57vh;
    height: 3.57svh;display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-left: 2.52svh;
    padding-top: 0.97svh;
}

.trivia_crack_v1 .menu-title{
    color: var(--color-text-button);
}


.menu-close-icon {
    width: 4.2vh;
    width: 4.2svh;
    height: 4.2vh;
    height: 4.2svh;
    background-image: url(/fb04dcb6/static/media/cross-icon.49277972771b58c012e2.svg);
    background-size: contain;
}


.menu-options {
    margin-top: 2.8vh;
    margin-top: 2.8svh;
}

.menu-option {
    height: 4.2vh;
    height: 4.2svh;
    width: 100%;
    margin-bottom: 1.5vh;
    margin-bottom: 1.5svh;
    display: flex;

}


.menu-option-description {
    font-family: "SegoeBL", serif;
    font-size: 2.1vh;
    font-size: 2.1svh;
    cursor: pointer;
    align-content: center;
}


.menu-avatar-icon {
    width: 3.61vh;
    width: 3.61svh;
    height: 3.53vh;
    height: 3.53svh;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.menu-avatar-icon-default {
    background-image: url(/fb04dcb6/static/media/avatar_default.ecd3c027d9c3d1f133bf.svg);
}

.trivia_crack_v1 .menu-avatar-icon-default {
    background-image: url(/fb04dcb6/static/media/edit_profile_no_avatar.3090e2be07185beeb09e.svg);
}

.menu-option-icon{
    width: 4.2vh;
    width: 4.2svh;
    height: 4.2vh;
    height: 4.2svh;
    margin-right: 2.62vh;
    margin-right: 2.62svh;
    margin-left: 2.52vh;
    margin-left: 2.52svh;
    background-size: contain;
    background-repeat: no-repeat;
}

.trivia_crack_v1 .menu-option-icon{
    width: 3.3vh;
    width: 3.3svh;
    height: 3.3vh;
    height: 3.3svh;
}


.menu-option-icon-first {
    background-image: url(/fb04dcb6/static/media/profile-icon-bg.46ca6f430bdb0dc16312.svg);
}

.menu-option-icon-second {
    background-image: url(/fb04dcb6/static/media/Sound_On_Icon.63a1498877848925c094.svg);
}

.trivia_crack_v1 .menu-option-icon-second {
    background-image: url(/fb04dcb6/static/media/Sound_On.f32ffc0f9ce1aa6dddfb.svg);
}


.menu-option-icon-second-disabled{
    background-image: url(/fb04dcb6/static/media/Sound_Off_Icon.e598afd2b11181926a54.svg);
}

.trivia_crack_v1 .menu-option-icon-second-disabled {
    background-image: url(/fb04dcb6/static/media/Sound_Off.9de3a84fe606d46fc458.svg);
}


.menu-option-icon-third {
    background-image: url(/fb04dcb6/static/media/instruction-icon.32d98d6bb2911a1d63ba.svg);
}

.trivia_crack_v1 .menu-option-icon-third {
    background-image: url(/fb04dcb6/static/media/Instructions.e0c66ec3f906e6ee5d4f.svg);
}


.menu-option-icon-fourth {
    background-image: url(/fb04dcb6/static/media/ranking-icon.01aee758ef1a191a0e3e.svg);
}

.trivia_crack_v1 .menu-option-icon-fourth {
    background-image: url(/fb04dcb6/static/media/Ranking.4bc05fbaf02dfc28f222.svg);
}


.menu-option-icon-fifth {
    background-image: url(/fb04dcb6/static/media/frequency-question-icon.d5630c48e74575be52d6.svg);
}

.trivia_crack_v1 .menu-option-icon-fifth {
    background-image: url(/fb04dcb6/static/media/FrequencyQuestions.53c1c4c644c2c55029da.svg);
}

.menu-option-icon-sixth {
    background-image: url(/fb04dcb6/static/media/logout-icon.1dfb0b020ec51a86dbf5.svg);
}

.trivia_crack_v1 .menu-option-icon-sixth {
    background-image: url(/fb04dcb6/static/media/LogOut.e26de8616bde93ca459f.svg);
}

.menu-option-icon-dark {
    background-image: url(/fb04dcb6/static/media/dark_icon.a7734729132696b0d7e9.svg);
}

.menu-option-icon-light {
    background-image: url(/fb04dcb6/static/media/light_icon.71b4f64a30b8c80bd226.svg);
}

@media (orientation: landscape) {
    .menu-background {
        display: flex;
        justify-content: center;
    }

    .menu {
        position: sticky;
        margin-top: 4vh;
        margin-top: 4svh;
        margin-left: 7vh;
        margin-left: 7svh;
    }
}

.scale-out-tr {
    animation: scale-out-tr var(--menu-animation-timer) cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@keyframes scale-out-tr {
    0% {
        transform: scale(1);
        transform-origin: 100% 0%;
        opacity: 1;
    }
    30% {
        transform: scale(1.15);
    }
    40% {
        transform: scale(1.15);
    }
    50% {
        opacity: 0.8;
    }
    100% {
        transform: scale(0);
        transform-origin: 100% 0%;
        opacity: 0;
    }
}


.scale-in-tr {
    animation: scale-in-tr var(--menu-animation-timer) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@keyframes scale-in-tr {
    0% {
        transform: scale(0);
        transform-origin: 100% 0%;
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    60% {
        transform: scale(1.15);
    }
    70% {
        transform: scale(1.15);
    }
    100% {
        transform: scale(1);
        transform-origin: 100% 0%;
        opacity: 1;
    }
}

.menu-fade-in-right {
    animation: menu-fade-in-right var(--menu-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    animation-delay: var(--menu-animation-delay);
}
@keyframes menu-fade-in-right {
    0% {
        transform: translateX(5.36vh);
        transform: translateX(5.36svh);
        opacity: 0;
    }
    50%{
        transform: translateX(-1.2vh);
        transform: translateX(-1.2svh);
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

.menu-fade-out-right {
    animation: menu-fade-out-right 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes menu-fade-out-right {
    0%, 50% {
        transform: translateX(0);
        opacity: 1;
    }
    75%{
        transform: translateX(-1.2vh);
        transform: translateX(-1.2svh);
    }
    100% {
        transform: translateX(2vh);
        transform: translateX(2svh);
        opacity: 0;
    }
}

.menu-fade-in-bottom {
    animation: menu-fade-in-bottom var(--menu-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes menu-fade-in-bottom {
    0% {
        transform: translateY(3.5vh);
        transform: translateY(3.5svh);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.menu-fade-out-bottom {
    animation: menu-fade-out-bottom var(--menu-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes menu-fade-out-bottom {
    0% {
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        transform: translateY(3.5vh);
        transform: translateY(3.5svh);
        opacity: 0;
    }
}


.menu-background-show{
    animation: menu-background-show var(--menu-animation-timer) cubic-bezier(0.250, 0.460, 0.450, 0.940) both;;
}

@keyframes menu-background-show {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.cta {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.light .cta{
    background-color: #F4F4F4
}

.cta-content{
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    width: 100%;
    color: white;
    margin-top: -8.73vh;
    margin-top: -8.73svh;
}

.light .cta-content,
.trivia_crack_v1 .cta-content{
    color: black;
}

.cta-image-container{
    background-repeat: no-repeat;
    background-size: cover;
    height: 49.8vh;
    height: 49.8svh;
    width: 100%;
    background-color: #262626;
    border-radius: 0 0 4.2vh 4.2vh;
    border-radius: 0 0 4.2svh 4.2svh;
}





.cta-logo-container {
    background-color: white;
    margin-top: -7vh;
    margin-top: -7svh;
    border-radius: 2vh;
    border-radius: 2svh;
    height: 16vh;
    height: 16svh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2.1vh;
    padding: 2.1svh;
}

.cta-logo {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%;
}





.cta-data-container{
    width: 35.2vh;
    width: 35.2svh;
}

.cta-texts-container{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 19.56vh;
    height: 19.56svh;
}

.main-text-container{
    font-family: "SegoeBL", serif;
    font-size: 3.7vh;
    font-size: 3.7svh;
    line-height: 4vh;
}

.secondary-text-container{
    margin-top: 1.05vh;
    margin-top: 1.05svh;
    font-family: "SegoeRegular", "serif";
    font-size: 2.5vh;
    font-size: 2.5svh;
}

.cta-content .wide-button{
    font-family: "SegoeBL", "serif";
    background: white;
    color: black;
    font-size: 1.8vh;
    font-size: 1.8svh;
}

.light .cta .wide-button,
.trivia_crack_v1 .wide-button {
    background: black;
    color: white;
}

.cta-logo-container{
    animation-delay: 0s;
}

.main-text-container {
    animation-delay: 0.1s;
}

.secondary-text-container {
    animation-delay: 0.2s;
}

.wide-button {
    animation-delay: 0.3s;
}


@media (orientation: landscape) {
    .cta-content {
        width: 45.21svh;
    }
}

.slide-in-bottom {
    animation: slide-in-bottom-overshoot var(--cta-animation-timer) ease-out both;
    animation-delay: 2s;
}

@keyframes slide-in-bottom-overshoot {
    0% {
        transform: translateY(8vh);
        transform: translateY(8svh);
        opacity: 0;
    }
    20%{
        opacity: 1;
    }
    40% {
        transform: translateY(-3vh);
        transform: translateY(-3svh);
    }
    100% {
        transform: translateY(0);
    }
}

.main-text-container{
    animation-delay: 0.5s;
}

.secondary-text-container{
    animation-delay: 0.6s;
}

.wide-button{
    animation-delay: 0.7s;
}

.fade-in-bottom {
    animation: fade-in-bottom var(--cta-image-animation) cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes fade-in-bottom {
    0% {
        transform: translateY(20vh);
        transform: translateY(20svh);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.fade-in-top {
    animation: fade-in-top var(--cta-animation-timer) cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@keyframes fade-in-top {
    0% {
        transform: translateY(-50vh);
        transform: translateY(-50svh);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}



/*# sourceMappingURL=main.f6f5744d.css.map*/