@media screen and (max-width:1450px) {
    .header_container {
        background:var(--primeColor);
    }
    
    .hdr_title > .label > .title {
        color:white;
    }
    
    .header_container > div {
        background-size:auto 100%;
    }
}

@media screen and (max-width:1100px) {
    .header_container > div {
        background:none;
    }
}

@media screen and (max-width:850px) {
    .hdr_title > .label > .title {
        font-size:30px;
    }
    
    .hdr_title > .label > .subtitle {
        font-size:20px;
    }
}

@media screen and (max-width:670px) {
    .hdr_title > .label > .title {
        font-size:20px;
    }
    
    .hdr_title > .label > .subtitle {
        font-size:16px;
    }
    
    .content {
        width:100%;
    }
    
    .content > div {
        padding:0px;
        padding-top:20px;
    }
    
    .test_area > div {
        padding:0px;
    }
    
    .question {
        border-radius:0px;
    }
    
    .result {
        padding:5px;
    }
    
    .info_box {
        width:100%;
    }
}

@media screen and (max-width:650px) {
    .question input[type="text"] {
        width:70%;
    }
    
    .question .q_slider {
        width:100%;
    }
}