



#contentLAYOUT { scroll-snap-type: y proximity; scroll-behavior: smooth;-webkit-overflow-scrolling: touch; }
#contentLAYOUT section { scroll-snap-align: start; scroll-snap-stop: normal; }
/*#contentLAYOUT section.media,
#contentLAYOUT section.login,
#contentLAYOUT section.message,
#contentLAYOUT section.footer { scroll-snap-align: initial; }*/





section.media > .row { padding: 0; gap: 0; flex-wrap: wrap; position: relative; background-color: var(--beige); }
section.media > .row .image { width: 100%; background-position: left center; background-size: cover; }
section.media > .row .video video { width: 100%; object-fit: cover; }
section.media > .row .video-embed { position: relative; width: 100%; overflow: hidden; }
section.media > .row .video-embed iframe { position: absolute; top: 0; left: 0; }
section.media > .row .gradient { height: 16vh; width: 100%; position: absolute; left: 0; }
section.media > .row .gradient.top { background: linear-gradient( to bottom,var(--white) 0%, rgba(255, 255, 255, 0) 100%); top: 0; }
section.media > .row .gradient.bottom { background: linear-gradient( to bottom, rgba(255, 255, 255, 0) 0%,var(--white) 100%); bottom: 0; }




section.login
section.login > .row { padding: 0; gap: 0; flex-wrap: wrap; }

section.login .section-text .content button { font-weight: 600; }
section.login .section-text .content button:hover { text-decoration: underline; }

.section-title .logo svg,
.section-title .logo img { height: 32px; width: auto; }

.section-form .text { margin-top: 0px !important; }
.section-form .text button { font-size: 10px; line-height: normal; }
.section-form .text button span { font-size: 10px; line-height: normal; }
.section-form .text button:hover { text-decoration: underline; }



section.register
section.register > .row { padding: 0; gap: 0; flex-wrap: wrap; }
section.register > .row.form {  }



.section-footer.margin-top-8 { margin-top: 160px; }







#contentLAYOUT .emoji { position: fixed; top: 80px; right: 40px; width: 72px; display: flex; justify-content: center; flex-direction: column; align-items: center; gap: 8px; }
#contentLAYOUT .emoji .eyes { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; padding: 0px; height: 32px; }
#contentLAYOUT .emoji .eyes > .wrap { display: flex; gap: 8px; cursor: pointer; }
#contentLAYOUT .emoji .eyes .eye { width: 32px; height: 32px; }
#contentLAYOUT .emoji.main { z-index: 2; }
#contentLAYOUT .emoji.main .eyes .eye { border-radius: 50%; border: 1px solid var(--dark); background-color: #f6f6f6; position: relative; overflow: hidden; }
#contentLAYOUT .emoji.main .eyes .eye .pupil { width: 20px; height: 20px; border-radius: 50%; background-color: var(--dark); position: absolute; top: 20px; left: 20px; transform: translate(-50%, -50%); }





section.message { position: fixed; top: 40px; left: 40px; width: calc(100vw - 40px); height: calc(100vh - 40px); background: #EEEEEE; z-index: 12; margin-top: 0; display: none; }
section.message > .wrap { padding: 0; }
section.message #bcPaint { font-size: 0; line-height: 0; }
section.message #bcPaint .row { padding: 0; }
section.message #bcPaint-menu { position: absolute; top: 40px; left: 40px; }
section.message #bcPaint-menu button { padding: 0 8px; height: 32px; border-radius: 20px; border: 1px solid var(--dark); margin-right: 8px; }
section.message #bcPaint-menu button span { display: inline-block; vertical-align: middle; }
section.message #bcPaint-palette { margin-top: 8px; white-space: nowrap; overflow-x: auto; width: 100%; }
section.message #bcPaint-palette .bcPaint-palette-color { width: 32px; height: 32px; display: inline-block; cursor: pointer; border-radius: 16px; margin-right: 8px; }
section.message #bcPaint-palette > .selected { border: 2px solid #343a40; }
section.message #bcPaint button.close { position: absolute; top: 40px; right: 40px; width: 32px; height: 32px; border-radius: 16px; border: 1px solid var(--dark); }
section.message #bcPaint button.close span { display: inline-block; vertical-align: middle; }
section.message #bcPaint button.close:hover { background-color: var(--dark); color: var(--white); }








section.gameListenAndSpell { position: relative; background-image: url(/public/storage/web/public/gameListenAndSpell/background.png); background-size: cover; background-position: center center; cursor: url(/public/storage/web/public/cursor-unicorn.png), auto; }
section.gameListenAndSpell > .row { padding: 0; gap: 0; align-content: center; }

section.gameListenAndSpell > .row.index {  }
section.gameListenAndSpell > .row.index .section-buttons {  }
section.gameListenAndSpell > .row.index .section-buttons > .wrap { display: flex; justify-content: center; flex-wrap: nowrap; flex-direction: row; gap: 40px; }
section.gameListenAndSpell > .row.index .section-buttons > .wrap .column { text-align: center; }
section.gameListenAndSpell > .row.index .section-buttons button.play { font-size: 2rem; font-weight: bold; border: 2px solid #333; background: #fff; padding: 10px 20px; cursor: pointer; overflow: hidden; }
section.gameListenAndSpell > .row.index .section-buttons button.play span { display: block; font-size: 0.8rem; line-height: normal; font-weight: 300; margin-top: 4px; }
section.gameListenAndSpell > .row.index .section-buttons button.play:hover { background-color: var(--dark); color: var(--white); }

section.gameListenAndSpell > .row.game { display: none; }
section.gameListenAndSpell > .row.game  .section-word {  }
section.gameListenAndSpell > .row.game  .section-word > .wrap { text-align: center; }
section.gameListenAndSpell > .row.game  .section-word .anwser { display: flex; align-items: center; flex-direction: column; }
section.gameListenAndSpell > .row.game  .section-word .inputs { font-size: 0; }
section.gameListenAndSpell > .row.game  .section-word .inputs input.letter { width: 40px; height: 56px; font-size: 24px; font-weight: 300; text-align: center; border: 1px solid var(--dark); outline: none; background: var(--violet-2); text-transform: lowercase; border-radius: 16px; margin: 2px; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5); }
section.gameListenAndSpell > .row.game  .section-word .actions { margin-top: 14px; }
section.gameListenAndSpell > .row.game  .section-word .actions .score { margin: 3px 8px 3px 0px; line-height: 24px; background: var(--white); display: inline-block; border-radius: 16px; min-width: 38px; padding: 4px 8px; text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; border: 1px solid var(--dark); text-align: left; }
section.gameListenAndSpell > .row.game  .section-word .actions button { background: var(--white); }

section.gameListenAndSpell > .row.newwords { display: none; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; line-height: 24px; text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; background-color: var(--beige); }
section.gameListenAndSpell > .row.newwords .section-text .content { line-height: 48px; font-size: 32px; }
section.gameListenAndSpell > .row.newwords .section-text .content span { display: block; }
section.gameListenAndSpell > .row.newwords .section-actions { position: absolute; z-index: 2; top: 32px; right: 9px; }
section.gameListenAndSpell > .row.newwords .section-actions button { margin: 0; padding: 0; min-width: 0; height: 32px; width: 32px; text-align: center; }


section.gameListenAndSpell .feedback { display: none; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; line-height: 24px; background: var(--yellow); text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; }
section.gameListenAndSpell .feedback span { color: var(--dark); }

section.gameListenAndSpell .feedback.true { background-color: #1A9562; z-index: 1; }
section.gameListenAndSpell .feedback.true .emoji .eyes {  }
section.gameListenAndSpell .feedback.true .emoji .eyes .eye {  }
section.gameListenAndSpell .feedback.true .emoji .mouth { width: 80px; height: 40px; border: 4px solid var(--dark); border-color: transparent transparent var(--dark) transparent; border-radius: 0 0 80px 80px; }

section.gameListenAndSpell .feedback.false { background-color: #EE5A36; z-index: 2; }
section.gameListenAndSpell .feedback.false .emoji {  }
section.gameListenAndSpell .feedback.false .emoji .eyes {  }
section.gameListenAndSpell .feedback.false .emoji .eyes .eye { background: linear-gradient(45deg, transparent 45%, var(--dark) 45%, var(--dark) 55%, transparent 55%), linear-gradient(-45deg, transparent 45%, var(--dark) 45%, var(--dark) 55%, transparent 55%); }
section.gameListenAndSpell .feedback.false .emoji .mouth { height: 48px; width: 40px; border: 4px solid var(--dark); border-radius: 50%; }







@import url('https://fonts.googleapis.com/css2?family=Schoolbell&display=swap');
section.gameAscoltaPoiScrivi { position: relative; cursor: url(/public/storage/web/public/cursor-unicorn.png), auto; background-image: url(/public/storage/web/public/gameAscoltaPoiScrivi/background.jpg); background-size: cover; background-position: center center; }
section.gameAscoltaPoiScrivi > .row { padding: 0; gap: 0; align-content: center; }

section.gameAscoltaPoiScrivi > .row.index {  }
section.gameAscoltaPoiScrivi > .row.index .section-buttons {  }
section.gameAscoltaPoiScrivi > .row.index .section-buttons > .wrap { text-align: center; }
section.gameAscoltaPoiScrivi > .row.index .section-buttons button.play { font-size: 2rem; font-weight: bold; border: 2px solid #333; background: #fff; padding: 10px 20px; cursor: pointer; display: inline-flex; gap: 5px; overflow: hidden; }
section.gameAscoltaPoiScrivi > .row.index .section-buttons button.play span { display: inline-block; }
section.gameAscoltaPoiScrivi > .row.index .section-actions {  }
section.gameAscoltaPoiScrivi > .row.index .section-actions > .wrap { text-align: center; }
section.gameAscoltaPoiScrivi > .row.index .section-actions button { background-color: var(--beige); }

section.gameAscoltaPoiScrivi > .row.game { display: none; }
section.gameAscoltaPoiScrivi > .row.game > .col-full { position: relative; }
section.gameAscoltaPoiScrivi > .row.game > .col-full > .wrap { position: absolute; bottom: 20px; width: 100%; }
section.gameAscoltaPoiScrivi > .row.game  .section-word {  }
section.gameAscoltaPoiScrivi > .row.game  .section-word > .wrap { text-align: center; padding: 0px; }
section.gameAscoltaPoiScrivi > .row.game  .section-word .anwser { display: flex; align-items: center; flex-direction: column; }
section.gameAscoltaPoiScrivi > .row.game  .section-word .anwser input { font-family: 'Schoolbell', cursive !important; font-size: 2em; border: none; background: transparent; color: var(--white); text-align: center; width: 100%; }
section.gameAscoltaPoiScrivi > .row.game  .section-word .actions { margin-top: 40px; }
section.gameAscoltaPoiScrivi > .row.game  .section-word .actions .score { margin: 3px 8px 3px 0px; line-height: 24px; background: var(--white); display: inline-block; border-radius: 16px; min-width: 38px; padding: 4px 8px; text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; border: 1px solid var(--dark); text-align: left; }
section.gameAscoltaPoiScrivi > .row.game  .section-word .actions button { background: var(--white); }

section.gameAscoltaPoiScrivi > .row.newwords { display: none; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; line-height: 24px; text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle;
background-color: var(--beige); }
section.gameAscoltaPoiScrivi > .row.newwords .section-text .content { line-height: 48px; font-size: 32px; }
section.gameAscoltaPoiScrivi > .row.newwords .section-text .content span { display: block; }
section.gameAscoltaPoiScrivi > .row.newwords .section-actions { position: absolute; top: 0; left: 0; }

section.gameAscoltaPoiScrivi .feedback { display: none; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; line-height: 24px; background: var(--yellow); text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; }
section.gameAscoltaPoiScrivi .feedback span { color: var(--dark); }
section.gameAscoltaPoiScrivi .feedback.true { background-color: #1A9562; z-index: 1; }
section.gameAscoltaPoiScrivi .feedback.true .emoji .eyes {  }
section.gameAscoltaPoiScrivi .feedback.true .emoji .eyes .eye {  }
section.gameAscoltaPoiScrivi .feedback.true .emoji .mouth { width: 80px; height: 40px; border: 4px solid var(--dark); border-color: transparent transparent var(--dark) transparent; border-radius: 0 0 80px 80px; }
section.gameAscoltaPoiScrivi .feedback.false { background-color: #EE5A36; z-index: 2; }
section.gameAscoltaPoiScrivi .feedback.false .emoji {  }
section.gameAscoltaPoiScrivi .feedback.false .emoji .eyes {  }
section.gameAscoltaPoiScrivi .feedback.false .emoji .eyes .eye { background: linear-gradient(45deg, transparent 45%, var(--dark) 45%, var(--dark) 55%, transparent 55%), linear-gradient(-45deg, transparent 45%, var(--dark) 45%, var(--dark) 55%, transparent 55%); }
section.gameAscoltaPoiScrivi .feedback.false .emoji .mouth { height: 48px; width: 40px; border: 4px solid var(--dark); border-radius: 50%; }




section.gameMemory { position: relative; cursor: url(/public/storage/web/public/cursor-unicorn.png), auto; }
section.gameMemory > .row {  }
section.gameMemory #memory-board {
    display: grid;
    align-content: start;
    gap: 8px;
  }


  .card {
    aspect-ratio: 1 / 1;
    perspective: 1000px;
    cursor: pointer;
}

.card-inner {
    width: 100%;
    height: 100%;
    position: relative;
    transition: transform 0.4s;
    transform-style: preserve-3d;
}

.card.flipped .card-inner {
    transform: rotateY(180deg);
}

.card-front,
.card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    border-radius: 16px;
}

/* Carta coperta */
.card-front {
    background-color: var(--dark);
    opacity: 1;
    background-size: 80px;
    background-repeat: no-repeat;
    background-image: url(/public/storage/web/public/gameMemory/back.png);
}

/* Carta scoperta */
.card-back {
    background-color: var(--white);
    transform: rotateY(180deg);
    background-size: cover;
    background-position: center;
}












section.gameRockPapaerScissor {  }
section.gameRockPapaerScissor > .row {  }
section.gameRockPapaerScissor .col-2 { margin-left: auto; margin-right: auto; }

section.gameRockPapaerScissor .section-result > .wrap { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; }
section.gameRockPapaerScissor .section-result .score { display: inline-block; background: var(--dark); color: var(--white); line-height: 20px; font-size: 12px; height: 20px; width: 20px; border-radius: 10px; text-align: center; }
section.gameRockPapaerScissor .section-game { aspect-ratio: 3 / 4; background: var(--dark); overflow: hidden; }
section.gameRockPapaerScissor .section-game > .wrap { padding: 0; }

section.gameRockPapaerScissor .section-game video { display: none; }
section.gameRockPapaerScissor .section-game canvas { display: block; width: 100%; height: auto; transform: scaleX(-1); aspect-ratio: 3 / 4; image-rendering: -webkit-optimize-contrast; }


section.gameRockPapaerScissor .section-game .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

            #countdown-overlay { position: absolute;top: 50%; left: 50%; font-size: 240px; font-weight: 900; color: var(--white); display: none; animation: pulse 0.8s infinite; transform: translate(-50%, -50%);  }

            @keyframes pulse {
                0% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
                50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0.9; }
                100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
            }

            .result-zone { 
                text-align: center; background: var(--beige); color: var(--yellow);   height: 100%;
    width: 100%; display: flex;
    justify-content: center;
    align-items: center;
            }
            .result-zone.show { opacity: 1; transform: scale(1); }

section.gameRockPapaerScissor .section-game .actions { position: absolute; bottom: 0; right: 0; }
section.gameRockPapaerScissor .section-game .actions button { margin: 3px 3px 3px 3px; }
            









section.gameTaboo {  }
section.gameTaboo > .row {  }
section.gameTaboo #step-1 .section-title .players .player { line-height: normal; }
section.gameTaboo #step-1 .section-title .players .player span.name { font-weight: 600; font-size: 24px; line-height: normal; }
section.gameTaboo #step-1 .section-actions .actions button { width: 100%; }
section.gameTaboo #step-2 .section-actions .actions label { font-size: 24px; line-height: normal; display: block; }
section.gameTaboo #step-2 .section-actions .actions label span { display: none; margin-right: 8px; }
section.gameTaboo #step-2 .section-actions .actions label input { display: none; }
section.gameTaboo #step-2 .section-actions .actions label:has(input:checked) { font-weight: 600; }
section.gameTaboo #step-2 .section-actions .actions label:has(input:checked) span { display: inline; }
section.gameTaboo #step-4 .col-1 { margin-left: auto; margin-right: auto; }
section.gameTaboo #step-4 .section-card { /*border: 1px solid var(--dark);*/ text-align: center; aspect-ratio: 3 / 4; position:relative; }
section.gameTaboo #step-4 .section-card .word { font-weight: 600; font-size: 24px; line-height: normal; padding: 24px 0; }
section.gameTaboo #step-4 .section-card .line { padding: 8px 0px 8px 0px; }
section.gameTaboo #step-4 .section-card .taboo-list {  }
section.gameTaboo #step-4 .section-card .taboo-list .taboo-word { font-size: 24px; padding: 16px 0 0 0; }
section.gameTaboo #step-4 .section-card .actions button { margin: 3px 0px 3px 0px; }
section.gameTaboo #step-4 .section-card.expired { background: var(--red-1); }
section.gameTaboo #step-4 .section-card.expired .line,
section.gameTaboo #step-4 .section-card.expired .taboo-list { display: none; }
section.gameTaboo #step-4 .section-actions { text-align: center; }
section.gameTaboo #step-4 .section-actions > .wrap { padding: 8px 0px 16px 0px; }
section.gameTaboo #step-4 .section-actions .actions { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 8px; }
section.gameTaboo #step-4 .section-actions .actions button { margin: 3px 0px 3px 0px; }







section.gameDemonInvaders {  }
section.gameDemonInvaders > .row {  }
section.gameDemonInvaders .section-game { border: 1px solid var(--violet-3); overflow: hidden; background-color: #0A1B48; background-image: url(/public/storage/web/public/authentication/gameDemonInvaders/background.png); background-size: 2048px auto; background-position: center bottom; background-repeat: no-repeat; }
section.gameDemonInvaders #game-container { position: relative; width: 100%; overflow: hidden; }

section.gameDemonInvaders #hud {
            position: absolute; top: 15px; left: 15px; right: 15px;
            display: flex; justify-content: space-between; z-index: 100;
            font-size: 10px; pointer-events: none;
        }
section.gameDemonInvaders #player {
            position: absolute; bottom: 16px; left: 50%;
            transform: translateX(-50%); width: 40px; height: 80px;
            background-image: url(/public/storage/web/public/authentication/gameDemonInvaders/player.svg);
            background-size: contain;
            background-repeat: no-repeat; z-index: 50;
        }

section.gameDemonInvaders .demon { position: absolute; width: 40px; height: 80px; background-size: contain; background-repeat: no-repeat; z-index: 10; cursor: pointer; }
section.gameDemonInvaders .demon-1 { background-image: url(/public/storage/web/public/authentication/gameDemonInvaders/demon-1.svg); }
section.gameDemonInvaders .demon-2 { background-image: url(/public/storage/web/public/authentication/gameDemonInvaders/demon-2.svg); }
section.gameDemonInvaders .bullet { position: absolute; width: 8px; height: 8px; background: var(--violet-3); z-index: 20; }

section.gameDemonInvaders .explosion {
            position: absolute; width: 40px; height: 80px;
            background-image: url(/public/storage/web/public/authentication/gameDemonInvaders/explosion.svg);
            background-size: contain;
            background-repeat: no-repeat;
            z-index: 15;
            pointer-events: none;
        }

section.gameDemonInvaders #math-overlay {
            display: none; 
            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
            background: var(--violet-3);
            z-index: 1000;
            flex-direction: column; justify-content: center; align-items: center;
        }
section.gameDemonInvaders #math-overlay span { color: var(--white); font-size: 24px; line-height: 24px; font-weight: 400; }
section.gameDemonInvaders #math-overlay input { width: 40px; font-size: 24px; line-height: 24px; font-weight: 400;  outline: none; background: var(--violet-3); border: none; border-bottom: 1px solid var(--white); color: var(--white); vertical-align: baseline; }


section.gameDemonInvaders .btn-ui {
            margin: 3px 8px 3px 0px;
    line-height: 24px;
    display: inline-block;
    border-radius: 16px;
    min-width: 38px;
    padding: 4px 8px;
    text-align: center;
    font-size: 14px;
    font-weight: 300;
    vertical-align: bottom;
    border: 1px solid var(--green-3);
    background: var(--green-3);
    color: var(--dark);
    text-align: left;
        }

        .penalty-text {
            position: absolute; color: #ff0000; font-size: 10px;
            z-index: 90; pointer-events: none;
        }
















section.gameDueScelte { position: relative; cursor: url(/public/storage/web/public/cursor-unicorn.png), auto; background-image: url(/public/storage/web/public/gameDueScelte/index_background.jpg); background-size: cover; background-position: center center; }
section.gameDueScelte > .row { padding: 0; gap: 0; align-content: center; background-size: contain; background-position: center center; background-repeat: no-repeat; }

section.gameDueScelte > .row.index {  }
section.gameDueScelte .section-buttons {  }
section.gameDueScelte .section-buttons > .wrap { text-align: center; }
section.gameDueScelte .section-buttons button { font-size: 2rem; font-weight: bold; border: 2px solid #333; background: #fff; padding: 10px 20px; cursor: pointer; display: inline-flex; gap: 5px; overflow: hidden; }

section.gameDueScelte > .row.game { display: none; align-content: flex-end; background-color: var(--white); }
section.gameDueScelte .section-controls {  }
section.gameDueScelte .section-controls > .wrap { text-align: center; }
section.gameDueScelte .section-controls .buttons { display:flex; gap:16px; justify-content:center; font-size: 16px; line-height: normal; }
section.gameDueScelte .section-controls .buttons button { position: relative; display: inline-block; cursor: pointer; outline: none; border: 0; vertical-align: middle; font-size: 16px; line-height: 16px; color: #382b22; text-transform: uppercase; padding: 1.25em 2em; background: #fff0f0; border: 2px solid #b18597; border-radius: 16px; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transition: background 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-transform 150ms cubic-bezier(0, 0, 0.58, 1); transition: transform 150ms cubic-bezier(0, 0, 0.58, 1), background 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-transform 150ms cubic-bezier(0, 0, 0.58, 1); }
section.gameDueScelte .section-controls .buttons button::before { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: #f9c4d2; border-radius: inherit; -webkit-box-shadow: 0 0 0 2px #b18597; box-shadow: 0 0 0 2px #b18597; -webkit-transform: translate3d(0, 0.75em, -1em); transform: translate3d(0, 0.75em, -1em); transition: transform 150ms cubic-bezier(0, 0, 0.58, 1), box-shadow 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-transform 150ms cubic-bezier(0, 0, 0.58, 1), -webkit-box-shadow 150ms cubic-bezier(0, 0, 0.58, 1); }
section.gameDueScelte .section-controls .buttons button:hover { background: #ffe9e9; -webkit-transform: translate(0, 0.25em); transform: translate(0, 0.25em); }
section.gameDueScelte .section-controls .buttons button:hover::before { -webkit-box-shadow: 0 0 0 2px #b18597; box-shadow: 0 0 0 2px #b18597; -webkit-transform: translate3d(0, 0.5em, -1em); transform: translate3d(0, 0.5em, -1em); }
section.gameDueScelte .section-controls .buttons button:active { background: #ffe9e9; -webkit-transform: translate(0em, 0.75em); transform: translate(0em, 0.75em); }
section.gameDueScelte .section-controls .buttons button:active::before { -webkit-box-shadow: 0 0 0 2px #b18597, 0 0 #ffe3e2; box-shadow: 0 0 0 2px #b18597, 0 0 #ffe3e2; -webkit-transform: translate3d(0, 0, -1em); transform: translate3d(0, 0, -1em); }
section.gameDueScelte .section-controls .actions { margin: 32px 0 0 0; }
section.gameDueScelte .section-controls .actions .score { margin: 3px 8px 3px 0px; line-height: 24px; background: var(--white); display: inline-block; border-radius: 16px; min-width: 38px; padding: 4px 8px; text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; border: 1px solid var(--dark); text-align: left; }
section.gameDueScelte .section-controls .actions button { background: var(--white); }
section.gameDueScelte .section-controls .word { margin: 8px 0 0 0; font-size: 12px; line-height: 12px; opacity: .5; }

/*section.gameDueScelte .feedback { display: none; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; line-height: 24px; background: var(--yellow); text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; }
section.gameDueScelte .feedback span { color: var(--dark); }
section.gameDueScelte .feedback.true { background-color: #1A9562; }
section.gameDueScelte .feedback.false { background-color: #EE5A36; }*/

section.gameDueScelte .feedback { display: none; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; line-height: 24px; background: var(--yellow); text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; }
section.gameDueScelte .feedback span { color: var(--dark); }

section.gameDueScelte .feedback.true { background-color: #1A9562; z-index: 1; }
section.gameDueScelte .feedback.true .emoji .eyes {  }
section.gameDueScelte .feedback.true .emoji .eyes .eye {  }
section.gameDueScelte .feedback.true .emoji .mouth { width: 80px; height: 40px; border: 4px solid var(--dark); border-color: transparent transparent var(--dark) transparent; border-radius: 0 0 80px 80px; }

section.gameDueScelte .feedback.false { background-color: #EE5A36; z-index: 2; }
section.gameDueScelte .feedback.false .emoji {  }
section.gameDueScelte .feedback.false .emoji .eyes {  }
section.gameDueScelte .feedback.false .emoji .eyes .eye { background: linear-gradient(45deg, transparent 45%, var(--dark) 45%, var(--dark) 55%, transparent 55%), linear-gradient(-45deg, transparent 45%, var(--dark) 45%, var(--dark) 55%, transparent 55%); }
section.gameDueScelte .feedback.false .emoji .mouth { height: 48px; width: 40px; border: 4px solid var(--dark); border-radius: 50%; }














@media screen and (max-width: 1794px) { /* 1366 */

}
@media screen and (max-width: 1454px) { /* 1455 / col-4 */

}
@media screen and (max-width: 1114px) { /* 1115 / col-3 */

}
@media screen and (max-width: 774px) { /* 775 / col-2 */

    section.gameListenAndSpell > .row.newwords .section-actions { top: 16px; right: 8px; }
    #contentLAYOUT .emoji { top: 64px; right: 24px; }

}
@media screen and (max-width: 688px) { /* 689 */

}