.elementor-857 .elementor-element.elementor-element-032514a:not(.elementor-motion-effects-element-type-background), .elementor-857 .elementor-element.elementor-element-032514a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://karmaglobal.com.tr/wp-content/uploads/2023/01/businesswoman-working-on-a-report-or-questionnaire.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-857 .elementor-element.elementor-element-032514a > .elementor-background-overlay{background-color:var( --e-global-color-primary );opacity:0.7;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-857 .elementor-element.elementor-element-032514a{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0em;margin-bottom:0em;padding:9em 0em 6em 0em;overflow:visible;}.elementor-857 .elementor-element.elementor-element-56d698a{text-align:center;}.elementor-857 .elementor-element.elementor-element-56d698a .elementor-heading-title{color:var( --e-global-color-7cf82fa );}:root{--page-title-display:none;}@media(min-width:1025px){.elementor-857 .elementor-element.elementor-element-032514a:not(.elementor-motion-effects-element-type-background), .elementor-857 .elementor-element.elementor-element-032514a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:scroll;}}@media(max-width:1024px){.elementor-857 .elementor-element.elementor-element-032514a:not(.elementor-motion-effects-element-type-background), .elementor-857 .elementor-element.elementor-element-032514a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-size:cover;}.elementor-857 .elementor-element.elementor-element-032514a{padding:10em 0em 6em 0em;}.elementor-857 .elementor-element.elementor-element-56d698a > .elementor-widget-container{margin:0em 0em -1em 0em;}}@media(max-width:767px){.elementor-857 .elementor-element.elementor-element-032514a{padding:10em 0em 4em 0em;}}/* Start custom CSS for html, class: .elementor-element-18880af */body {
        background-color: #434343 !important;
        box-shadow: 0 0 600px #343434 inset !important;
        width: 100vw;
        height: 100vh;

        align-items: center;
        justify-content: center;
        font-family: 'Be Vietnam Pro', sans-serif !important;
    }

    button {
        outline: none;
    }

    .h1_title {
        font-weight: 700 !important;text-shadow: 1px 2px 0 rgb(0 0 0 / .2);
    }

    .ctr {
        background-color: #fff;
        width: 100%;
        height: 100%;
        overflow: auto;
        height: 450px;
        max-width: 1200px;
        border-radius: 20px;
        box-shadow: 0 5px 10px #343434;
    }

    .question_ctr {
        transition: 500ms all ease-in-out;
    }

    .result_ctr {
        background-color: #fff;
        width: 100%;
        height: 100%;
        overflow: auto;
        max-height: 800px !important;
        max-width: 1200px;
        border-radius: 20px;
        box-shadow: 0 5px 10px #343434;
    }

    .start_ctr {
        padding: 30px 0;
        max-height: none;
        height: initial;
        width: 100%;
        transition: 500ms all ease-in-out;
    }

    .start_btn {
        background-color: #535353;
        border-radius: 3px;
        border: none;
        color: #fff;
        padding: 10px 30px;
        transition: 200ms all ease-in-out;
    }

    .start_btn:hover {
        background-color: #333;
    }

    .ctr_left {
        flex-basis: 35%;
    }

    .ctr_right {
        flex-basis: 65%;
    }

    .question_count_item {
        width: 11px;
        height: 4px;
        border-radius: 10px;
        background-color: #dadada;
    }

    .question_done {
        background-color: #757575;
    }

    .question_at {
        background-color: #999;
    }

    .option_item {
        position: relative;
        overflow: hidden;
        transition: 200ms all ease-in-out;
        margin: 10px 0;
        padding: 5px 15px;
        border-radius: 3px;
        border: 2px solid #dfdfdf;
    }

    .option_text {
        font-size: 14px;
        color: #434343;
    }

    .option_selectable {
        cursor: pointer;
    }

    .option_selectable:hover {
        border: 2px solid #aaa;
    }

    .previous_question_btn {
        width: 100%;
        padding: 10px 0;
        border: none;
        background-color: #535353;
        color: #fff;
        border-radius: 5px;
        font-weight: bold;
        font-size: 14px;
        transition: 200ms all ease-in-out;
    }

    .previous_question_btn:hover {
        width: 100%;
        background-color: #333;
    }

    .next_question_btn {
        width: 100%;
        padding: 10px 0;
        border: none;
        background-color: #535353;
        color: #fff;
        border-radius: 5px;
        font-weight: bold;
        font-size: 14px;
        transition: 200ms all ease-in-out;
    }

    .next_question_btn:hover {
        width: 100%;
        background-color: #333;
    }

    .option_selected {
        background-color: #dfdfdf;
    }

    .option_selected .option_check {
        right: 5px;
    }

    .left_animation {
        opacity: 0;
        animation: left_anim 500ms;
        animation-fill-mode: forwards;
    }

    .left_animation:nth-child(1)
    {
        animation-delay: 100ms
    }
    .left_animation:nth-child(2)
    {
        animation-delay: 200ms
    }
    .left_animation:nth-child(3)
    {
        animation-delay: 300ms
    }
    .left_animation:nth-child(4)
    {
        animation-delay: 400ms
    }
    .left_animation:nth-child(5)
    {
        animation-delay: 500ms
    }
    .left_animation:nth-child(6)
    {
        animation-delay: 600ms
    }
    .left_animation:nth-child(7)
    {
        animation-delay: 700ms
    }
    .left_animation:nth-child(8)
    {
        animation-delay: 800ms
    }
    .left_animation:nth-child(9)
    {
        animation-delay: 900ms
    }
    .left_animation:nth-child(10)
    {
        animation-delay: 1000ms
    }
    .left_animation:nth-child(11)
    {
        animation-delay: 1100ms
    }

    @keyframes left_anim {
        from {
            opacity:  0;
            transform: translateX(30px);
        }
        to {
            opacity:  1;
            transform: translateX(0px);
        }
    }

    .option_check {
        position: absolute;
        right: -20px;
        bottom: 50%;
        transform: translateY(50%);
        transition: 200ms all ease-in-out;
    }

    .start_sink {
        transform: translateY(30px);
        opacity: 0;
    }

    @keyframes sink_anim {
        from {
            opacity: 1;
            transform: translateY(0px);
        }
        to {
            opacity: 0;
            transform: translateY(30px);
        }
    }

    @keyframes rise_anim {
        from {
            opacity: 0;
            transform: translateY(30px);
        }
        to {
            opacity: 1;
            transform: translateY(0px);
        }
    }

    .rise_anim {
        animation: rise_anim 500ms;
        animation-fill-mode: forwards;
    }

    .sink_anim {
        animation: sink_anim 500ms;
        animation-fill-mode: forwards;
    }

    @media screen and (max-width: 768px) {
        .question_ctr {
            height: auto !important;
            overflow-y: auto;
        }
    }

    @media screen and (max-height: 500px) {
        .question_ctr {
            height: 100% !important;
        }
    }

    /* Extra */

    .topics-ctr h3 {
        text-align: center;
    }/* End custom CSS */