:root{
  --zilverBackground: #fbfbfb;

  --blauwLicht:   #B7BCE1;
  --blauwMiddel:  #B7BCE1; /*//#5CABB4; //#A6CCE4;*/
  --blauwDonker:  #006EB3;

  --MFBlauwLicht:  #B7BCE1;
  --MFBlauwMiddel: #616FBD;
  --MFBlauwDonker: #1E2447;

  --oranjeDonker: #FF8500;    /*//#FFA500;  //donker oranje*/
  --oranjeLicht:  #FDD282;    /*//licht oranje*/
  --oranjeHeelLicht: #FCEAC7; /*//heel licht; achtergrond voor het ruitjesblad*/
  
  --demin: #5CABB4;
  --deminLicht:   #b0e2db;  /*//antwoord veld in spreadsheet en ruitjesblad*/
  --oranjeLicht: #FDD282;
  --MFBlauwDonker: #1E2447;

  --menuAchtergrond: var(--MFBlauwDonker);
  --menuAchtergrondDonkerder: #162133;

  --paars:        #c67cd3;  /*//paars*/
  --roodDonker:   #CE4747;  /*//rood*/

  --groenDonker:  #47B64D;  /*//donker groen*/
  --groenLicht:   #7FDA7A;  /*//licht groen*/

  --errorMessageAchtergrond: var(--oranjeLicht);
  --errorMessageBorder: var(--oranjeDonker);

  --questionFout: #CCCCCC;
  --questionGoed: #009304;

  --curveGreen:  #98d69b;
  --curveOrange: #ffbb70;
  --curveRed:    #e49898;

  --courseHeight: 375px;

  --surveillantBorder: var(--oranjeDonker);

  --kleurLijntjes: var(--blauwMiddel);
}

.test{background-color: var(--menuAchtergrond);}

.bg_od{ background-color: var(--oranjeDonker)  !important; }
.bg_ol{ background-color: var(--oranjeLicht)   !important; }
.bg_mb{ background-color: var(--blauwMiddel);  }                                /* Midden Blauw  */
.bg_mo{ background-color: var(--oranjeLicht);  }                                /* Midden Oranje */
.bg_gd{ background-color: var(--groenDonker)   !important; }
.bg_gl{ background-color: var(--groenLicht)    !important; }                    /* licht groen   */
.bg_rd{ background-color: var(--roodDonker);   }

.bg_qf{ background-color: var(--questionFout); }                                      /* question fout */
.bg_qg{ background-color: var(--questionGoed); }                                      /* mja.          */

.tx_od{ color: var(--oranjeDonker); }
.tx_bd{ color: var(--blauwDonker); }

.bg_st{ background-color: var(--zilverBackground);}                             /*standaard achtergrond, toegevoegd voor de goudstaven-vraag */

/* roboto-regular - latin */
@font-face{
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'),
      url('/fonts/roboto-v19-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('/fonts/roboto-v19-latin-regular.woff2') format('woff2'),  Super Modern Browsers
      url('/fonts/roboto-v19-latin-regular.woff') format('woff'), /* Modern Browsers */
      url('/fonts/roboto-v19-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
      url('/fonts/roboto-v19-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

@font-face{
    font-family: 'Architects Daughter';
    font-style: normal;
    font-weight: 400;
    src: local('ArchitectsDaughter'), url('/fonts/ArchitectsDaughter.ttf') format('truetype')
}
/* deze wordt gebruikt in de plaatjes die we versturen bij Rekenen */
@font-face{
    font-family: '';
    font-style: normal;
    font-weight: 400;
    src: local('Josefin Sans'), url('/fonts/JosefinSans-VariableFont_wght.ttf')
}

/* 20230417 font toegevoegd om in chrome de formules mooi te maken (grote haakjes) */
@font-face{
    font-family: 'Fira Math';
    font-style: normal;
    font-weight: 400;
    src: local('Fira Math'), url('/fonts/FiraMath-Regular.otf')
}

/* fallback */
@font-face{
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(/fonts/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons{
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
}