@media screen and (min-width: 1451px) and (max-width: 1919px) {


}



@media screen and (min-width: 1180px) and (max-width: 1450px) {


}


@media screen and (min-width: 1000px) and (max-width: 1179px) {

}

@media screen and (min-width: 100px) and (max-width: 999px) {
    .keygfx-inner {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-around;
    }
    .keygfx-container:after {
        background-size:cover;
    }
    .keygfx-container img:nth-child(3) {
        max-width:360px;
    }
    .keygfx-container img:nth-child(1), .keygfx-container img:nth-child(2) {
        max-width:120px;
    }


    .page-wrapper {
        mix-blend-mode: unset;
        padding-top: 350px;
        overflow:hidden;
    }

    .steps-container {
        max-width:280px;
        transform: skew(-3deg); 
    }

    .details {
        transform:unset;
    }

    .step {
        transform: skew(5deg);
        padding:10px;
        margin-left:8px;
        display: flex;
        flex-direction: column;
    }

    .step b {
        font-size:22px;
    }

    .step:before {
        transform: skew(-5deg);
    }
    .steps-container:after {
        padding:0px;
    }
    .steps-container:before {
        padding:0px;
    }
    .green_box {
        max-width:300px;
    }

    .task_timer div:nth-child(2) {
        margin-left:0px;
        margin-top:5px;
    }

    .active_task {
        flex-direction: column;
        z-index:300;
        width:90%;
        margin-top:80px;
    }

    .scores_title div {
        font-size:15px;
        padding-left:10px;
        padding-right:10px;
        flex-basis:20%;
    }
    
    .scores img {
        width:80%;
    }

    .scores div:first-child {
        text-align:center;
    }

    .scores_title {
        width:90%;
    }

    .scores_lines {
        width:90%;
    }

    .task {
        padding-bottom:0px;
    }

    .task_timer {
        padding:0px;
        margin:0px auto;
        width:300px;
        margin-bottom: -10px;
        z-index: 10000;        
    }

    .task_timer:before {
        transform: skew(-5deg);
    }

    .task_arrow {
        top:50px;
        right:-20px;
        left:unset;
        transform: rotate(45deg);
        z-index:100000;
    }

    .task_arrow img {
        max-width:120px;
    }

    .your_placement {
        width:350px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .faq_list {
        width:96%;
    }

    .scores_title {
        justify-content: space-around;
        gap:0px;
    }

    .task_title {
        width:90%;
        padding: 18px;
        font-size: 24px;
    }

    

    .scores_title, .scores_participant {
        font-size:15px;
    }

    
    img {
        max-width:340px;
        width:100%;
    }

}