/* ************************** */
/* GENERAL */
/* ************************** */

:root {
    --white: #ffffff;
    --dark-gray: #666666;
    --dark-gray-2: #808080;
    --gray: #938895;
    --medium-gray: #999999;
    --light-gray: #f2f2f2;
    --dark-green: #005b71;
    --dark-green-2: #245963;
    --dark-green-3: #128095;
    --dark-green-4: #24596e;

    --medium-green: #669daa;

    --light-green: #0098a5;
    --light-green-2: #80cbd2;
    --light-green-3: #91acb6;

    --dark-violet: #662e91;
    --dark-violet-3: #8755a3;
    --medium-violet: #b37ec4;
    --medium-violet2: #9065ab;
    
    --light-violet: #7e459b;
    --light-violet-2: #cfaeda;
    --light-violet-3: #b296c8;

    --dark-pink: #9e005c;
    --medium-pink: #c5669d;
    --light-pink-2: #cf80ad;
    --light-pink: #c5669d;

    --red: #bd2026;

    --gradient: linear-gradient(90deg, rgba(190, 15, 15, 1) 0%, rgba(161, 94, 181, 1) 50%, rgba(0, 150, 164, 1) 94%);
    --default-border-radius: 60px;
    --default-border-radius-inner: 30px;
    --default-border-radius-checkbox: 45px;
}

* {
    box-sizing: border-box;
    font-family: 'Poppins';
}

body {
    margin: 0;
    width: 3840px;
    height: 2160px;
    color: #000;
    background-color: fff;
    user-select: none;
}

.hidden {
    display: none;
}

.fullsize {
    width: 100%;
    height: 100%;
}

.button {
    cursor: pointer;
    pointer-events: all;
    /*opacity: 0.5;*/
}

.button-link {
    cursor: pointer;
    pointer-events: all;
    /*opacity: 0.5;*/
}

.highlight {
    transform-origin: center;
    animation: 1.5s linear 0s infinite normal none running anim-highlight !important;
}

.pulse {
    transform-origin: center;
    animation: 3s linear 0s infinite normal none running anim-pulse !important;
    animation-delay: 0.5s !important;
}

.button.pulse,
.icon.pulse {
    transform-origin: center;
    animation: 3s linear 0s infinite normal none running anim-pulse !important;
    animation-delay: 0.5s !important;
}

.button.locked {
    cursor: none;
    pointer-events: none;
}

.button.disabled,
.button.tempdisabled {
    cursor: none;
    pointer-events: none;
    opacity: 0.3;
}

.button.disabled .icon,
.button.tempdisabled .icon {
    cursor: none;
    pointer-events: none;
}

.button.tempdisabled .icon.pulse {
    transform-origin: center;
    animation: none !important;
    animation-delay: 0.5s !important;
}

.app-area,
.app-section,
.app-slide {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    position: absolute;
    overflow: hidden;
}

.reference-popup {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    position: absolute;
    overflow: hidden;
}

.reference-popup .overlay {
    width: 100%;
    height: 100%;
    background-color: #030F3B;
    opacity: 0.75;
}

.home-popup {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    position: absolute;
    overflow: hidden;
}

.home-popup .overlay {
    width: 100%;
    height: 100%;
    background-color: #030F3B;
    opacity: 0.75;
}

.box {
    position: absolute;
}

.videofullscreen {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.videoboxfullscreen {
    position: absolute;
    z-index: 100;
    width: 100%;
    height: 100%;
}

.videofullscreen {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
}

.playvideo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}

.closevideo {
    position: absolute;
    top: 2%;
    right: 2%;
    cursor: pointer;
    width: 150px;
    height: 150px;
}

.box-draggable.dragging {
    z-index: 100;
}

input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    cursor: pointer;
    outline: none;
}

input[type=range]:focus,
input[type=range]:active {
    outline: none;
}

input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    background: white;
    border: 15px solid var(--gray);
    border-radius: var(--default-border-radius-checkbox);
    width: 5%;
    aspect-ratio: 1 / 1;
    margin-right: 1%;
}

input[type="checkbox"].error {
    border-color: var(--red);
}

input[type="checkbox"]:checked {
    position: relative;
    background: #ffffff;
}

input[type="checkbox"]:checked:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("../../assets/img/common/v-green.png") no-repeat;
    background-size: contain;
    width: 80%;
    aspect-ratio: 1 / 1;
}

.radio-group {
    display: flex;
    flex-direction: column;
    gap: 88px;
}

/* Hide default radio input */
.radio-group input {
    display: none;
}

/* Custom radio button */
.radio-group label {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.radio-group .custom-radio {
    width: 80px;
    height: 80px;
    border: 8px solid var(--dark-green-2);
    background-color: var(--light-gray);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    position: relative;
}

/* Inner bullet using pseudo-element */
.radio-group input:checked+.custom-radio::before {
    content: "";
    width: 50px;
    height: 50px;
    background-color: var(--dark-green-2);
    border-radius: 50%;
    position: absolute;
}

/* Label text styling */
.radio-group span {
    color: var(--dark-gray);
    font-size: 3.4rem;
}

.simple-keyboard {
    width: 3840px;
    height: 530px;
    z-index: 100;
    position: absolute;
    left: 0px;
    bottom: 0px;
    font-size: 3rem;
}

.hg-theme-default .hg-button {
    height: 100px;
}

.hg-theme-default .hg-button.hg-standardBtn[data-skbtn=".com"] {
    max-width: 160px;
}

.hg-theme-default .hg-button.hg-standardBtn[data-skbtn="@"] {
    max-width: 100px;
}

/* LOADER */

.lds-dual-ring {
    display: inline-block;
    width: 120px;
    height: 120px;
}

.lds-dual-ring:after {
    content: " ";
    display: block;
    width: 120px;
    height: 120px;
    margin: 0px;
    border-radius: 50%;
    border: 10px solid;
    border-color: rgba(190, 15, 15, 1) transparent rgba(0, 152, 165, 1) transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}

#loader>div {
    position: absolute;
    width: 1366px;
    height: 1024px;
    z-index: 4;
}

/* ROTATE DEVICE */
#rotate-device {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99999;
}

#rotate-device p {
    color: #fff;
    font-size: 50px;
    text-align: center;
    display: block;
    position: relative;
    top: 32%;
}

#rotate-device img {
    display: block;
    position: relative;
    width: 30%;
    height: auto;
    top: 25%;
    left: 35%;
    filter: invert(1);
    animation: rotate90deg 2s infinite;
}

/* ANIMATIONS */
@-webkit-keyframes anim-pulse {
    0% {
        -webkit-transform: scale3d(1.0, 1.0, 1.0);
        -webkit-animation-timing-function: ease-in-out;
    }

    5% {
        -webkit-transform: scale3d(1.15, 1.15, 1.15);
        -webkit-animation-timing-function: ease-in-out;
    }

    10% {
        -webkit-transform: scale3d(1.0, 1.0, 1.0);
        -webkit-animation-timing-function: ease-in-out;
    }
}

@-webkit-keyframes anim-highlight {
    0% {
        -webkit-transform: scale3d(1.0, 1.0, 1.0);
        -webkit-animation-timing-function: ease-in-out;
    }

    50% {
        -webkit-transform: scale3d(1.15, 1.15, 1.15);
        -webkit-animation-timing-function: ease-in-out;
    }

    100% {
        -webkit-transform: scale3d(1.0, 1.0, 1.0);
        -webkit-animation-timing-function: ease-in-out;
    }
}

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotate90deg {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(90deg);
    }
}

/* ************************** */
/* COMMON */
/* ************************** */
.checkpoint-title::after {
    content: "";
    background-image: url(../../assets/img/common/v-green.png);
    background-repeat: no-repeat;
    width: 100px;
    height: 100px;
    position: absolute;
    top: 4%;
    right: -24%;
}

.draggable {
    background-size: 100% auto;
    background-repeat: no-repeat;
    cursor: pointer;
}

.button[buttonid="continue"] {
    background-image: url(../../assets/img/common/btn-continue.png);
    width: 936px;
    height: 351px;
}

.button[buttonid="continue2"] {
    background-image: url(../../assets/img/common/btn-continue-2.png);
    width: 812px;
    height: 311px;
}

.button[buttonid="enter"] {
    background-image: url(../../assets/img/common/btn-enter.png);
    width: 432px;
    height: 228px;
}

.button[buttonid="submit"] {
    background-image: url(../../assets/img/common/btn-submit.png);
    width: 380px;
    height: 167px;
}

.button[buttonid="back"] {
    background-image: url(../../assets/img/common/btn-back.png);
    width: 541px;
    height: 208px;
}

/* ************************** */
/* ************************** */
/* AREA TRIATHLON */
/* ************************** */
/* ************************** */

/* ************************** */
/* GROUP HOME */
/* ************************** */
/* SLIDE 1 */
.app-area[area="triathlon"] .app-section[group="home"] .app-slide[slide="1"] {
    background-image: url(../../assets/img/home/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="home"] .app-slide[slide="1"] .button[selection="start"] {
    background-image: url(../../assets/img/common/btn-start.png);
    position: absolute;
    top: 1321px;
    left: 1493px;
    width: 861px;
    height: 351px;
}

.app-area[area="triathlon"] .app-section[group="home"] .app-slide[slide="1"] .footer {
    position: absolute;
    bottom: 100px;
    color: white;
    font-size: 30px;
    line-height: 1.2;
    width: 100%;
    text-align: center;
}

/* ************************** */
/* GROUP PROFILE */
/* ************************** */
/* SLIDE 1 */
.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="1"] {
    background-image: url(../../assets/img/profile/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="1"] #specialty-select,
.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="1"] #country-select {
    position: relative;
    appearance: none;
    background-color: #fff;
    background-image: url(../../assets/img/common/select-arrow-down.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right center;
    height: 10%;
    padding: 1% 0.8% 1% 0.8%;
    border-radius: 50px;
    border: none;
    outline: none;
    width: 48%;
}

.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="1"] #specialty-select option,
.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="1"] #country-select option {
    font-size: 1.5rem;
}

/* SLIDE 2 */
.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="2"] {
    background-image: url(../../assets/img/profile/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="2"] #email-user {
    position: relative;
    appearance: none;
    background-color: #fff;
    height: 10%;
    padding: 1% 0.8% 1% 0.8%;
    border-radius: 50px;
    border: none;
    outline: none;
    width: 48%;
}

.app-area[area="triathlon"] .app-section[group="profile"] .app-slide[slide="2"] #email-user.error {
    border: 15px solid var(--red);
}


/* ************************** */
/* GROUP MAP */
/* ************************** */

.app-area[area="triathlon"] .app-section[group="map"] .map-point {
    width: 94px;
    height: 94px;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="map"] .map-gamepiece {
    width: 272px;
    height: 272px;
    position: absolute;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.app-area[area="triathlon"] .app-section[group="map"] .map-gamepiece.type2 {
    background: url(../../assets/img/common/gp-1.png);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-gamepiece.barrier {
    background: url(../../assets/img/common/gp-2.png);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-gamepiece.neuro {
    background: url(../../assets/img/common/gp-3.png);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-point.green.off {
    background-color: var(--light-green-3);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-point.green.on {
    background-color: var(--dark-green-4);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-point.violet.off {
    background-color: var(--light-violet-3);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-point.violet.on {
    background-color: var(--dark-violet);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-point.pink.off {
    background-color: var(--light-pink-2);
}

.app-area[area="triathlon"] .app-section[group="map"] .map-point.pink.on {
    background-color: var(--dark-pink);
}

/* SLIDE 1 */
.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] {
    background-image: url(../../assets/img/map/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .button[buttonid="start"] {
    background-image: url(../../assets/img/map/btn-start-map.png);
    width: 473px;
    height: 291px;
    position: absolute;
    top: 624px;
    left: 70px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="1"] {
    top: 712px;
    left: 1471px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="2"] {
    top: 831px;
    left: 1684px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="3"] {
    top: 261px;
    left: 1778px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="4"] {
    top: 416px;
    left: 1909px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="5"] {
    top: 440px;
    left: 2532px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="6"] {
    top: 622px;
    left: 2532px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="7"] {
    top: 1174px;
    left: 1503px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="8"] {
    top: 1174px;
    left: 985px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="9"] {
    top: 1434px;
    left: 1237px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="10"] {
    top: 1796px;
    left: 844px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="11"] {
    top: 1780px;
    left: 1484px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="12"] {
    top: 1347px;
    left: 1579px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="13"] {
    top: 1112px;
    left: 2401px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="14"] {
    top: 1365px;
    left: 2624px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="15"] {
    top: 1548px;
    left: 2013px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-point[position="16"] {
    top: 1686px;
    left: 2258px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-gamepiece[position="0"] {
    top: 612px;
    left: 565px;
}

.app-area[area="triathlon"] .app-section[group="map"] .app-slide[slide="1"] .map-gamepiece[position="17"] {
    top: 1558px;
    left: 2942px;
}

/* ************************** */
/* GROUP PATH.... */
/* ************************** */

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-gamepiece,
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-gamepiece,
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-gamepiece {
    position: absolute;
    width: 458px;
    height: 458px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 10;
    /*opacity: 0.1;*/
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point,
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point,
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point {
    width: 168px;
    height: 168px;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point.green.off {
    background-color: var(--light-green-3);
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point.green.on {
    background-color: var(--dark-green-4);
    outline: 30px solid var(--light-green);
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point.violet.off {
    background-color: var(--light-violet-3);
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point.violet.on {
    background-color: var(--dark-violet);
    outline: 30px solid var(--medium-violet2);
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point.pink.off {
    background-color: var(--light-pink-2);
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point.pink.on {
    background-color: var(--dark-pink);
    outline: 30px solid var(--light-pink-2);
}



/* ************************** */
/* GROUP PATH-TYPE2 */
/* ************************** */
/* SLIDE 1 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] {
    background-image: url(../../assets/img/path-type2/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="1"] {
    top: 1179px;
    left: 1173px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="1"]::after {
    content: "1.1";
    position: absolute;
    top: 11px;
    left: 40px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="2"] {
    top: 1400px;
    left: 1548px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="2"]::after,
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="4"]::after,
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="6"]::after {
    content: "";
    background: url(../../assets/img/common/v-white.png);
    position: absolute;
    background-repeat: no-repeat;
    background-size: 45% auto;
    background-position: center;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="3"] {
    top: 350px;
    left: 1711px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="3"]::after {
    content: "1.2";
    position: absolute;
    top: 11px;
    left: 32px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="4"] {
    top: 619px;
    left: 1934px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="5"] {
    top: 687px;
    left: 3101px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="5"]::after {
    content: "1.3";
    position: absolute;
    top: 11px;
    left: 32px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-point[position="6"] {
    top: 1013px;
    left: 3094px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .path-gamepiece.type2 {
    background: url(../../assets/img/common/gp-1-big.png);
    /*background-color: red;*/
    top: 996px;
    left: -204px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .content-txt[position="1"] {
    background: url(../../assets/img/path-type2/content_1_1_txt.png);
    position: absolute;
    top: 923px;
    left: 1165px;
    width: 418px;
    height: 186px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .content-txt[position="3"] {
    background: url(../../assets/img/path-type2/content_1_2_txt.png);
    position: absolute;
    top: 439px;
    left: 2042px;
    width: 762px;
    height: 96px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="1"] .content-txt[position="5"] {
    background: url(../../assets/img/path-type2/content_1_3_txt.png);
    position: absolute;
    top: 881px;
    left: 2262px;
    width: 832px;
    height: 96px;
}

/* SLIDE 2 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="2"] {
    background-image: url(../../assets/img/path-type2/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="2"] .content {
    background: url(../../assets/img/path-type2/content-1_1.png);
    background-repeat: no-repeat;
    background-size: contain;
}

/* SLIDE 3 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="3"] {
    background-image: url(../../assets/img/path-type2/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="3"] .checkpoint-1_1-1-draggable[value="most"] {
    background-image: url(../../assets/img/path-type2/drag-1_1-1.png);
    position: absolute;
    top: 931px;
    left: 1031px;
    width: 438px;
    height: 214px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="3"] .checkpoint-1_1-1-draggable[value="least"] {
    background-image: url(../../assets/img/path-type2/drag-1_1-2.png);
    position: absolute;
    top: 931px;
    left: 1515px;
    width: 438px;
    height: 214px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="3"] #checkpoint-1_1-1-droppable-1 {
    top: 764px;
    left: 1743px;
    width: 363px;
    height: 74px;
}


.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="3"] #checkpoint-1_1-2-droppable-1 {
    top: 1329px;
    left: 2386px;
    width: 363px;
    height: 74px;
    opacity: 0.5;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="3"] .checkpoint-1_1-2-draggable[value="depression"] {
    background-image: url(../../assets/img/path-type2/drag-1_1-3.png);
    position: absolute;
    top: 1441px;
    left: 1041px;
    width: 665px;
    height: 214px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="3"] .checkpoint-1_1-2-draggable[value="schizophrenia"] {
    background-image: url(../../assets/img/path-type2/drag-1_1-4.png);
    position: absolute;
    top: 1441px;
    left: 1745px;
    width: 836px;
    height: 214px;
}

/* SLIDE 4 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="4"] {
    background-image: url(../../assets/img/path-type2/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="4"] .content {
    background: url(../../assets/img/path-type2/content-1_2.png);
    background-repeat: no-repeat;
    background-size: contain;
}

/* SLIDE 5 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] {
    background-image: url(../../assets/img/path-type2/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-content .box-dashed {
    background-image: url(../../assets/img/path-type2/box-1_2.png);
    background-size: cover;
    background-repeat: no-repeat;
    width: 694px;
    height: 956px;

}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] #checkpoint-1_2-droppable-left-1 {
    top: 753px;
    left: 709px;
    width: 693px;
    height: 956px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] #checkpoint-1_2-droppable-right-1 {
    top: 753px;
    left: 2439px;
    width: 693px;
    height: 956px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="normal eosinophils"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-1.png);
    position: absolute;
    top: 619px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="elevated ige"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-2.png);
    position: absolute;
    top: 749px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="purulence"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-3.png);
    position: absolute;
    top: 880px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="patient-reported facial pain"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-4.png);
    position: absolute;
    top: 1007px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="elevated  eosinophils"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-5.png);
    position: absolute;
    top: 1127px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="eosinophilic mucin"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-6.png);
    position: absolute;
    top: 1264px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="patient-reported nasal congestion"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-7.png);
    position: absolute;
    top: 1393px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="patient-reported discharge"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-8.png);
    position: absolute;
    top: 1520px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="patient-reported smell loss"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-9.png);
    position: absolute;
    top: 1646px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="5"] .checkpoint-1_2-draggable[value="normal ige"] {
    background-image: url(../../assets/img/path-type2/drag-1_2-10.png);
    position: absolute;
    top: 1774px;
    left: 1441px;
    width: 850px;
    height: 146px;
}

/* SLIDE 6 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="6"] {
    background-image: url(../../assets/img/path-type2/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="6"] .content {
    background: url(../../assets/img/path-type2/content-1_3.png);
    background-repeat: no-repeat;
    background-size: contain;
}

/* SLIDE 7 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="7"] {
    background-image: url(../../assets/img/path-type2/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

/* SLIDE 8 */
.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="8"] {
    background-image: url(../../assets/img/path-type2/bkg_final.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-type2"] .app-slide[slide="8"] .button[buttonid="continue"] {
    position: absolute;
    top: 1613px;
    left: 1454px;
}

/* ************************** */
/* GROUP PATH-BARRIER */
/* ************************** */

.app-area[area="triathlon"] .app-section[group="path-barrier"] .checkpoint-title::after {
    content: "";
    background-image: url(../../assets/img/common/v-violet.png);
    background-repeat: no-repeat;
    width: 100px;
    height: 100px;
    position: absolute;
    top: 4%;
    right: -24%;
}

/* SLIDE 1 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] {
    background-image: url(../../assets/img/path-barrier/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="1"] {
    top: 450px;
    left: 2132px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="1"]::after {
    content: "2.1";
    position: absolute;
    top: 11px;
    left: 31px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="2"] {
    top: 455px;
    left: 1199px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="2"]::after,
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="4"]::after,
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="6"]::after {
    content: "";
    background: url(../../assets/img/common/v-white.png);
    position: absolute;
    background-repeat: no-repeat;
    background-size: 45% auto;
    background-position: center;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="3"] {
    top: 928px;
    left: 1662px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="3"]::after {
    content: "2.2";
    position: absolute;
    top: 11px;
    left: 16px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="4"] {
    top: 1597px;
    left: 953px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="5"] {
    top: 1558px;
    left: 2107px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="5"]::after {
    content: "2.3";
    position: absolute;
    top: 11px;
    left: 19px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-point[position="6"] {
    top: 758px;
    left: 2295px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .path-gamepiece.barrier {
    background: url(../../assets/img/common/gp-2-big.png);
    /*background-color: red;*/
    top: -214px;
    left: 2595px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .content-txt[position="1"] {
    background: url(../../assets/img/path-barrier/content_2_1_txt.png);
    position: absolute;
    top: 331px;
    left: 1341px;
    width: 816px;
    height: 96px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .content-txt[position="3"] {
    background: url(../../assets/img/path-barrier/content_2_2_txt.png);
    position: absolute;
    top: 959px;
    left: 1019px;
    width: 572px;
    height: 96px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="1"] .content-txt[position="5"] {
    background: url(../../assets/img/path-barrier/content_2_3_txt.png);
    position: absolute;
    top: 1302px;
    left: 1702px;
    width: 470px;
    height: 197px;
}

/* SLIDE 2 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="2"] {
    background-image: url(../../assets/img/path-barrier/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

/* SLIDE 3 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="3"] {
    background-image: url(../../assets/img/path-barrier/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="3"] .radio-group .custom-radio {
    border: 8px solid var(--dark-violet);
}

/* Inner bullet using pseudo-element */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="3"] .radio-group input:checked+.custom-radio::before {
    background-color: var(--dark-violet);
}

/* SLIDE 4 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="4"] {
    background-image: url(../../assets/img/path-barrier/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

/* SLIDE 5 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] {
    background-image: url(../../assets/img/path-barrier/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] .checkpoint-content .box-dashed {
    background-image: url(../../assets/img/path-barrier/box-2_2.png);
    background-size: cover;
    background-repeat: no-repeat;
    width: 694px;
    height: 956px;

}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] #checkpoint-2_2-droppable-left-1 {
    top: 722px;
    left: 709px;
    width: 693px;
    height: 956px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] #checkpoint-2_2-droppable-right-1 {
    top: 722px;
    left: 2439px;
    width: 693px;
    height: 956px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] .checkpoint-2_2-draggable[value="nasal polyps"] {
    background-image: url(../../assets/img/path-barrier/drag-2_2-1.png);
    position: absolute;
    top: 763px;
    left: 1463px;
    width: 962px;
    height: 189px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] .checkpoint-2_2-draggable[value="neutrophilic content"] {
    background-image: url(../../assets/img/path-barrier/drag-2_2-2.png);
    position: absolute;
    top: 1035px;
    left: 1463px;
    width: 962px;
    height: 189px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] .checkpoint-2_2-draggable[value="elevated tissue eosinophil levels"] {
    background-image: url(../../assets/img/path-barrier/drag-2_2-3.png);
    position: absolute;
    top: 1293px;
    left: 1463px;
    width: 962px;
    height: 189px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="5"] .checkpoint-2_2-draggable[value="no nasal polyps"] {
    background-image: url(../../assets/img/path-barrier/drag-2_2-4.png);
    position: absolute;
    top: 1577px;
    left: 1463px;
    width: 962px;
    height: 189px;
}

/* SLIDE 6 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="6"] {
    background-image: url(../../assets/img/path-barrier/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="6"] .content {
    background: url(../../assets/img/path-barrier/content-2_3.png);
    background-repeat: no-repeat;
    background-size: contain;
}

/* SLIDE 7 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="7"] {
    background-image: url(../../assets/img/path-barrier/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="7"] .checkpoint-2_3-1-draggable[value="conductive dysfunction"] {
    background-image: url(../../assets/img/path-barrier/drag-2_3-1.png);
    position: absolute;
    top: 1361px;
    left: 1031px;
    width: 665px;
    height: 227px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="7"] #checkpoint-2_3-1-droppable-1 {
    top: 756px;
    left: 1720px;
    width: 389px;
    height: 74px;
}


.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="7"] #checkpoint-2_3-2-droppable-1 {
    top: 1169px;
    left: 1499px;
    width: 385px;
    height: 74px;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="7"] .checkpoint-2_3-2-draggable[value="sensorineural dysfunction"] {
    background-image: url(../../assets/img/path-barrier/drag-2_3-2.png);
    position: absolute;
    top: 1361px;
    left: 1885px;
    width: 659px;
    height: 227px;
}

/* SLIDE 8 */
.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="8"] {
    background-image: url(../../assets/img/path-barrier/bkg_final.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-barrier"] .app-slide[slide="8"] .button[buttonid="continue"] {
    position: absolute;
    top: 1613px;
    left: 1454px;
}

/* ************************** */
/* GROUP PATH-NEURO */
/* ************************** */

.app-area[area="triathlon"] .app-section[group="path-neuro"] .checkpoint-title::after {
    content: "";
    background-image: url(../../assets/img/common/v-pink.png);
    background-repeat: no-repeat;
    width: 100px;
    height: 100px;
    position: absolute;
    top: 4%;
    right: -24%;
}

/* SLIDE 1 */
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] {
    background-image: url(../../assets/img/path-neuro/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="1"] {
    top: 320px;
    left: 1940px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="1"]::after {
    content: "3.1";
    position: absolute;
    top: 11px;
    left: 31px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="2"] {
    top: 767px;
    left: 2376px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="2"]::after,
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="4"]::after {
    content: "";
    background: url(../../assets/img/common/v-white.png);
    position: absolute;
    background-repeat: no-repeat;
    background-size: 45% auto;
    background-position: center;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="3"] {
    top: 1108px;
    left: 1263px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="3"]::after {
    content: "3.2";
    position: absolute;
    top: 11px;
    left: 16px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    color: #fff;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-point[position="4"] {
    top: 1389px;
    left: 1715px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .path-gamepiece.neuro {
    background: url(../../assets/img/common/gp-3-big.png);
    /*background-color: red;*/
    top: 549px;
    left: 589px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .content-txt[position="1"] {
    background: url(../../assets/img/path-neuro/content_3_1_txt.png);
    position: absolute;
    top: 508px;
    left: 2197px;
    width: 620px;
    height: 132px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .content-txt[position="3"] {
    background: url(../../assets/img/path-neuro/content_3_2_txt.png);
    position: absolute;
    top: 1138px;
    left: 1492px;
    width: 567px;
    height: 134px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .button[buttonid="finish"] {
    background: url(../../assets/img/path-neuro/finish-off.png);
    position: absolute;
    top: 1576px;
    left: 3008px;
    width: 723px;
    height: 610px;
    pointer-events: none;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="1"] .button[buttonid="finish"].on {
    background: url(../../assets/img/path-neuro/finish-on.png);
    pointer-events: all;
}

/* SLIDE 2 */
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="2"] {
    background-image: url(../../assets/img/path-neuro/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

/* SLIDE 3 */
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="3"] {
    background-image: url(../../assets/img/path-neuro/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="3"] .checkpoint-3_1-1-draggable[value="type 1 inflammation"] {
    background-image: url(../../assets/img/path-neuro/drag-3_1-1.png);
    position: absolute;
    top: 1080px;
    left: 1031px;
    width: 814px;
    height: 184px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="3"] #checkpoint-3_1-1-droppable-1 {
    top: 756px;
    left: 1394px;
    width: 389px;
    height: 74px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="3"] .checkpoint-3_1-1-draggable[value="type 2 inflammation"] {
    background-image: url(../../assets/img/path-neuro/drag-3_1-2.png);
    position: absolute;
    top: 1080px;
    left: 2075px;
    width: 808px;
    height: 184px;
}

/* SLIDE 4 */
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="4"] {
    background-image: url(../../assets/img/path-neuro/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="4"] .swiper-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="4"] .swiper-slide {
    background-size: cover;
    background-position: center;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="4"] .swiper-pagination {
    position: absolute;
    bottom: 870px;
    width: 92%;
    display: block;
    left: 100px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="4"] .swiper-pagination img {
    width: 55px;
    height: 89px;
    cursor: pointer;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="4"] .swiper-pagination img.prev-slide {
    position: absolute;
    top: 0px;
    left: 0px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="4"] .swiper-pagination img.next-slide {
    position: absolute;
    top: 0px;
    right: 0px;
}

/* SLIDE 5 */
.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="5"] {
    background-image: url(../../assets/img/path-neuro/bkg_2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="5"] .checkpoint-3_2-1-draggable[value="decreased"] {
    background-image: url(../../assets/img/path-neuro/drag-3_2-1.png);
    position: absolute;
    top: 1083px;
    left: 1031px;
    width: 605px;
    height: 187px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="5"] #checkpoint-3_2-1-droppable-1 {
    top: 756px;
    left: 2350px;
    width: 389px;
    height: 74px;
}


.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="5"] #checkpoint-3_2-2-droppable-1 {
    top: 905px;
    left: 1059px;
    width: 385px;
    height: 74px;
}

.app-area[area="triathlon"] .app-section[group="path-neuro"] .app-slide[slide="5"] .checkpoint-3_2-2-draggable[value="increased"] {
    background-image: url(../../assets/img/path-neuro/drag-3_2-2.png);
    position: absolute;
    top: 1083px;
    left: 1692px;
    width: 578px;
    height: 187px;
}

/* ************************** */
/* GROUP END */
/* ************************** */

/* SLIDE 1 */
.app-area[area="triathlon"] .app-section[group="end"] .app-slide[slide="1"] {
    background-image: url(../../assets/img/path-result/bkg2.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="end"] .app-slide[slide="1"] .button[buttonid="explore"] {
    background-image: url(../../assets/img/common/btn-explore-more.png);
    position: absolute;
    top: 1498px;
    left: 1555px;
    width: 737px;
    height: 276px;
}

/* SLIDE 2 */
.app-area[area="triathlon"] .app-section[group="end"] .app-slide[slide="2"] {
    background-image: url(../../assets/img/end/bkg.png);
    width: 100%;
    height: 100%;
    position: absolute;
}

.app-area[area="triathlon"] .app-section[group="end"] .app-slide[slide="2"] .button[buttonid="return"] {
    background-image: url(../../assets/img/common/btn-return.png);
    position: absolute;
    top: 1361px;
    left: 2285px;
    width: 559px;
    height: 291px;
}

.app-area[area="triathlon"] .app-section[group="end"] .app-slide[slide="2"] .qr {
    position: absolute;
    top: 654px;
    left: 573px;
}

.app-area[area="triathlon"] .app-section[group="end"] .app-slide[slide="2"] .advent-link {
    position: absolute;
    top: 994px;
    left: 1684px;
}


@keyframes zoomOut {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes zoomIn {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    100% {
        transform: scale(0);
        opacity: 0;
    }
}

.zoom-out {
    animation: zoomOut 0.3s ease-out forwards;
}

.zoom-in {
    animation: zoomIn 0.3s ease-in forwards;
}