@media screen and (min-width: 320px) and (max-width: 479px) {
    div.viewport {
        width: 100%;
    }

    div.wrapper {
        padding: 0 15px;
    }

    div.content-table {
        width: 100%;
    }

    .white-wrapper .search-box {
        width: 100%;
        flex-wrap: wrap;
    }

    .white-wrapper .search-box .search-box-input {
        width: 100%;
    }
        .white-wrapper .search-box button, .white-wrapper .search-box input[type="button"] {
            width: 100%;
            margin-top: 15px;
        }

    .tiles-4-col .tiles-item {
        width: 96%;
    }

    .white-wrapper .charges-list li a, .white-wrapper .charges-list li  {
        width: 100%;
    }

    ul.wizard-menu li {
         width: 100%;
        margin-top: 15px;
    }

    li.step-1 {
        padding: 0;
    }

    div.content h1 {
        margin: 25px 0 20px 0;
    }

    div.wizard {
        height: auto;    
    }

    ul.wizard-menu li {
        float: none !important;
    }

    form div.forms-block ul.forms-content li {
        width: 100%!important;
    }

    div.content div.fine, div.wrapper ul.form-select__block {
        width: 100%;
    }

    div.wrapper ul.form-select__block {
        width: 100%;
    }

    div.content-table table {
        width: 100%;
    }

    td.header-user-search .search-block {
        background: #fff;
        z-index: 5000;
    }
 
}

/*mobile*/
@media screen and (min-width: 480px) and (max-width: 767px) {

    td.header-user-search .search-block {
        background: #fff;
        z-index: 5000;
    }
    div.viewport {
        width: 100%;

    }

    .search-block {
        background: #fff;
        z-index: 5000;
    }

    div.wrapper {
        width: 100%;
        padding: 0 15px;
    }

    form div.forms-block ul.forms-content {
        width: 95%;
    }
    li.step-2 > span, li.step-4 > span, li.step-3 > span {
        float: none !important;
        text-align: left;
    }

    .content .white-wrapper .content-block ul.tiles-list li {
        width: 45%;
        margin: 7.5px 7.5px;
    }

    ul.wizard-menu  {
        display: flex;
        justify-content: space-between;
        margin-top: 80px;
        width: 100%;
    }

    ul.wizard-menu li {
        float: none!important;
        display: block!important;
        width: 100%!important;
        text-align: center !important;
    }

    div.blank-container {
        position: initial !important;
    }

    form div.forms-block ul.forms-content li {
        width: 100%!important;
    }

    div.wizard {
        height: auto;
    }

    div.wizard-circle {
        float: none !important;
    }

    ul.wizard-menu li img {
        display: none !important;
    }

    li.step-1 > span {
        width: auto;
        float: none;
    }

    div.content h1 {
        margin: 48px 0 20px 0;
    }

    div.content div.fine {
        width: 95%;
    }

    div.wrapper ul.form-select__block {
        width: 100%;
    }

    div.content-table {
        width: 100%;
    }

    ul.wizard-menu li {
        display: flex!important;
    }

   
}


/*Tablet*/

@media screen and (min-width: 768px) and (max-width: 991px) {

    td.header-user-search .search-block {
        background: #fff;
        z-index: 5000;
    }

    div.viewport {
        width: 100%;
        padding: 0 15px;
        margin: 0 auto;
    }
    .white-wrapper .search-box .search-box-input {
        width: 66%;
    }

    .white-wrapper .search-box {
        width: 95%;
    }

        .white-wrapper .search-box button, .white-wrapper .search-box input[type="button"] {
            width: 32%;
        }

    div.wrapper ul.form-select__block {
        width: 100%;
    }

    div.content div.fine {
        width: 100%;
    }

    .tiles-4-col .tiles-item {
        width: 46%;
    }

    .white-wrapper .charges-list li {
        width: 31%;
    }

    .charges-list li a {
        height: 110px;
    }

    div.content div.fine {
        width: 95%;
    }

}

/* monitors and laptops */
@media screen (min-width: 992px) and (max-width: 1200px) {
}