/**
 * Custom styles
 */
/* === Variables === */
/* === Includes === */
/* =========== Mixins */
/* =========== Semantic fluid grid */
/*

    Use '@include grid(12, 2)' to make a column. 
    The first unit (12) is the column width.
    The second unit (2) is the margin on both sides.
    The margin will be auto substracted from the column width.
    So don't recalculate the column width if you change your margin.
    
    To set different margins on both sides use '@include grid(12, 2, 3)'.
    You can also use negative margins.
    
*/
/* Use this mixin to reset your grid by example for your mobile articles */
/* The clearfix mixin is necessary for the floats */
/* === Tags === */
/* Make grid rows */
div.row {
  clear: both; }

div.holder.error img.float {
  float: right;
  max-width: 10em; }
div.holder.error pre {
  overflow: auto; }

body.dev div.logo a, body.error div.logo a {
  background-image: url("/images/fmf_logo_error.png"); }

article h1 {
  font-size: 1.5em; }

body.application tbody tr:hover {
  background-color: #eeeeee; }
body.application div.content {
  position: relative; }

div.support a.language {
  margin-right: 0.4em; }

ul.listing, ul.filelisting {
  *zoom: 1;
  list-style: none;
  background-color: #f8f8f8;
  background-color: rgba(255, 255, 255, 0.9);
  background-color: rgba(250, 250, 250, 0.5);
  border: 1px solid #d9d9d9;
  margin: 0; }
  ul.listing:before, ul.listing:after, ul.filelisting:before, ul.filelisting:after {
    display: block;
    height: 0 !important;
    line-height: 0;
    overflow: hidden;
    visibility: hidden;
    content: "."; }
  ul.listing:after, ul.filelisting:after {
    clear: both; }
  ul.listing li, ul.filelisting li {
    position: relative;
    margin: 0 0 0 1em;
    border-bottom: 1px solid #d9d9d9;
    background-color: rgba(255, 255, 255, 0.9);
    background: #ffffff \9; }
    ul.listing li:last-of-type, ul.filelisting li:last-of-type {
      border-bottom: none; }
    ul.listing li.notice, ul.filelisting li.notice {
      font-style: italic;
      font-size: 0.6em; }
    ul.listing li div, ul.filelisting li div {
      position: relative; }
    ul.listing li a, ul.filelisting li a {
      cursor: pointer;
      display: block;
      color: #474747; }
      ul.listing li a:before, ul.filelisting li a:before {
        font-size: 0.6em;
        margin-right: 1em; }
      ul.listing li a:hover, ul.listing li a.active, ul.filelisting li a:hover, ul.filelisting li a.active {
        color: #276ba4;
        background-color: #fcfcfc; }
      ul.listing li a span, ul.filelisting li a span {
        margin-left: 0.5em;
        font-size: 0.8em;
        opacity: 0.8; }
      ul.listing li a:last-of-type > ul.filelisting:last-of-type, ul.filelisting li a:last-of-type > ul.filelisting:last-of-type {
        border-bottom: none; }
    ul.listing li button, ul.listing li a.button, ul.filelisting li button, ul.filelisting li a.button {
      display: inline;
      position: absolute;
      right: 0;
      top: 0;
      font-size: 0.8em;
      padding: 0.1em 0.8em 0.5em;
      height: 100%;
      color: white; }
    ul.listing li ul.listing, ul.listing li ul.filelisting, ul.filelisting li ul.listing, ul.filelisting li ul.filelisting {
      border-right: none;
      border-bottom: none; }

div.popupContainer {
  background: rgba(5, 5, 5, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }
  div.popupContainer div.popup, div.popupContainer div.menuPopup {
    margin: auto auto;
    width: 60%;
    max-width: 80%;
    max-height: 80%;
    background: white;
    border: 1px solid #d9d9d9;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;
    overflow: auto;
    padding: 0.5em; }
    @media only screen and (max-width: 520px) {
      div.popupContainer div.popup, div.popupContainer div.menuPopup {
        width: 100%;
        height: 100%;
        max-width: 100%;
        margin: 0; } }
    div.popupContainer div.popup header, div.popupContainer div.menuPopup header {
      border-bottom: 1px solid black;
      background: url("../images/teaser.png") center bottom no-repeat;
      margin-bottom: 0.5em; }
      div.popupContainer div.popup header h1, div.popupContainer div.menuPopup header h1 {
        font-size: 1.5em; }
  div.popupContainer div.menuPopup {
    width: 75%;
    height: 75%;
    padding: 0; }
    @media only screen and (max-width: 520px) {
      div.popupContainer div.menuPopup {
        width: 100%;
        height: 100%; } }
    div.popupContainer div.menuPopup div.menu, div.popupContainer div.menuPopup div.content {
      float: left;
      box-sizing: border-box;
      height: 100%; }
    div.popupContainer div.menuPopup div.content {
      width: 70%;
      overflow: auto; }
      @media only screen and (max-width: 520px) {
        div.popupContainer div.menuPopup div.content {
          width: 100%; } }
    div.popupContainer div.menuPopup div.menu {
      width: 30%;
      border: none;
      border-right: 1px solid #d9d9d9;
      float: left; }
      div.popupContainer div.menuPopup div.menu ul {
        margin: 0;
        list-style: none;
        *zoom: 1;
        background: rgba(255, 255, 255, 0.9);
        background: #ffffff \9; }
        div.popupContainer div.menuPopup div.menu ul:before, div.popupContainer div.menuPopup div.menu ul:after {
          display: block;
          height: 0 !important;
          line-height: 0;
          overflow: hidden;
          visibility: hidden;
          content: "."; }
        div.popupContainer div.menuPopup div.menu ul:after {
          clear: both; }
        div.popupContainer div.menuPopup div.menu ul li a {
          border-top: 1px solid #e6e6e6;
          display: block;
          color: #91979d;
          padding: 0.6em 1.25em;
          font-size: 1.1em;
          font-family: "Ubuntu", "Helvetica Neue", Arial, sans-serif;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          -webkit-transition: padding-left 50ms;
          -moz-transition: padding-left 50ms;
          -o-transition: padding-left 50ms;
          transition: padding-left 50ms; }
          div.popupContainer div.menuPopup div.menu ul li a:before {
            font-size: 0.6em;
            margin-right: 1em; }
          div.popupContainer div.menuPopup div.menu ul li a:hover {
            color: #276ba4;
            padding-left: 1.35em; }
          div.popupContainer div.menuPopup div.menu ul li a:active, div.popupContainer div.menuPopup div.menu ul li a.active {
            background: whitesmoke;
            border-color: #c7c7c7;
            position: relative;
            -webkit-box-shadow: inset 0px 1px 5px -1px #d4d4d4, 0px 1px 0px #d9d9d9;
            -moz-box-shadow: inset 0px 1px 5px -1px #d4d4d4, 0px 1px 0px #d9d9d9;
            -o-box-shadow: inset 0px 1px 5px -1px #d4d4d4, 0px 1px 0px #d9d9d9;
            box-shadow: inset 0px 1px 5px -1px #d4d4d4, 0px 1px 0px #d9d9d9;
            color: #acb1b5;
            padding-top: 0.65em;
            padding-bottom: 0.55em; }
        div.popupContainer div.menuPopup div.menu ul li.active a {
          padding-left: 1.75em;
          background: #fafafa;
          color: #276ba4; }
        div.popupContainer div.menuPopup div.menu ul li:first-child a {
          border: 0; }
    @media only screen and (max-width: 520px) {
      div.popupContainer div.menuPopup div.menu, div.popupContainer div.menuPopup div.content {
        float: none;
        width: 100%;
        height: auto; } }

textarea.content_editor.editing {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  padding: 4em 10em 2em 2em;
  background-image: url("/img/editing_content.png");
  background-position: bottom right;
  background-repeat: no-repeat; }

/* === Slider === */
div.photo #slider {
  display: none;
  overflow: hidden;
  position: relative; }
  @media (max-width: 520px) {
    div.photo #slider {
      display: none; } }
  div.photo #slider ul.sliderControls {
    position: absolute;
    bottom: 1em;
    right: 1em;
    list-style: none;
    margin: 0; }
    div.photo #slider ul.sliderControls li {
      float: left;
      display: bloack;
      margin-right: 1em; }
      div.photo #slider ul.sliderControls li:hover {
        color: white; }
  div.photo #slider div.slidesContainer {
    width: 100%; }
    div.photo #slider div.slidesContainer div.slide {
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center center;
      filter: drop-shadow(0px 0px 2px black);
      -webkit-filter: drop-shadow(0px 0px 1px black); }

/* Fix section overflows from tables, etc. */
section {
  overflow-x: auto; }

/* Bedrijfsprofielen */
table.bedrijfsprofiel, table.bedrijfsprofiel tr, table.bedrijfsprofiel td {
  border-style: none; }
table.bedrijfsprofiel th, table.bedrijfsprofiel td {
  font-size: 10pt;
  width: 50%; }
table.bedrijfsprofiel li {
  line-height: 1.2em; }

/* Commissieoverzichten */
table.committee th, table.committee td {
  width: 50%; }

/* Quick links */
ul.navigation.quicklinks {
  font-size: 11pt; }
  ul.navigation.quicklinks li a {
    padding: 0.4em 1em !important; }

/* Noscript block */
noscript {
  display: block;
  text-align: center;
  color: white;
  font-weight: bold;
  font-size: 1.2rem;
  background-color: red;
  padding: 1em 0; }