/* ----------------------------
#  Responsive Media css
---------------------------------- */

@media (min-width: 992px){
    html,body{
        overflow: hidden;
    }
}

@media (max-width:1100px){
    .section-questionnaire {
        padding: 15vh 6vw 70px 7vw;
    }
    .site-header, .site-footer {
        padding-left: 4vw;
    }
    .site-header{
        padding-top: 8vh;
    }
    .site-header .logo img {
        max-width: 220px;
    }
    .section-questionnaire .actions{
        margin-top: 20px;
    }
    .main-right-content:after, .main-right-content:before{
        filter: none;
        box-shadow: 0px 0px 70px rgba(73, 143, 233, 0.50);
    }
}

@media (max-width: 991px){
    .main-content{
        flex-direction: column;
        height: auto;
        min-height: 100svh;
        padding-bottom: 70px;
        position: relative;
    }
    .radio-group.multiple{
        width: 100%;
    }
    .site-header,
    .site-footer,
    .main-right-content{
        width: 100%;
    }
    .main-right-content{
        height: auto;
    }
    .site-header {
        padding: 25px;
    }
    .site-footer{
        background-color: #498FE9;
    }
    .section-questionnaire {
        padding: 85px 25px 25px 25px;
    }
    .main-right-content:before{
        height: 100vh;
        left: 0;
        top: 90%;
        width: 100%;
    }
    .main-right-content:after{
        transform: skewX(0) skewY(-5deg);
    }
    .section-questionnaire,
    .question-step{
        max-width: 100%;
    }
    .question-step{
        max-width:500px;
    }
    .section-questionnaire .actions{
        margin-top: 40px;
    }
    .site-footer a{
        color: #fff;
        
    }
    .site-header, .site-footer{
        padding: 25px;
    }
}

@media (max-width: 767px){
    h1 { font-size: 26px; }
    h2 { font-size: 20px; }
    h3 { font-size: 20px; }
    h4 { font-size: 16px; }
    h5 { font-size: 14px; }
    h6 { font-size: 12px; }
    h1.title {
        font-size: 33px;
    }
    input,textarea{
        font-size: 12px;
    }
    textarea{
        padding: 12px;
    }
    .btn {
        min-width: 120px;
        padding: 10px 20px;
    }
    input.btn.btn-next{
        background-position: calc(100% - 40px) center;
    }
    .site-header .logo img {
        max-width: 137px;
    }
    .main-right-content:after {
        transform: skewX(0) skewY(-8deg);
    }
    .site-footer{
        padding-bottom: 35px;
    }
    .site-footer p{
        font-size: 10px;
    }
    .site-footer a{
        font-size: 12px;
    }
    .form-group {
        margin-bottom: 13px;
    }
    .question-step.question-step-1{
        padding-top: 0;
    }
    .user-input-block .rate-label {
        font-size: 14px;
        margin-bottom: 12px;
    }
    .user-input-block .bottom.rate-label {
        order: 3;
    }
    .progress-block{
        margin-bottom: 18px;
    }
    .section-questionnaire .user-input-block{
        margin-top: 32px;
    }
    .main-content{
        min-height: 100svh;
    }

    .question-step.thankyou-block,
    .question-step.error-block {
        padding-top: 0;
    }
    .question-step.error-block .block-logo{
        flex-wrap: wrap;
        justify-content: center;
    }
    .error-block .block-logo img {
        max-height: 63px;
    }
    .error-block .block-logo img + h2{
        padding-left: 0;
        margin-top: 23px;
    }
   
}


@media screen and (max-height: 700px) and (min-width: 767px){
    h1, h2, h3 {
        margin-bottom: 20px;
    }
    .site-header, .section-questionnaire {
        padding-bottom: 40px;
        padding-top: 50px;
    }
    .section-questionnaire {
        padding-top: 70px;
    }
    .section-questionnaire .user-input-block {
        margin-top: 40px;
    }
    .site-header .logo img {
        max-width: 250px;
    }
    .section-questionnaire .actions{
        margin-bottom: 30px;
        margin-top: 0;
    }
}

@media screen and (max-height: 640px) and (min-width: 767px){
    .site-header,
    .main-right-content{
        padding-top: 50px;
    }
    .site-header .logo img {
        max-width: 220px;
    }
    .main-right-content{
        padding-bottom: 40px;
    }
    .section-questionnaire .user-input-block {
        margin-top: 40px;
    }
}

@media screen and (max-height: 480px) and (max-width: 767px){
    .main-right-content:before{
        top: 70%;
    }
}