html, body {
    overflow-x: hidden;
}
.titleMenuMobile {
    display: none;
}
#ns-app .field input[type=submit]{
    display: none;
}
#ns-app #organizationSelection{
    width: 290px;
}

#ns-app .menu_switch{
    display: none;
}
.portaal_mobile_help{
    display: none;
}
.display_mobile_phone{
    display: none;
}
.display_desktop{
    display: block;
}
.arrow-right:after {
    content:'\2794';
    font-size: 14px;
}

.arrow-bottom:after{
    content: '\25bc';
    font-size: 14px;
}

#ns-app form.form-switch div.menu_switch label {
    padding-top: initial;
}
/* #### Tablets Portrait or Landscape #### ======================================================================================= */
@media (min-device-width: 670px) and (max-device-width: 1024px){
    .content .l-10-12{
        width: auto;
    }
    #ns-app.error-page{
        max-width: 100%;
        margin: 0;
    }
    #ns-app .col-4a{
        float: none;
        width: auto;
    }
    #ns-app .portaal_help_panel{
        display: none;
    }
    #ns-app .portaal_mobile_help{
        display: block;
        padding-top: 8px;
    }
   #ns-app .portaal-content a.back{
        float: none;
    }
    #ns-app .portaal-content .header .option{
        float: none;
        display: contents;
    }
    #navPanel ul.clicknshow{
        width: 300px;
        margin: 1px 0px 0px 8px;
    }
    .header{
        max-width: 100%;
    }
    #mainContent > div.content {
        min-width: auto;
        max-width: 100%;
    }
    /* .portaal-content{
        margin-top: 96px;
    } */
    .portaal-content .multi.box .header{
        max-width: 100%;
    }
    #ns-app .col-2a {
        width: 100%;
        float: none;
    }
    #searchPanel .multi.box .header{
        max-width: 100%;
    }
    /* #ns-app .box .actions{
        padding: 14px 0 0 0;
    } */
    .footer, #ns-app{
        max-width: 100%;
    }
    .nslogo--footer {
        margin-top: -22px;
    }
    #loading-message .message{
        max-width: 60%;
    }
    #ns-app .portaal-content .form-application{
        margin-left: 4px;
    }
    #ns-app>.col-3b.portaal-content{
        float: none;
        width: 100%;
        margin-top: 150px;
    }
    #ns-app div.col-3b {
        float: none;
    }
    #ns-app .form-switch div.field {
        position: relative;
        top: 0;
        left: -10px;
        width: 300px;
    }
    #ns-app .portaal-content div.field{
        position: relative;
        top: 0;
        left: 0;
    }
    #ns-app div.field label {
        margin-left: 2px;
    }
    div#ns-app p.credentials {
        width: 100%;
        margin-left: -42px;
        padding: 4px;
    }

    #ns-app>.col-3b div.title.box {
        margin-top: 38px;
    }
    #navPanel ul.clicknshow{
        width: 300px;
        margin: 1px 0px 0px 8px;
    }
    .print-hide {
        position: absolute;
        background-color: white;
        z-index: 10;
    }
    body div.container--article {
        width: initial;
        min-width: initial;
    }
    #ns-app #navPanel form.form-switch {
        height: initial;
        margin: 10px;
        padding: 10px;
    }

    #ns-app .menu_switch {
        height: 25px;
        border: 2px solid #fc3;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        margin: 0 10px;
        display: block;
        background-color: rgb(255, 204, 51);
        width: 294px;
    }
    #ns-app .menu_switch p{
        display: inline-block;
        margin: 3px 3px 3px 13px;
    }
    #ns-app .menu_switch .menu-button{
        margin: 3px 6px 3px 6px;
        max-width: 33.3px;
        float: right;
        cursor: pointer;
        color: #006;
        background-color: rgb(255, 204, 51);
    }
    #ns-app #navPanel form.form-switch label {
        font-weight: bold;
        width: 35px;
    }
    #ns-app form.form-switch > div.switch > select#organizationSelection, 
    #ns-app form.form-switch div.menu_switch .ie-select {
        width: 190px
    }
    div.headerLink {
        padding-left: initial;
    }
    #ns-app ul.tabs.tabs-print {
        padding-top: 25px;
    }
    #ns-app fieldset .col-3a {
        width:initial;
    }

    #navPanel hr {
        display: none;
    }
    #ns-app #navPanel div.box {
        margin-right: 2px;
        margin-left: 2px;
    }
    .titleMenuMobile {
        text-align: right;
        width: 260px;
        display: inline-block;
        font-weight: bolder;
        font-size: 14px;
        cursor: pointer;
    }
    .credentials span {
        max-width: 270px;
        display: inline-flex;
    }
    body div.content {
        overflow-x: hidden;
    }
    #ns-app .card p.actions a.more {
        z-index: initial;
    }

    #ns-app .card a.more {
        z-index: initial;
    }
    .mobile_pointer {
        cursor: pointer;
    }
    div.details {
        background-color: white;
    }
    #ns-app div.container-bcb{
        left: 0;
    }
    #ns-app #navPanel ul.clicknshow {
        display: none;
        background-color: white;
    }
    #ns-app ul.clicknshow.condensed li {
        margin-bottom: 3px;
    }
    #ns-app .col-5a {
        width: 100%;
    }
    .company_name{
        margin-left: 14px;
    }
}

/* #### Mobile Phones Portrait ######################################################################################################### */ 
@media (max-width: 669px){
    .company_name{
        margin-left: 14px;
    }
    .display_mobile_phone{
        display: block;
    }
    .display_desktop{
        display: none;
    }
    #ns-app.error-page{
        max-width: 100%;
        margin: 0;
    }
    .content .container .grid{
        margin: 0;
    }
    .content .l-10-12{
        width: auto;
    }
    .grid__unit{
        padding: 0;
    }
    #ns-app #dialog-ajax, #ns-app #dialog-help, #dialog-calendar{
        left: 8% !important;
        top: 25% !important;
        position: fixed;
    }

    #ns-app .dialog .arrow{
        display: none !important;
        visibility: hidden !important;
    }
    #showClaimHistory{
        word-break: break-word;
    }
    #ns-app .door-to-door-edit fieldset{
        margin-bottom: 10px;
    }
    #ns-app .door-to-door-edit .radio-list-container fieldset img{
        margin-right: 10px;
        margin-top: -16px;
    }
    #ns-app div.radiogroup .option{
        min-width: auto;
    }
    #ns-app .col-4a{
        float: none;
        width: auto;
    }
    #ns-app .field-3a{
        width: 100%;
    }
    #ns-app .portaal_help_panel{
        display: none;
    }
    #ns-app .portaal_mobile_help{
        display: block;
        padding-top: 8px;
    }
    #ns-app .portaal-content .form-application{
        margin-left: 4px;
    }
   #ns-app .portaal-content a.back{
        float: none;
    }
    #ns-app #navPanel ul.clicknshow {
        display: none;
        background-color: white;
    }
    #navPanel ul.clicknshow{
        width: 300px;
        margin: 1px 0px 0px 8px;
    }
    #ns-app ul.clicknshow.condensed li {
        margin-bottom: 3px;
    }
    #ns-app #navPanel form.form-switch {
        height: initial;
        margin: 10px;
        padding: 10px;
    }
    #ns-app .portaal-content .header .option{
        float: none;
        display: contents;
    }
    #ns-app .portaal-content fieldset .field.readonly span{
        max-width: 70%;
        display: inline-block;
    }
    #ns-app .portaal-content fieldset .field.readonly label{
        width: 100%;
        display: inline-block;
    }
    #ns-app .menu_switch {
        display: block;
    }

    #ns-app #navPanel form.form-switch label {
        font-weight: bold;
        width: 35px;
    }
    #ns-app div.col-3b {
        float: none;
    }
    #ns-app .form-switch div.field {
        position: relative;
        top: 0;
        left: -10px;
        width: 300px;
    }
    #ns-app .portaal-content div.field{
        position: relative;
        top: 0;
        left: 0;
    }
    #ns-app div.field label {
        margin-left: 2px;
    }
    div#ns-app p.credentials {
        padding: 4px;
    }
    #ns-app .field-5b, #ns-app .field-5c{
        width: 100%;
    }
    #ns-app a.button{
        margin-top: 6px;
    }
    #ns-app a.button.bestellen-btn span{
        text-align: right;
        width: 193px;
    }
    #ns-app>.col-3b div.title.box {
        margin-top: 38px;
    }
    #navPanel ul.clicknshow{
        width: 300px;
        margin: 1px 0px 0px 8px;
    }
    #orderForAllSelectedCardHoldersMobileSpan, #editForAllSelectedCardHoldersMobileSpan{
        text-align: right;
        width: 200px !important;
    }
    #ns-app .box .card p.actions{
        clear: both;
    }
    #ns-app #dialog-cancel, #ns-app #dialog-cancel textarea{
        width: 100%;
    }
    #ns-app .m-monitor .box .submit+.reset+.button{
        margin-left: 0;
    }
    #ns-app table.door-to-door-edit tbody tr img{
        display: none;
    }
    #ns-app .portaal-content .box .details .field .more-info{
        word-break: break-word;
        margin-left: 0;
    }
    #ns-app .product-details .product-price{
        position: relative;
        margin-bottom: 30px;
        /* top: -80px; */
    }
    #ns-app .product-list .product-details ul.change{
        position: relative;
        top: 0 !important;
    }
    .print-hide {
        position: absolute;
        background-color: white;
        z-index: 10;
    }
    body div.container--article {
        width: initial;
        min-width: initial;
        margin: 0;
    }
    #ns-app form.form-switch > div.switch > select#organizationSelection, 

    div.headerLink {
        padding-left: initial;
    }
    #ns-app ul.tabs.tabs-print {
        padding-top: 25px;
    }
    #ns-app fieldset .col-3a {
        width:initial;
        margin-bottom: 6px;
    }

    #navPanel hr {
        display: none;
    }
    #ns-app #navPanel div.box {
        margin-right: 2px;
        margin-left: 2px;
    }
    .titleMenuMobile {
        text-align: right;
        width: 260px;
        display: inline-block;
        font-weight: bolder;
        font-size: 14px;
        cursor: pointer;
    }
    .credentials span {
        max-width: 270px;
        display: inline-flex;
    }
    body div.content {
        overflow-x: hidden;
    }
    #ns-app .card p.actions a.more {
        z-index: initial;
    }

    #ns-app .card a.more {
        z-index: initial;
    }
    .mobile_pointer {
        cursor: pointer;
    }
    div.details {
        background-color: white;
    }
    #ns-app form .box .details .product-details{
        display: initial;
    }
    #ns-app form .box .details .product-details .important{
        margin: 0;
        float: right;
    }
    #ns-app a.pasfoto-continue-btn{
        margin-top: -16px;
        margin-right: 10px;
    }
    #ns-app .product-list.pl-large .product-details{
        width: 100%;
    }
    #ns-app .product-list.pl-large .product-details table{
        width: auto;
    }
    #mainContent > div.content {
        min-width: auto;
        max-width: 100%;
    }
    /* .portaal-content{
        margin-top: 96px;
    } */
    .portaal-content .multi.box .header{
        max-width: 100%;
    }
    #ns-app .col-2a {
        width: 100%;
        float: none;
    }
    #searchPanel .multi.box .header{
        max-width: 100%;
    }
    #ns-app .box .actions{
        padding: 14px 0 0 0;
    }
    .footer, #ns-app{
        max-width: 100%;
    }
    .nslogo--footer {
        margin-top: -22px;
    }
    #loading-message .message{
        max-width: 60%;
    }

    .header{
        max-width: 100%;
    }
    #dialog-calendar{
        left: 25px;
    }
    #ns-app a.help{
        display: none;
        visibility: hidden;
    }
    #ns-app table.worklist {
        display: inline-block;
        overflow-y:scroll;
        /* background-color: white;  */
    }
    #ns-app table.downloads {
        display: block;
        overflow-y:scroll;
    }
    #ns-app .m-monitor .details div.field label{
        width: 100%;
        display: inline-block;
    }
    #ns-app .m-monitor .km-overview{
        margin: 0 0 0 20px;
    }
    #ns-app #charts-form select{
        margin-top: 10px;
    }

    #ns-app .portaal-content .chart-box{
        overflow-y: scroll !important;
    }
    #ns-app .portaal-content .chart-box .chartgroup{
        width: max-content;
    }
    #ns-app table.facturen, #ns-app table.history, #ns-app table.products{
        display: inline-block;
        overflow-y: scroll;
    }
    #ns-app table.facturen::before, #ns-app table.history::before, #ns-app table.products::before, 
    #ns-app table.worklist::before, #ns-app .portaal-content .chart-box::before{
        content: '\2190 \00a0 scroll  \2192';
        display: inline-block;
        margin-left: 40%;
        font-family: "Lucida Sans Unicode", "Arial Unicode MS";
        font-size: 14px;
    }
    #ns-app table.facturen tbody{
        background-color: white;
    }
    #ns-app #datepickerLink{
        display: none;
        visibility: hidden;
    }
    #ns-app>.col-3b div.multi {
        background-color: #ffcc33;
    }
    #ns-app .col-5b .solid a h4, #ns-app .col-5b .solid p span{
        word-break: break-word;
    }
    #ns-app .door-to-door a.special, #ns-app .door-to-door div.special{
        width: 100%;
    }
    #ns-app div.container-bcb{
        left: 0;
    }
    #ns-app>.col-3b div.multi h3 span.option{
        float: none;
    }
    #ns-app div.field .button.float-right{
        float: none;
    }
    #ns-app>.col-3b .box .details form .section .field{
        left: 0;
    }
    #ns-app>.col-3b .box .details form .section{
        border: none;
    }
    #ns-app>.col-3b .box .details form .section .field-4a{
        width: auto;
    }
    #ns-app>.col-3b .box .details form .section .field-2a{
        width: auto;
    }
    #ns-app>.col-3b .box .details form .section .field-2a a img {
        display: none;
    }
    #ns-app>.col-3b form .section .product-list-new .product-details-new{
        width: 90%;
    }
    #ns-app>.col-3b .box .steps-bar{
        /* margin-left: -9px;
        width: max-content; */
        margin-bottom: 40px;
    }
    #ns-app .title.voordeel .steps-bar{
        width: auto;
    }
    #ns-app .portaal-content div.field a img{
        display: none;
    }
    #ns-app .details div.field span.fake{
        width: auto;
    }
    #ns-app>.col-3b form .box .details .drawer .product-list .product-details {
        padding: 4px;
    }
    #ns-app>.col-3b form .box .details .product-list .product-details{
        padding: 4px;
    }
    #ns-app>.col-3b form .box .details .product-list .product-details h2{
        margin-left: 4px;
    }
    #ns-app>.col-3b form .box .details .product-list .product-details img{
        display: none;
    }
    #ns-app>.col-3b form .box .details .product-list .product-details table{
        width: auto;
        margin-left: 4px; 
    }
    #ns-app>.col-3b form .box .details .drawer .product-list .product-details table{
        margin-right: 0;
        width: auto;
    }
    #ns-app>.col-3b form .box .details .drawer .product-list .product-details table th{
        width: auto;
    }
    #ns-app>.col-3b .box .details .products {
        overflow-x: auto;
    }
    #ns-app>.col-3b .box .details .box-section .pages .back, 
    #ns-app>.col-3b .box .details .box-section .pages .forward{
        top: 26px;
    }
    #ns-app .pages a.forward, #ns-app .pages .back{
        top: 26px;
    }
    #ns-app fieldset.inlogGegevensSection label{
        display: inline-block;
        width: 100%;
    }
    #ns-app fieldset.inlogGegevensSection span{
        /* max-width: 68%; */
        word-break: break-word;
    }
    #ns-app>.col-3b .box .details .field label{
        width: 100%;
        float: none !important;
        /* display: inline-block; */
    }
    #ns-app>.col-3b .box .details .field input{
        margin-top: 6px;
    }
    #ns-app>.col-3b .box .details .activationDiv label{
        display: inline-block;
        width: 100%;
    }
    #ns-app>.col-3b .box .details .activationDiv span{
       max-width: 68%;
       word-break: break-word;
    }
    #ns-app>.col-3b .col-2a .left-col form  .field label, 
    #ns-app>.col-3b .col-2a .right-col form  .field label{
        width: auto;
    }
    #ns-app>.col-3b form .box .details .vertical .field label{
        width: auto;
    }
    #ns-app>.col-3b .box .details .col-5b .solid ul li a{
        background: none;
        padding: 4px 0;
    }
    #ns-app>.col-3b .box .application form .col-2a .field a img{
        display: none;
    }
    #ns-app .door-to-door-edit .button-labels {
        font-size: 10px;
    }
    #ns-app .door-to-door-edit.full-width .button-labels{
        padding-left: 63%;
    }
    #ns-app .door-to-door-edit .item-label{
        width: 50%;
    }
    #ns-app .push-table-410{
        width: 180px !important;
    }
    #ns-app>.col-3b.portaal-content{
        float:none;
        width: 100%;
        margin-top: 150px;
    }
    #ns-app .col-2a {
        width: 100%;
        float: none;
    }
    #ns-app .col-5a {
        width: 100%;
    }
    #ns-app h2 span.secundair{
        display: inline-block;
    }
    #ns-app .portaal-content .light .special{
        float: none;
        width: auto;
    }
    #ns-app table.details td.klassewissel{
        padding-right: 10px;
    }
    #ns-app .field-2a{
        width: auto;
    }
    #ns-app .field-2a span{
        word-break: break-word;
    }
}

#ns-app .menu_switch {
    height: 25px;
    border: 2px solid #fc3;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin: 0 10px;
    background-color: rgb(255, 204, 51);
    width: 294px;
}
#ns-app .menu_switch p{
    display: inline-block;
    margin: 3px 3px 3px 13px;
}
#ns-app .menu_switch .menu-button{
    margin: 3px 6px 3px 6px;
    max-width: 33.3px;
    float: right;
    cursor: pointer;
    color: #006;
    background-color: rgb(255, 204, 51);
}
#ns-app form.form-switch div.menu_switch .ie-select {
    width: 190px
}

.mobile .portaal-content{
    float:none;
    width: 100%;
    margin-top: 150px;
}
.mobile #ns-app .print-hide {
    position: absolute;
}