@font-face {
    font-family: 'the-mix-bold';
    src: url(../../../../custom/theme/assets/font/TheMix_Bold.otf);
    font-weight: bold;
  }
  @font-face {
    font-family: 'the-mix';
    src: url(../../../../custom/theme/assets/font/TheMix_Plain.otf);
    font-weight: normal;
  }
  :root {

    /***Logo's***/
    --logo-standard: url("../../custom/theme/assets/images/logo-denhaag.jpg");
    --logo-alt: url("../../custom/theme/assets/images/Logo_HSG.png");  

    /***Header Image (Van toepassing op visual.twig)***/
     --header-image: url("../../custom/theme/assets/images/headerimage.jpg"); 

    /***Brand Colors***/
  --color-brand-primary: #F8D62D;
    --color-brand-primary-rgb: 34, 140, 74;
    --color-brand-secondary: #A87A26;
  --color-brand-tertiary: #1261A3;
    --color-brand-light: #B9BBB8;
    --color-brand-dark: #293575;

    --color-neutral-black:#231F20;
    --color-neutral-gray-09:#424547;
    --color-neutral-gray-08:#5A5F5F;
    --color-neutral-gray-07:#6E7276;
    --color-neutral-gray-06:#B9BBB8;

    /***Font***/
    --font-family: 'the-mix', sans-serif; 
     --font-family-title:  'the-mix-bold', sans-serif; 
    /* --font-size: 1.6rem; */

    --border-radius: 0;

    /**** Voor meer settings zie: /themes/base/assets/style/variables.css ****/
}

a {
  color: #1261A3;
}

.note {
  color: var(--color-brand-tertiary);
  font-style: italic;
}

h2 {
  font-size: var(--font-size-l);
}

.form_check {
    display: inline;
}

img{
    max-width: 100%;
}
.logo {
  height: 60px;
}
.header_visual .header_visual-content {
    background: none;
    color: var(--color-neutral-white);
}
.navigation-bg{
  background-image: url(../../../../custom/theme/assets/images/navigatie-bg.svg);
  height: 32px;
  width: 100%;
  max-width: 100%;
}
.bg-color{
  background-color: var(--color-brand-tertiary);
}
.page-home h3{
  margin: 0rem 0 0.8rem 0;
}
.page-home .multistep_title h3{
  margin: 3.2rem 0 0.8rem 0;
}
.iframe-container{
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}
.iframe-container iframe{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
header .header_bar {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.errorbox {
  color: red;
}
.page-home .multistep_title h3 {
  margin: 0rem 0 0.8rem 0;
}
.ui-dialog .ui-button.button--primary, .button--primary {
    color: var(--color-neutral-black);
}
.ui-dialog .ui-button.button--primary:hover, .button--primary:hover {
    color: var(--color-neutral-white);
}
.button--back {
  color: var(--color-neutral-gray-08);
}
button, .button, input[type="submit"], input[type="button"] {
  font-size: var(--font-size-s);
}
.menu-items li .menu-item:hover,
.menu-items li.menu-active:not(.menu-group.open) .menu-item:not(.menu-item--sub) {
    color: var(--color-brand-secondary);
}
.ui-accordion .ui-accordion-header.ui-state-active {
    background-color: var(--color-brand-primary);
    border: none;
    color: var(--color-brand-dark);
}
.ui-accordion .ui-accordion-header.ui-state-active.ui-state-hover {
    background-color: var(--color-brand-dark);
    border: none;
    color: var(--color-neutral-white);
}

.page-enquete.main,
.row-center.mt-4 {
margin-top: 16rem;
}
.drag-drop-file-uploader .upfile-container .action > * {
    background: var(--color-brand-dark);
    cursor: pointer;
}
@media (min-width: 992px){
  .container-champion .col-xs-12 {
    grid-column-start: 3;
    grid-column-end: 11;
    display: grid;
  }
    h2 {
    font-size: var(--font-size-xl);
  }
}

@media (max-width: 992px){
.page-home {
margin-top: 12rem;
}
}