/* Algemeen ---------------------------------------------------------------------------------------- */
html {font-size: 17px; color: #171717;}

body {font-family: 'helveticaNeueLT_light', Arial, Sans-Serif; font-size: 1rem; font-weight: 300;font-size: 1rem; font-style: normal; line-height: 1.42857143rem; margin-top: 2.52941176rem;}

body {overflow: hidden; overflow-y: hidden;}
body.display-xs,
body.display-sm {overflow-y: scroll;}

.system-unpublished {
    display: none !important;
}

h1, h1 a {margin-bottom: 2.8rem; text-decoration: none;}
h2, h2 a {margin-bottom: 2.8rem; text-decoration: none;}
h3, h3 a {margin-bottom: 1.4rem;}
p {margin-bottom: 1.4rem; color: #171717;}
a {font-family:inherit; font-size: inherit; font-weight: inherit; text-decoration: underline; color: #171717; }
bold, strong {font-weight: 600; font-style: normal;}

form {display: block; float: left; width: 100%; height: auto; margin-bottom: 0;}
.inner {float: left;}

.edge {border: 0px solid #ccc; border-radius: .58823529rem; overflow: hidden;}
.edge-transparent {border: 1px solid transparent; background-color: transparent; border-radius: .58823529rem; }
.edge-background, .background-grey {border: 1px solid transparent; background-color: #E7E5E6; border-radius: .58823529rem; }

.alert.alert-notice {background-color: #eee; }

.page-header {padding: 0 15px;}
.page-header h1 {font-family: 'HelveticaNeue_medium', Arial, Sans-Serif;font-style: normal; font-size: 1rem; margin-left: 21px !important; margin-bottom: .5rem;}

.display-xs #sp-main-body {min-height: 425px;}
.display-sm #sp-main-body {min-height: 100px;}
.display-md #sp-main-body {min-height: 600px;}

.hidden {display: none !important;}

.cancelled, .cancelled p {text-decoration: line-through;}

/* Algemeen (2) ------------------------------------------------------------------------------------ &*/
.container {max-width: 100%;}
.row {width: 1170px;}
.row.sp-header {width: 100%; width: 1170px;}
#sp-menu {width: 100%;}
.logo-plus-menu {
    float: left;
    margin-bottom: 23px;
    padding: 0;
    clear: both;
    width: 1170px;
}

#sp-logo,
#sp-menu {float: left;}
#sp-submenu {
    float: left;
    margin-bottom: 23px;
    padding: 0;
    position: relative;
    clear: both;
    width: 1170px;
}

.tekstkleur_grijs {color:#858585;}

/* BS4 buttons ------------------------------------------- */
.btn {font-size: 0.94117647rem; font-weight: 400; line-height: 1.4; /*padding: .25rem .5rem */; border-radius: 0.58823529rem; }
.btn-primary, .sppb-btn-primary , #filter .btn-primary , .btn-primary.filter-button {font-family: 'helveticaNeueLT_light'; font-weight: 300; font-size: .88235294rem ; border-color: #252525; background-color: #252525; text-decoration: none; padding: 7px 10px 8px 7px; line-height: .9411764705882353em; border-radius: 6px;}
.btn.focus, .btn:focus,
.btn-primary.focus, .btn-primary:focus,
.btn-primary:hover,
.sppb-btn-primary:hover,
.btn-primary:active,
.sppb-btn-primary:active,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:focus,
.sppb-btn-primary:focus,
.btn-primary:active:focus,
.sppb-btn-primary:active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus,
.show > .btn-primary.dropdown-toggle {border-color: #252525; background-color: #252525; box-shadow: none; opacity: 0.5;}

.btn-primary:focus,
.sppb-btn-primary:focus,
.btn-primary:active,
.sppb-btn-primary:active {box-shadow: none;}


#filter .btn-primary, .btn-primary.filter-button {
    font-family: 'helveticaNeueLT_light' !important;
    font-weight: 300 !important;
    font-size: .88235294rem !important;
    color: #fff !important;
    border-color: #252525 !important;
    background-color: #252525 !important;
    text-decoration: none !important;
    padding: 7px 10px 8px 7px !important;
    line-height: .9411764705882353em !important;
    border-radius: 6px !important;
}

.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .show > .btn-secondary.dropdown-toggle:focus {
    box-shadow: none;
}

.actions .btn.focus,
.actions .btn:focus,
.actions .btn-primary.focus,
.actions .btn-primary:focus,
.actions .btn-primary:hover,
.actions .sppb-btn-primary:hover,
.actions .btn-primary:active,
.actions .sppb-btn-primary:active,
.actions .btn-primary:not(:disabled):not(.disabled).active,
.actions .btn-primary:not(:disabled):not(.disabled):active,
.actions .btn-primary:focus,
.actions .sppb-btn-primary:focus,
.actions .btn-primary:active:focus,
.actions .sppb-btn-primary:active:focus,
.actions .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus,
.actions .show > .btn-primary.dropdown-toggle {border-color: transparent; background-color: transparent; box-shadow: none; opacity: 0.5;}

.buttons .btn {display: inline-block;}

.btn.back-button {float: left !important; }
.btn.ok-button {float: right !important; margin-left: 15px;}
.btn.content_mobile {float: right; margin-left: 15px;}

.mod-article-single button#toggle {background-color: #7B7979;}
.mod-article-single button#toggle:hover, .mod-article-single button#toggle:active {opacity: 0.5}

/* BS4 input fields -------------------------------------- */
.input-group > .custom-select:not(:first-child), .input-group > .form-control:not(:first-child) {border-top-left-radius: .25rem; border-bottom-left-radius: .25rem;}

input:focus,
input[type="text"]:not(.form-control):focus,
input[type="email"]:not(.form-control):focus,
input[type="url"]:not(.form-control):focus,
input[type="date"]:not(.form-control):focus,
input[type="password"]:not(.form-control):focus,
input[type="search"]:not(.form-control):focus,
input[type="tel"]:not(.form-control):focus,
input[type="number"]:not(.form-control):focus,
select:not(.form-control):focus,
.form-control:focus {
    border-color: #80bdff;
    box-shadow: none;
}

input:-internal-autofill-selected {
    background-color: transparent !important;
    background-image: none !important;
    color: -internal-light-dark-color(#000, #fff) !important;
}


/* Select fields ------------------------------------------ */

.form-check-inline input[type="radio"] {
    display: inline-block;
  }

label input,
#registerModal input {
    accent-color: #555;
}


/* Boxed layout */
.layout-boxed .body-innerwrapper {
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
    max-width: 1170px;
    margin: 0 auto;
}

/* Breadcrumbs */
.breadcrumb {
    padding: 0;
    margin-bottom:0;
    background-color: transparent;
    border-radius: 0;
}

.separator {padding: 0 0.5rem;}

/* Datepocker ----------- */


.datepicker table tr td.day.focused, .datepicker table tr td.day:hover {
    background: #eee;
    cursor: pointer;
}

/*top row*/
.datepicker tfoot tr th:hover, .datepicker thead tr:first-child th:hover {
    background: #eee;
}
.datepicker tfoot tr th, .datepicker thead tr:first-child th {
    cursor: pointer;
}
.datepicker.dropdown-menu td, .datepicker.dropdown-menu th {
    padding: 4px 5px;
}
.datepicker table tr td, .datepicker table tr th {
    text-align: center;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    border: none;
}

.datepicker table tr td span {
    display: block;
    width: 23%;
    height: 54px;
    line-height: 54px;
    float: left;
    margin: 1%;
    cursor: pointer;
    border-radius: 4px;
}


.datepicker table tr td span.focused.focused, .datepicker table tr td span.focused.disabled.focused, .datepicker table tr td span.focused.disabled:active, .datepicker table tr td span.focused.disabled:focus, .datepicker table tr td span.focused.disabled:hover, .datepicker table tr td span.focused.disabled:hover.focused, .datepicker table tr td span.focused.disabled:hover:active, .datepicker table tr td span.focused.disabled:hover:focus, .datepicker table tr td span.focused.disabled:hover:hover, .datepicker table tr td span.focused:active, .datepicker table tr td span.focused:focus, .datepicker table tr td span.focused:hover, .datepicker table tr td span.focused:hover.focused, .datepicker table tr td span.focused:hover:active, .datepicker table tr td span.focused:hover:focus, .datepicker table tr td span.focused:hover:hover, .open .dropdown-toggle.datepicker table tr td span.focused, .open .dropdown-toggle.datepicker table tr td span.focused.disabled, .open .dropdown-toggle.datepicker table tr td span.focused.disabled:hover, .open .dropdown-toggle.datepicker table tr td span.focused:hover {
    color: #fff;
    background-color: #3276b1;
    border-color: #285e8e;
}

.datepicker.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    float: left;
    display: none;
    min-width: 160px;
    list-style: none;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 5px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    /*-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);*/
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    -webkit-background-clip: padding-box;
    /*-moz-background-clip: padding;*/
    background-clip: padding-box;
    color: #333;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px;
    line-height: 1.428571429;
}

.table-condensed {
    width: 100%;
}

.datepicker .datepicker-days .active {
    background-color: #000;
    color: #fff;
}
.datepicker.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    float: left;
    display: none;
    min-width: 200px;
    list-style: none;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 5px;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    /*-moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);*/
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -webkit-background-clip: padding-box;
    /*-moz-background-clip: padding;*/
    background-clip: padding-box;
    color: #333;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 13px;
    line-height: 1.428571429;
}
.datepicker {
    padding: 6px 12px;
}

input.datepicker:invalid {
    background: #fff ;
    border: 1px solid #ced4da;
    color: rgba(0,0,0,.85) ;
    box-shadow: none ;
}

/* SP Cookies styling ------------------------------------------------------------------------------ */

#sp-cookie-consent.position-bottom {
    left: 0;
    width: 100%;
    display: block;
    height: 100%;
    z-index: 10000002;
    background-color: rgba(23,23,23,0.5);
}

#sp-cookie-consent.position-bottom > div {
    width: auto;
    max-width: 585px;
    margin: 1.9rem auto;
    z-index: 10000003;
    background: #e7e5e6;
    margin: 2rem auto;
    display: block;
    position: relative;

    border-radius: 15px;
    padding: 20px;
    border: 1px solid rgba(0,0,0,.2);
    box-shadow: 0 5px 15px rgba(0,0,0,.5);

}

#sp-cookie-consent.position-bottom > div > .sp-cookie-consent-content,
#sp-cookie-consent.position-bottom > div > .sp-cookie-consent-action {
    -ms-flex: 0 0 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
}

#sp-cookie-consent.position-bottom > div > .sp-cookie-consent-content {
    margin-bottom: 1em !important;
}

/* Template posities ------------------------------------------------------------------------------- */

.display-xs section,
.display-sm section {
    display: inline-block;
}

/* sp-header - Balk met logo en menu*/
#sp-header {height: auto; margin-top: 0; padding-bottom: 0px; box-shadow: none;}

.display-xs .row.sp-header,
.display-sm .row.sp-header {display: block; float: left; height: auto; margin-left: 0; width: 100%;}
.display-xs #offcanvas-toggler.offcanvas-toggler-right,
.display-sm #offcanvas-toggler.offcanvas-toggler-right {
    float: left !important;
    margin-left: 21px !important;
}


/* sp-logo ----------*/
#sp-logo .sp-column {display: block; margin: 0 auto;}

.view-login #sp-logo {margin: 0 auto;}

/* Sp-logo */
#sp-logo img {max-height: 65px; height: 65px;}


/* sp-menu ----------*/
#sp-menu {padding-left: 0;}
#sp-menu.col-9 {flex: 0 0 76.5%; max-width: 76.5%;}

.view-welcomes #sp-menu.col-sm-3 {width: 25%;}


/* Hide on home page */
.view-login #sp-menu #offcanvas-toggler {display: none !important;}

/* sp-second-menu */
#sp-second-menu {min-height: 1.7rem; height: 1.7rem; margin: 0; padding-top: 14px;}

/* sp-above-content -------------------------------------------------------------------------------- */
#sp-above-content {
    border: 1px solid #000;
    background-color: #fff;
    border-radius: 0.58823529rem;
    margin: 0 auto; padding: 21px;
}

#sp-above-main-body .container {padding-bottom: 18px;}

#sp-ident-breadcrumb ,
#sp-ident-breadcrumb a, #sp-ident-breadcrumb a:hover {font-family: 'HelveticaNeue_medium',Arial,sans-serif;font-size: 0.70588rem;color: #000; text-transform: uppercase; text-decoration: none;}
#sp-ident-breadcrumb a:hover {opacity: 0.5}
#sp-ident-breadcrumb .separator {opacity: 0.5;}
#sp-ident-breadcrumb .breadcrumb-item.active {color: #000;}

/* sp-main-body */
#sp-main-body {position: relative; float: left; clear: both; width: 100%; max-width: 1170px; margin: 0; padding: 0;}
#sp-main-body .container {padding: 0; width: 1170px; max-width: 1170px;}

#sp-main-body .row {
    margin: 0;
}

/* sp-component ------------------------------------------------------------------------------------ */
#sp-component {margin-bottom: 0;}
#sp-component .sp-column {float: left; width: 100%;}

#sp-component.col-lg-12 {padding-left: 0; padding-right: 0;}

/* sp-footer --------------------------------------------------------------------------------------- */

#sp-footer {background-color: #fff;}
#sp-footer {/* background-color: transparent;*/ color: #333; border-top: 1px solid #000; margin-top: 10px; margin-bottom: 30px; padding-bottom: 10px; text-align: center;}
#sp-footer .container-inner {padding: 15px 0 22px 0; border-top: none;}

#sp-footer .separator {font-size: 2rem; padding: 0 0.5rem;}
#sp-footer .footercontent {display: inline-block; margin: 0 auto;}
#sp-footer .footertext, #sp-footer .footertext p, #sp-footer .footertext a, #sp-footer .footertext a:hover, #sp-footer .separator { color: #171717; text-decoration: none;line-height: 1.42857143rem; vertical-align: middle;}
#sp-footer .footertext a:hover {opacity: 0.5}


.display-xs #sp-footer,
.display-sm #sp-footer  {
    background-color: transparent;
    margin-bottom: 0;
    padding-bottom: 0;
}

.display-xs #sp-footer .organisation_name,
.display-sm #sp-footer .organisation_name,
.display-xs #sp-footer .organisation_address,
.display-sm #sp-footer .organisation_address,
.display-xs #sp-footer .organisation_contacts,
.display-sm #sp-footer .organisation_contacts {display: block; width: 100%; clear: both;}
.display-xs #sp-footer .organisation_name,
.display-sm #sp-footer .organisation_name {font-weight: 600;}
.display-xs #sp-footer .organisation_site,
.display-sm #sp-footer .organisation_site {display: none;}

/* Bootstrap additions ----------------------------------------------------------------------------- */
.col-12 {float: left;}
.hidden {display: none;}
/* .content .h-100 {height: auto !important;}*/




/* Forms in modals --------------------------------------------------------------------------------- */

.modal.show .modal-content .form-check-inline input[type="radio"] {
    display: inline-block;
}

.modal.show .modal-content .ui.form .field label {min-width: 206px;}


/* Login page -------------------------------------------------------------------------------------- */

body.login .login .col-md-4 .login-options {
    display: block;
    width: 100%;
    float: left;
    margin-top: 2rem;
}

/* Menu's ------------------------------------------------------------------------------------------ */
.sp-megamenu-parent {width: 100%; margin: 0;}
.sp-megamenu-parent .sp-menu-item {min-height: 63px;}
.sp-megamenu-parent .sp-menu-item a {border-radius: 10px; font-size: 1.0rem; text-transform: uppercase;}


.sp-megamenu-parent .sp-menu-item .menutitle {
    font-family: Helvetica,'helveticaNeueLT_light';
    font-size: 22.5px;
    font-weight: 400;
    line-height: 24.75px;
    text-transform: uppercase;
    /* color: #fff; */
    margin: 0;
    margin-bottom: 2px;
    position: relative;
    display: block;
    width: 100%;
    clear: both;
}

.sp-megamenu-parent .sp-menu-item .subtitle {
    font-family: Helvetica,'helveticaNeueLT_light';
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 1px;
    text-transform: uppercase;
    /* color: #fff; */
    margin: 0;
    position: relative;
    display: block;
    width: 100%;
    clear: both;
}

.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {line-height: 1.324rem;}

.sp-megamenu-parent .sp-menu-item {padding-left: 12px; padding-right: 0;}
.sp-megamenu-parent .sp-menu-item a {width: 100%;text-decoration: none;}
.sp-megamenu-parent .sp-menu-item a:hover {text-decoration: none;}

.sp-megamenu-parent .sp-menu-item a {background-color: #1a171b; color: #fff;}
.sp-megamenu-parent .sp-menu-item a:hover, .sp-megamenu-parent > li.active:hover > a {background-color: #edebec; color: #000;}
.sp-megamenu-parent .sp-menu-item.active a {background-color: #7B7979; color: #fff;}
.login .sp-megamenu-parent .sp-menu-item a {background-color: #868586;}

#sp-submenu {min-height: 1.165rem;}
#sp-submenu ul.menu {padding-left: 0; text-align: right; list-style: none; margin-bottom: 0;}
#sp-submenu ul.menu li.active a {color: #1a171b;}
#sp-submenu ul.menu li {display: inline-block; width: 204px; line-height: 1rem; /*padding: 0 2.55rem; border-left: 1px solid #000;*/}
#sp-submenu ul.menu li::after {content: '|'; font-size: 17px; font-weight: 400; color: #000; padding: 0 52px;}
/*#sp-submenu ul.menu li:last-child::after {content: none; padding: 0 0 0 2.65rem;}*/
#sp-submenu ul.menu li:first-child {border-left: 0;}
#sp-submenu ul.menu li:last-child {padding-right: 0;}

#sp-submenu ul.menu li a {font-family: 'HelveticaNeue_medium'; font-size: 1.059rem; color: #999; text-decoration: none; text-transform: uppercase;}
#sp-submenu ul.menu li a {
    font-family: Helvetica,'helveticaNeueLT_light';
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    color: #858585;
    text-decoration: none;
}
#sp-submenu ul.menu li a:hover {opacity: 0.5;}

#offcanvas-toggler, #offcanvas-toggler a {color: #000;}
#offcanvas-toggler a:hover {color: #000; opacity: 0.5;}



/* Content ----------------------------------------------------------------------------------------- */
.content .inner {padding: 21px; width: 100%;}
.home .content,
.chauffeur .content {padding: 0;}
.welcome-image .inner img {width: 100%;}
.content {overflow-y: auto;}

/* Content tables ---------------------------------------------------------------------------------- */
.content_table {width: 100%; border: 0; table-layout: fixed; white-space: nowrap;}
.content_table , .content_table td, .content_table p, .content_table a {font-size: 0.88235294rem;}
.content_table
.content_table thead tr {padding-bottom: 50px;margin-bottom: 20px;}
.content_table thead th {padding-bottom: 0.6125rem; padding-right: 0.5rem; vertical-align: top; border-bottom: 1px solid #000;}
.content_table thead th:last-child {text-align: right;}
.content_table tbody tr:first-child td {padding-top: .9125rem;}
.content_table td {width: auto; padding-right: 0.5rem; vertical-align: top; line-height: 1.25rem; /* height: 1.25rem */; overflow: hidden;}
.content_table td p, .content_table td a {margin-bottom: 0; vertical-align: middle; text-align: left;}
.content_table td.empty {padding-right: 0;}
.content_table .actions .btn {padding-top: 0;}
.content_table .force_fit_width {width: .75rem;}
.content_table .force_fit_width.date {width: 5.25rem !important;}
.content_table .force_fit_width.time {width: 3.0rem !important;}
.content_table .force_fit_width.rit-id {width: 7.0rem !important;}
.content_table .force_fit_width.name {width: auto;}
.content_table .force_fit_width.address {width: auto;}
.content_table .force_fit_width.empty {width: inherit;}
.content_table .driver_actions.force_fit_width {width: 13rem;}

.content_table .btn, .content_table .btn-primary {font-family: 'HelveticaNeue_medium', Arial, Sans-Serif; background-color: transparent; border: transparent; float: right; color: #7B7979; }
.content_table td a {font-family: 'HelveticaNeue_medium'; font-size: 1rem; color: #7B7979; padding-right: 0;}
.content_table td a:hover, .content_table td a:active {color: rgb(123, 121, 121);}

.content_table .actions {display: block; width: auto;float: right; }
.content_table .actions .btn-primary {padding: 3px 0px 3px 7px; }

.table_footer .actions .btn {font-family: 'HelveticaNeue_medium'; font-size: 0.88235294rem; color: #7B7979; text-decoration: none;}


.content_table th .planned, .content_table th .reality {display: block; width: 100%; clear: both;}
.content_table tr .planned, .content_table tr .reality {width: 100%; clear: both;}

.actions .btn-primary:not(:disabled):not(.disabled).active, .actions .btn-primary:not(:disabled):not(.disabled):active,
.table_footer .btn:not(:disabled):not(.disabled).active, .table_footer .btn:not(:disabled):not(.disabled):active,
.table_footer .btn:not(:disabled):not(.disabled):focus {
    background-color: transparent;
    border-color: transparent;
}

.content_table .btn {font-size: 0.88235294rem;}
.table_footer .btn:hover {opacity: 0.5}

.display-xs .content_table .edge-background,
.display-xs .content_table .background-grey {
    border: none;
    background-color: transparent;
    border-radius: 0;
}
.display-xs .content_table {border-collapse:collapse;}
.display-xs .content_table thead th {border-bottom: 0}
.display-xs .content_table tr {background: transparent; width: 100%;}

.display-xs .content_table tr td:first-child,
.display-xs .content_table tr th:first-child {padding-left: 15px;}
.display-xs .content_table tr th:last-child {text-align: left;}

.display-xs .content_table tr:first-child td {padding-top: 6px; }
.display-xs .content_table tr td {background-clip: padding-box; border: 2px solid rgba(231,229,230,1.0); border-radius: .23529412rem; padding-top: 6px; padding-bottom: 6px; margin-bottom: 10px; background-color: rgba(231,229,230,0.5); width: auto; }
.display-xs .content_table tr td:first-child {border-right: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; padding-left: 15px; }
.display-xs .content_table tr td:last-child {border-left: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: .23529412rem; border-top-right-radius: .23529412rem;}

/* Mobile datatables -------------------------------------------------------------------------------- */

.mobile-view.buttons,
.mobile-view.contenttable,
.mobile-view.contenttable .heading,
.mobile-view.contenttable .contents {width: 100%; float: left;}

.mobile-view.contenttable,
.mobile-view.contenttable .heading,
.mobile-view.contenttable .contents {
    font-family: 'helveticaNeueLT_light', Arial, Sans-Serif;
    font-size: 0.88235294rem;
    font-weight: 300;
    font-style: normal;
    line-height: 1.42857143rem;
}

.mobile-view.contenttable .heading {
    font-weight: 600;
}

.mobile-view.buttons {margin-bottom: .5rem;}

.mobile-view.contenttable .heading div:first-child {padding-left: 15px;}
.mobile-view.contenttable .heading div:nth-child(2),
.mobile-view.contenttable .heading div:nth-child(3) {padding-left: 7px;}
.mobile-view.contenttable .contents div:first-child {padding-left: 8px;}

.mobile-view.contenttable .heading div,
.mobile-view.contenttable .contents div {float: left;}

.mobile-view.contenttable .contents a {
    display: block;
    background-color: rgba(237,235,236,1.0);
    border: 1px solid rgba(33,37,41,0.25);
    color: rgba(33,37,41,1.0);
    padding: 6px;
    border-radius: .23529412rem;
    margin-bottom: 6px;
    text-decoration: none;
    float: left;
    width: 100%;
}

.mobile-view.contenttable .contents a:active,
.mobile-view.contenttable .contents a:focus,
.mobile-view.contenttable .contents a:hover {
    background-color: rgba(237,235,236,0.5);
    border: 1px solid rgba(33,37,41,0.125);
}

.mobile-view.contenttable .contents div {height: 1.42857143rem; float: left; white-space: normal; overflow: hidden;}

form .buttons {width: 100%; clear: both; float: left;}

/* Content tables: chauffeurs ---------------------------------------------------------------------- */
.chauffeur .content_table .force_fit_width,
.chauffeurs .content_table .force_fit_width,
.content_table.chauffeurs .force_fit_width {width: auto;}

.mobile-view.drivers .heading .driver_number,
.mobile-view.drivers .contents .driver_number {width: 6rem;}
.mobile-view.drivers .heading .driver_lastname,
.mobile-view.drivers .contents .driver_lastname {width: 65%;}


/* Selection above table --------------------------------------------------------------------------- */
.selection .col-md-2 {min-height: 0;}
.selection .btn {margin-top: 2.3rem;}
.table_footer {width: 100%; float: left; margin-top: 1rem;margin-bottom: 1rem;}
/*.selection input {height: 40px;}*/
.selection .input-group .btn {margin-top:0;}
.selection .filter-field:first-child .control-group {margin-left: 0 !important;}

/* Chauffeurs -------------------------------------------------------------------------------------- */
.driver_actions {text-align: right;}
.driver_actions .btn {text-align: right; margin-left: 0.5rem;}
.content_table th:last-child,
.content_table td:last-child {margin-right: 0;padding-right: 0}
.driver_actions .btn:last-child {margin-right: 0;}
.table_footer .btn {float: right; padding-right: 0;}

.display-xs.chauffeur .inner,
.display-sm.chauffeur .inner {padding-top: 0;}

/* Voertuig ----------------------------------------------------------------------------------------- */
.vehicle_mobitab {min-width: 10rem;}

.content_table.vehicles {table-layout: auto;}

.vehicles .vehicle_licensplate {width: 6rem !important;}
.vehicles .vehicle_type,
.vehicles .vehicle_vin,
.vehicles .vehicle_vergunning_standplaats,
.vehicles .vehicle_gemeente_standplaats {width: 14.875rem !important;}
.vehicles .vehicle_actions {width: 5rem !important;}




.display-xs.voertuig .inner,
.display-sm.voertuig .inner {padding-top: 0;}

.mobile-view.contenttable .vehicle_license {width: 8.5rem;}
.mobile-view.contenttable .vehicle_license_plate {width: 5rem;}
.mobile-view.contenttable .vehicle_vin_short {width: auto;}


/* Historie ----------------------------------------------------------------------------------------- */
th .reality,
.reality td {opacity: 0.5;}
.planned td {padding-top: 12px;}
.historie .content_table td {vertical-align: top;}

/* Popups / Modals ---------------------------------------------------------------------------------- */
.modal-dialog {margin: 2.4rem auto;}

.modal-dialog {width: 359px;}
.display-xs .modal-dialog {padding: 0 15px; width: 100%;}

.modal-dialog .close {display: none;}

.modal-content {border: 1px solid rgba(0,0,0,.2); border-radius: 10px; padding: 21px; box-shadow: 0 5px 15px rgba(0,0,0,.5);}
.modal-header {padding: 0;border-bottom: none;}
.modal-title {display: none;}

#system-message-container {display: none !important;}

.modal-header{width: 100%; }
.modal-content {float: left; display: block; width: 100%;}
.modal-body {width: 100%; padding: 0 0 5px 0; float: left;}
.modal-body p {font-size: 0.88235294rem !important; color: #555; margin: 0 0 10px !important; line-height: 1.42857143; overflow-wrap: normal; word-wrap: normal; white-space: normal;}
.modal-footer {float: left; width: 100%; clear: both; width: 100%; padding-right: 0; padding-left: 0; padding-bottom: 0;border-top: 1px solid #999;}
.modal-footer {
    display:inherit;
    justify-content:center;
}
.modal-footer form {width: 50%; float: right;}

.modal-footer .btn.back-button {float: left !important;}
.modal-footer .btn.ok-button {float: right !important;}
/*.modal-footer .btn.btn-primary*/

.modal-footer .btn {font-size: 0.88235294rem !important; color: #fff !important;  border-radius: 6px !important; padding: 7px 10px 8px 7px !important; margin-bottom: 0 !important; margin-left: 0; font-family: 'helveticaNeueLT_light' !important; font-weight: 300; border-color: #252525 !important; background-color: #252525 !important; text-decoration: none; line-height: .9411764705882353em; border-radius: 6px;}

.modal-footer .btn:hover {opacity: .5 !important;}
.modal-footer .btn:focus {box-shadow: none;}

#passwordReset .modal-footer {border-top: 0;}

/* Content area ------------------------------------------------------------------------------------ */
.display-xs .col-12.content, .display-sm .col-12.content {height: auto !important;}

/* Views ------------------------------------------------------------------------------------------- */

/* Login ------------------------------------------------------------------------------------------- */
.content .welcome-image {height: 100%; margin-bottom: 30px;}
.content .login-form {height: 100%; margin-bottom: 30px;}
.content .login-form .inner {padding: 21px; width: 100%;}
.welcome-image .inner {padding: 0;}

.view-login span.star {display: none;}
.view-login .password-group .input-group-text {display: none;}
.view-login .form-check.form-group {display: none;}

.view-login .form-group {margin-bottom: 1rem;}
.view-login .form-group button {width: auto; float: right;}

.login img {margin:0;}

.login .edge-transparent {border: 1px solid #ccc;}

.login a.password-reset {color: #171717; text-decoration: none;}
.login a.password-reset:hover {opacity: 0.5;}

.login #username-lbl {font-family: 'HelveticaNeue_medium'; font-weight: 300; font-size: 1rem;}
.login #password-lbl {font-family: 'HelveticaNeue_medium'; font-weight: 300; font-size: 1rem;}

.login .form-validate p {margin-bottom: 0;}



/* Mobile (< small) */
.view-login .content .login-form .inner {padding: 15px;}
.view-login .content_mobile .login {margin-bottom: 21px;}
.view-login .content_mobile .welcome-image {padding-left: 0; padding-right: 0;}
.view-login #sp-logo .sp-module-content {display: inline-block; width: 100%;}
.view-login #sp-logo a {display: block; margin: 0 auto; width: 100%;}

.display-xs .content .login-form, .display-sm .content .login-form,
.display-xs .content .welcome-image, .display-sm .content .welcome-image {height: auto;}
.display-xs .login-form,
.display-sm .login-form {padding-left: 0; padding-right: 0;}
.home.display-xs .login-form,
.home.display-sm .login-form {padding-left: 15px; padding-right: 15px;}

/* Extensions and modules -------------------------------------------------------------------------- */

/* Chronoforms & Joomla forms ---------------------------------------------------------------------- */

/* No CF credits... */
.chronoforms6_credits {display: none;}

/* NO stars.... */
.ui.form .required.field > .checkbox::after, .ui.form .required.field > label::after, .ui.form .required.fields.grouped > label::after, .ui.form .required.fields:not(.grouped) > .field > .checkbox::after, .ui.form .required.fields:not(.grouped) > .field > label::after {content: none !important;}
label .star {display: none;}

/* group labels and fields together */
.ui.form .field, .control-group  {margin: 0 0 1em !important; float: left; width: 100%;}

/* No inline validation errors (in small red print) */
/* .ui.form small.custom-error {display: none !important;} */

/* Various fields settings */
.ui.form .field input[type="text"], .ui.form .field.error input[type="text"],
.ui.form .field input[type="textarea"], .ui.form .field.error input[type="textarea"],
.ui.form .field select, .ui.form .field.error select,
.control-group input.form-control,
.control-group select,
.control-group select:not(.form-control),
.control-group textarea.form-control {
    width: 66%;
    float: right;
}

.ui.form textarea {width: 66% !important; float: right; min-height: 106px; resize:vertical; }
/* .ui.form textarea {width: 66% !important; float: right; min-height: 104.866px; resize:vertical; } */
.ui.form button {float: right;}

.ui.button {font-family: 'helveticaNeueLT_light', Arial, Sans-Serif !important;}

.ui.form label, .ui.form .field > label, .control-group label {font-family: 'HelveticaNeue_medium'; font-weight: 300 !important; font-size: 0.8825294rem !important; padding-top: 6.5px; padding-right: 6px; float: left; width: auto; margin:0; display: block; }

.ui.form label:after, .ui.form .field > label:after, .control-group label:after {content: none;}

.semanticui-body button {
    font-family: 'helveticaNeueLT_light', Arial, Sans-Serif !important;
    font-size: 0.94117647rem !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    padding: .25rem .5rem !important;
    border-radius: 0.58823529rem !important;
}

/* Errors / validation */

/* Validation errors */
.ui.form .field.error input:not([type]), .ui.form .field.error input[type="date"], .ui.form .field.error input[type="datetime-local"], .ui.form .field.error input[type="email"], .ui.form .field.error input[type="file"], .ui.form .field.error input[type="number"], .ui.form .field.error input[type="password"], .ui.form .field.error input[type="search"], .ui.form .field.error input[type="tel"], .ui.form .field.error input[type="text"], .ui.form .field.error input[type="time"], .ui.form .field.error input[type="url"], .ui.form .field.error select, .ui.form .field.error textarea, .ui.form .fields.error .field input:not([type]), .ui.form .fields.error .field input[type="date"], .ui.form .fields.error .field input[type="datetime-local"], .ui.form .fields.error .field input[type="email"], .ui.form .fields.error .field input[type="file"], .ui.form .fields.error .field input[type="number"], .ui.form .fields.error .field input[type="password"], .ui.form .fields.error .field input[type="search"], .ui.form .fields.error .field input[type="tel"], .ui.form .fields.error .field input[type="text"], .ui.form .fields.error .field input[type="time"], .ui.form .fields.error .field input[type="url"], .ui.form .fields.error .field select, .ui.form .fields.error .field textarea {
    background: #fff !important;
    /*border-color: #4375BC !important;*/
    border-color: #4375BC;
    color: rgba(0,0,0,.85) !important;
}
.ui.form .field.error .input, .ui.form .field.error label, .ui.form .fields.error .field .input, .ui.form .fields.error .field label, field.required.error {color: rgba(0,0,0,.87) !important;}

/* placeholder validation errors */
.ui.form .field.error input::placeholder, .ui.form .field.error textarea::placeholder {color: rgba(0,0,0,.85) !important;}

/* Change Autocomplete / autofill styles */
input {
    filter: none;
}

/* Dimmed background on error/message popups */
.ui.dimmer {text-align: left !important; background-color: rgba(0,0,0,.5) !important;}

.ui.form input:not([type]),
.ui.form input[type="date"],
.ui.form input[type="datetime-local"],
.ui.form input[type="email"],
.ui.form input[type="file"],
.ui.form input[type="number"],
.ui.form input[type="password"],
.ui.form input[type="search"],
.ui.form input[type="tel"],
.ui.form input[type="text"],
.ui.form input[type="time"],
.ui.form input[type="url"],
optgroup, textarea, option,
.form-control::placeholder,
.form-control input,
input.form-control 
/*input[type="text"]:not(.form-control),
input[type="email"]:not(.form-control),
input[type="url"]:not(.form-control),
input[type="date"]:not(.form-control),
input[type="password"]:not(.form-control),
input[type="search"]:not(.form-control),
input[type="tel"]:not(.form-control),
input[type="number"]:not(.form-control) */ {
    font-family: 'helveticaNeueLT_light', Arial, Sans-Serif !important;
    font-size: 0.88235294rem !important;
    font-weight: 300 !important;
    line-height: 1.25 !important;
    height: 33.7667px;
    color: #495057 !important;
    /*padding: 0.375rem .75rem !important; */
    border-radius: 4.00000006px !important;
    /* border: 1px solid #ced4da !important;*/
}

select,
select:active,
select:hover,
select:focus,
select:not(.form-control),
select:not([multiple]),
.form-control select,
.form-control select:active,
.form-control select:hover,
.form-control select:focus,
select.form-control {
    font-family: 'helveticaNeueLT_light', Arial, Sans-Serif !important;
    font-size: 0.88235294rem !important;
    font-weight: 300 !important;
    line-height: 1.25 !important;
    height: 1.98627647rem !important;
    color: #495057 !important;
    /* background-color: #fff !important; */
    padding: .375rem .75rem !important;
    background-image: none;
    background-clip: padding-box;
    border: 1px solid #ced4da !important;
    border-radius: 0.25rem !important;
}

option {
    font-family: 'helveticaNeueLT_light', Arial, Sans-Serif !important;
    font-size: 0.88235294rem !important;
    font-weight: 300 !important;
    line-height: 1.25 !important;
    color: #495057 !important;
    background-color: #fff !important;
    padding: 0 !important;
}

option:active,
option:hover,
option:focus {
    font-family: 'helveticaNeueLT_light', Arial, Sans-Serif !important;
    font-size: 0.88235294rem !important;
    font-weight: 300 !important;
    line-height: 1.25 !important;
    color: #000 !important;
    background-color: #7B7979 !important;
    padding: 0 !important;
}
option::before {content: none !important;}

input[type="checkbox"]:checked {
    color: #ff0000 !important; background-color: #ccc !important;
}

/* Indivial pages ---------------------------------------------------------------------------------- */

/* HOME page --------------------------------------------------------------------------------------- */
.home .login-form .edge-transparent {background-color: #E7E5E6; color: #000;}
.home .greeting {font-family: 'HelveticaNeue_medium'; font-weight: 300; font-size: 1rem;}

/* CHAUFFEURS page --------------------------------------------------------------------------------- */

/* VOERTUIG page ----------------------------------------------------------------------------------- */
.voertuig .content_table .vehicle_type {width: auto; min-width: 3rem;}

/* PLANNING page ----------------------------------------------------------------------------------- */
.planning .content_table {width: 100%; table-layout:inherit;}
.planning .control-group  {margin: 0 0 1rem 0 !important; float: left; width: auto;}
.planning .select_date .control-group {margin-left: 0 !important; width: 240px;}
.planning .control-group label {display: block; float: left;padding-right: 4.9px;}
.planning .control-group .field-calendar,
.planning .control-group .driver,
.planning .control-group input,
.planning .control-group select {display: block; float: right; width: auto;}
.planning .control-group .datepicker {width: 120px;}
.planning .selection .btn {margin-top: 0rem; float: right;}
.planning .selection .btn:hover,
.planning .selection .btn:focus {opacity: 0.5;}

/* Breedte van de kolommen */
.planning .row1 th {border-bottom: 0; padding-bottom: 0;}
.planning th.select_date {width: 255px;}
.planning th.select_rpnumber {width: 190px;}
.planning th.select_rpnumber input {width: 104px !important;}
.planning th.select_driver {width: 540px;}
.planning th.select_submit {width: auto;}
.planning th.date {width: 115.233px !important;}
.planning th.time {width: 51.6px !important; max-width: 51.6px !important;}
.planning th.rit-id {width: 85.7333px !important;}
.planning th.name {width: 210px !important;}
.planning th.address {width: 284.0835px !important;}

.planning td.rit-id p {width: 100%; overflow:visible;}
.planning td.date {width: 115.233px !important;}
.planning td.time {width: 51.6px !important; max-width: 51.6px !important;}
.planning td.rit-id {width: 85.7333px !important;}
.planning td.name {width: 210px !important;}
.planning td.address {width: 284.0835px !important; overflow: hidden;}
.planning td.name p,
.planning td.address p {width: 100%; overflow: hidden; white-space: normal;}

.planning .row1 .btn {margin-top: 5.5px;}
.planning .row1 .select_submit input.btn {font-family: 'HelveticaNeue_medium', Arial, Sans-Serif !important ; background-color: transparent !important; border-color: transparent !important; color: #7B7979 !important; padding-right: 0 !important;}
.planning .row1 input.btn:hover,
.planning .row1 input.btn:focus {opacity: 0.5;}


/* Mobiele weergave planning */
.display-xs.planning .inner,
.display-sm.planning .inner {padding-top: 0;}

.display-xs .heading .planning_date,
.display-xs .contents .planning_date,
.display-sm .heading .planning_date,
.display-sm .contents .planning_date {width: 6rem;}
.display-xs .heading .planning_time,
.display-xs .contents .planning_time,
.display-sm .heading .planning_time,
.display-sm .contents .planning_time {width: 3rem;}
.display-xs .heading .planning_name,
.display-xs .contents .planning_name {width: 9rem !important; height: auto !important; word-break: break-all;}
.display-sm .heading .planning_name,
.display-sm .contents .planning_name {width: 19rem;}

.display-xs .contents .planning_nodata,
.display-sm .contents .planning_nodata {width: 100%;}


/* mobiele weergave planning filter */
.display-xs.planning #filter .control-group {width: 100%;}

.display-xs.planning #filter #jform_ritdatum-lbl,
.display-xs.planning #filter #jform_rp_nummer-lbl,
.display-xs.planning #filter #jform_rl_chauffeurs_nummer-lbl {width: 5rem;}

.display-xs.planning #filter #jform_ritdatum,
.display-xs.planning #filter #jform_rp_nummer,
.display-xs.planning #filter #jform_rl_chauffeurs_nummer {width: 100%;}



/* EDIT PLANNING page ------------------------------------------------------------------------------ */
.edit-planning .field-group {width: 100%; float: left; clear: both;}
.edit-planning .field-group .control-group {margin: 0 0 1rem 1rem !important; float: left; width: auto;}
.edit-planning .field-group .control-group .boekdatum,
.edit-planning .field-group .control-group .ritdatum {width: 120px;}
.edit-planning .field-group .control-group .betaalwijze {width: 120px;}
.edit-planning .field-group .control-group .boektijd,
.edit-planning .field-group .control-group .rittijd,
.edit-planning .field-group .control-group .instaptijd,
.edit-planning .field-group .control-group .uitstaptijd {width: 98px;}
.edit-planning .field-group .control-group .ritbedrag,
.edit-planning .field-group .control-group .afstand {width: 98px;}
.edit-planning .field-group .control-group:first-child {margin-left: 0 !important;}
.edit-planning .field-group .left .control-group {float: left;}
.edit-planning .field-group .right .control-group {float: right;}
/*.edit-planning .control-group label {width: 120.75px;}*/
.edit-planning .control-group label {width: auto;}
.edit-planning .field-group .control-group:first-child label  {width: 120.75px;}
.edit-planning .field-group .control-group label {width: auto;}
.edit-planning .control-group input,
.edit-planning .control-group textarea,
.edit-planning .control-group select {width: 77%;}
.edit-planning .control-group textarea {height: 8rem; min-height: 8rem;}
.edit-planning .field-group .control-group {width: auto;}
.edit-planning #jform_boektijd-lbl,
.edit-planning #jform_rittijd-lbl {width: 75px;}
.edit-planning #jform_ritId-lbl,
.edit-planning #jform_chauffeur-lbl {width: auto;}
.edit-planning #jform_ritbedrag-lbl,
.edit-planning #jform_betaalwijze-lbl {width: 120.75px;}
.edit-planning .col-12 .button-group {float: right;}
.edit-planning .button-group .btn {margin-left: 15px;}

/* AANPASSINGEN SIMON 24-09-2020 ------------------------------------------------------ */
.edit-planning .right #jform_instapadres-lbl,
.edit-planning .right #jform_uitstapadres-lbl {display: none;}

.edit-planning .instapadres .right .control-group,
.edit-planning .uitstapadres .right .control-group {width: 55%;}
.edit-planning .instapadres .right .control-group input,
.edit-planning .uitstapadres .right .control-group input {width:100%;}


.edit-planning.display-xs #sp-main-body {padding-left: 15px; padding-right: 15px;}
.edit-planning.display-xs #sp-main-body .content {padding-left: 20px; padding-right: 20px; padding-bottom: 20px;}
.edit-planning.display-xs #sp-main-body .content .left-column,
.edit-planning.display-xs #sp-main-body .content .right-column {padding-left: 0; padding-right: 0;}
.edit-planning.display-xs #sp-main-body .content .inner {padding-left: 0; padding-right: 0; border: 0;}

.edit-planning.display-xs .edit-planning .field-group .right .control-group {float: left;}
.edit-planning.display-xs .edit-planning .control-group,
.edit-planning.display-xs .edit-planning .control-group label,
.edit-planning.display-xs .edit-planning .control-group input,
.edit-planning.display-xs .edit-planning .control-group textarea,
.edit-planning.display-xs .edit-planning .control-group select {
    width: 100%;
}
/* EINDE AANPASSINGEN SIMON 24-09-2020 ------------------------------------------------------ */


.display-xs .col-12.content,
.display-xs .edit-planning .col-12.left-column,
.display-xs .edit-planning .col-12.right-column {padding-left: 0; padding-right: 0;}

.display-xs .edit-planning .col-12.left-column .inner {padding-bottom: 0;}
.display-xs .edit-planning .col-12.right-column .inner {padding-top: 0;}


.display-xs .field-group .left,
.display-sm .field-group .left,
.display-xs .field-group .right,
.display-sm .field-group .right,
.display-xs .field-group .left .control-group,
.display-xs .field-group .right .control-group,
.display-sm .field-group .left .control-group,
.display-sm .field-group .right .control-group,
.display-xs .field-group .left .control-group input,
.display-xs .field-group .right .control-group input,
.display-sm .field-group .left .control-group input,
.display-sm .field-group .right .control-group input,
.display-xs .field-group .left .control-group select,
.display-xs .field-group .right .control-group select,
.display-sm .field-group .left .control-group select,
.display-sm .field-group .right .control-group select,
.display-xs .control-group input.form-control,
.display-sm .control-group input.form-control,
.display-xs .control-group textarea.form-control,
.display-sm .control-group textarea.form-control,
.display-xs .control-group select,
.display-sm .control-group select {width: 100%;}


/* HISTORIE page ----------------------------------------------------------------------------------- */
.historie .planning_rit-id {width: 5rem;}
.historie .selection .actions input.btn {margin-top: 0rem; float: right;}
.historie .selection .actions input.btn {border-color: transparent; background-color: transparent !important; font-family: 'HelveticaNeue_medium' !important; font-size: 1rem; color: #7B7979 !important; padding-right: 0 !important;}
.historie .selection .actions input.btn:hover,
.historie .selection .actions input.btn:focus {opacity: 0.5;}

.historie .control-group label {display: block; width: auto; clear: both;}
.historie .control-group input#jform_rp_nummer {display: block;}
.historie .selection .btn-primary {margin-top: 1.9rem; float: right;}
.historie .control-group {margin: 0 0 1rem 1rem !important; float: left; width: auto; }
.historie .control-group label {display: block; float: left; padding-right: 6px;}
.historie .control-group .field-calendar,
.historie .control-group .driver,
.historie .control-group input,
.historie .control-group select {display: block; float: right; width: auto;}
.historie .control-group .datepicker {width: 120px;}
.historie .historie_rit-id {width: 5rem;}

.historie .selection .btn-primary {border-color: transparent; background-color: transparent; font-family: 'HelveticaNeue_medium'; font-size: 0.8825294rem !important; color: #7B7979; padding-right: 0;}
.historie .filter_row_1, .historie .filter_row_2 {float: left; width: 100%; clear: both;}
.historie .filter_row_1 .control-group {padding-top: 0;}
.historie .selection .btn {margin-top: 0; float: right;}
.historie .force_fit_width {width: auto;}

/* Mobiele weergave */
.display-xs .historie .inner,
.display-sm .historie .inner {padding-top: 0;}

.display-xs .heading .historie_date,
.display-xs .contents .historie_date,
.display-sm .heading .historie_date,
.display-sm .contents .historie_date {width: 6rem;}
.display-xs .heading .historie_time,
.display-xs .contents .historie_time,
.display-sm .heading .historie_time,
.display-sm .contents .historie_time {width: 3rem;}
.display-xs .heading .historie_name,
.display-xs .contents .historie_name {width: 9rem !important; height: auto !important; word-break: break-all;}
.display-sm .heading .historie_name,
.display-sm .contents .historie_name {width: 19rem;}

.display-xs .contents .historie_nodata,
.display-sm .contents .historie_nodata {width: 100%;}

.display-xs.view-histories #filter .control-group {width: 100%;}

.display-xs.view-histories #filter #jform_ritdatum-lbl,
.display-xs.view-histories #filter #jform_rp_nummer-lbl,
.display-xs.view-histories #filter #jform_rl_chauffeurs_nummer-lbl {width: 100%;}

.display-xs.view-histories #filter #jform_startdate,
.display-xs.view-histories #filter #jform_startdate,
.display-xs.view-histories #filter #jform_rp_nummer,
.display-xs.view-histories #filter #jform_rl_chauffeurs_nummer,
.display-xs.view-histories #filter #jform_wp_wagen_nummer {width: 100%;}



/* Mobiele weergave planning */
.display-xs.planning .inner,
.display-sm.planning .inner {padding-top: 0;}


/* HISTORIE DETAILS page ------------------------------------------------------------------------------ */
.history-details #jform_instapadres-lbl,
.history-details #jform_uitstapadres-lbl {display: none;}

.history-details .instapadres .right .control-group,
.history-details .uitstapadres .right .control-group {width: 55%;}
.history-details .instapadres .right .control-group input,
.history-details .uitstapadres .right .control-group input {width:100%;}


.history-details.display-xs #sp-main-body {padding-left: 15px; padding-right: 15px;}
.history-details.display-xs #sp-main-body .content {padding-left: 20px; padding-right: 20px; padding-bottom: 20px;}
.history-details.display-xs #sp-main-body .content .left-column,
.history-details.display-xs #sp-main-body .content .right-column {padding-left: 0; padding-right: 0;}
.history-details.display-xs #sp-main-body .content .inner {padding-left: 0; padding-right: 0; border: 0;}

.history-details.display-xs .edit-planning .field-group .right .control-group {float: left;}
.history-details.display-xs .edit-planning .control-group,
.history-details.display-xs .edit-planning .control-group label,
.history-details.display-xs .edit-planning .control-group input,
.history-details.display-xs .edit-planning .control-group textarea,
.history-details.display-xs .edit-planning .control-group select {
    width: 100%;
}

.history-details.display-xs .edit-planning .inner {padding-bottom: 0;}


/* RAPPORTAGE page --------------------------------------------------------------------------------- */
.rapportage .col-12 {padding-right: 0;}

.rapportage h3 {font-family: 'HelveticaNeue_medium'; ; font-size: 1rem; font-weight: 400;}
.rapportage .left .control-group .form-check {width: 100%;float: left; clear: both;}
.rapportage .right .control-group label {width: 34%;}
.rapportage .right .control-group .datepicker {width: 120px; float: left;}

.rapportage .btn {margin-top: 0rem; float: right;}
.rapportage .btn:hover,
.rapportage .btn:focus {opacity: 0.5;}

.report .inner {width: 100%;}
.report .row_1, .report .row_2 {float: left; width: 100%; clear: both;}
.report .column_left, .report .column_middle{float: left;}
.report .column_right {float: right;}
.report .column_right .btn {float: right;}
.report .column_left {width: 15%;}
.report .column_middle {width: 45%;}
.report .column_right {width: 40%;}
.report .column_left p {font-family: 'HelveticaNeue_medium';
    font-weight: 300 !important;
    font-size: 0.8825294rem !important;
    padding-top: 0px;
    padding-right: 6px;
    float: left;

    margin: 0;}
.report .column_left p {padding-top: 6.5px;}
.report .column_middle .form-check {width: 100% !important;}
.report .column_middle .form-check label {width: 90% !important;margin: 0 0 1em -2px !important;}
.report .row_2 .column_left p {padding-top: 6.5px;}
.report .row_2 .column_middle .control-group label {width: 18%; float: left;}
.report .row_2 .column_middle .control-group label input {margin-top: 4px;}
.report .row_2 .column_middle .control-group input,
.report .row_2 .column_middle .control-group select {width: 82%; float: left;}
.report .column_middle .datepicker {width: 120px !important;}

.rapportage .btn {
    font-family: 'HelveticaNeue_medium', Arial, Sans-Serif !important;
    background-color: transparent !important;
    border-color: transparent !important;
    color: #7B7979 !important;
    font-size: 0.8825294rem;
    padding-right: 0 !important;
}

/* BEDRIJF page ------------------------------------------------------------------------------------ */

.bedrijf .title-group {display: block; float: left; width: 100%; clear: both;}
.bedrijf .title-group h4 {font-family: 'HelveticaNeue_medium'; font-weight: 300 !important; font-size: 0.8825294rem !important; font-size: 1rem; font-weight: 400; margin: 0.5rem 0 1rem !important; padding-right: 0.25rem; float: left; background-color: #E7E5E6;}
.bedrijf .field-group {display: block; float: left; width: 100%; clear: both;}


.bedrijf .content .inner {padding: 0;}
.bedrijf .content .inner.header {padding: 15px 31px 0 31px;}
.bedrijf.display-xs .content .inner.header {padding: 15px 0 0 0;}

.bedrijf .content .inner form {padding: 15px; border: 1px solid #000; border-radius: .58823529rem;}
.bedrijf .content .blok_test, .bedrijf .content .blok_acceptatie {padding-bottom: 15px;}
.bedrijf .buttons-footer {padding-left: 15px; padding-right: 15px;}

.bedrijf .inner.header .control-group {padding-right: 15px;}


/* CONTACT page ------------------------------------------------------------------------------------ */
.contact textarea#vraag {height: 106.866px;}

.contact.display-xs .welcome-image, .contact.display-sm .welcome-image {display: none;}
.contact.display-xs .right-column {padding-left: 0 !important; padding-right: 0 !important;}
.contact.display-xs .content, .contact.display-sm .content {overflow-y: scroll;}

.contact.display-xs label, .contact.display-sm label,
.contact.display-xs input, .contact.display-sm input,
.contact.display-xs .ui.form label, .contact.display-xs .ui.form .field > label, .contact.display-xs .control-group label,
.contact.display-sm .ui.form input, .contact.display-sm .ui.form .field > input, .contact.display-sm .control-group input,
.contact.display-xs .ui.form .field input[type="text"], .contact.display-sm .ui.form .field input[type="text"] {width: 100%;}
.contact.display-xs .ui.form textarea, .contact.display-sm .ui.form textarea {width: 100% !important;}


/* Versie informatie ------------------------------------------------------------------------------- */

.view-category p {margin-bottom: 0;}


/* END OF Indivial pages --------------------------------------------------------------------------- */

/* Offcanvas menu ---------------------------------------------------------------------------------- */

.offcanvas-init .offcanvas-overlay,
.offcanvas-init .offcanvas-menu {display: none;}


div[itemprop="articleBody"] .offcanvas-menu {display: block; position: relative; height: auto; margin-top: 0; width: 100%; transition: all 0.4s; }

.responsive-menu .responsive-inner {padding: 15px 24px;}
.responsive-menu .responsive-inner .moduletable:not(:last-child) {margin-bottom: 0;}
.responsive-menu .responsive-inner .moduletable .menu {margin-bottom: .58823529rem;}
.responsive-menu .responsive-inner .moduletable ul {padding-left: 0;}
.responsive-menu .responsive-inner .moduletable ul > li {background-color: rgba(255,255,255,1.0); margin-bottom: .58823529rem; border: 1px solid #999; border-radius: .58823529rem; padding: .58823529rem; list-style: none;}
.responsive-menu .responsive-inner .moduletable ul > li a {text-decoration: none;}
.responsive-menu .responsive-inner .moduletable ul > li .menutitle {font-family: 'HelveticaNeue_medium', Arial, Sans-Serif; font-size: 1rem; font-weight: 300;font-size: 1.2rem; font-style: normal; line-height: 1.42857143rem; padding-top: 0; padding-bottom: 0; text-transform: uppercase; color: #999; width: 100%; display: block;}
.responsive-menu .responsive-inner .moduletable ul > li .subtitle {font-family: 'helveticaNeueLT_light', Arial, Sans-Serif; font-size: 1rem; font-weight: 300;font-size: 1rem; font-style: normal; line-height: 1.42857143rem; padding-top: 0; padding-bottom: 0; text-transform: uppercase; color: #999; width: 100%; display: block;}

.offcanvas-menu .offcanvas-inner .moduletable ul > li.item-393 {display: none;}


.display-xs .no-mobile {display: none;}
/* Pagina Rapportage */
.display-xs .item-393,
.display-sm .item-393,
/* PAgina Bedrijf */
.display-xs .item-440,
.display-sm .item-440 {display: none;}

/* CSS SIMON ----------------------------------------------------------------------------------- */

.display-xs #sp-header .row ,
.display-sm #sp-header .row {
    flex-direction: row-reverse;
}

.overflow-scroll {
    overflow: scroll;
}



.display-xs #sp-second-menu, .display-sm #sp-second-menu,
.display-sm #sp-second-menu, .display-sm #sp-second-menu {
    display: none;
}

.display-xs .report,
.display-sm .report {
    display: none !important;
}

.footertext {
    display: inline-block;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    appearance: textfield;
    -moz-appearance: textfield;
}


#sp-third-menu .submenu .active, .anchor_higlight_menu .submenu .active{
    font-weight: 600;
}

.no-gutter, .anchor_higlight_menu {
    position: fixed;
    top: 155px;
    z-index: 1000000;
    left: 0;
    background: white;
}


/* END CSS SIMON ----------------------------------------------------------------------------------- */



.content form#adminFrom {display: block; width: 250px; overflow: hidden;}
#sp-footer {position: relative; bottom: 0; width: 100%;}

/* Formulieren com_momforms ------------------------------------------------------------------------ */

.ui.form .radio label {
    font-family: 'helveticaNeueLT_light', Arial, Sans-Serif !important;
    font-weight: 300 !important;
  font-size: 0.8825294rem !important;
}



/* Aanpassingen 04-2025 ---------------------------------------------------------------------------- */

.contact .ui.form #jform_aanhef_2-lbl {width: 34% !important;}

.ui.form .form-button.field {
    margin-bottom: 0 !important;
}

/* Offerteaanvraag CDT */ 

#customFormModal9 .ui.form .display_label_left:nth-child(n+15) .field label {
    width: 445px !important;
    word-break: normal;
}

#customFormModal9 .ui.form .display_label_left:nth-child(n+15) .field .form-check label {
    width: auto !important;
    word-break: normal;
}

#customFormModal9 .ui.form .display_label_left:nth-child(n+15) .field .radio {
    width: fit-content;
    display: block;
    float: right;
}

/* Aanmelding BCT XML Online */

#customFormModal10 .form-check label {padding-left: 1.4rem;}

#customFormModal10 .form-check label input {margin-left: -1.4rem; display: block; float: left;}


/* Offerteaanvraag Digitale Rittenstraat */

#customFormModal8 .ui.form .display_label_left:nth-child(n+13) .field label {
    width: 445px !important;
    word-break: normal;
}

#customFormModal8 .ui.form .display_label_left:nth-child(n+13) .field .form-check label {
    width: auto !important;
    word-break: normal;
}

#customFormModal8 .ui.form .display_label_left:nth-child(n+13) .field .radio {
    width: fit-content;
    display: block;
    float: right;
}


/* Media queries ----------------------------------------------------------------------------------- */

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 576px) {

}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

    /* Bootstrap additions ----------------- */
    .col-12.content, .col-12.above-content {padding-left: 0; padding-right: 0;}

    .content form#adminFrom {display: block; width: 250px; overflow: hidden;}

    #sp-footer {position: relative; bottom: 0; width: 100%;}

    .content_large {display: none !important;}
    .content_mobile {display: block;}

    .no_display_xs {display: none;}

    .bedrijf .welcome-image {display: none !important;}

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {

    /* .layout-boxed .body-innerwrapper {max-width: 720px;} */

    /* Header */
    #sp-header #sp-logo {padding-left: 0;}
    #sp-header #sp-menu {padding-right: 0;}

    .layout-boxed #sp-main-body .content div.col-12:first-child {padding-left: 0;}
    /*.layout-boxed #sp-main-body .content div.col-12:second-child {padding-right: 0;}*/

    .layout-boxed #sp-main-body .content div.col-12.left-column {padding-left: 0;}
    .layout-boxed #sp-main-body .content div.col-12.right-column {padding-right: 0;}

    .login-form {margin:0}

    .content_large {display: block !important;}
    .content_mobile {display: none;}

    .no_display_xs {display: none;}

    .bedrijf .welcome-image {display:inherit !important;}

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

    /* .layout-boxed .body-innerwrapper {max-width: 960px;} */

    /*.login-form {margin: 15px;}*/

    .article-details .article-header , .article-details .page-header {display: none;}

    /* Logo */
    #sp-logo .sp-column {padding-top: 8.5px;}
    /* Menu */
    .sp-megamenu-parent {margin-top: 9px;}
    .sp-megamenu-parent .sp-menu-item {padding-left: 10.5px; padding-right: 0;}
    .sp-megamenu-parent .sp-menu-item a {padding: 8px; min-height: 54px; max-height: 54px; min-width: 155px;}
    .sp-megamenu-parent .sp-menu-item .subtitle {
        font-family: Helvetica,'helveticaNeueLT_light';
        font-weight: 400;
        font-size: 11px;
        line-height: 16px;
        letter-spacing: 1px;}
    .subtitle {display: none;}

    /* Main component */

    /* Welcome page */
    .home .content .login-form ,
    .login .content .login-form {padding-right: 0;}
    .content .login-form .inner {height: 100%;}
    .welcome-image {display: inline-block !important;}
    .login-form {display: inline-block !important;}

    /* Footer */
    /*
    #sp-footer {margin: 0 auto; left: 50%; width: 960px; margin-left: -480px;}
    #sp-footer {position: fixed; bottom: 0;}
    .offcanvas-footer #sp-footer {display: none;}
    */

    #sp-footer p {margin-bottom: 0;}

    .no_display_xs {display: inline;}


}

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

    html {min-height: 1080px;}

    /* .body-innerwrapper {padding-left: 0; padding-right: 0;}*/

    /*.layout-boxed .body-innerwrapper, .container {max-width: 1170px;}*/

    /* Header */
    #sp-header #sp-logo {padding-left: 0; padding-right: 0;}
    #sp-header #sp-menu {padding-right: 0; padding-right: 0;}

    /* Logo */
    #sp-logo .sp-column {padding-top: 1px;}
    /* Menu */
    .sp-megamenu-parent {margin-top: 2px;}
    .sp-megamenu-parent .sp-menu-item a {padding: 8px; min-height: 63px; max-height: 63px; /* min-width: 211.75px;*/}
    .sp-megamenu-parent .sp-menu-item:first-child {padding-left: 0;}

    /* Main component & content */
    .content .welcome-image, .content .login-form {margin-bottom: 0;}

    /* Welcome page */
    .home .content .login-form ,
    .login .content .login-form {padding-right: 0;}
    .content .login-form .inner {height: auto;}
    .home .login-form {height: 560.883px !important; }
    .home .login-form .inner {height: 100%;}

    /* Edit chauffeur */
    /*.view-editchauffeurform .content .login-form {padding-right: 0;}*/

    /* Edit voertuig */
    /*
    .view-editvehicleform .content .login-form {padding-right: 0; height: 560.883px !important;}
    .view-editvehicleform .login-form .inner {height: 100%;}
    */

    /* Bedrijf */
    /* 
    .content .right-part {padding-right: 0;}
    */

    /* Footer */
    #sp-footer {margin: 0 auto; left: 50%; width: 1170px; margin-left: -585px;}
    #sp-footer p {margin-bottom: 1.4rem;}

}