body {
            height: 100vh;
        }

        * {
            font-size: clamp(14px, 3vw, 18px);
        }

        .row {
            width: 100% !important;
            max-width: 100% !important;
            margin: 0 !important;
        }

        .gray_color {
            color: gray;
        }

        .w-fit {
            width: fit-content;
        }

        .enust,
        .enalt {
            padding: 0 !important;
        }

        .question-container {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 100px 0px;
        }

        .container-fluid.sorualani {
            padding: 0px !important;
        }

        .drag-container .imgdiv {
            position: relative !important;
            padding: 0 !important;
            overflow: hidden;
        }

        .imgdiv img {
            box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
            width: 100%;
            user-select: none;
            -webkit-user-drag: none;
            -moz-user-drag: none;
            -o-user-drag: none;
            -ms-user-select: none;
            -moz-user-select: none;
            -webkit-user-select: none;
        }

        .drop_drag {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            padding: 20px 20px 10px 20px;
            min-height: 100px;
        }

        .drop .circle {
            width: 100%;
            height: 100%;
        }

        .circle {
            padding: 0 !important;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: #ffffffc9;
            cursor: pointer;
            border: solid 5px #dc9735;
            border-radius: 50%;
            text-align: center;
            font-size: 25px;
            color: #dc9735;
            font-weight: bold;
            transition: border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),
            color 250ms cubic-bezier(0.4, 0, 0.2, 1);
        }

        .circle:hover {
            color: rgba(156, 136, 255, 1);
            border-color: rgba(156, 136, 255, 1);
        }

        .drop {
            background: rgb(249 202 36 / 52%);
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 50%;
            user-select: none;
            position: absolute;
            transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1);
        }

        .quiz-completed {
            font-weight: bold;
            color: #006591;
            font-size: 50px;
        }