/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {
    section.steps .step-right{
        padding:50px 30px 50px 180px;
    }
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    section.steps .left-up {
        z-index: 2;
        position: relative;
        left: 0;
        margin-bottom: 20px;
    }

    section.steps .step-left {
        border-top-right-radius: 0;
    }

    section.steps .step-right {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    section#step-5 .step-right {
        border-top-left-radius:248.5px;
        border-bottom-left-radius:248.5px;
    }
}

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {
    section.steps .left-up {
        z-index: 2;
        position: relative;
        left: 0;
        margin-bottom: 20px;
    }

    section.steps .step-left {
        border-top-right-radius: 0;
    }

    section.steps .step-right {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

}

/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {
    header {
        padding: 50px;
        height:auto;
    } 
    section.steps{
        margin:0;
        padding: 0 20px;
    }
    section.steps .left-up {
        z-index: 2;
        position: relative;
        left: 0;
        padding-right:0;
        margin-top: 20px;
    }

    section.steps .step-right {
        padding: 30px;
        border-radius:0 0 20px 20px;
        display: block !important;
        text-align: center;
        margin-bottom:20px;
    }

    section.steps .step-left {
        border-radius: 20px 20px 0 0;
        text-align:center;
    }
}