.box .row{
    display: flex;
    padding: 0.75rem 0.5rem;
    border-bottom:1px solid var(--themeColorModeBordersLite);
}

.box .row:last-of-type{
    border-bottom: none;
}

.cell{
    flex:1 1;
}

.box .row SELECT{
    width:100%;
}

.box .row .cell.label{
    flex:0.5 0.5;
    font-weight:bold;
    margin-right: 1rem;
}

.cell.lighter{
    color:#888;
}

.cell.smaller{
    font-size:0.8rem;
}

.box .row .cell .details{
    font-size:0.8rem;
    margin:0.5rem 0 0 0;
    display: flex;
    align-items: center;
}

.box .row .cell .details .separator{
    display: inline-block;
    border-left: 1px solid var(--themeColorModeBorders);
    margin:0 1rem;
    width:1px;
    height:1rem;
}

.cell.score{
    flex: none;
    max-width:5rem;
    min-width:5rem;
    margin-right:2rem;
}

.subjectDescription.accountData{
    margin:-2rem auto 0 auto
}

.dashboardScore{
    margin:0 auto;
    font-size:0.9rem;
    line-height: 2rem;
    font-weight: bold;
    text-align: center;
    width:4rem;
    height:2rem;
    box-sizing: border-box;
    border-radius: 0.5rem;
    background-color: var(--themeColorModeButtonBackground);
    border:1px solid;
    color:var(--themeColorModeUiElementBackground);
}

.progressIndicator{
    margin:1rem 0 0 0;
    font-size:0.7rem;
    text-align: center;
}

.avatar{
    width:15rem;
    height:15rem;
    border-radius:7.5rem;
    border:1rem solid var(--themeColorModeButtonBackground);
    box-sizing: border-box;
    margin:-6rem auto 1rem auto;
    display: inline-block;
}

.profileLogin{
    font-size:1.5rem;
    font-weight:bold;
}

.mRepetitor{

}

.mRepetitor.minimized{
    position: relative;
}


.mRepetitor .body{
    min-height:15rem;
}

.mRepetitor .questionBody{
    display:flex;
    flex-direction: column;
}

.mRepetitor.uiWindow.fullscreen .questionBody{
    flex-direction: unset;
}

.mRepetitor.uiWindow.fullscreen .body{
    max-height:calc(100vh - 6.5rem);
}

.mRepetitor .subInfoContainer{
    text-align: center;
}

.mRepetitor .subInfoContainer SMALL{
    display: block;
    font-weight: normal;
    background-color: var(--themeColorModeButtonBackground);
    padding:0.25rem;
    font-size:0.7rem;
    border-radius:0 0 0.5rem 0.5rem;
    padding:0.5rem 2rem;
}

.mRepetitor.uiWindow.fullscreen .subInfoContainer SMALL{
    border-radius: 0.5rem;
}

.mRepetitor .questionText{
    margin:2rem 0 2rem 0;
    font-size:1.4rem;
    text-align: center;
}

.mRepetitor .questionPictureContainer{
    max-height:25rem;
    background-color: var(--themeColorModeButtonBackground);
}

.mRepetitor.uiWindow.fullscreen .questionPictureContainer{
    border-radius: 0.5rem;
    margin-right:2rem;
}

.mRepetitor .questionPictureContainer IMG{
    object-fit: contain;
    object-position: center;
    height:20rem;
    width:100%;
    display: block;
}

.mRepetitor .buttons{
    margin-top:2rem;
    padding-top:1rem;
    min-height:1.5rem;
    border-top:1px solid var(--themeColorModeBorders);
    position: relative;
}

.mRepetitor.uiWindow.fullscreen .buttons{
    height:4rem;
}

.mRepetitor .buttons .button{
    display: inline-block;
    width: auto;
    margin:0 0.5rem 0.5rem 0;
}

.mRepetitor.uiWindow.fullscreen .buttons .floating{
    position: absolute;
    left: 1rem;
    bottom:0.5rem;
}


.mRepetitor .button.answer{
    position: absolute;
    right: 0;
    bottom:-0.5rem;
    background-color: var(--themeMain);
    color: var(--themeColorTextInvert);
}

.mRepetitor.uiWindow.fullscreen .button.answer{
    position: absolute;
    bottom:0.5rem;
    background-color: var(--themeMain);
    color: var(--themeColorTextInvert);
}



.mRepetitor .summaryScreen{
    font-size:1.6rem;
    text-align:center;
    padding:1rem;
    border-radius: 1rem;
}

.mRepetitor .correctRow{
    display: block;
    padding: 0.25rem 0.5rem;
    text-decoration: none;
    text-align: center;
    color: var(--themeColorModeText);
    font-size:1.2rem;
}

.mRepetitor.uiWindow.fullscreen .correctRow{
    font-size:2.5rem;
}

.mRepetitor .iconsContainer{
    position: absolute;
    bottom:5rem;
    right:2rem;
    z-index: 100;
}

.mRepetitor .iconsContainer .icon{
    -webkit-animation: wobble-ver-left cubic-bezier(0.165, 0.840, 0.440, 1.000) 1s both;
    animation: wobble-ver-left cubic-bezier(0.165, 0.840, 0.440, 1.000) 1s both;
    font-size:2rem;
    border-radius:1rem;
}

.mRepetitor.uiWindow.fullscreen .iconsContainer{
    position: absolute;
    bottom:5rem;
    right:2rem;
}

.mRepetitor.uiWindow.fullscreen .iconsContainer .icon{
    font-size:3rem;
}

.mRepetitor .body .answerBox.qwt6{
    line-height:2rem;
}

.premiumIndicator{
    background-color: var(--themeMainLite);
    padding:0.5rem 1rem;
    border-radius: 0.5rem;
    display: flex;
    font-size:0.8rem;
    display: inline-block;
}
.premiumIndicator .label{
    font-weight: bold;
}

.avatarContainer{
    position: relative;
    display: inline-block;
    cursor:pointer;
}

.avatarContainer .uploadNew{
    width:2rem;
    height:2rem;
    border-radius: 1rem;
    box-sizing: border-box;
    background-color: var(--themeMain);
    color: var(--themeColorTextInvert);
    position: absolute; bottom:2.2rem; right:2.2rem;
    cursor: pointer;
    line-height: 2rem;
}

.userRanking{
    margin-bottom:2rem;
    padding-bottom:2rem;
    border-bottom: 1px solid var(--themeColorModeBorders);
}


.userRanking .place{
    color: var(--themeMain);
    font-weight: bold;
    text-align: center;
    font-size:5rem;
}

.userRanking .place.small{
    font-size:2.5rem;
}
@media screen and (max-width: 640px) {

    .mRepetitor.uiWindow.fullscreen .questionBody{
        flex-direction: column;
    }

    .mRepetitor.uiWindow.fullscreen .questionPictureContainer{
        margin-right:0;
        border-radius:0.5rem 0.5rem 0 0;
    }

    .mRepetitor.uiWindow.fullscreen .subInfoContainer SMALL{
        border-radius: 0 0 0.5rem 0.5rem;
    }

    .responsive-column .flex1,
    .responsive-column .flex2,
    .responsive-column .flex3,
    .responsive-column-reverse .flex1,
    .responsive-column-reverse .flex2,
    .responsive-column-reverse .flex3{
        padding:0;
    }

    .responsive-column .box,
    .responsive-column-reverse .box{
        margin-right:0;
    }

}

/* ----------------------------------------------
 * Generated by Animista on 2024-5-7 16:42:26
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation wobble-ver-left
 * ----------------------------------------
 */
@keyframes wobble-ver-left {
    0%
     {
        transform: translateY(0) rotate(0);
        transform-origin: 50% 50%;
    }
    15% {
        transform: translateY(-30px) rotate(-6deg);

    }
    30% {
        transform: translateY(15px) rotate(6deg);
    }
    45% {
        transform: translateY(-15px) rotate(-3.6deg);
    }
    60% {
        transform: translateY(9px) rotate(2.4deg);
    }
    75% {
        transform: translateY(-6px) rotate(-1.2deg);
    }
    100%{
        transform: translateY(0) rotate(0);
        transform-origin: 50% 50%;
    }
}
