html, body,.full-height {
    height:100%;
}
body{
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
.xforms-ui-overlay{position:absolute; overflow:hidden; margin: 0; padding: 0;}
h1, h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-weight: 700 !important; color:#281F6B !important;}
h1, h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6, legend,.col-form-label{font-family: "Karbon-Medium";}
a{word-break: break-all;}
a.externallink::after{
  content: "\f35d";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size:16px;
  margin-left:5px;
}
a.logout{font-weight:700; font-family: "Karbon-Medium"}
.form-check label{font-weight:normal;}
label.btn{cursor:pointer;}
fieldset.xforms-group > legend{font-weight:bold;}
.w-15{width: 15% !important;}
.form-border{border-width:3px !important;}
.required-indicator{color:red;}
.ui-datepicker-trigger, .ui-datepicker-clear{display:none;}
.sfs-uploads{overflow:hidden;}
.xforms-field-alert {
  display:none;
  background-color: transparent;
  font-size:20px;
  padding:10px 0 10px 20px;
  color: #D11F3D;
  box-shadow: 0 0 0 1px #transparent;
  border-radius: 0 0 4px 4px;
}
.xforms-split-date-cc{display:block;}
.xforms-group.xforms-ap-minimal .xforms-field-alert { display: none;}
.xforms-invalid .xforms-field-alert { display: flex;}
.noscript .xforms-message { display: none;}
.xforms-message.ephemeral, .script .xforms-message.ephemeral { display: inline-block; width: auto;}
.script .xforms-message {display: none;}
.required-indicator {display: none;}
.xforms-required .required-indicator {display: inline;}
.xforms-rc.current .btn-link:disabled{ font-weight:bold; color:#000 !important; background-color: transparent;}
input[type="radio"].form-control, input[type="checkbox"].form-control{width:24px; height: 24px; background-color:transparent; position:relative;}
.xforms-rc .btn-link:disabled{background-color: transparent;}

.form-control:focus{border:0;}

.footer-text{font-family:"Karbon-SemiBold";}
.jump-to-page{text-decoration:underline !important;}

.split-date-day:focus,.split-date-month:focus,.split-date-year:focus{
  color: #281F6B;
  background-color: #F4F4F7;
  border-color: #7CA7E3;
  border:0;
  outline: 0;
  box-shadow: 0 0 0 2px #7CA7E3;
  width: 100% !important;
}
.xforms-invalid input, .xforms-invalid textarea{border:none; box-shadow: 0 0 0 1px #D11F3D;}
.form-check{padding-left: 2.25rem;}
.form-check-input{width: 20px; height: 20px; margin-top:0 px; margin-left: -2.25rem;}
.xforms-invalid .form-check-input{box-shadow:none;}
.xforms-valid.xforms-modified input[type=text], .xforms-valid.xforms-modified select, .xforms-valid.xforms-modified textarea{border:none; box-shadow: 0 0 0 1px #61B375;}
.xforms-valid.xforms-modified .success-icon{display:inline-block;}
.success-icon{
  display:none;
  background-image: url('../img/vicon.svg');
  width: 20px;
  height:20px;
  background-size:contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  bottom: 13px;
  left: 96%;
}
.input-group .help-block{top:-1px;}

select.form-control[size], select.form-control[multiple]{
  padding: 0.375rem 0.75rem;
  height:48px !important;
}

.trg_left{border-color:rgba(39,31,104,0.35)}


.hint::before{
  content:"(";
}
.hint::after{
  content:")";
}
.hint:empty{
  display:none;
}
.help-block{ 
  border-color: rgba(39,31,104,0.35) !important;
  position: relative;
  display: inline-block;
  margin:0 5px;
  height:18px;
}
.help-block img{width:18px; margin-top:-5px;}
.xforms-help-box .card{ background-color:#E5EFF8; border:none;}
textarea{height:200px !important;}
textarea.sfs-ta-klein{height:100px !important;}
textarea.sfs-ta-middel{height:200px !important;}
textarea.sfs-ta-groot{height:300px !important;}
.xforms-form .xforms-rc:first-child:last-child > .xforms-group > .sfs-repeat-remove-button {
  display: none;
}
legend.sfs-control-label{ font-size:1.25rem;}
.ui-geo-picker-map{ display:block !important; width:100% !important;}



.footer{
    position: absolute;
    bottom: 0;
    width: 100%;
    line-height: 60px;
}

.footer-title{
  font-family: 'Karbon-SemiBold';
    font-size: 24px;
    color: #000078;
    text-align: center;
}
.split-date-day, .split-date-month, .split-date-year{
  height: 48px;
  width:2em !important;
  min-width: 100px !important;
  padding: 0.375rem 0.75rem;
  font-family: "Karbon-Regular", Verdana, sans serif;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.5;
  color: #281F6B;
  background-color: #F4F4F7;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 4px;
}
fieldset legend label,fieldset legend{
 font-size:20px;
}
.alert-info{background-color: #E5EFF8;}
.alert-info,.alert-warning,.alert-danger{padding:1rem; margin-bottom:30px;}
.sfs-repeat-remove-button, .sfs-repeat-add-button{text-decoration: underline !important;}

/* Fix Successpage*/
div.content-body{margin:0 25%;}

@media only screen and (max-width: 767px) {
  div.content-body{margin:0;}
}
@media only screen and (max-width: 600px) {
  .logo {
    margin-left:15px;
    margin-top:12px;
  }
  .motto{margin-left:25px;}
}
/* Dialog overlay styling*/
#xf-dialog-overlay {
    z-index: 0;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

#xf-dialog-overlay.ismodal {
    z-index: 5;
}

#xf-dialog-overlay #xf-dialog-screen {
    width: 100%;
    height: 100%;
    background-color: transparent;
    opacity: 0;
}

#xf-dialog-overlay.ismodal #xf-dialog-screen {
    background-color: #000;
    opacity: 0.5;
}

#xf-dialog-overlay .dialog {
    z-index: 10;
    position: absolute;
    margin: auto;
    top: 25%;
    left: 50%;
    min-width: 400px;
    max-width: 600px;
    transform: translateY(-25%);
    transform: translateX(-50%);
    border: 2px solid black;
    padding: 10px;
    background-color: white;
}
/* End Dialog */


/* Datepicker: To make disabled buttons not clickable */
#myDatepickerGrid {width: 100%;}
.datepickerDialog tr th{text-align: center;}
.datepickerDialog{width: 400px; z-index:3;}
.disabled { pointer-events: none; }
.dateButton{width: 48px;}
.dateButton.disabled{opacity: .35; background-color:#EBEBEB; color:#16113B; border:none; }
.dayNotInMonth{display:none;}
#myDatepickerGrid th, button.dateButton{font-weight:normal; font-family: "Karbon-Regular", Verdana, sans serif;}
#myDatepickerGrid button.dateButton:focus{background-color:#3297FD; color: white;}
.prevMonth,.nextMonth{line-height:0;}
.nextMonth img,.prevMonth img{height:24px;}
.next_btn, .prev_btn{width: 20%;}
.logout img{ height: 20px; margin-left:5px;}
.pagelist-page img{position: absolute; top: 15px; right: 15px;}
.alert{border:0 !important;}
@media screen and (max-width: 765px) {
  .next_btn, .prev_btn{width: 100%;}
}
@media screen and (max-width: 560px) {
  .success-icon{left:90%;}
}

.indicator{  color: #dc3545 !important; }
.xforms-output{word-break: break-all;}
.sfs-repeat-remove-button{color:#D11F3D;}
.sfs-repeat-add-button{color:#00804D;}
.wcag-alerts{margin-bottom: 0; !important}

.xforms-output.sfs-ephemeral-output.xforms-ap-default{
	word-break: break-word !important;
}

label.select1-label > legend,
label.check-group-label > legend{
	margin-bottom: 0px;
}
p.break-word span{
	word-break: break-word;
}
.font-weight-bold{font-family: "Karbon-Medium" !important;}
strong{font-family: "Karbon-Medium" !important;}
.summary .rowheader{width:50% !important;}

/* Aanpassingen WCAG test feedback  */
.container-text{
  font-family: 'Karbon-Medium';
    font-weight: bolder;
    font-size: 24px;
    color: #281F6B;
    margin-bottom: 0;
}
select.form-control, input.form-control{border-color:#949494;}
select.form-control:focus, input.form-control:focus{
  box-shadow: 0 0 0 2px #281F6B;
}