@charset "UTF-8";
/* @include gradientBackground($gradientColor1,$gradientColor2);*/
/*===========================================================================================
--------------------------------------GG STYLING-------------------------------------
===========================================================================================*/
@font-face {
  font-family: 'BellMT', serif;
  src: url("../fonts/BellMT.eot?#iefix") format("embedded-opentype"), url("../fonts/BellMT.woff") format("woff"), url("../fonts/BellMT.ttf") format("truetype"), url("../fonts/BellMT.svg#BellMT") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'BellMTBold', serif;
  src: url("../fonts/BellMTBold.eot?#iefix") format("embedded-opentype"), url("../fonts/BellMTBold.woff") format("woff"), url("../fonts/BellMTBold.ttf") format("truetype"), url("../fonts/BellMTBold.svg#BellMTBold") format("svg");
  font-weight: normal;
  font-style: normal; }
/*===========================================================================================
----------------------------------Helperclasses--------------------------------------------
===========================================================================================*/
.fullWidth {
  width: 100%;
  display: inline-block; }

.fullWidthNoPadding {
  width: calc(100% + 30px);
  margin-left: -15px; }

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

.text-right {
  text-align: right; }

.uppercase {
  text-transform: uppercase; }

/*===========================================================================================
-----------------------------------FONT-STYLING----------------------------------
===========================================================================================*/
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: "BellMT", serif;
  font-size: 18px; }

img {
  display: inline-block;
  max-width: 100%; }

::-moz-selection {
  /* Code for Firefox */
  color: #fff;
  background: #cf3a48; }

::selection {
  color: #fff;
  background: #cf3a48; }

p, blockquote, strong, span {
  font-family: "BellMT", serif;
  margin-bottom: 1rem;
  font-size: 1rem;
  line-height: 1.45rem;
  font-weight: 400; }
  p.large, blockquote.large, strong.large, span.large {
    font-size: 1.5rem;
    line-height: 2.75rem; }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  font-family: "Saira Condensed", sans-serif;
  color: #282828;
  margin-bottom: 1rem;
  display: inline-block;
  font-weight: 700; }
  h1 blockquote, h1 strong, h1 span, h1 i, h2 blockquote, h2 strong, h2 span, h2 i, h3 blockquote, h3 strong, h3 span, h3 i, h4 blockquote, h4 strong, h4 span, h4 i, h5 blockquote, h5 strong, h5 span, h5 i, h6 blockquote, h6 strong, h6 span, h6 i {
    font-family: inherit;
    color: inherit;
    font-size: inherit;
    font-weight: inherit; }

h1 {
  margin-top: 0;
  font-size: 3rem;
  line-height: 4.5rem; }

h2 {
  font-size: 2.5rem;
  line-height: 3.75rem; }

h3 {
  font-size: 2rem;
  line-height: 3rem; }

h4 {
  font-size: 1.5rem;
  line-height: 2.25rem; }

b, strong {
  font-family: "BellMTBold", serif; }

i {
  font-style: italic; }

/*===========================================================================================
------------------------------FORM STYLING-------------------------------------------
===========================================================================================*/
label {
  font-size: 12px;
  text-transform: uppercase;
  color: #282828;
  font-weight: 700;
  display: block;
  margin-bottom: 5px;
  transition: all 0.4s ease; }

.inputWrapper {
  position: relative;
  display: inline-block;
  width: 100%;
  /* einde input{} */
  /* ======================= states by class ======================= */ }
  .inputWrapper input, .inputWrapper textarea {
    border: 1px solid #dfe3e9;
    border-radius: 5px;
    line-height: 35px;
    min-height: 35px;
    width: 100%;
    padding: 0px 15px;
    font-weight: normal;
    font-family: "BellMT", serif;
    transition: all 0.4s ease;
    margin-bottom: 15px;
    /*================= BROWSER STATES ====================== */
    /* Placeholders */
    /* specific type edits */ }
    .inputWrapper input:hover, .inputWrapper textarea:hover {
      border: 1px solid #ced0da; }
    .inputWrapper input:focus, .inputWrapper textarea:focus {
      outline: none;
      border: 1px solid #0e76bc; }
    .inputWrapper input:disabled, .inputWrapper textarea:disabled {
      cursor: not-allowed;
      background: #e9edf1;
      border: 1px solid #dfe3e9; }
    .inputWrapper input::-webkit-input-placeholder, .inputWrapper textarea::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      color: #393939;
      /* text-transform:capitalize;*/ }
    .inputWrapper input::-moz-placeholder, .inputWrapper textarea::-moz-placeholder {
      /* Firefox 19+ */
      color: #393939;
      text-transform: capitalize; }
    .inputWrapper input:-ms-input-placeholder, .inputWrapper textarea:-ms-input-placeholder {
      /* IE 10+ */
      color: #393939;
      /* text-transform:capitalize;*/ }
    .inputWrapper input:-moz-placeholder, .inputWrapper textarea:-moz-placeholder {
      /* Firefox 18- */
      color: #393939;
      /* text-transform:capitalize;*/ }
    .inputWrapper input[type="checkbox"], .inputWrapper input[type="radio"], .inputWrapper textarea[type="checkbox"], .inputWrapper textarea[type="radio"] {
      display: none; }
      .inputWrapper input[type="checkbox"] + label, .inputWrapper input[type="radio"] + label, .inputWrapper textarea[type="checkbox"] + label, .inputWrapper textarea[type="radio"] + label {
        display: inline-block;
        margin: 0;
        margin-top: -5px;
        text-transform: none;
        font-size: 15px;
        line-height: 15px; }
        .inputWrapper input[type="checkbox"] + label::before, .inputWrapper input[type="radio"] + label::before, .inputWrapper textarea[type="checkbox"] + label::before, .inputWrapper textarea[type="radio"] + label::before {
          display: inline-block;
          content: '';
          width: 16px;
          font-size: 8px;
          height: 16px;
          border: 1px solid #ced0da;
          float: left;
          margin-right: 5px;
          padding-left: 1px;
          box-sizing: border-box;
          line-height: 14px;
          text-align: center;
          color: #29b411;
          transition: all 0.4s ease;
          transition: color 0.6s ease; }
      .inputWrapper input[type="checkbox"]:checked + label::before, .inputWrapper input[type="radio"]:checked + label::before, .inputWrapper textarea[type="checkbox"]:checked + label::before, .inputWrapper textarea[type="radio"]:checked + label::before {
        content: '\f00c';
        color: #fff;
        font-family: "Font Awesome 5 Light";
        border-color: #27aa11;
        background: #29b411;
        /* Old browsers */
        /* FF3.6-15 */
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(45deg, #29b411 0%, #57d841 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color1', endColorstr='$color2',GradientType=1 );
        /* IE6-9 fallback on horizontal gradient */ }
      .inputWrapper input[type="checkbox"]:disabled + label, .inputWrapper input[type="radio"]:disabled + label, .inputWrapper textarea[type="checkbox"]:disabled + label, .inputWrapper textarea[type="radio"]:disabled + label {
        color: rgba(53, 64, 82, 0.5); }
        .inputWrapper input[type="checkbox"]:disabled + label:hover, .inputWrapper input[type="radio"]:disabled + label:hover, .inputWrapper textarea[type="checkbox"]:disabled + label:hover, .inputWrapper textarea[type="radio"]:disabled + label:hover {
          cursor: not-allowed; }
        .inputWrapper input[type="checkbox"]:disabled + label::before, .inputWrapper input[type="radio"]:disabled + label::before, .inputWrapper textarea[type="checkbox"]:disabled + label::before, .inputWrapper textarea[type="radio"]:disabled + label::before {
          background: #e9edf1;
          border-color: #dfe3e9; }
    .inputWrapper input[type="radio"] + label::before, .inputWrapper textarea[type="radio"] + label::before {
      border-radius: 50%; }
    .inputWrapper input[type="radio"]:checked + label::before, .inputWrapper textarea[type="radio"]:checked + label::before {
      content: '\2022';
      font-size: 23px;
      line-height: 12px;
      color: #fff;
      font-family: "Font Awesome 5 Light";
      border-color: #27aa11;
      background: #29b411;
      /* Old browsers */
      /* FF3.6-15 */
      /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(45deg, #29b411 0%, #57d841 100%);
      /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color1', endColorstr='$color2',GradientType=1 );
      /* IE6-9 fallback on horizontal gradient */ }
    .inputWrapper input.toggle + label:before, .inputWrapper textarea.toggle + label:before {
      width: 40px;
      height: 20px;
      border: none;
      border-radius: 20px;
      background: #dfe1e5; }
    .inputWrapper input.toggle + label:after, .inputWrapper textarea.toggle + label:after {
      content: '';
      display: block;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #fff;
      position: absolute;
      top: 9px;
      left: 2px;
      transition: all 0.2s ease; }
    .inputWrapper input.toggle:checked + label:before, .inputWrapper textarea.toggle:checked + label:before {
      content: ''; }
    .inputWrapper input.toggle:checked + label:after, .inputWrapper textarea.toggle:checked + label:after {
      left: 22px; }
  .inputWrapper textarea {
    line-height: 1.4;
    padding: 5px; }
  .inputWrapper.error input {
    border: 1px solid #bf1e2e;
    color: #bf1e2e; }
  .inputWrapper.error:after {
    content: '\f00d';
    display: inline-block;
    position: absolute;
    font-family: "Font Awesome 5 Light";
    bottom: 21px;
    right: 15px;
    color: #bf1e2e; }
  .inputWrapper.success input {
    border: 1px solid #1bb934;
    color: #1bb934; }
  .inputWrapper.success:after {
    content: '\f00c';
    display: inline-block;
    position: absolute;
    font-family: "Font Awesome 5 Light";
    bottom: 21px;
    right: 15px;
    color: #1bb934; }
  .inputWrapper[data-icon] input {
    padding-left: 45px; }
  .inputWrapper[data-icon]::before {
    content: attr(data-icon);
    display: inline-block;
    position: absolute;
    font-family: "Font Awesome 5 Light";
    bottom: 21px;
    left: 15px;
    color: #9a9fa8; }
  .inputWrapper[data-notification] {
    padding-bottom: 15px; }
    .inputWrapper[data-notification]::before {
      bottom: 36px; }
    .inputWrapper[data-notification]::after {
      content: attr(data-notification);
      display: inline-block;
      font-family: "Font Awesome 5 Light";
      color: #9a9fa8;
      font-size: 12px;
      position: absolute;
      bottom: 6px;
      left: 5px; }
    .inputWrapper[data-notification][data-notification-icon]::after {
      content: attr(data-notification-icon) " " attr(data-notification); }

/* einde .inputWrapper */
/* ============================SELECT ELEMENT CSS ONLY ======================*/
/* NOTE HOW THE HTML OF THIS CSS ONLY SELECTBOX SHOULD LOOK LIKE THIS:*/
/* UL.SELECT>LI>BUTTON+UL>LI*3>INPUT[TYPE=RADIO]+LABEL*/
ul.select {
  background: #000;
  background: var(--theme-background-color);
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 9; }
  ul.select > li {
    list-style: none;
    margin: 0;
    padding: 0;
    font-weight: 700;
    font-family: "BellMT", serif;
    margin-bottom: 15px;
    position: relative; }
    ul.select > li > button {
      border: 1px solid #dfe3e9;
      line-height: 35px;
      height: 35px;
      width: 100%;
      margin: 0;
      padding: 0px 15px;
      background: #fff;
      text-align: left;
      font-family: "BellMT", serif;
      position: relative;
      z-index: 2; }
      ul.select > li > button:after {
        content: '\f0d7';
        font-family: "Font Awesome 5 Light";
        display: inline-block;
        position: absolute;
        top: 0px;
        right: 15px;
        transition: all 0.4s ease; }
    ul.select > li button {
      border-radius: 5px; }
      ul.select > li button:focus + label:after {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg); }
      ul.select > li button:focus ~ ul {
        max-height: 300px; }
    ul.select > li ul {
      position: absolute;
      top: 0;
      display: block;
      width: 100%;
      margin: 0;
      padding: 0;
      max-height: 0;
      padding-top: 34px;
      overflow: hidden;
      border-bottom: 1px solid #dfe3e9;
      transition: all 0.3s ease;
      z-index: 3; }
      ul.select > li ul::-webkit-scrollbar {
        height: 5px; }
      ul.select > li ul::-webkit-scrollbar-track {
        height: 5px; }
      ul.select > li ul::-webkit-scrollbar-thumb {
        background-color: darkgrey;
        outline: 1px solid slategrey;
        height: 5px; }
      ul.select > li ul::-webkit-scrollbar-corner {
        width: 0px;
        height: 0px; }
      ul.select > li ul li {
        list-style: none; }
        ul.select > li ul li label {
          border: 1px solid #dfe3e9;
          border-bottom: none;
          line-height: 34px;
          height: 34px;
          width: 100%;
          margin: 0;
          padding: 0px 15px;
          background: #fefefe;
          overflow: hidden; }
          ul.select > li ul li label:hover {
            border: 1px solid #2ea2f8;
            cursor: pointer; }
        ul.select > li ul li input[type="radio"] {
          display: none; }
          ul.select > li ul li input[type="radio"]:checked + label {
            background: #fff;
            position: absolute;
            top: 0;
            visibility: visible;
            color: #2ea2f8;
            z-index: 3; }
            ul.select > li ul li input[type="radio"]:checked + label:after {
              content: '\f0d7';
              font-family: "Font Awesome 5 Light";
              display: inline-block;
              position: absolute;
              top: 0px;
              right: 15px;
              transition: all 0.4s ease; }
        ul.select > li ul li:nth-child(even) label {
          background: #eaecef; }
      ul.select > li ul:hover {
        height: auto;
        max-height: 300px;
        overflow-y: auto; }

/* ============================ CUSTOM CHECKBOXES CSS ONLY ======================*/
/*===========================================================================================
-----------------------------------PANELS AND TABS-----------------------------------------
===========================================================================================*/
/* ============================TABS ======================*/
/* NOTE HOW THE HTML SHOULD LOOK LIKE:*/
/* .tabs.tabsHorizontal>nav>ul>li*5>a[data-content=tab$]{tab $ title}^^^ul.tabsContent>li[data-content=tab$]$*5>h3{Tab Title}*/
.tabs {
  width: 100%;
  display: block;
  position: relative;
  margin-bottom: 30px; }
  .tabs.tabsHorizontal nav {
    width: 100%;
    display: block;
    background: #fff;
    border: 1px solid #dfe2e5;
    border-top: none;
    overflow: hidden;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    height: 110px;
    position: relative;
    -webkit-transform: rotate(180deg) scale(-1, 1);
    transform: rotate(180deg) scale(-1, 1); }
    .tabs.tabsHorizontal nav ul {
      display: inline-block;
      margin: 0;
      padding: 0;
      position: absolute;
      bottom: -15px;
      left: 0;
      white-space: nowrap;
      border-bottom: 1px solid #dfe2e5;
      margin-bottom: 15px;
      -webkit-transform: rotate(-180deg) scale(-1, 1);
      transform: rotate(-180deg) scale(-1, 1);
      min-width: 100%; }
      .tabs.tabsHorizontal nav ul li {
        list-style: none;
        margin: 0;
        padding: 0;
        display: inline-block;
        padding: 0px 30px;
        transition: all 0.4s ease; }
        .tabs.tabsHorizontal nav ul li a {
          display: inline-block;
          padding: 30px 0px;
          font-weight: 300;
          color: #282828;
          font-size: 16px; }
          .tabs.tabsHorizontal nav ul li a.active {
            border-bottom: 2px solid #2ea2f8;
            font-weight: 600;
            padding: 30px 0px 28px; }
        .tabs.tabsHorizontal nav ul li:hover {
          background: #efefef;
          cursor: pointer; }
      .tabs.tabsHorizontal nav ul::after {
        content: '';
        display: block;
        clear: both; }
    .tabs.tabsHorizontal nav::-webkit-scrollbar {
      height: 5px; }
    .tabs.tabsHorizontal nav::-webkit-scrollbar-track {
      height: 5px; }
    .tabs.tabsHorizontal nav::-webkit-scrollbar-thumb {
      background-color: darkgrey;
      outline: 1px solid slategrey;
      height: 5px; }
    .tabs.tabsHorizontal nav::-webkit-scrollbar-corner {
      width: 0px;
      height: 0px; }
  .tabs.tabsHorizontal .scrollRight, .tabs.tabsHorizontal .scrollLeft {
    position: absolute;
    display: block;
    z-index: 4;
    top: 0;
    height: 110px;
    width: 20px; }
  .tabs.tabsHorizontal .scrollRight {
    right: 0; }
  .tabs.tabsHorizontal .scrollLeft {
    left: 0; }
  .tabs .tabsContent {
    width: 100%;
    background: #fff;
    margin: 0;
    border: 1px solid #dfe2e5;
    border-top: none;
    padding: 15px;
    position: relative; }
    .tabs .tabsContent > li {
      display: inline-block;
      width: 100%;
      list-style: none;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 0;
      opacity: 0;
      height: 0;
      overflow: hidden;
      transition: all 0s ease; }
      .tabs .tabsContent > li.active {
        height: auto;
        opacity: 1;
        position: relative;
        transition: all 1s ease;
        overflow: visible; }

/*===========================================================================================
---------------------------------TABLES----------------------------------------------------
===========================================================================================*/
.tableWrapper {
  margin-bottom: 30px;
  width: 100%;
  overflow-x: auto; }
  .tableWrapper::-webkit-scrollbar {
    height: 5px; }
  .tableWrapper::-webkit-scrollbar-track {
    height: 5px; }
  .tableWrapper::-webkit-scrollbar-thumb {
    background-color: darkgrey;
    outline: 1px solid slategrey;
    height: 5px; }
  .tableWrapper::-webkit-scrollbar-corner {
    width: 0px;
    height: 0px; }
  .tableWrapper table {
    width: 100%;
    background: #fff;
    border: 1px solid #dfe2e5;
    border-collapse: collapse; }
    .tableWrapper table * {
      text-align: left; }
    .tableWrapper table tr {
      border-bottom: 1px solid #dfe2e5;
      transition: all 0.2s ease; }
      .tableWrapper table tr th {
        font-family: "Saira Condensed", sans-serif;
        color: #282828;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        padding: 15px; }
      .tableWrapper table tr td {
        color: #282828;
        font-size: 14px;
        font-weight: 400;
        line-height: 20px;
        padding: 15px; }
        .tableWrapper table tr td:first-child {
          font-weight: 600; }
      .tableWrapper table tr:hover {
        background: #f0f0f2; }

/*===========================================================================================
------------------------------------Buttons styling------------------------------------------
===========================================================================================*/
.button {
  font-family: "Saira Condensed", sans-serif;
  text-transform: uppercase;
  font-weight: 700;
  padding: 15px 30px;
  font-size: 1.333rem;
  text-decoration: none;
  margin-bottom: 30px;
  background: #282828;
  color: #fefefe;
  transition: all 0.4s ease;
  -webkit-transform: scale(1);
  transform: scale(1);
  display: inline-block;
  text-align: center; }
  .button:hover {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    cursor: pointer;
    color: #fefefe;
    text-decoration: none; }
  .button blockquote, .button strong, .button span {
    font-family: inherit;
    color: inherit;
    font-size: inherit;
    font-weight: inherit; }
  .button.button-alt {
    background: #bf1e2e;
    /* Old browsers */
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg, #bf1e2e 0%, #c33067 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color1', endColorstr='$color2',GradientType=1 );
    /* IE6-9 fallback on horizontal gradient */
    color: #fff; }
  .button.buttonLarge {
    padding: 20px 40px;
    font-size: 2rem; }
  .button.buttonFB[data-icon] {
    border: none;
    background: #3b5998; }
    .button.buttonFB[data-icon]::before {
      font-family: 'FontAwesome'; }
    .button.buttonFB[data-icon].shared {
      background: #dfe2e5; }
      .button.buttonFB[data-icon].shared::before {
        content: '\f00c'; }
  .button.buttonTwitter[data-icon] {
    border: none;
    background: #55acee; }
    .button.buttonTwitter[data-icon]::before {
      font-family: 'FontAwesome'; }
    .button.buttonTwitter[data-icon].shared {
      background: #dfe2e5; }
      .button.buttonTwitter[data-icon].shared::before {
        content: '\f00c'; }
  .button.buttonLI[data-icon] {
    border: none;
    background: #007bb5; }
    .button.buttonLI[data-icon]::before {
      font-family: 'FontAwesome'; }
    .button.buttonLI[data-icon].shared {
      background: #dfe2e5; }
      .button.buttonLI[data-icon].shared::before {
        content: '\f00c'; }
  .button[data-icon]::before {
    content: attr(data-icon);
    display: inline-block;
    font-family: "Font Awesome 5 Light";
    margin-right: 5px;
    font-weight: normal; }
  .button[data-icon].icon-right::before {
    display: none; }
  .button[data-icon].icon-right::after {
    content: attr(data-icon);
    display: inline-block;
    font-family: "Font Awesome 5 Light";
    margin-left: 5px;
    font-weight: normal; }
  .button.facebookButton {
    background: #39579a;
    color: #fff; }
    .button.facebookButton[data-icon]::before {
      font-family: 'FontAwesome'; }
  .button.buttonRed {
    background: #c51d31;
    border: 1px solid #dd171e;
    color: #fff; }
  .button.buttonBlue {
    background: #00a3eb;
    border: 1px solid #1991eb;
    color: #fff; }
  .button.buttonGreen {
    background: #56c02b; }

/*# sourceMappingURL=uikit.css.map */