/* inlog schermpje */
.bg_od {
  background-color: #FF8500 !important;
}
.bg_ol {
  background-color: #FDD282 !important;
}
.bg_mb {
  background-color: #B7BCE1;
}
/* Midden Blauw  */
.bg_mo {
  background-color: #FDD282;
}
/* Midden Oranje */
.bg_gd {
  background-color: #47B64D !important;
}
.bg_gl {
  background-color: #7FDA7A !important;
}
/* licht groen   */
.bg_rd {
  background-color: #CE4747;
}
.bg_qf {
  background-color: #CCCCCC;
}
/* question fout */
.bg_qg {
  background-color: #009304;
}
/* mja.          */
.tx_od {
  color: #FF8500;
}
.tx_bd {
  color: #006EB3;
}
.bg_st {
  @zilver Background;
}
/* 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');
}
/*
@font-face {
    font-family: 'Noticia Text';
    font-weight: 400;
    font-style: normal;
    src: url('https://fonts.googleapis.com/css2?family=Noticia+Text&display=swap')
}
*/
.at-form {
  overflow: hidden;
  font-size: 15px;
  margin-left: 1em;
  margin-right: 1em;
}
.at-form input {
  padding: 5px !important;
  width: 100%;
}
ul.HPROpsommen {
  counter-reset: list;
}
ul.HPROpsommen > li {
  list-style: none;
  position: relative;
  font-size: 1.2em;
  font-weight: 600;
}
ul.HPROpsommen > li:before {
  content: ">";
  left: -20px;
  padding-right: 10px;
  position: absolute;
  text-align: right;
  width: 20px;
  font-weight: 800;
  color: #FF8500;
}
.at-title h1 {
  font-size: 1.7em;
}
.at-error,
.at-result {
  border: 5px #FF8500 solid;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  color: #FF8500;
  background-color: #FFF;
}
.at-error > p,
.at-result > p {
  font-weight: 800;
  margin: 0px;
}
.at-result {
  border: 5px #009304 solid;
  color: #009304;
}
.at-sep {
  display: none;
}
.at-form label {
  display: inline-block;
  width: 100%;
  margin: 10px 0px 0px 0px;
  color: #1E2447;
  font-size: 15px;
}
.at-form a.at-link {
  color: #FF8500;
  text-decoration: none;
}
.at-form a.at-link:hover {
  color: #FF8500;
  text-decoration: underline;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus textarea:-webkit-autofill,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: #000;
  -webkit-box-shadow: 0 0 0px 1000px #FFF inset;
  transition: background-color 5000s ease-in-out 0s;
}
.welkomHeader {
  height: 100px;
  background-color: #616FBD;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.75);
}
#divWelkomForm {
  background-color: #FFF;
  color: #1E2447;
  -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.47);
  -moz-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.47);
  box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.3);
  border: 2px solid #1E2447;
  border-radius: 5px;
}
.divWelkomFormTitle {
  padding-top: 1em;
  font-size: 1.5em;
}
.frmAccount .divTitle {
  font-size: 2em;
  padding-top: 1em;
  color: #1E2447;
  font-weight: 400;
}
.frmAccount .divLabel {
  padding-top: 1em;
  color: #1E2447;
  font-weight: 800;
}
.frmAccount input,
#at-pwd-form input {
  width: 100%;
  margin-right: 6px;
  height: 33px;
  border-bottom: 4px solid gray;
  color: black;
}
p.foutje {
  padding: 0.5em;
  border-left: 5px solid #CCCCCC;
  border-bottom: 2px solid #CCCCCC;
}
.frmAccount input:focus {
  border-bottom: 4px solid #FF8500;
}
.divFoutboodschap {
  border: 2px solid #CCCCCC;
  color: white;
  padding: 1em;
  margin: 1em;
}
.divFoutboodschap:empty {
  display: none;
}
.divFeedback {
  border: 2px solid #47B64D;
  color: white;
}
.divFeedback:empty {
  display: none;
}
.row .ruimteBOenON {
  margin-top: 1em;
  margin-bottom: 1em;
}
#divRekenenHP h1 {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 800 !important;
}
#divRekenenHP .parSloganHP {
  text-shadow: 2px 3px 0px #FF8500;
  text-align: center;
  line-height: 1.5em;
}
#divRekenenHP h3 {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  border-bottom: none;
  padding: 0px;
  margin: 0px;
  margin-bottom: 00em;
  text-align: center;
}
#divRekenenHP h4 {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  color: #1E2447;
}
#divRekenenHP .divDonker h3 {
  color: white;
}
.div3Rij {
  padding: 1em;
}
.divLicht {
  background-color: #FFF;
  color: #616FBD;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
}
.divBeetjeLicht {
  background-color: #f1f2f9;
  color: #616FBD;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
}
.divDonker {
  color: white !important;
  background-color: #616FBD;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
}
.navbar {
  background-color: #616FBD;
}
.navbar li a {
  color: #ffffff !important;
}
.navbar li a:hover {
  border-bottom: 2px solid !important;
  background-color: #616FBD;
}
.navbar-brand {
  color: #ffffff !important;
  font-weight: bold;
}
.navbar-fixed-top.scrolled {
  background-color: rgba(34, 34, 34, 0.95) !important;
  transition: background-color 1000ms linear;
}
.icon-bar {
  background-color: #ffffff !important;
}
.navbar-toggle:hover,
.navbar-toggle:focus {
  background-color: transparent !important;
}
.btnInlogscherm {
  padding: 0.5em;
  bottom: 0px;
  font-family: 'Josefin Sans', sans-serif;
  font-weight: 800;
  font-size: 1.5em;
  margin-top: 1em;
  width: 100%;
  margin: auto;
  display: block;
}
.parSubButton {
  padding-top: 1em;
  text-align: center;
  color: white;
}
#divAccountAanmakenB,
#divRekenenInloggenB {
  display: none;
}