.game-container {

    &.riddle .riddle-wrap {
        $riddle-btn-max-width: 200px;
        $riddle-margin-act-btn: 5px;

        position: relative;
        padding: 10px;

        .riddle-choices {
            display: flex;
            flex-direction: column;
            align-items: center;

            label {
                max-width: ($riddle-btn-max-width * 2) + ($riddle-margin-act-btn * 2) + 290px;
                width: 100%;

                &.selected {
                    background-color: #fff;
                    color: #000;
                    font-weight: bold;
                }
            }
        }

        .riddle-footer {
            button {
                background-color: #FFF1F1 !important;
                color: #0E0E0E !important;
                width: 100%;
                max-width: $riddle-btn-max-width;


                &.btn-cta-prev {
                    margin-right: $riddle-margin-act-btn;
                }

                &.btn-cta-next {
                    margin-left: $riddle-margin-act-btn;
                }

                &.btn-cta-submit {
                    max-width: ($riddle-btn-max-width * 2) + ($riddle-margin-act-btn * 2);
                }

                &[disabled] {
                    cursor: not-allowed;
                }
            }
        }

        .riddle-placeholder{
            display: none;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            position: absolute;
            left: 50%;
            right: 0;
            top: 50%;
            bottom: 0;
            transform: translate(-50%, -50%);
            color: rgba(0,0,0,0.50);
            height: 100%;
            width: 100%;
        }
        &.inactive {
            .riddle-question,
            .riddle-choices,
            .riddle-footer,
            div:not(.riddle-placeholder){
                filter: blur(8px);
                -webkit-filter: blur(8px);
            }
            .riddle-placeholder{
                display: flex;
            }

            /* Add the blur effect */
            &:after {
                display: block;
                content: "";
                position: absolute;
                left: 0;
                right: 0;
                top: 0;
                bottom: 0;
                background-color: transparent;
                opacity: .8;
                cursor: not-allowed;
                border-radius: 10px;
            }
        }
    }
}
