/* Signautre Section  */
@media screen and (max-width: 991px){
    .button {
        padding: 1.3rem 6rem;
        font-size: 1.6rem;
    }
}

@media screen and (max-width: 767px){
    .signature-box-wrapper {
        width: 95%;
        margin: 4rem auto 0;
    }

    .signature-box-wrapper .signature-box-heading {
        width: 35%;
    }

    .signature-box-wrapper .signature-box-content {
        width: 65%;
    }

    .signature-box-wrapper ul li {
        padding: 1rem;
        font-size: 1.4rem;
        min-height: 6rem;
        align-items: center;
        display: flex;
    }

    .button {
        margin-bottom: 1rem;
    }
}

@media screen and (max-width: 360px){
    .header .brand-wrapper {
        max-width: 10rem;
    }

    .header .logo-bg {
        bottom: -29px;
     }
}

/* Step 1 responsive */
@media screen and (max-width: 991px){
    .step-navigation {
        margin-bottom: 6rem;
    }

    .step-navigation ul li h6 {
        margin-top: 2rem;
        font-size: 1.4rem;
    }

    .step-navigation ul li {
        padding: 0 1rem;
    }

    .step-navigation ul li:after {
        width: 6rem;
        left: calc(100% - 2.5rem);
    }

    .step-heading-wrapper {
        padding-left: 5rem;
        margin-bottom: 3rem;
    }

    .step-heading-wrapper h3 {
        font-size: 2rem;
    }

    .step-heading-wrapper .heading-counter {
        padding: 0.5rem 1.2rem;
        border-radius: 0.5rem;
     }

     .steps-form-wrapper .field-row {
        margin-bottom: 1.5rem;
    }

    .steps-form-wrapper .checkbox-wrapper label {
        font-size: 1.6rem;
    }

    .popup-area.warning .popup-wrapper p {
        font-size: 1.4rem;
    }
}

@media screen and (max-width: 767px){
    .step-navigation ul li {
        display: flex;
        align-items: center;
        margin-bottom: 30px;
    }

    .step-navigation ul li .couter-box{
        margin:  0;
    }

    .step-navigation ul li h6 {
        margin: 0 0 0 20px;
    }

    .step-navigation ul li:after{
        display: none;
    }

    .popup-area.warning .popup-wrapper {
        padding-left: 2rem;
    }
}


/* Step 2 responsive*/
@media screen and (max-width: 991px){
    .document-wrapper {
        height: auto;
    }
}

@media screen and (max-width: 767px){
    .document-wrapper {
        width: 100%;
        height: auto;
    }

    .document-holder .placeholder h2 {
        font-size: 4rem;
    }

    .document-holder .placeholder span {
        font-size: 2rem;
        color: #a4b2d6;
        letter-spacing: 0.6rem;
    }
}

@media screen and (max-width: 540px){
    .document-holder >div {
        width: 100%;
    }
}

@media screen and (max-width: 460px){
    .document-wrapper {
        width: 100%;
    }
    .button {
        padding: 1.3rem 3rem;
    }
}


/* Step 4 responsive */
@media screen and (max-width: 991px){
    .scan-sign-wrapper .draw-sign {
        width: 100%;
        padding: 3rem;
        margin-right: 0;
    }

    .scan-bar {
        width: 100%;
        padding: 3rem;
        margin-top: 2rem;
    }

    .scan-sign-wrapper {
        padding: 3rem;
    }

    .exceeded-connection-time, .signed-successfully {
        padding: 4rem 6rem;
    }
}

@media screen and (max-width: 767px){
    .scan-bar{
        display: none;
    }

    /*.step4 .button {
        width: 49%;
    }*/

    .step4 .button.button-green {
        width: 99%;
    }

    .exceeded-connection-time img, 
    .signed-successfully img {
        max-width: 5rem;
    }

    .exceeded-connection-time, 
    .signed-successfully {
        padding: 4rem 2rem;
    }

    .exceeded-connection-time h3, .signed-successfully h3 {
        font-size: 2.4rem;
        margin: 3rem 0 1.5rem;
    }

    .exceeded-connection-time h6, .signed-successfully h6 {
        font-size: 1.4rem;
    }

    .signed-successfully .button-darkblue span {
        font-size: 2rem;
        padding: 1rem 2.5rem;
     }

    .signed-successfully a {
        font-size: 1.4rem;
    }

    .exceeded-connection-time .button {
        width: unset;
    }
}

@media screen and (max-width: 480px){
    .scan-sign-wrapper {
        padding: 2rem;
    }

    .scan-sign-wrapper .draw-sign .sign-area img {
        width: 100%;
    }

    .scan-sign-wrapper .draw-sign p {
        font-size: 1.4rem;
    }

    .scan-sign-wrapper .draw-sign {
        padding: 2rem;
    }
}