/* basis scss imports -------- */
/* reset --------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

blockquote, q {
  list-style: none;
}

  .ck-content{
           height: 250px;
       }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  -webkit-tap-highlight-color: transparent;
}

*, *:before, *:after {
  box-sizing: border-box;
}

/* --------------------------- */
/* reset focus styles -------- */
*:focus {
  outline: none;
}

/* --------------------------- */
/* html reset ---------------- */
html {
  scroll-behavior: smooth;
  overflow: hidden;
  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
}

/* --------------------------- */
/* Set max width images ------ */
img {
  max-width: 100%;
  height: auto;
}

/* --------------------------- */
/* grid settings ------------- */
/* --------------------------- */
/* max width ----------------- */
/* --------------------------- */
/* media queries ------------- */
/* --------------------------- */
/* fonts --------------------- */
/* --------------------------- */
/* colors -------------------- */
/* --------------------------- */
/* css vars ------------------ */
:root {
  --yellow: #F2A900;
  --blue: #002855;
  --green: #F2A900;
}

/* --------------------------- */
/* fonts --------------------- */
body,
div,
table,
td,
li,
input,
select,
textarea,
p,
h4,
h5, form button[type="submit"] {
   font-family: 'Montserrat', sans-serif;
}

/* --------------------------- */
/* pseudo classes ------------ */

form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
form textarea,
form button[type="submit"] {
  background: none;
  border: none;
  margin: 0;
  padding: 0;
  width: auto;
  overflow: visible;
  text-align: left;
  border-radius: 0;
}

/* --------------------------- */
/* mixins -------------------- */
/* --------------------------- */
/* simple grid --------------- */
.row {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  padding: 0 20px;
  justify-content: flex-start;
}

table.dataTable.no-footer {
  border-bottom:none !important;
}

@media only screen and (min-width: 1300px) {
  .row {
    padding: 0;
  }
}

.row.s-left {
  justify-content: flex-start;
}

.row.s-center {
  justify-content: center;
}

.row.s-right {
  justify-content: flex-end;
}

.row.s-between {
  justify-content: space-between;
}

.row.s-evenly {
  justify-content: space-evenly;
}

@media only screen and (min-width: 640px) {
  .row.m-left {
    justify-content: flex-start;
  }
  .row.m-center {
    justify-content: center;
  }
  .row.m-right {
    justify-content: flex-end;
  }
  .row.m-between {
    justify-content: space-between;
  }
  .row.m-evenly {
    justify-content: space-evenly;
  }
}

@media only screen and (min-width: 1024px) {
  .row.l-left {
    justify-content: flex-start;
  }
  .row.l-center {
    justify-content: center;
  }
  .row.l-right {
    justify-content: flex-end;
  }
  .row.l-between {
    justify-content: space-between;
  }
  .row.l-evenly {
    justify-content: space-evenly;
  }
}

#errorbox{
  width:100%;
  display: inline-block;
  background: red;
  margin-bottom: 10px;
}

#errorbox ul{
  color:white;
  list-style: square;
  padding:10px;
  margin-top: 0;
}

#errorbox li{
  color:white;
  list-style: square;
  list-style-type: none;
  padding:0px !important;
}

#errorbox p{
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  margin-left: 15px;
  margin-top: 10px;
}


#meldingbox{
  width:100%;
  display: inline-block;
  background: green;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

#errorbox ul{
  meldingbox:white;
  list-style: square;
  padding:10px;
  margin-top: 0;
}

#meldingbox li{
  color:white;
  list-style: square;
  list-style-type: none;
  padding:0px !important;
}

#meldingbox p{
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  margin-left: 15px;
  margin-top: 10px;
  color:white;
}

.cols {
  padding: 0 10px;
  flex-grow: 0;
  flex-basis: 0;
  min-height: 1px;
}

.cols.s-1 {
  min-width: 8.33333%;
}

.cols.s-offset-1 {
  margin-left: 8.33333%;
}

.cols.s-2 {
  min-width: 16.66667%;
}

.cols.s-offset-2 {
  margin-left: 16.66667%;
}

.cols.s-3 {
  min-width: 25%;
}

.cols.s-offset-3 {
  margin-left: 25%;
}

.cols.s-4 {
  min-width: 33.33333%;
}

.cols.s-offset-4 {
  margin-left: 33.33333%;
}

.cols.s-5 {
  min-width: 41.66667%;
}

.cols.s-offset-5 {
  margin-left: 41.66667%;
}

.cols.s-6 {
  min-width: 50%;
}

.cols.s-offset-6 {
  margin-left: 50%;
}

.cols.s-7 {
  min-width: 58.33333%;
}

.cols.s-offset-7 {
  margin-left: 58.33333%;
}

.cols.s-8 {
  min-width: 66.66667%;
}

.cols.s-offset-8 {
  margin-left: 66.66667%;
}

.cols.s-9 {
  min-width: 75%;
}

.cols.s-offset-9 {
  margin-left: 75%;
}

.cols.s-10 {
  min-width: 83.33333%;
}

.cols.s-offset-10 {
  margin-left: 83.33333%;
}

.cols.s-11 {
  min-width: 91.66667%;
}

.cols.s-offset-11 {
  margin-left: 91.66667%;
}

.cols.s-12 {
  min-width: 100%;
}

.cols.s-offset-12 {
  margin-left: 100%;
}

@media only screen and (min-width: 640px) {
  .cols.m-1 {
    min-width: 8.33333%;
  }
  .cols.m-offset-1 {
    margin-left: 8.33333%;
  }
  .cols.m-2 {
    min-width: 16.66667%;
  }
  .cols.m-offset-2 {
    margin-left: 16.66667%;
  }
  .cols.m-3 {
    min-width: 25%;
  }
  .cols.m-offset-3 {
    margin-left: 25%;
  }
  .cols.m-4 {
    min-width: 33.33333%;
  }
  .cols.m-offset-4 {
    margin-left: 33.33333%;
  }
  .cols.m-5 {
    min-width: 41.66667%;
  }
  .cols.m-offset-5 {
    margin-left: 41.66667%;
  }
  .cols.m-6 {
    min-width: 50%;
  }
  .cols.m-offset-6 {
    margin-left: 50%;
  }
  .cols.m-7 {
    min-width: 58.33333%;
  }
  .cols.m-offset-7 {
    margin-left: 58.33333%;
  }
  .cols.m-8 {
    min-width: 66.66667%;
  }
  .cols.m-offset-8 {
    margin-left: 66.66667%;
  }
  .cols.m-9 {
    min-width: 75%;
  }
  .cols.m-offset-9 {
    margin-left: 75%;
  }
  .cols.m-10 {
    min-width: 83.33333%;
  }
  .cols.m-offset-10 {
    margin-left: 83.33333%;
  }
  .cols.m-11 {
    min-width: 91.66667%;
  }
  .cols.m-offset-11 {
    margin-left: 91.66667%;
  }
  .cols.m-12 {
    min-width: 100%;
  }
  .cols.m-offset-12 {
    margin-left: 100%;
  }
  .cols.m-offset-0 {
    margin-left: 0;
  }
}

@media only screen and (min-width: 1024px) {


  .cols.l-1 {
    min-width: 8.33333%;
  }
  .cols.l-offset-1 {
    margin-left: 8.33333%;
  }
  .cols.l-2 {
    min-width: 16.66667%;
  }
  .cols.l-offset-2 {
    margin-left: 16.66667%;
  }
  .cols.l-3 {
    min-width: 25%;
  }
  .cols.l-offset-3 {
    margin-left: 25%;
  }
  .cols.l-4 {
    min-width: 33.33333%;
  }
  .cols.l-offset-4 {
    margin-left: 33.33333%;
  }
  .cols.l-5 {
    min-width: 41.66667%;
  }
  .cols.l-offset-5 {
    margin-left: 41.66667%;
  }
  .cols.l-6 {
    min-width: 50%;
  }
  .cols.l-offset-6 {
    margin-left: 50%;
  }
  .cols.l-7 {
    min-width: 58.33333%;
  }
  .cols.l-offset-7 {
    margin-left: 58.33333%;
  }
  .cols.l-8 {
    min-width: 66.66667%;
  }
  .cols.l-offset-8 {
    margin-left: 66.66667%;
  }
  .cols.l-9 {
    min-width: 75%;
  }
  .cols.l-offset-9 {
    margin-left: 75%;
  }
  .cols.l-10 {
    min-width: 83.33333%;
  }
  .cols.l-offset-10 {
    margin-left: 83.33333%;
  }
  .cols.l-11 {
    min-width: 91.66667%;
  }
  .cols.l-offset-11 {
    margin-left: 91.66667%;
  }
  .cols.l-12 {
    min-width: 100%;
  }
  .cols.l-offset-12 {
    margin-left: 100%;
  }
  .cols.l-offset-0 {
    margin-left: 0;
  }
}

/* --------------------------- */
/* show/hide ----------------- */
.s-hide,
.hide {
  display: none !important;
}

@media only screen and (min-width: 640px) {
  .m-hide {
    display: none !important;
  }
  .m-show {
    display: initial !important;
  }
}

@media only screen and (min-width: 1024px) {
  .l-hide {
    display: none !important;
  }
  .l-show {
    display: initial !important;
  }
}

@media only screen and (min-width: 1300px) {
  .full-hide {
    display: none !important;
  }
  .full-show {
    display: initial !important;
  }
}

/* --------------------------- */
/* fonts ---------- */
@font-face {
  font-family: "Helvetica Neue LT Std";
  src: url("../fonts/HelveticaNeueLTStd-Bd.eot");
  src: url("../fonts/HelveticaNeueLTStd-Bd.eot?#iefix") format("embedded-opentype"), url("../fonts/HelveticaNeueLTStd-Bd.woff2") format("woff2"), url("../fonts/HelveticaNeueLTStd-Bd.woff") format("woff"), url("../fonts/HelveticaNeueLTStd-Bd.ttf") format("truetype"), url("../fonts/HelveticaNeueLTStd-Bd.svg#HelveticaNeueLTStd-Bd") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Helvetica Neue LT Std";
  src: url("../fonts/HelveticaNeueLTStd-Roman.eot");
  src: url("../fonts/HelveticaNeueLTStd-Roman.eot?#iefix") format("embedded-opentype"), url("../fonts/HelveticaNeueLTStd-Roman.woff2") format("woff2"), url("../fonts/HelveticaNeueLTStd-Roman.woff") format("woff"), url("../fonts/HelveticaNeueLTStd-Roman.ttf") format("truetype"), url("../fonts/HelveticaNeueLTStd-Roman.svg#HelveticaNeueLTStd-Roman") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat', sans-serif;
  src: url("../fonts/HelveticaNeueLT-Condensed.eot");
  src: url("../fonts/HelveticaNeueLT-Condensed.eot?#iefix") format("embedded-opentype"), url("../fonts/HelveticaNeueLT-Condensed.woff2") format("woff2"), url("../fonts/HelveticaNeueLT-Condensed.woff") format("woff"), url("../fonts/HelveticaNeueLT-Condensed.ttf") format("truetype"), url("../fonts/HelveticaNeueLT-Condensed.svg#HelveticaNeueLT-Condensed") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat', sans-serif;
  src: url("../fonts/HelveticaNeueLT-BoldCond.eot");
  src: url("../fonts/HelveticaNeueLT-BoldCond.eot?#iefix") format("embedded-opentype"), url("../fonts/HelveticaNeueLT-BoldCond.woff2") format("woff2"), url("../fonts/HelveticaNeueLT-BoldCond.woff") format("woff"), url("../fonts/HelveticaNeueLT-BoldCond.ttf") format("truetype"), url("../fonts/HelveticaNeueLT-BoldCond.svg#HelveticaNeueLT-BoldCond") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

/* basic typography ---------- */
body,
div,
table,
td,
li,
input,
select,
textarea,
p,
h4,
h5 {
  font-size: 14px;
  line-height: 1.36;
  font-weight: 400;
  color: #000;
}

h1,
h2 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1;
}

@media only screen and (min-width: 640px) {
  h1,
  h2 {
    font-size: 30px;
  }
}

@media only screen and (min-width: 1024px) {
  h1,
  h2 {
    font-size: 30px;
  }
}

h2 {
  font-size: 30px;
}

@media only screen and (min-width: 640px) {
  h2 {
    font-size: 40px;
  }
}

@media only screen and (min-width: 1024px) {
  h2 {
    font-size: 60px;
  }
}

h3 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 20px;
}

h4,
h5 {
  font-weight: 700;
  font-size: 26px;
  line-height: 1;
  margin: 0 0 20px;
  color: #000;
}

@media only screen and (min-width: 640px) {
  h4,
  h5 {
    font-size: 32px;
  }
}

@media only screen and (min-width: 1024px) {
  h4,
  h5 {
    font-size: 36px;
  }
}

h4,
h5,
h6 {
  font-size: 22px;
}

a {
  text-decoration: underline;
  color: #000;
  transition: color linear 0.2s;
}

a:hover {
  color: #000;
}

p + *,
ul + *,
ol + * {
  margin-top: 30px;
}

ul,
ol {
  margin-left: 5px;
  list-style: none;
}

ul li,
ol li {
  position: relative;
  padding-left: 35px;
}

ul li:before,
ol li:before {
  display: block;
  position: absolute;
  left: 0;
}

ol {
  counter-reset: section;
}

ol li:before {
  counter-increment: section;
  content: counter(section);
  top: 0;
}

strong {
  font-weight: 700;
}

/* --------------------------- */
form {
  display: block;
  position: relative;
  float: left;
  width: 100%;
}

form label {
  display: block;
  float: left;
  width: 100%;
  cursor: pointer;
  color: var(--grey_4);
  line-height: 1;
  padding-bottom: 15px;
}

form label.last {
  margin-bottom: 40px;
}

form label input[type="checkbox"],
form label input[type="radio"] {
  display: none;
}

form label input[type="checkbox"] + span,
form label input[type="radio"] + span {
  position: relative;
  display: block;
  float: left;
  width: 100%;
  padding-left: 30px;
}

form label input[type="checkbox"] + span:before,
form label input[type="radio"] + span:before {
  content: "";
  position: absolute;
  background-color: #fff;
  border: 1px solid var(--color_3);
}

form label input[type="checkbox"] + span:before {
  top: 2px;
  left: 1px;
  width: 18px;
  height: 18px;
  border-radius: 3px;
}

form label input[type="checkbox"]:checked + span:after {
  content: "\00d7";
  position: absolute;
  top: -4px;
  left: 2px;
  font-size: 29px;
  color: var(--color_3);
}

form label input[type="radio"] + span:before {
  top: 1px;
  left: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
}

form label input[type="radio"]:checked + span:after {
  content: "";
  position: absolute;
  top: 5px;
  left: 4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--color_3);
}

form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
form textarea {
  display: block;
  background-color: #fff;
  float: left;
  width: 100%;
  padding: 10px 30px;
  border-radius: 10px;
  margin-bottom: 20px;
  font-size: 14px;
  color: var(--yellow);
  /* disable autofill bg */
}

form input:not([type="file"]):not([type="checkbox"]):not([type="radio"])::placeholder,
form textarea::placeholder {
  color: #8b8b8b;
  transition: none;
}

form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):focus::placeholder,
form textarea:focus::placeholder {
  transition: color linear 0.2s;
}

form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):-webkit-autofill, form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):-webkit-autofill:hover, form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):-webkit-autofill:focus, form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):-webkit-autofill:active,
form textarea:-webkit-autofill,
form textarea:-webkit-autofill:hover,
form textarea:-webkit-autofill:focus,
form textarea:-webkit-autofill:active {
  box-shadow: rem-calc(0 0 0 40) #fff inset !important;
}

form input[type="file"] {
  max-width: 100%;
}

form textarea {
  height: 100px;
  resize: none;
}

form button[type="submit"] {
  display: block;
  position: relative;
  float: left;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  color: var(--grey_4);
  border: 1px solid var(--grey_4);
  min-height: 50px;
  padding: 11px 50px 13px;
  overflow: hidden;
  transition: all linear 0.2s;
  float: right;
}



html:not(.touch) form button[type="submit"]:hover {
  color: #fff;
  background-color: #F2A900;
}

html:not(.touch) form button[type="submit"]:hover:after {
  right: 0;
  opacity: 0;
}

/* --------------------------- */
/* site modules styling ------ */
.inlog {
  position: relative;
  background-color: #c0cfe2;
  background-image: url("../img/assets/limburgsport-bg.png");
  background-position: 50% 30%;
  background-repeat: no-repeat;
  height: 100vh;
}

.inlog .row,
.inlog .cols {
  height: 100%;
}

.inlog .loginblock {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.inlog .logintitel {
  text-align: center;
}

.inlog .logintitel h1 {
  color: var(--blue);
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 44px;
  white-space: nowrap;
}

.inlog .logintitel h1 span {
  font-weight: bold;
}

.inlog .loginform {
  background-color: var(--blue);
  padding: 50px 30px 50px 30px;
  border-radius: 10px;
  margin-top: 60px;
}

.inlog .loginform .alert {
  background-color: var(--green);
  padding: 10px;
  color: #fff;
}

.inlog .loginform .alert .close {
  margin-right: 10px;
}

.inlog .loginform form,
.inlog .loginform input {
  float: none !important;
}

.inlog .loginform label {
  display: none;
}

::-webkit-input-placeholder {text-transform:none !important;font-size:15px !important;color: #8b8b8b !important;}

.inlog .loginform form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.inlog .loginform form textarea {
  border-radius: 0;
  color: #000;
  font-size: 16px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 275;
  padding-left: 10px;
  text-transform: none;
}

.inlog .loginform .controls {
  margin-top: 30px;
}

.inlog .loginform .btn {
  display: block;
  font-family: 'Montserrat', sans-serif;
  background-color: #fff;
  color: #000;
  float: none;
  margin: 0 auto;
  padding: 5px 30px;
  font-size: 18px;
  border-radius: 10px;
  min-height: 40px;
  margin-top: 20px;
  border: 0;
}

.inlog .loginform .options.group {
  text-align: center;
  margin: 10px 0;
  margin-top: 40px;
}

.inlog .loginform .options.group a {
  font-family: 'Montserrat', sans-serif;
  font-weight:700;
  color: #002855;
  border-radius: 10px;
  padding: 10px;
  text-decoration: none;
  background-color: var(--green);
}

.inlog .loginform .wachtwoordbtn {
  background-color: var(--yellow);
  font-size: 16px;
}

.inlog .loginform form input::-webkit-input-placeholder {
  font-family: 'Montserrat', sans-serif;
  color: #000 !important;
  text-transform: uppercase;
  font-size: 22px;
}

.inlog .loginform form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):focus,
.inlog .loginform form textarea:focus {
  padding-bottom: 10px;
}

@media only screen and (max-width: 575px) {
  .inlog .logintitel h1 {
    font-size: 22px;
  }
  .inlog .loginform {
    margin-top: 30px;
  }
  .inlog .loginform form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
  .inlog .loginform .inlog .loginform form textarea {
    font-size: 18px;
  }
  .inlog .loginform form input::-webkit-input-placeholder {
    font-size: 18px;
  }
  .inlog .loginform .btn {
    font-size: 18px;
  }
}

.hoofdmenuouter {
  display: unset;
}

.hoofdmenu {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  background-color: var(--blue);
}

.hoofdmenu .logocontainer {
  text-align: center;
  min-height: 240px;
}

.hoofdmenu .logocontainer .logo {
  max-width: 154px;
  margin: 30px 0;
}

.hoofdmenu .menu {
  padding: 20px 0 20px 50px;
  padding-top:0;
}

.hoofdmenu .menu .menutitel {
  font-family: 'Montserrat', sans-serif;
  color: var(--yellow);
  text-transform: uppercase;
  font-weight: 600;
  font-size: 22px;
}

.hoofdmenu .menu .menuinner {
  padding: 0;
}

.hoofdmenu .menu .menuinner li {
  padding: 0 0 20px 35px;
}

.hoofdmenu .menu .menuinner li a {
  display: block;
  position: relative;
  font-family: 'Montserrat', sans-serif;
  font-weight:800;
  font-size: 18px;
  color: #fff;
  text-decoration: none;
  transition: all 0.5s ease;
}

.hoofdmenu .menu .menuinner li a.icon::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: -40px;
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
}

.hoofdmenu .menu .menuinner li a.leden::before {
  background-image: url("../img/icons/icon_leden.svg");
}

.hoofdmenu .menu .menuinner li a.categorieen::before {
  background-image: url("../img/icons/icon_groepsleden.svg");
}

.hoofdmenu .menu .menuinner li a.statussen::before {
  background-image: url("../img/icons/status.svg");
}


.hoofdmenu .menu .menuinner li a.user::before {
  background-image: url("../img/icons/user.svg");
}

.hoofdmenu .menu .menuinner li a.agenda::before {
  background-image: url("../img/icons/agenda.svg");
}

.hoofdmenu .menu .menuinner li a.document::before {
  background-image: url("../img/icons/documenten.svg");
}

.hoofdmenu .menu .menuinner li a.commisie::before {
  background-image: url("../img/icons/commissies.svg");
}

.hoofdmenu .menu .menuinner li a.albums::before {
  background-image: url("../img/icons/albums.svg");
}

.hoofdmenu .menu .menuinner li a.loguit::before {
  background-image: url("../img/icons/loguit.svg");
}

.hoofdmenu .menu .menuinner li a.email::before {
  background-image: url("../img/icons/email-icon.svg");
}

.hoofdmenu .menu .menuinner li a.meetings::before {
  background-image: url("../img/icons/meetings-icon.svg");
}

.hoofdmenu .menu .menuinner li a:hover {
  margin-left: 5px;
  color:#F2A900;
}

.hoofdmenu .gebruiker {
  display: flex;
  align-items: center;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  background-color: var(--yellow);
  padding: 30px 0 30px 50px;
}

.hoofdmenu .gebruiker .gebruikerimg {
  width: 45px;
  height: 45px;
  border-radius: 100%;
  margin-bottom: -3px;
  margin-right: 15px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.hoofdmenu .gebruiker p {
  align-self: flex-end;
  position: relative;
  font-family: 'Montserrat', sans-serif;
  color: var(--blue);
  font-size: 16px;
  top: 50%;
  transform: translateY(-50%);
}

.hoofdmenu .gebruiker p a {
  text-decoration: none;
}

.mobileBtn {
  display: none;
  position: fixed;
  left: 0;
  top: 200px;
  z-index: 99;
}

.mobileBtn::after {
  content: "\f0c9";
  font-weight: 900;
  line-height: 40px;
  font-size: 20px;
  font-family: "Font Awesome 5 Free";
  color: #fff;
  display: block;
  width: 50px;
  height: 40px;
  background-color: var(--blue);
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  text-align: center;
}

.mobileBtn.openMenu.hide {
  display: none;
}

.mobileBtn.closeMenu {
  top: 20px;
  left: auto;
  right: 10px;
}

.mobileBtn.closeMenu::after {
  content: "\f00d";
}


@media only screen and (max-width: 1024px) {
 .hidesmall{
    display:none !important;
  }
}



@media only screen and (max-width: 1200px) {
  .mobileBtn {
    display: block;
  }
}

.header {
  position: sticky;
  top: 0;
  width: 100%;
  height: 230px;
  background: #F2A900;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  z-index: 10;
}

.header .row,
.header .row .cols {
  height: 100%;
}

.header .titel {
  height: 100%;
}

.header .titel h1 {
  font-family: 'Montserrat', sans-serif;
  font-weight: normal;
  color: var(--blue);
  font-size: 50px;
  text-transform: uppercase;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.header .titel h1 span {
  font-weight: bold;
}

.header .datum {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.header .datum p {
  font-family: 'Montserrat', sans-serif;
  color: var(--blue);
  font-weight: bold;
  font-size: 20px;
}

@media only screen and (max-width: 640px) {
  .header .row,
  .header .row .cols {
    height: auto;
  }
  .header .titel {
    margin-top: 30px;
  }
  .header .titel h1 {
    font-size: 30px;
  }
  .header .datum {
    margin-top: 20px;
  }
}

.dashboard .blok {
  margin-bottom: 80px;
}

.dashboard .blok.kalenderouter {
  overflow: hidden;
}

.dashboard .titel {
  position: relative;
  background-color: #F5F5F2;
  padding: 30px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
}

.dashboard .titel p {
  font-family: 'Montserrat', sans-serif;
  font-weight: bold;
  font-size: 20px;
}

.dashboard .dataslide {
  border: 0.5px solid rgba(175, 175, 175, 0.3);
  position: relative;
  height: 235px;
}

.dashboard .datablok {
  border: 0.5px solid rgba(175, 175, 175, 0.3);
  position: relative;
}

.dashboard .datablok.kalenderblok {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.dashboard .data {
  position: relative;
  padding: 30px;
  height: 100%;
}

.dashboard .data::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 90%;
  height: 0.5px;
  background-color: rgba(175, 175, 175, 0.3);
  left: 50%;
  transform: translate(-50%, 0);
}

.dashboard .data a {
  text-decoration: none;
}

.dashboard .data .datainner {
  display: flex;
  align-items: center;
}

.dashboard .data .image {
  width: 45px;
  height: 45px;
  border-radius: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.dashboard .data .datatext {
  margin-left: 20px;
}

.dashboard .data .datatext p {
  font-size: 14px;
  line-height: 18px;
  max-width: 283px;
}

.dashboard .data .datatext span {
  font-weight: bold;
  display: block;
}

.dashboard .data .datatext h3 {
  font-family: 'Montserrat', sans-serif;
  color: var(--blue);
  font-size: 20px;
  margin: 0;
}

.dashboard .data .datatext .intro {
  margin: 10px 0;
}

.dashboard .data .datatext .link a {
  font-size: 15px;
  font-style: italic;
  text-decoration: underline;
}

.dashboard .slidebtn {
  display: block;
  background-color: #F2A900;
  padding: 20px 30px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  cursor: pointer;
}

.dashboard .slidebtn p {
  font-size: 15px;
  line-height: 15px;
  color: #fff;
  font-weight: bold;
}

.dashboard .slidebtn p::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 15px;
}

.dashboard .slidebtn.nextslide p::before {
  content: "\f078";
}

.dashboard .slidebtn.nextslide {
  position: absolute;
  bottom: -57px;
  width: 100%;
}

.dashboard .slidebtn.nextslide p {
  transition: all 0.2s ease;
}

.dashboard .slidebtn.nextslide:hover p {
  margin-bottom: -2px;
}

.dashboard .slidebtn.prevslide {
  position: absolute;
  bottom: -57px;
  width: 100%;
}

.dashboard .slidebtn.prevslide p {
  transition: all 0.2s ease;
}

.dashboard .slidebtn.prevslide:hover p {
  margin-bottom: 2px;
}

.dashboard .slidebtn.prevslide p::before {
  content: "\f077";
}

.dashboard .nextbtn {
  display: block;
  background-color: #F2A900;
  padding: 20px 30px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  cursor: pointer;
}

.dashboard .nextbtn a {
  font-size: 15px;
  line-height: 15px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  transition: all 0.5s ease;
}

.dashboard .nextbtn a::before {
  content: "\f054";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 15px;
}

.dashboard .nextbtn:hover a {
  margin-left: 5px;
}

@media only screen and (max-width: 575px) {
  .dashboard .kalenderouter {
    display: none;
  }
}

.kalendercontainer .calendar {
  overflow: revert;
}

.kalendercontainer .calendar .event-container {
  background: #F2A900;
}

.kalendercontainer .calendar .event-container .event-wrapper {
  padding-right: 20px;
}

.kalendercontainer .calendar .event-container .event {
  background-color: #fff;
}

.kalendercontainer .calendar .event-container .event .event-hour {
  text-transform: lowercase;
}

.kalendercontainer .calendar .event-container .event .event-date {
  text-transform: lowercase;
}

.kalendercontainer .calendar .event-container .event .event-link {
  margin: 10px 0;
  font-style: italic;
  text-decoration: underline;
}

.kalendercontainer .calendar .event-container .event .event-link a {
  display: block;
  text-transform: lowercase;
}

.kalendercontainer .calendar .event-container .event .event-link a::first-letter {
  text-transform: uppercase;
}

.kalendercontainer .calendar .event-container .event .event-remove {
  padding: 20px 0 0 0;
  border-top: 1px solid #afafaf;
}

.kalendercontainer .calendar .event-container .event .event-remove a {
  display: block;
  color: #dc3232;
  text-transform: lowercase;
}

.kalendercontainer .calendar .event-container .event .event-remove a::first-letter {
  text-transform: uppercase;
}

.kalendercontainer .calendar .event-container .event .event-remove a::before {
  content: "";
  display: inline-block;
  margin-right: 10px;
  width: 10px;
  height: 10px;
  background-color: #dc3232;
  border-radius: 100%;
}

.kalendercontainer .calendar .filler {
  background-color: #F2A900;
}

.kalendercontainer .calendar .day.today {
  background: var(--blue);
  color: #fff;
  font-weight: bold;
}

.kalendercontainer .calendar .day.has-event:after {
  background: var(--yellow);
}

.kalendercontainer .calendar .day:hover {
  border: 2px solid var(--yellow);
}

.kalendercontainer .calendar thead td {
  font-weight: bold;
}

.kalendercontainer .calendar tbody tr:nth-child(even) {
  background-color: #F5F5F2;
}

.kalendercontainer .calendar header {
  position: absolute;
  width: 100%;
  top: -80px;
}

.kalendercontainer .calendar header .month {
  display: flex;
  justify-content: center;
  align-items: baseline;
  color: #000;
  font-size: 24px;
}

.kalendercontainer .calendar header .month .year {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 24px;
  margin-left: 10px;
  color: #000000;
}

.kalendercontainer .calendar header .btn-next {
  right: 30px;
}

.kalendercontainer .calendar header .btn-prev {
  right: 90px;
  left: auto;
}

.kalendercontainer .calendar header .simple-calendar-btn {
  color: #000000;
  border-color: #000000;
}

.kalendercontainer .calendar header .simple-calendar-btn:hover {
  background-color: #000000;
}

.tabellen .usebalk .cols {
  position: relative;
}

.tabellen .usebalk .toevoegtext {
  display: inline-block;
  margin-right: 20px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.tabellen .usebalk .toevoegtext a {
  display: inline-block;
  color: #afafaf;
  text-decoration: none;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
}

.tabellen .usebalk .toevoegtext a::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../img/icons/documenten-grey.svg");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 10px;
  margin-bottom: -3px;
}

.tabellen .usebalk .toevoegtext.maptext a::before {
  background-image: url("../img/icons/documenten-map.svg");
}

.tabellen .usebalk .toevoegtext.meetingtext a::before {
  background-image: url("../img/icons/meetings-icon-grey.svg");
}

.tabellen .usebalk .toevoegtext.commtext a::before {
  background-image: url("../img/icons/commissies-grey.svg");
}

.tabellen .usebalk .toevoegtext.cattext a::before {
  background-image: url("../img/icons/icon_groepsleden_grey.svg");
}

.tabellen .usebalk .toevoegtext.usertext a::before {
  background-image: url("../img/icons/user-grey.svg");
}


.tabellen .usebalk .toevoegtext.ledentext a::before {
  background-image: url("../img/icons/icon_leden_grey.svg");
}

.tabellen .usebalk .toevoegtext.agendatext a::before {
  background-image: url("../img/icons/agenda-grey.svg");
}

.tabellen .usebalk form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.tabellen .usebalk form textarea {
  font-family: 'Montserrat', sans-serif;
  color: #afafaf;
  font-size: 15px;
  border: 1px solid #afafaf;
  border-radius: 0;
  padding: 10px 40px 10px 20px;
  margin-bottom: 0;
}

.tabellen .usebalk form input:not([type="file"]):not([type="checkbox"]):not([type="radio"])::placeholder,
.tabellen .usebalk form textarea::placeholder {
  color: #afafaf;
}

.tabellen .usebalk .tabelzoek {
  position: relative;
}

.tabellen .usebalk .tabelzoek::after {
  content: "";
  display: block;
  position: absolute;
  top: 13px;
  right: 20px;
  width: 15px;
  height: 15px;
  background-image: url("../img/icons/search.svg");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.select-form-balk h3 {
  margin-bottom: 16px;
}

.select-form-balk form button[type="submit"] {
  background: #F2A900;
  color: #ffffff;
  font-size: 15px;
  font-family: 'Montserrat', sans-serif;
  width: 100%;
}

.select-form-balk select {    
  font-family: 'Montserrat', sans-serif;
  color: #afafaf;
  font-size: 15px;
  border: 1px solid #afafaf;
  border-radius: 0;
  padding: 13px 40px 13px 20px;
  margin-bottom: 0;
  width: 100%;
}

.select-form-balk form button[type="submit"], .select-form-balk select {
  margin-bottom: 16px;
}

.tabellen .tabelblok {
  margin: 30px 0;
}

.tabellen .tabelblok .tabelcol {
  background-color: #F2A900;
  text-align: center;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
}

.tabellen .tabelblok .tabelcol h2 {
  font-family: 'Montserrat', sans-serif;
  color: #fff;
  font-size: 18px;
  padding: 15px 0;
  text-transform: uppercase;
}

.tabellen .tabelblok .tabeltop .tabeltitel .cols {
  background-color: #F5F5F2;
}

.tabellen .tabelblok .tabeltop .tabeltitel .cols h3 {
  color: var(--blue);
  font-size: 20px;
  font-family: 'Montserrat', sans-serif;
  text-align: center;
  margin: 30px 0;
  text-transform: uppercase;
}

.tabellen .tabelblok .tabeltop .tabeltitel .cols.leftalign h3 {
  text-align: left;
}

.tabellen .tabelblok .tabeltop .tabelrow .row .cols {
  padding-top: 30px;
  padding-bottom: 30px;
  position: relative;
}

.tabellen .tabelblok .tabeltop .tabelrow:nth-child(even) .cols {
  background-color: #F5F5F2;
}

.tabellen .tabelblok .tabeltop .tabelrow a {
  display: inline-block;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 18px;
  text-decoration: none;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.tabellen .tabelblok .tabeltop .tabelrow .meerlink {
  font-family: "Helvetica Neue LT Std";
  font-weight: normal;
  font-style: italic;
  text-decoration: underline;
  font-size: 16px;
  top: auto;
  transform: none;
}

.tabellen .tabelblok .tabeltop .tabelrow p {
  text-align: center;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.tabellen .tabelblok .tabeltop .tabelrow p a {
  top: 0;
  transform: none;
  font-size: 16px;
}

.tabellen .tabelblok .tabeltop .tabelrow p span {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 18px;
}

.tabellen .tabelblok .tabeltop .tabelrow .leftalign p {
  text-align: left;
}

.tabellen .tabelblok .tabeltop .tabelrow .documenticon {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.tabellen .tabelblok .tabeltop .tabelrow .documenticon::before {
  content: "";
  display: block;
  height: 40px;
  width: 40px;
  background-image: url("../img/icons/documenten-blue.svg");
  background-size: 50%;
  background-position: center;
  background-repeat: no-repeat;
  border: 2px solid var(--yellow);
  border-radius: 100%;
  margin: 0 auto;
}

.tabellen .tabelblok .tabeltop .tabelrow .documenticon.mapicon::before {
  background-image: url("../img/icons/documenten-map-blue.svg");
}

.tabellen .tabelblok .tabeltop .tabelrow .documenticon.commicon::before {
  background-image: url("../img/icons/commissies-blue.svg");
}

.tabellen .tabelblok .tabeltop .tabelrow .documenticon.usericon::before {
  background-image: url("../img/icons/user-blue.svg");
  background-size: 30%;
}

.tabellen .tabelblok .tabeltop .tabelrow .tabelbtn {
  text-align: center;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.tabellen .tabelblok .tabeltop .tabelrow .tabelbtn a {
  margin: 0 2px;
  transform: none;
  top: auto;
}

.vervolgtabel .blok {
  margin-bottom: 30px;
}

.vervolgtabel .titel {
  position: relative;
  background-color: #F5F5F2;
  padding: 30px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
}

.vervolgtabel .titel p {
  font-family: 'Montserrat', sans-serif;
  font-weight: bold;
  font-size: 20px;
}

.vervolgtabel .datablok {
  border: 0.5px solid rgba(175, 175, 175, 0.3);
  position: relative;
}

.vervolgtabel .datablok.lidblok {
  padding: 30px;
}

.vervolgtabel .datablok.agendablok {
  padding: 30px;
}

.vervolgtabel .datablok.agendablok ul li {
  margin: 5px 0;
  padding-left: 30px;
}

.vervolgtabel .datablok.agendablok ul li::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../img/icons/user-blue.svg");
  background-position: center;
  background-repeat: no-repeat;
  margin-top: -2px;
}

.vervolgtabel .datablok .info h3 {
  font-family: 'Montserrat', sans-serif;
  color: #000;
  margin-bottom: 20px;
}

.vervolgtabel .tabelfoto {
  padding-right: 20px;
}

.vervolgtabel .tabelfoto img {
  border-radius: 10px;
  margin-right: 20px;
}

.vervolgtabel .infotabel table {
  width: 100%;
}

.vervolgtabel .infotabel table td {
  padding: 5px 0;
}

.vervolgtabel .infotabel p {
  padding-right: 10px;
}

.vervolgtabel .nextbtn {
  display: block;
  background-color: #F2A900;
  padding: 20px 30px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  cursor: pointer;
}

.vervolgtabel .nextbtn a {
  font-size: 15px;
  line-height: 15px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  transition: all 0.5s ease;
}

.vervolgtabel .nextbtn a::before {
  content: "\f053";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 15px;
}

.vervolgtabel .nextbtn:hover a {
  margin-left: -5px;
}

.vervolgtabel .aanwezigbtn {
  display: block;
  background-color: #F2A900;
  padding: 20px 30px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  cursor: pointer;
}

.vervolgtabel .aanwezigbtn a,
.vervolgtabel .aanwezigbtn button {
  font-size: 15px;
  line-height: 15px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  transition: all 0.5s ease;
  float: none;
  padding: 0;
  min-height: auto;
}

.vervolgtabel .aanwezigbtn a::before,
.vervolgtabel .aanwezigbtn button::before {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 15px;
}

.vervolgtabel .aanwezigbtn:hover a,
.vervolgtabel .aanwezigbtn:hover button {
  margin-left: -5px;
}

.vervolgtabel .afwezigbtn {
  display: block;
  background-color: #F2A900;
  padding: 20px 30px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  cursor: pointer;
}

.vervolgtabel .afwezigbtn a,
.vervolgtabel .afwezigbtn button {
  font-size: 15px;
  line-height: 15px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  transition: all 0.5s ease;
  float: none;
  padding: 0;
  min-height: auto;
}

.vervolgtabel .afwezigbtn a::before,
.vervolgtabel .afwezigbtn button::before {
  content: "\f00d";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 15px;
}

.vervolgtabel .afwezigbtn:hover a,
.vervolgtabel .afwezigbtn:hover button {
  margin-left: -5px;
}

.edittabel .datablok {
  background-color: #F5F5F2;
}

.edittabel .tabelfoto img {
  margin-bottom: 20px;
}

.edittabel .tabelfoto button {
  margin-top: 20px;
  color: var(--blue);
  border-color: var(--blue);
  cursor: pointer;
}

.edittabel table td {
  margin-bottom: 10px;
  vertical-align: middle;
}

.edittabel form input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.edittabel form textarea {
  margin-bottom: 0 !important;
  padding: 10px 20px;
  color: #000;
  float: none !important;
}

.edittabel form input:not([type="file"]):not([type="checkbox"]):not([type="radio"])::placeholder,
.edittabel form textarea::placeholder {
  color: #000;
}

.edittabel form label {
  display: inline-block;
  width: auto;
  float: none;
}

.edittabel form input[type="submit"] {
  background-color: var(--yellow) !important;
  display: inline-block !important;
  width: 300px !important;
  text-align: center !important;
  float: none !important;
  margin-top: 20px !important;
  font-family: 'Montserrat', sans-serif;
  font-weight: bold;
}

.edittabel .formulier_rij_info {
  font-weight: bold;
}

.edittabel .formulier_rij_input em {
  font-size: 14px;
  font-style: italic;
}

.edittabel .formulier_rij input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.edittabel .formulier_rij textarea {
  margin-bottom: 20px !important;
  margin-top: 20px !important;
}

@media only screen and (max-width: 1025px) {
  .info,
  .infotabel {
    margin: 20px 0;
  }
  .toevoegtext {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 575px) {
  .tabellen .tabelblok .tabeltop .tabeltitel .cols h3 {
    font-size: 14px;
  }
  .tabellen .tabelblok .tabeltop .tabelrow a,
  .tabellen .tabelblok .tabeltop .tabelrow .leftalign p,
  .tabellen .tabelblok .tabeltop .tabelrow p span,
  .tabellen .tabelblok .tabeltop .tabelrow p {
    font-size: 14px;
  }
  .tabellen .tabelblok .tabeltop .tabelrow p span {
    word-break: break-word;
  }
  .tabellen .tabelblok .tabeltop .tabelrow p a {
    font-size: 14px;
  }
  .edittabel .infotabel td,
  .vervolgtabel .infotabel td {
    display: block;
  }
  .edittabel .infotabel input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
  .vervolgtabel .infotabel input:not([type="file"]):not([type="checkbox"]):not([type="radio"]) {
    margin-bottom: 20px !important;
  }
  .hidetabel {
    display: none;
  }
}

.noSort {
  background-image: none !important;
  cursor: default !important;
}

a.tabel {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.example_length {
  background-color: #ffffff;
  background: #ffffff;
}

.dataTables_empty {
  font-size: 16px !important;
  padding: 40px !important;
}

table.dataTable tbody th, table.dataTable tbody td {
  padding: 0px 10px;
}

#datatables_button_info {
  z-index: -1 !important;
  position: absolute;
  top: 0;
  left: 0;
  background: #ffffff;
}

.dt-button-info {
  z-index: -1 !important;
  position: absolute;
  top: 0;
  left: 0;
  background: #ffffff;
  left: 50%;
  margin-left: -10%;
  margin-top: 5%;
}

#example_paginate {
  padding-top: 0 !important;
  margin-top: -20px !important;
  margin-bottom: 10px !important;
}

select {
  background-color: #ffffff;
  background: #ffffff;
  border: none;
  border-radius: 5px;
  padding: 5px 20px;
}

.dt-button {
  background-color: #ffffff;
  background: #ffffff;
  border: none;
  padding: 10px 20px;
  text-transform: uppercase;
  color: var(--blue);
  font-family: 'Montserrat', sans-serif;
  cursor: pointer;
}

.dt-buttons {
  margin-right: 20px;
  padding-bottom: 20px;
}

.dt-button:hover {
  text-decoration: underline;
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
  background-color: #ffffff;
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.even {
  background-color: #F5F5F2;
}

table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
  background-color: #ffffff;
}

table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
  background-color: #F5F5F2;
}

.tabellen .tabelblok .tabeltop .tabeltitel .cols {
  background-color: #F5F5F2;
}

.dataTables_filter {
  display: none;
}

#example_wrapper {
  margin-top: -5px;
  background-color: #F2A900;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

table.dataTable.compact thead th, table.dataTable.compact thead td {
  padding: 4px 5px;
  vertical-align: middle !important;
  background: var(--blue) !important;
  background-color: var(--blue) !important;
  color: #ffffff;
  border: none;
}

table.dataTable tbody th, table.dataTable tbody td {
  font-size: 12px;
}

table.dataTable.compact tbody a {
  font-size: 12px;
}

table.dataTable.compact tbody td a {
  font-size: 12px !important;
}

#example_info {
  color: #ffffff !important;
  margin-top: -9px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  color: white !important;
  background: var(--blue) !important;
  background-color: var(--blue) !important;

}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  color: var(--blue) !important;
  background: #ffffff !important;
  background-color: white;
  background-color: #ffffff !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {
  outline: none;
  background-color: #2b2b2b;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c));
  background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
  background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
  background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
  background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
  background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%);
  box-shadow: none;
}

.dataTables_info {
  padding-top: 0 !important;
  padding-left: 15px  !important;
}

.dataTables_length {
  color: #ffffff !important;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  padding-left: 20px;
  padding-bottom: 10px;
}

.dt-buttons {
  float: right;
}

table.dataTable.compact thead th, table.dataTable.compact thead td {
  padding: 4px 5px;
  vertical-align: middle !important;
}

table.dataTable.compact tbody td {
  padding: 4px 5px;
  vertical-align: middle !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
  color: #ffffff !important;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
}

.dataTables_info {
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  color: var(--blue) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  color: #ffffff !important;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
    border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  color: white !important;
    border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  background: var(--blue) !important;
  background-color: var(--blue) !important;
}

.current:hover {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  color: var(--blue) !important;
  border: none;
  background: #ffffff !important;
  background-color: #ffffff !important;
}

.ellipsis {
  color: white !important;
}

table.dataTable thead th, table.dataTable thead td {
  padding: 25px 18px;
  border-bottom: none;
  background-color: #F5F5F2;
}

.paginate_button.disabled {
  background: none !important;
  background-color: none !important;
}

.next:hover {
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

.sorting {
  text-align: left;
}

.sorting_asc {
  text-align: left;
}

.sorting_desc {
  text-align: left;
}

/* --------------------------- */
/* generic styles ------------ */
html.noscroll {
  overflow-y: hidden;
}

body {
  transition: all ease 0.3s 0.7s;
  opacity: 1 !important;
  transform: none !important;
  background: #fff;
}

.mainflex {
  display: flex;
  flex-direction: row;
}

.leftcol,
.rightcol {
  position: relative;
  flex: 1;
}

.leftcol {
  background-color: var(--blue);
}

.leftcol.open {
  display: block;
  position: absolute;
  width: 100%;
  top: 0;
  z-index: 99;
}

.rightcol {
  flex-grow: 5;
}

.flexholder {
  display: block;
  display: flex;
  flex-direction: column;

}

main {
  position: relative;
  flex: 1 1 0;
  width: 100%;
  margin: 0 auto;
  background-color: #fff;
  padding-top:0 !important;
}

.maininner {
  padding-top: 40px;
}

@media only screen and (max-width: 1199px) {
  .leftcol {
    display: none;
  }
}

/* --------------------------- */