#lightboxUnscramble {
    display: none;
}

    #lightboxUnscramble .message-wrapper {
        display: none;
        height: 49vmin;
        justify-content: flex-start;
    }

    #lightboxUnscramble .naveen-wrapper {
        display: none;
    }

    .unscramble-wrapper {
        position: relative;
    }

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

            .unscramble-draggable {
                 height: 11vmin;
                background-size: contain;
                background-repeat: no-repeat;
                margin: 1vmin 2vmin;
                width: 11vmin;
                cursor: pointer;
                position: relative;
                z-index: 10;
            }

                .unscramble-draggable:first-of-type {
                    margin-left: 0;
                }

                .unscramble-draggable:last-of-type {
                    margin-right: 0;
                }

                #unscrambleFirst {
                    background-image: url("../img/letter_o.png");
                }

                #unscrambleSecond {
                    background-image: url("../img/letter_z.png");
                }

                #unscrambleThird {
                    background-image: url("../img/letter_o.png");
                }


        .unscramble-row-droppable {
            display: flex;
            align-items: center;
            justify-content: space-around;
            margin-top: 5vmin;
        }

            .unscramble-droppable {
                border-radius: 1vmin;
                width: 11vmin;
                height: 11vmin;
                background-color: #fff;
                margin: 0 2vmin;
            }

                .unscramble-droppable.ui-state-hover {
                    animation-name: pulse;
                    animation-duration: 1s;
                    animation-fill-mode: both;
                    animation-iteration-count: infinite;
                    background-color: #fff;
                    opacity: .9;
                    z-index: 1;
                }

                .unscramble-droppable:first-of-type {
                    margin-left: 0;
                }

                .unscramble-droppable:last-of-type {
                    margin-right: 0;
                }

                #unscrambleBox1 {

                }

                #unscrambleBox2 {

                }

                #unscrambleBox3 {

                }


@media(max-height: 800px ) and (orientation: landscape) {
    #lightboxUnscramble .message-wrapper {
        margin-bottom: 0;
        min-height: 62vmin;
    }

    #lightboxUnscramble .message-wrapper h1 {
        margin-top: 0;
    }

    .unscramble-wrapper {
        width: 85vmin;
    }

    .unscramble-droppable {
        width: 15vmin;
        height: 15vmin;
    }

    .unscramble-draggable {
        width: 15vmin;
        height: 15vmin;
    }
}

@media(max-width: 600px) and (orientation: portrait) {
    #lightboxUnscramble .message-wrapper {
        height: 71vmin;
    }

    #lightboxUnscramble .message-wrapper h1 {
        margin-top: 0;
    }

    .unscramble-wrapper {
        width: 85vmin;
    }

    .unscramble-droppable {
        width: 15vmin;
        height: 15vmin;
    }

    .unscramble-draggable {
        width: 15vmin;
        height: 15vmin;
    }
}
