/* RKVV Bergeijk Bestandenportaal */
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/barlow-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/barlow-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/barlow-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/barlow-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/barlow-condensed-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/barlow-condensed-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/barlow-condensed-latin-800-normal.woff2) format('woff2')}

body{margin:0;background:#F4F5F1;color:#0F1B2D;font-family:'Barlow',Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:#0B4F9C}a:hover{color:#083A75}
button{font-family:inherit}
input,textarea{font-family:inherit;color:#0F1B2D}
button:focus-visible,a:focus-visible{outline:3px solid #22D3EE;outline-offset:2px}
button:disabled{cursor:default!important}

.boot{min-height:100vh;display:flex;align-items:center;justify-content:center}
.boot img{border-radius:50%;background:#fff;object-fit:contain;animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.4}}

/* Hover/focus-states uit het design */
.fi:focus{border-color:#0B4F9C!important}
.fi2:focus{border-color:#0B4F9C!important;background:#fff!important}
.hy:hover{background:#F2D900!important}
.hb:hover{border-color:#0B4F9C!important}
.hd:hover{background:#083A75!important}
.hr:hover{background:#FDECEC!important}
.hv:hover{background:#16243A!important}
.hl:hover{color:#0B4F9C!important;text-decoration:underline}
.hdash:hover{border-color:#0B4F9C!important;color:#0B4F9C!important}
.hleave:hover{border-color:#B42318!important;color:#B42318!important}

.spin{display:inline-block;width:18px;height:18px;border:2.5px solid currentColor;border-right-color:transparent;border-radius:50%;animation:rot .8s linear infinite;vertical-align:-3px}
@keyframes rot{to{transform:rotate(360deg)}}
.newrow{animation:flash 2.4s ease-out}
@keyframes flash{0%{background:#FFF7B3}100%{background:#fff}}

/* Responsive */
@media (max-width:640px){
  .main{padding:24px 16px 48px!important}
  .hdr-in{padding:12px 16px!important;gap:12px 16px!important}
  .sub-in{padding:0 8px!important}
  .ptitle{font-size:34px!important}
  .hdr-right{margin-left:0!important;width:100%;justify-content:space-between}
  .modal-box{padding:22px!important}
  .modal-wrap{padding:12px!important;align-items:flex-end!important}
}