@media only screen and (min-width: 992px) {
    /*  welcome page  */
    .welcome-page-content {
        width: 50%;
    }

    .welcome-page-buttons {
        margin-top: 5%;
    }

    .welcome-page-button {
        width: auto;
    }


    /*  guided mode  */
    .guided-flow {
        margin-top: 5%;
        padding-left: 5vw;
        padding-right: 5vw;
        max-width: 900px;
    }

    .guided-mode-warning {
        font-size: medium;
    }

    .guided-flow-summary {
        width: 60%;
    }

    .guided-flow .header-localityname {
        font-size: inherit;
    }

    .guided-flow .header-residency {
        font-size: inherit;
        padding-left: 1%;
    }

    .guided-flow .flow-entry .form-check > label {
        font-size: inherit;
    }

    .guided-flow .flow-entry .question-label {
        font-size: inherit;
    }

    .check-my-progress-button {
        margin-left: 4%;
    }

    .guided-flow-summary > h6 {
        font-size: inherit;
    }
    
    .guided-flow-summary > table tr td, .guided-flow-summary > table th {
        font-size: inherit;
    }

    .guided-flow-summary-progress {
        justify-content: inherit;
    }


    /*  choose mode  */
    .choose-mode {
        width: 70%;
    }

    .choose-mode-table {
        margin-top: 5%;
    }

    .choose-mode-table > table td, .choose-mode-table > table th {
        font-size: inherit;
    }

    .choose-mode-table-footer {
        font-size: inherit;
    }


    /*  breadcrumbs  */
    .breadcrumbs {
        width: 20%;
        padding-top: 20px;
        margin-left: 2%;
        margin-right: 5%;
    }

    .breadcrumb {
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }

    #breadcrumb-dropdown {
        display: none;
    }

    /*  wizard  */
    .wizard {
        display: flex;
    }

    .wizard-content {
        width: 55%;
        margin-left: 1%;
    }

    .wizard-pa-address-selection {
        width: 55%;
    }

    .question-label {
        margin-bottom: 8px;
        font-size: inherit;
    }

    .notes {
        font-size: inherit;
    }

    .notes caption {
        caption-side: top;
    }


    /*  jurat page  */
    .jurat {
        width: 70%;
        margin-left: 10%;
        margin-top: 2%;
        font-size: inherit;
    }

    .jurat-content-section {
        width: 70%;
    }

    .jurat-buttons-content {
        text-align: inherit;
    }

    /*  finish/form submitted page  */
    .form-submitted-page-content {
        width: 65%;
    }

    .finish-page-content {
        margin-top: 10%;
        width: 60%;
    }

    .postback-xml {
        font: normal 14px verdana;
        line-height: 30px;
    }


    /*  helper pages  */
    .helper-welcome-page-content {
        width: 50%;
    }

    .helper-welcome-header {
        width: 50%;
        margin-top: 10%;
    }

    .helper-wizard-header {
        width: 50%;
        margin-top: 5%;
    }

    .helper-copy-address-message {
        font-size: inherit;
    }

    /*  adress/lock-in-letter warning  */
    .warning-content {
        width: 65%;
    }


    /* blank forms */
    .blank-forms-page {
        width: 75%;
    }

    .blank-forms-company-logo {
        margin-left: auto;
        margin-right: auto;
        max-width: 500px;
        max-height: 500px;
    }

    .blank-forms-table-responsive {
        font-size: 1rem;
    }

    .blank-forms-table-responsive td, .blank-forms-table-responsive th {
        padding: 1rem;
    }


    /* loading wheels */
    .tiny-loader-container {
        margin-left: inherit;
        margin-right: inherit;
        text-align: inherit;
    }

    .loader {
        width: 240px;
        height: 240px;
        margin-top: 15%;
    }

    .loader div {
        width: 192px;
        height: 192px;
        margin: 24px;
        border: 24px solid #3e93f7;
        border-color: #3e93f7 transparent transparent transparent;
    }
    
    #dropdown-mobile {
        display: none;
    }

    /* for mobile language select dropdown */
    .mobile-select-view {
        display: none;
    }
    
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    /*  welcome page  */
    .welcome-page-content {
        width: 70%;
    }

    .welcome-page-buttons {
        margin-top: 5%;
    }

    .welcome-page-button {
        margin-left: 0%;
    }


    /*  guided mode  */
    .guided-flow {
        margin-top: 5%;
        padding-left: 7vw;
        padding-right: 7vw;
        max-width: 800px;
    }

    .guided-mode-warning {
        font-size: small;
    }

    .guided-flow .header-localityname {
        font-size: inherit;
    }

    .guided-flow .header-residency {
        font-size: inherit;
        padding-left: 1%;
    }

    .guided-flow .flow-entry .form-check > label {
        font-size: small;
    }

    .guided-flow .flow-entry .question-label {
        font-size: small;
    }

    .guided-flow-summary {
        width: 70%;
    }

    .check-my-progress-button {
        margin-left: 2%;
    }

    /*  choose mode  */
    .choose-mode {
        width: 80%;
    }

    .choose-mode-table {
        margin-top: 5%;
    }

    .choose-mode-table > table td, .choose-mode-table > table th {
        font-size: small;
    }

    .question-label {
        margin-bottom: 8px;
    }

    /*  jurat page  */
    .jurat {
        width: 80%;
    }


    /*  finish/form submitted page  */
    .form-submitted-page-content {
        width: 60%;
    }

    .finish-page-content {
        width: 70%;
    }

    .postback-xml {
        font: normal 14px verdana;
        line-height: 30px;
    }


    /*  helper pages  */
    .helper-welcome-page-content {
        width: 60%;
    }

    .helper-welcome-header {
        width: 65%;
        margin-top: 10%;
    }

    .helper-wizard-header {
        width: 65%;
        margin-top: 5%;
    }

    .helper-copy-address-message {
        font-size: inherit;
    }

    /*  adress/lock-in-letter warning  */
    .warning-content {
        width: 65%;
    }


    /* blank forms */
    .blank-forms-page {
        width: 85%;
    }

    .blank-forms-table-responsive {
        font-size: 1rem;
    }

    .blank-forms-table-responsive td, .blank-forms-table-responsive th {
        padding: 1rem;
    }
    
    
    /* loading wheels */
    .loader {
        width: 160px;
        height: 160px;
        margin-top: 15%;
    }

    .loader div {
        width: 128px;
        height: 128px;
        margin: 16px;
        border: 16px solid #3e93f7;
        border-color: #3e93f7 transparent transparent transparent;
    }
}

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

    .welcome-page-buttons {
        margin-top: 22%;
    }

    .welcome-page-button {
        margin-bottom: 12px;
        margin-left: 0%;
    }


    /*  guided mode  */
    .guided-flow {
        margin-top: 10%;
        max-width: 600px;
    }

    .guided-flow .flow-entry {
        width: 50vw;
    }

    .guided-flow .flow-entry .form-check > label {
        font-size: small;
    }

    .check-my-progress-button {
        margin-left: 0%;
    }

    .guided-flow-summary-progress {
        padding-top: 0px;
    }

    /*  choose mode  */
    .choose-mode {
        width: 85%;
    }

    .choose-mode-table {
        margin-top: 7%;
    }

    /*  wizard  */
    .wizard-content {
        width: 80%;
    }

    .wizard-pa-address-selection {
        width: 80%;
    }

    .question-label {
        margin-bottom: 8px;
    }


    /*  finish/form submitted page  */
    .form-submitted-page-content {
        width: 70%;
    }

    .finish-page-content {
        padding: 10px;
        margin-top: 20%;
        width: 75%;
    }

    .postback-xml {
        font: normal 14px verdana;
        line-height: 30px;
    }


    /*  helper pages  */
    .helper-work-address-table td,
    .helper-work-address-table th,
    .helper-data-review-content td,
    .helper-data-review-content th {
        font-size: small;
    }

    .helper-copy-address-message {
        font-size: small;
    }


    /* blank forms */
    .blank-forms-page {
        width: 90%;
    }


    /* loading wheels */
    .loader {
        width: 80px;
        height: 80px;
        margin-top: 30%;
    }

    .loader div {
        width: 64px;
        height: 64px;
        margin: 8px;
        border: 8px solid #3e93f7;
        border-color: #3e93f7 transparent transparent transparent;
    }
}

@media only screen and (max-width: 992px) {
    html {
        height: 100%;    
    }

    #root {
        height: 100%;
    }

    /* Helper Pages */
    #helper-main {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .needs-validation {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .helper-add-work-address-button {
        text-align: center !important;
        margin-bottom: 5px;
    }

    /* Guided Mode */
    #guided-flow-main {
        height: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .choose-mode {
        width: 98%
    }

    .guided-flow {
        height: 100%;
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-direction: column;
    }

    .guided-flow-summary {
        width: 98%;
    }

    #guided-mode-opt-in-count {
        margin-left: 10vw;
        margin-right: 10vw;
        margin-bottom: 2rem;
    }

    .list-unstyled {
        flex-grow: 1;
    }

    .welcome-page-buttons {
        margin-top: 0px;
    }

    /* Choose Mode */
    #wizard-main {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    #wizard {
        display: flex;
        flex-direction: column;
        flex-grow: 1;
    }

    .wizard {
        display: flex;
        flex-direction: column;
        flex-grow: 1;
    }

    /* Breadcrumbs */
    #dropdown-desktop {
        display: none;
    }
    .breadcrumb-dropdown {
        font-size: 1rem;
    }
    /* Select Menu for Language dropdown */
    .desktop-select-view {
        display: none;
    }

    .message-button-icon {
        right: 130px;
    }

    #move-popover {
        inset: 50px 10vw auto auto !important;
        transform: none !important;
    }

    /* Guided Mode Back/Next Button  */
    .guided-flow {
        padding-left: 0;
        padding-right: 0;
    }
    
    .guided-mode-warning {
        padding-left: 10vw;
        padding-right: 10vw;
    }

    .guided-mode-title {
        padding-left: 10vw;
        padding-right: 10vw;
    }

    .list-unstyled {
        padding-left: 10vw;
        padding-right: 10vw;
    }

    /* Next & Back buttons */
    .button-group-centered {
        margin-bottom: 0;
        margin-left: 0;
        text-align: unset !important;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10;
        background-color: #fff;
    }

    .next-button-left-margin {
        margin-left: 0;
    }

    #nextButton {
        min-width: 65%;
        height: 65px;
        border-radius: 0;
    }

    #backButton {
        min-width: 35%;
        height: 65px;
        border-radius: 0;
    }

    #nextFlowContinueButton {
        min-width: 60%;
        height: 65px;
        border-radius: 0;
    }
}