/* Imports */
/*==========================================================================
1. Variables & functions
===========================================================================*/
/* Colors
===========================================================================*/
/* Widths & heights
===========================================================================*/
/* Breakpoints
===========================================================================*/
/* Font family's
===========================================================================*/
/* Font size's
===========================================================================*/
/* Rondehoeken
===========================================================================*/
.btn_blue {
  background-color: #ffffff;
  border: 2px solid #0652DD;
  color: #0652DD;
  padding: 1px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
.btn_blue:hover {
  background-color: #0652DD;
  color: #ffffff;
}
.btn_blue_reversed {
  background-color: #0652DD;
  border: 2px solid #0652DD;
  color: #ffffff;
  padding: 5px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
.btn_blue_reversed:hover {
  background-color: #ffffff;
  color: #0652DD;
}
.btn_red {
  background-color: #ffffff;
  border: 2px solid red;
  color: red;
  padding: 1px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
.btn_red:hover {
  background-color: red;
  color: #ffffff;
}
.btn_red_reversed {
  background-color: red;
  border: 2px solid red;
  color: #ffffff;
  padding: 1px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
.btn_red_reversed:hover {
  background-color: #ffffff;
  color: red;
}
.btn_red_fullwidth {
  background-color: red;
  border: 2px solid red;
  color: #ffffff;
  padding: 1px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  width: 100%;
  display: block;
  text-align: center;
  box-sizing: border-box;
  margin: 0;
}
.btn_red_fullwidth:hover {
  background-color: #ffffff;
  color: red;
}
.btn_green {
  background-color: #ffffff;
  border: 2px solid green;
  color: green;
  padding: 1px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
.btn_green:hover {
  background-color: green;
  color: #ffffff;
}
.btn_green_reversed {
  background-color: green;
  border: 2px solid green;
  color: #ffffff;
  padding: 1px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
.btn_green_reversed:hover {
  background-color: #ffffff;
  color: green;
}
.btn_green_fullwidth {
  background-color: green;
  border: 2px solid green;
  color: #ffffff;
  padding: 1px 8px;
  display: inline-block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  width: 100%;
  display: block;
  text-align: center;
  box-sizing: border-box;
  margin: 0;
}
.btn_green_fullwidth:hover {
  background-color: #ffffff;
  color: green;
}
.rondehoeken-white {
  background-color: #ffffff;
  padding: 20px;
  margin-bottom: 20px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.5);
  box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.5);
}
.rondehoeken-row {
  background-color: #ffffff;
  padding: 10px;
  margin-bottom: 20px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.5);
  box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.5);
}
.black_text {
  color: #000000;
  font-weight: bold;
}
.red_text {
  color: #EA2027;
  font-weight: bold;
}
.green_text {
  color: #009432;
  font-weight: bold;
}
.blue_text {
  color: #0652DD;
  font-weight: bold;
}
.orange_text {
  color: #F79F1F;
  font-weight: bold;
}
/* Site branding
===========================================================================*/
#block-portal-theme-branding {
  padding: 10px 20px;
  box-sizing: border-box;
  grid-column: brand / endbrand;
}
#block-portal-theme-branding .site-name a {
  color: #ffffff;
  font-weight: bold;
}
/* Header menu | Drupal menu
===========================================================================*/
#block-headermenu {
  grid-column: headermenu / end;
}
#block-headermenu ul.menu {
  display: flex;
  margin: 0;
  position: relative;
}
#block-headermenu ul.menu li.menu-item {
  list-style: none;
  padding: 0;
}
#block-headermenu ul.menu li.menu-item a {
  width: 50px;
  height: 50px;
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
}
#block-headermenu ul.menu li.menu-item a svg {
  color: #ffffff;
}
#block-headermenu ul.menu li.menu-item a:hover {
  background-color: #323130;
}
#block-headermenu ul.menu li.menu-item ul.menu {
  position: absolute;
  right: 0;
  top: 100%;
  width: 300px;
  z-index: 10;
  background-color: #ffffff;
  display: none;
  height: calc(100vh - 50px);
}
#block-headermenu ul.menu li.menu-item ul.menu li.menu-item {
  width: 100%;
}
#block-headermenu ul.menu li.menu-item ul.menu li.menu-item a {
  width: 100%;
  padding: 1em 1.5em;
  box-sizing: border-box;
  height: auto;
  display: block;
}
#block-headermenu ul.menu li.menu-item ul.menu li.menu-item a:hover {
  background-color: #D2D2D2;
}
#block-headermenu ul.menu li.menu-item.open ul.menu {
  display: block;
}
/* Hoofdnavigatie | Main menu | Superfish responsive |
===========================================================================*/
#block-hoofdnavigatie .sf-accordion-toggle {
  display: none;
}
#block-hoofdnavigatie ul.sf-menu {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}
#block-hoofdnavigatie ul.sf-menu.sf-horizontal li.sf-depth-1,
#block-hoofdnavigatie ul.sf-menu.sf-accordion li.sf-depth-1 {
  float: none;
  display: block;
  width: 100%;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 a.sf-accordion-button {
  overflow: hidden;
  float: right;
  z-index: 2;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40px;
  width: 40px;
  padding: 0;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 a.sf-accordion-button:after {
  display: none;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 > a.sf-depth-1 {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 > a.sf-depth-1 svg {
  flex: 0 0 25px;
  width: 16px;
  height: 16px;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 > a.sf-depth-1 span {
  flex: 1 1 auto;
  font-size: 14px;
  line-height: 1;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 > a.sf-depth-1:hover {
  background-color: #D2D2D2;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 ul {
  overflow: hidden;
  margin: 0;
  padding: 0;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 ul li {
  float: none;
  width: 100%;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 ul li a.sf-depth-2 {
  display: block;
  padding: 9px 10px 9px 45px;
  font-size: 14px;
  text-decoration: none;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1 ul li a.sf-depth-2:hover {
  background-color: #D2D2D2;
}
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1:hover > a.sf-depth-1,
#block-hoofdnavigatie ul.sf-menu li.sf-depth-1:hover a.sf-accordion-button {
  background-color: #D2D2D2;
}
#block-hoofdnavigatie-2 ul.sf-menu {
  position: relative;
  width: 40px;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 a.sf-depth-1 {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  padding: 12px 10px;
  box-sizing: border-box;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 a.sf-depth-1 svg {
  font-size: 16px;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 a.sf-depth-1 span {
  display: none;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 ul {
  min-width: 250px;
  top: 0;
  left: 100%;
  background-color: #e9e9e9;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 ul li.sf-depth-1 a.sf-depth-1 {
  display: flex;
  align-items: center;
  height: 40px;
  width: 100%;
  padding: 12px 10px;
  font-size: 16px;
  background-color: #484644;
  box-sizing: border-box;
  color: #ffffff;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 ul li.sf-depth-1 a.sf-depth-1 svg {
  display: none;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 ul li.sf-depth-1 a.sf-depth-1 span {
  display: block;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 ul li.sf-depth-2 a.sf-depth-2 {
  display: flex;
  align-items: center;
  height: 32px;
  width: 100%;
  padding: 12px 10px;
  font-size: 14px;
  box-sizing: border-box;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1 ul li.sf-depth-2:hover a.sf-depth-2 {
  background-color: #D2D2D2;
}
#block-hoofdnavigatie-2 ul.sf-menu li.sf-depth-1:hover a.sf-depth-1 {
  background-color: #D2D2D2;
}
.content-wrapper.full #block-hoofdnavigatie-2 {
  display: none !important;
}
.content-wrapper.minimized #block-hoofdnavigatie {
  display: none !important;
}
/* Hoofdnavigatie js toggle | Main menu
===========================================================================*/
#block-mainmenutoggle .contextual {
  display: none!important;
}
#block-mainmenutoggle #js-main-menu-toggle {
  display: flex;
  align-items: center;
  padding: 12px;
  box-sizing: border-box;
  cursor: pointer;
}
#block-mainmenutoggle #js-main-menu-toggle svg {
  font-size: 16px;
}
#block-mainmenutoggle #js-main-menu-toggle:hover {
  background-color: #D2D2D2;
}
/* Theme toggle | Dark and light mode/theme
===========================================================================*/
#block-themetoggle,
#block-blokvoorhetswitchenvandarkenlighttheme {
  grid-column: theme / endtheme;
}
#block-themetoggle .js-theme-toggle,
#block-blokvoorhetswitchenvandarkenlighttheme .js-theme-toggle {
  height: 50px;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#block-themetoggle .js-theme-toggle a,
#block-blokvoorhetswitchenvandarkenlighttheme .js-theme-toggle a {
  color: #ffffff;
}
#block-themetoggle .js-theme-toggle svg,
#block-blokvoorhetswitchenvandarkenlighttheme .js-theme-toggle svg {
  color: #ffffff;
  margin-right: 5px;
}
#block-themetoggle .js-theme-toggle:hover,
#block-blokvoorhetswitchenvandarkenlighttheme .js-theme-toggle:hover {
  background-color: #323130;
  cursor: pointer;
}
body.dark-theme #js-dark-mode-toggle {
  display: none;
}
body.light-theme #js-light-mode-toggle {
  display: none;
}
/* Block edit
===========================================================================*/
#block-views-block-content-block-1 {
  grid-column: edit / headermenu;
}
#block-views-block-content-block-1 a {
  height: 50px;
  width: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
#block-views-block-content-block-1 svg {
  font-size: 18px;
  color: #ffffff;
  margin-left: 3px;
  margin-bottom: 2px;
}
#block-views-block-content-block-1:hover {
  background-color: #323130;
}
#block-data-export {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 20px;
}
#block-data-export .column {
  background-color: #ffffff;
}
#block-data-export .column .inner-column {
  padding: 20px;
}
#block-data-export .column .inner-column .row {
  margin-bottom: 10px;
}
.digi_data_terugbel_report {
  background-color: #ffffff;
}
