* {-webkit-font-smoothing: antialiased;}

body {
    margin: 0;
}

button, input, select, textarea {
    line-height: normal !important;
}

h2.m_ff_title {
    font-size: 18px;
    color: #3c474b;
    height:30px;
    margin-top:20px;
    font-weight: 600;
    letter-spacing: 0.4px;
}

h2.search_m_ff_title {
    margin-top: 0;
}

#m_ff_overzicht tr td table tr td,
#m_ff_search tr td table tr td {
    border-bottom: none !important;
}

#m_ff_overzicht tr td.medium {
    width:85px;
}


.errorMessage {
    display: none;
}

/* Custom Bootstrap addition */
.row.no-gutters > [class^="col-"],
.row.no-gutters > [class*=" col-"] {
    padding-right: 0;
    padding-left: 0;
}

/* Easy Autocomplete Overrule */
.easy-autocomplete { width: auto !important; }


.m_ff_add {
    float:right;
    margin-top:10px;
}
.m_ff_client th {
    padding:15px;
}

div#horizontalmenu,
div#horizontalmenu div.horizontal-menu-item, div#horizontalmenu div.horizontal-menu-item_active,
div#horizontalmenu div.horizontal-menu-item_active {
    background-color: #3c474b;
}

div#horizontalmenu div.horizontal-menu-item_active a {
    color: #fff;
    font-weight: bold;
    text-decoration: underline;
}

div#horizontalmenu div.horizontal-menu-item_active {
    background-color: #3c474b;
    text-decoration: underline;
}

div#horizontalmenu div.horizontal-menu-item:hover {
    background-color: #3c474b;
    text-decoration: underline;
}

/** TEXT **/
.text_green {
    color: green;
}

.text_red {
    color: red;
}

.text_bold {
    font-weight: bold;
}

/**list**/
ul.no_padding {
    padding: 0;
}

li.list_style_none {
    list-style: none;
}

/** BUTTONS **/
.btn-default {
    border-radius: 0;
}

.btn-primary {
    background-color: #3c474b;
    border-radius: 0;
    border: 0;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: #5f5f5f !important;
}

.btn-primary:focus {
    outline: 0 !important;
}

/** TABS **/
.nav-tabs {
    margin-top: 20px;
}

.nav-tabs > li > a {
    border-radius: 0 0 0 0;
    color: #333;
}

.nav-tabs {
    border-color: #3c474b;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
    border-color: #3c474b #3c474b transparent;
    background-color: #fafafa;
}

.nav-tabs > li.active {
    font-weight: bold;
}

.nav-tabs > li > a:hover {
    border-color: #eee #eee #3c474b;
}

/** AUTOCOMPLETE PRODUCTS ON RECEIPT **/
ul.productOnReceiptList {
    margin-top: 20px;
    width: 95%;
}

ul.productOnReceiptList .badge {
    cursor: pointer;
}

ul.productOnReceiptList li.list-group-item {
    padding: 5px 10px;
    border-radius: 0;
}

.easy-autocomplete input {
    border-radius: 0;
    box-shadow: none;
}



/** NEW STYLING **/
@font-face {
    font-family: 'latoregular';
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/lato-regular-webfont.woff2') format('woff2'),
    url('../fonts/lato-regular-webfont.woff') format('woff');
}

@font-face {
    font-family: 'latoblack';
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/lato-black-webfont.woff2') format('woff2'),
    url('../fonts/lato-black-webfont.woff') format('woff');
}

@font-face {
    font-family: 'cocogooseregular';
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/cocogoose_trial2-webfont.woff2") format("woff2"),
    url("../fonts/cocogoose_trial2-webfont.woff") format("woff"); }

@font-face {
    font-family: 'cocogoose_letterpressregular';
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/cocogooseletterpress_trial-webfont.woff2") format("woff2"),
    url("../fonts/cocogooseletterpress_trial-webfont.woff") format("woff"); }

body {
    font-family: 'latoregular';
    height: 100%;
}

html {
    position: relative;
    min-height: 100%;
}

.topmenu {
    background-color: #a5d2a5;
    color: #fff;
    padding: 10px;
    min-height: 40px;
    line-height: 1em;
    margin-bottom: 40px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    height: 40px;
}

.menu-novik {
    text-align: right;
    border-bottom: 1px solid #d9d9d9;
    padding: 0;
}

@media(max-width: 768px) {
    .menu-novik  {
        text-align: center;
    }
}


#topmenu .col-md-12 {
    padding-right: 0px;
    padding-left: 0px;
}

#topmenu .menu-right .logout-link{
    color: #fff;
    border-bottom: 1px solid white;
    padding-bottom: 1px;
}

#topmenu .menu-right .logout-link:hover{
    text-decoration: none;
}

#horizontalmenu {
    background-color: #a5d2a5 !important;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.horizontal-menu-item, .horizontal-menu-item_active {
     display: inline-block;padding: 7px 30px;
}

.horizontal-menu-item a:hover, .horizontal-menu-item_active a:hover,
.horizontal-menu-item a:visited, .horizontal-menu-item_active a:visited,
.horizontal-menu-item a:active, .horizontal-menu-item_active a:active,
.horizontal-menu-item a:focus, .horizontal-menu-item_active a:focus {
    text-decoration: none;
    border-bottom: 4px solid #93abb2;
    padding-bottom: 6px;
}

.horizontal-menu-item:last-child, .horizontal-menu-item_active:last-child {
    padding-right: 0;
}

.horizontal-menu-item a, .horizontal-menu-item_active a {
    color: #3d444b;
    font-family: 'latoregular';
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 14px;
    font-weight: 600;
}

.horizontal-menu-item_active a {
    border-bottom: 4px solid #93abb2;
    padding-bottom: 6px;
}

#homepage #homepage-text, #homepage #homepage-title {
    font-family: 'latoregular';
}

#main-content {
    margin-bottom: 50px;
    margin-top: 15px;
}

#main-content #menu_item_0 {
    background-color: #93abb2;
}

#menu #menu_item_0 a, #menu #menu_item_0_active a {
    font-size: 14px;
}


@media (max-width: 970px) {
    .horizontal-menu-item, .horizontal-menu-item_active {
        padding: 7px 15px;
    }
}

table#m_ff_search:not(.statistics) td:nth-child(2) {
    padding-right: 5px;
}

#m_ff_search tr:last-child td {
    border-bottom: none;
}

#main-content #content table tbody .huisnummer-input, #main-content #content table tbody .toevoeging-input {
    margin-left: 0px;
}

#main-content #content table tbody .claim_id {
    margin-top: 8px;
}

#main-content #content table tbody .claim-id-button {
    margin-left: 20px;
    padding: 13px;
    margin-top: -4px;
    line-height: 4px !important;
    font-size: 13px;
    width: 100px;
    height: 19px;
}

#m_ff_search tr td {
    padding-left: 0 !important;
}

#m_ff_search .group {
    background-color: inherit !important;
}

#main-content #content table tbody .m_ff_search {
    font-size: 16px;
    min-width: 120px;
    margin-left: 3px;
    margin-bottom: 3px;
}

.button-search-right {
    width: 400px;
}

#main-content #content table tbody .search-td {
    border: none;
}

#main-content #content .export-table input {
    margin-left: 0;
}

#main-content #content form #m_ff_search .export-button-td {
    border: none;
}

#main-content #content form #m_ff_search .export-button {
    float: right;
    padding: 13px;
    line-height: 3px !important;
    font-size: 16px;
    width: 120px;
    float: right;
}

#content #m_text_content ul {
    list-style-type: none;
    padding-left: 0;
}

#content #m_text_content ul li {
    list-style-type: none;
    padding-top: 5px;
    font-weight: bold;
}

#content #m_text_content ul li a {
    color: #3d444b;
    font-weight: 300;
}

#main-content #content #m_ff_overzicht tr {
    height: 50px;
}

#menu #menu_item_0 a, #menu #menu_item_0_active a,
#menu #menu_item_1 a, #menu #menu_item_1_active a {
    font-family: 'latoregular';
    line-height: 25px;
    text-decoration: none;
    color: #000;
    margin-bottom: 1px;
}

#menu #menu_item_0 {
    background-color: #e7edee;
}

#menu #menu_item_0:hover, #main-content #menu #menu_item_0_active:hover, #main-content #menu #menu_item_0_active {
    background-color: #cedcde;
}

#menu #menu_item_1, #menu #menu_item_1_active {
    margin-right: 10px;
    background-color: #c7e3c7;
    padding: 5px 0 5px 25px;
    border-bottom: 1px solid white;
}

#menu #menu_item_1:hover, #menu #menu_item_1_active:hover, #menu #menu_item_1_active {
    background-color: #a5d2a5;
}

#menu #menu_1 {
    border-bottom: 1px solid white;
}

#menu #menu_item_1 a, #menu #menu_item_1_active a {
    font-family: 'latoregular';
}

.footer-novik {
    background-color: #a5d2a5;
    color: #fff;
    padding: 10px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.footer-novik #footer-left {
    float: left;
}

.footer-novik #footer-notonpaper {
    float: right;
}

/* LOGIN PAGE */
.login #header {
    margin-top: 55px;
}

.login #header .separator {
    display: none;
}

#login {
    background-color: #fff;
    border-radius: 16px;
    border: 1px solid #d3d3d3;
    padding-bottom: 55px;
    margin-top: 75px;
}

#login #login-tekst {
    text-align: center;
    background-color: #a5d2a5;
    color: #fff;
    width: 100%;
    padding: 28px 10px 0 10px;
    margin-bottom: 20px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    font-family: 'cocogoose_letterpressregular';
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 1px;
}

#login #login-form {
    margin: 0 auto;
    font-family: 'latoregular';
    font-size: 16px;
    margin-top: 30px;
}

#login #login-form-user, #login #login-form-pass, #login #login-form-remember {
    height: 40px;
}

#login #login-form-btn {
    color: #fff;
}

#login #login-form-btn input {
    background-color: #93abb2;
    padding: 5px;
    border-radius: 7px;
    border: 1px solid #fff;
    margin-left: 130px;
    width: 188px;
}

#login #login-forgot {
    margin-left: 150px;
}

#login input[type="checkbox"], #login input[type="radio"] {
    margin-top: 8px;
}

.dashboard-page {
    color: #626366;
    letter-spacing: 0.3px;
    margin-bottom: 50px;
    padding-bottom: 20px;
}

.dashboard-page .welcome-dashboard {
    text-align: center;
    margin-bottom: 40px;
    margin-top: 20px;
}

.dashboard-page .welcome-dashboard img {
    width: 40px;
}

.dashboard-page h3, .dashboard-page .nvk-table h3 {
    font-family: 'cocogooseregular';
    font-size: 16px;
    color: #626366;
}

.dashboard-page .roeler {
    height: 1px;
    background-color: #cedcde;
    margin: 50px 0;
}

.dashboard-page h2 {
    font-size: 18px;
    font-family: 'cocogooseregular';
    text-transform: uppercase;
    font-weight: 300;
    text-align: center;
    padding: 15px 0;
    background-color: #a5d2a5;
    color: white;
    letter-spacing: 1px;
    margin: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.dashboard-page .stats-block {
    background-color: white;
    border: 1px solid #cedcde;
    padding: 15px;
    text-align: center;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.dashboard-page .charts .stats-block {
    height: 220px;
    border-radius: 10px;
    text-align: left;
}

@media(max-width: 1200px) {
    .dashboard-page .charts .stats-block {
        height: 270px;
    }
}

@media(max-width: 768px) {
    .dashboard-page .stats-block {
        margin-bottom: 40px;
    }
}

.stats-block .grid {
  display: grid;
  display: -ms-grid;
  position: absolute;
  width: 78%;
  height: 104%;
  margin-right: 50%;
  margin-top: 50%;
  margin-bottom: 50%;
}

.stats-block .flex {
  font-size: 17px;
  text-align: center;
  line-height: 2em;
  padding-top: 0.3em;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.dashboard-page .charts .stats-block .stats-info {
    height: 100%;
}

.dashboard-page .charts .stats-block .stats-button {
    position: absolute;
    bottom: 10px;
}

@media(max-width: 768px) {
    .dashboard-page .charts .stats-block .stats-button {
        bottom: 35px;
    }
}

.btn-statistics {
    display: block;
    background-color: #93abb2;
    padding: 7px;
    border-radius: 7px;
    border: 1px solid #93abb2;
    color: #fff;
    text-align: center;
    width: 80%;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

@media(max-width: 768px) {
    .btn-statistics {
        width: 60%;
    }
}

.btn-statistics:hover, .btn-statistics:focus {
    text-decoration: none;
    box-shadow: none;
    color: #fff;
}

.btn-statistics .caret-button {
    padding-left: 10px;
}

.dashboard-page span.stat-result {
    font-weight: 600;
    font-size: 20px;
}

.dashboard-page span.stat-label {
    display: block;
    margin-bottom: 24px;
    color: darkgray;
}

.dashboard-page .padding-row {
    padding-top: 30px;
}

.dashboard-page .nvk-table th.orange-nvk {
  background-color: #F8AB53;
}

.dataTable {
    border: 1px solid #cedcde !important;
    border-radius: 10px;
}

.dataTable thead {
    color: #ffffff;
    background-color: #a5d2a5;
}

.dataTable thead th, .dataTable thead td {
  border-bottom: 0px solid #cedcde !important;
}

.dataTable thead th:first-of-type {
    border-top-left-radius: 10px;
}

.dataTable thead th:last-of-type {
    border-top-right-radius: 10px;
}

.subTableHead {
    border: 0px !important;
}

.subTableHead tr {
    background-color: transparent !important;
    border: 0px !important;
}

.subTableHead th {
    border: 0px !important;
}

.dataTable tbody tr:last-of-type td:first-of-type {
  border-bottom-left-radius: 10px;
}

.dataTable tbody tr:last-of-type td:last-of-type {
  border-bottom-right-radius: 10px;
}

.dataTable tbody tr td table {
    margin: -8px 0px;
    width: 100%;
}

.dataTable tbody tr td table tbody tr {
    background-color: transparent !important;
}

.dataTable tbody tr td {
    border-right: 1px solid #ddd;
}

.dataTable tr.odd {
  background-color: #F7F9F9 !important;
}

.dataTable tbody td {
  border-right: 1px solid #D9D9D9;
}

.dataTable td:last-of-type {
  border-right: 0;
}

.dataTable td a.icon-batch {
  background-image: url(../images/batch-icon.png);
  background-repeat: no-repeat;
  border: 0;
  width: 32px;
  height: 32px;
}

.dataTable td button.show-info-icon {
  background-image: url(../images/show-info.png);
  background-repeat: no-repeat;
  border: 0;
  width: 32px;
  height: 32px;
}

.dataTable .sorting_1 {
  background-color: transparent !important;
}

.dashboardBrandSelect {
    background-color: #626366;
    padding: 15px 0px;
    margin: 6rem 0 4rem;
}

.dashboardBrandSelect .brand-name {
    color: #ffffff;
    font-family: 'cocogooseregular';
    font-size: 16px;
    line-height: 32px;
}

.dashboardBrandSelect .brand-select {
  display: flex;
  justify-content: flex-end;
}

.dashBoardExport{
    margin-top: 30px;
}

.dashBoardExportBlok{
    border: 1px solid #ddd;
    margin: 0px;
    padding-bottom: 15px;
    border-radius: 10px;
    background-color: white;
}

.dashBoardBlokHeader {
    background-color: #a5d2a5;
    padding: 10px 15px;
    color: #ffffff;
    font-weight: bold;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    font-family: 'cocogooseregular';
    text-align: center;
}

.dataTableTextCentre{
    text-align: center;
}

.dataTables_paginate {
  margin-top: 2rem;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0.4em 0.8em !important;
    border: 1px solid #94ABB2 !important;
    background: #ffffff !important;
    border-radius: 7px !important;
    color: #94ABB2 !important;
    margin-left: 1rem !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: #94ABB2 !important;
    color: #ffffff !important;

}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    background: #F7F9F9 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    background: white !important;
}

.dashBoardExport {
  margin-bottom: 6rem;
}
.dashBoardExport .export-form {
  padding: 6rem 2rem 2rem;
}

.dashBoardExport .export-form {
  /*height: 1px;*/
  /*background-color: black;*/
}

.dashBoardExport .export-form .marginbottom-1 {
  margin-bottom: 0.5rem;
}

.dashBoardExport .export-form .min-margin {
  margin-left: 0;
  margin-right: 0;
}

.dashBoardExport .export-form select, .dashBoardExport .export-form input {
  margin-bottom: 2rem;
}

.dashboardExport .export-form .anonymised {
  margin-right: 1rem;
}

.dashBoardExport .export-form .btn.dashboard-export {
  background-color: #93abb2;
  margin-top: 1rem;
  margin-bottom: 0;
  padding: 10px 20px;
  border-radius: 7px;
  border: 1px solid #93abb2;
  color: #fff;
  text-align: center;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  font-weight: 700;
}

.dashBoardExport .export-form .btn.dashboard-export:hover,
.dashBoardExport .export-form .btn.dashboard-export:focus,
.dashBoardExport .export-form .btn.dashboard-export:active {
  box-shadow: none;
  background-color: #93abb2 !important;
}

.dashboard-page select {
  display: block;
  font-size: 14px;
  font-family: 'latoregular';
  color: #444;
  line-height: 1.3;
  padding: .6em 1.4em .5em .8em;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  border: 1px solid #95989A;
  border-radius: .5em;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'), linear-gradient(to bottom, #ffffff 0%,#ffffff 100%);
  background-repeat: no-repeat, repeat;
  background-position: right .7em top 50%, 0 0;
  background-size: .65em auto, 100%;
}

.dashboard-page select::-ms-expand {
  display: none;
}

.dashboard-page select:hover {
  border-color: #888;
}

.dashboard-page select:focus {
  border-color: #aaa;
  box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
  box-shadow: 0 0 0 3px -moz-mac-focusring;
  color: #222;
  outline: none;
}

.dashboard-page select option {
  font-weight:normal;
}

.export-form input.date {
  display: block;
  font-size: 14px;
  font-family: 'latoregular';
  color: #444;
  line-height: 1.3;
  padding: .6em 1.4em .5em .8em;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: 1px solid #95989A;
  border-radius: .5em;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
}

.dashboard-page select option {
  font-weight:normal;
}

.export-form button.ui-datepicker-trigger {
  display: none;
}

#ui-datepicker-div.ui-widget-content {
  background: white none 50% bottom repeat-x !important;
}

#ui-datepicker-div.ui-widget-content .ui-datepicker-header {
  background: white none 50% bottom repeat-x !important;
  border: none;
}

#ui-datepicker-div.ui-widget-content .ui-datepicker-calendar th {
  color: #A4AFB7;
}

#ui-datepicker-div.ui-widget-content .ui-state-default {
  background: white none 50% bottom repeat-x !important;
  color: #4D4F5C;
  border: none;
  font-weight: 500;
}
#ui-datepicker-div.ui-widget-content .ui-datepicker-title select {
  display: inline;
  font-size: 12px;
  font-family: 'latoregular';
  color: #444;
  line-height: 1.3;
  padding: .6em 1.4em .5em .8em;
  box-sizing: border-box;
  margin: 0;
  border: 1px solid #95989A;
  border-radius: .5em;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'), linear-gradient(to bottom, #ffffff 0%,#ffffff 100%);
  background-repeat: no-repeat, repeat;
  background-position: right .7em top 50%, 0 0;
  background-size: .65em auto, 100%;
}

#ui-datepicker-div.ui-widget-content .ui-datepicker-title select::-ms-expand {
  display: none;
}

#ui-datepicker-div.ui-widget-content .ui-datepicker-title select:hover {
  border-color: #888;
}

#ui-datepicker-div.ui-widget-content .ui-datepicker-title select:focus {
  border-color: #aaa;
  box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
  box-shadow: 0 0 0 3px -moz-mac-focusring;
  color: #222;
  outline: none;
}