/*Achtergrondkleur rondom formulier en algemene tekstkleur */

body.orbeon {
  font-family : Verdana, Arial, sans-serif; }


/* Achtergrondkleur formulier en kader*/
.fr-border {
  /*border-bottom : 40px solid #e1004f;*/
  border-bottom : 5px solid #e1004f;
}


/* Achtergrondkleur logo */
/*
.fr-view:before {
  background-color: #FFF; }
*/

/* Link kleur (tip: gelijk aan kleur van knoppen) */
.orbeon a:hover,
.orbeon a:active,
.orbeon a:focus {
    color: #e1004f;
    text-decoration: underline; 
}
.orbeon .overzicht-trigger button.btn {
    color: #e1004f;
}
.orbeon .overzicht-trigger button.btn:hover,
.orbeon .overzicht-trigger button.btn:active,
.orbeon .overzicht-trigger button.btn:focus {
    color: #e1004f;
    text-decoration: underline;
}

/* Achtergrondkleur titelbalk */

.orbeon .navbar-inverse .navbar-inner {
  background-color : #e1004f; 
min-height : 10px; }


/* Tekstkleur titelbalk met formtitel in smalle titelbalk*/
/*
.orbeon .navbar-inverse .navbar-inner .container h1 {
  color : #FFF;
  line-height : 10px;}

.orbeon .navbar-inverse .navbar-inner span,
.orbeon .navbar-inverse .navbar-inner .container {
  line-height: 10px;
}
*/

/* Tekstkleur titelbalk geen formtitel alleen smalle balk*/

.orbeon .navbar-inverse .navbar-inner .container h1 {
  color : #FFF;
  line-height : 10px;
  display : none;}

.orbeon .navbar-inverse .navbar-inner {
  background-color : transparent;
border-bottom: 5px solid #e1004f;}


/* Tekstkleur paginakoppen */

.orbeon h2,.orbeon h3,.orbeon h4,.orbeon h5,.orbeon h6 {
  color : #e1004f; }


/* Kleuren actief menu-item  */

.fr-formnavigation span.button-active button, .orbeon .btn:focus, .orbeon .btn:active, .orbeon .btn.active {
  background-color : #e1004f;
  border-color : #e1004f;
  color : #FFF; }


/* Kleuren (menu) buttons */

.yui-skin-sam .yui-button button, .orbeon button.close, .orbeon button.btn {
  font-family : Verdana, Arial, sans-serif;
  background-color : #e1004f;
  border-color : #000; 
  color : #000; }


/* Kleuren (menu)buttons mouse-over */
.orbeon button.btn {
    background-color: #e1004f;
}

.orbeon .btn:hover, .orbeon .btn:focus, .orbeon button.close:hover, .orbeon button.close:focus {
  color: #000;
  background-color : #fbeceb;
  border-color : #000; }


/* Uitgeschakelde buttons (disabled) */

.orbeon .btn.disabled, .orbeon .btn[disabled], .orbeon .btn.disabled:hover, .orbeon .btn[disabled]:hover {
  background-color: #e1004f;
  border : #e1004f; 
  color : #888; 
}


/* Standaard velden: kleur kader */
/*
.orbeon select, .orbeon textarea, .orbeon input[type="text"], .orbeon input[type="password"], .orbeon input[type="datetime"], .orbeon input[type="datetime-local"], .orbeon input[type="date"], .orbeon input[type="month"], .orbeon input[type="time"], .orbeon input[type="week"], .orbeon input[type="number"], .orbeon input[type="email"], .orbeon input[type="url"], .orbeon input[type="search"], .orbeon input[type="tel"], .orbeon input[type="color"], .orbeon .uneditable-input {
 border-color : #AAA; }
*/

/* Verplichte velden: Veldkader en schaduwkleur */

.orbeon .xforms-required input, .orbeon .xforms-required textarea, .xforms-required-empty .xforms-input-input {
  border-color : #e1004f;
  box-shadow:  0px 0px 2px 1px #e1004f;}


/* Verplichte velden: Achtergrondkleur blok */

.xforms-required  { 
  background-color : #fbeceb;
  padding-right: 0px;
  margin-right: 0px;
  padding: 5px 0px 5px 0px;
  margin: -5px 0px -5px 0px;
}


/* Verplichte velden: kaderkleur correct ingevuld */
/*
.orbeon .xforms-required.xforms-filled input {
  border-color : #e1004f;
  box-shadow : none; }
*/

/* Verplichte velden: kleur van de asterisk '*' */

.xforms-required label em {
    color: #e1004f; }


/* Kleur kader en schaduw van het huidig actieve veld */

.orbeon textarea:focus, .orbeon input[type=text]:focus, .orbeon .xforms-required.xforms-invalid.xforms-visited textarea:focus, .orbeon .xforms-required.xforms-visited textarea:focus {
  border-color : #fbeceb;
  box-shadow: 0px 0px 2px 1px #e1004f; }


/* Kleur pijltjes voor uitleg bij een vraag */

.xforms-hint::before {
  color : #e1004f; }


/* Kleur kader foutieve velden */

.orbeon .xforms-invalid.xforms-visited .xforms-input-input, .orbeon .xforms-invalid.xforms-visited input[type="password"], .orbeon textarea.xforms-invalid.xforms-visited, .orbeon .xforms-required.xforms-invalid.xforms-visited textarea {
  border-color: #F00; }
*/

/* Kleur tekst foutmelding of waarschuwing */

.orbeon .xforms-invalid > .xforms-alert.xforms-active, .orbeon .xforms-alert.xforms-active.xforms-invalid {
  color : #e1004f; }


/* kleur pijltjes voor foutmelding of waarschuwing */

.xforms-alert::before {
  color : #e1004f; }


/* Tekstkleur Waarschuwing versturen onvolledig ingevuld formulier */
/*
.warningtxt, .warningtxt+span {
  color : #F00000; }
*/

/* Achtergrondtkleur Waarschuwing versturen onvolledig ingevuld formulier */
/*
.warningtxt, .warningtxt+span {
  background-color : #FFE6E6; }
*/

/* Kleur van de RAND om help popup (alle border kleuren hieronder horen gelijk) */
/*
.orbeon .popover              { border-color       : #000; }
.orbeon .popover.right .arrow { border-right-color : #000; }
.orbeon .popover.left .arrow  { border-left-color  : #000; }
*/

/* Achtergrondkleur popup (alle kleuren horen gelijk) */
/*
.orbeon .popover.right .arrow:after  { border-right-color: #FAFAFA; }
.orbeon .popover.left .arrow:after   { border-left-color : #FAFAFA; }
.orbeon .popover                     { background-color  : #FAFAFA; }
*/

/* Kleuren popup titel */
/*
.orbeon .popover-title
  { border-bottom : 1px dashed #BBB;
    background-color : #FAFAFA; }
*/

/* Hyperlink kleur 20150828 */
.orbeon a {
  color: #e1004f;
  text-decoration: none;
  font-weight : bold; }

  
.fr-form-group a {
    font-family: verdana;
}


.fr-top h1 {
    font-family: verdana;
}

.orbeon img {
    height: auto;
    max-width: 100%;
    border: 0px none;
    float: right;
    padding-left: 150px;
}

/* Begin CSS toegevoegd door Stefan */
.orbeon .xforms-textarea textarea, .orbeon input, .orbeon button, .orbeon select, .orbeon textarea, .orbeon .orbeon-portlet-body { font-family:Verdana, Arial, sans-serif; }

.alert { width:100%; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-box-sizing: border-box; }

.xforms-required.xforms-filled { background-color:transparent; }
.xforms-required.xforms-invalid.xforms-filled { background-color:#fbeceb; }

.xforms-upload.xforms-required, .fr-attachment.xforms-required { margin:0; }

.custom_attachment .xforms-trigger a { visibility:hidden; }
.custom_attachment .xforms-trigger a:before { display:table; visibility:visible; content:"Voeg nog een bijlage toe"; margin:10px -5px; color:#e1004f; font-weight:bold; cursor:pointer; }

@media screen\0 {
  .custom_attachment .xforms-trigger a { visibility:visible; }
  .custom_attachment .xforms-trigger a:before { content:"";visibility:hidden; margin:0; }
  .custom_attachment .xforms-trigger a img { display:none; }
}

@media screen\9 {
  .custom_attachment .xforms-trigger a { visibility:visible; }
  .custom_attachment .xforms-trigger a:before { content:"";visibility:hidden; margin:0; }
  .custom_attachment .xforms-trigger a img { display:none; }
}
/* Einde CSS toegevoegd door Stefan */
/* Begin CSS toegevoegd Maikel */

@media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
	.orbeon .headerImage {
	    float: right;
	}
	.digid-button .btn {
	    min-width: 160px;
	    width: 100%;
	    margin: 80px 0px -50px 0px !important;
	}
	.collapseTrigger:checked ~ .fr-formnavigation span.button-inactive,
	.collapseTrigger:checked ~ .fr-formnavigation span.button-active {
	    height: auto;
	    margin-bottom: -35px;
	}
	.collapseTrigger:checked ~ .fr-formnavigation > span button {
		padding: 0px;
	}

}

@media screen and (max-width:870px) {
  .xforms-input,
  .xforms-input-input,
  .orbeon input {
    //width: 100% !important;
      width: 95% !important;
      display: block !important;
      margin: 0 auto;
  }
}

@media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
	div.fr-formnavigation {
	    margin-bottom: 10px;
	}
}

.btn:focus {
outline: 0;
outline: none;
}
.xforms-control label.xforms-label {
    /* line-height: 3; */
    vertical-align: top;
}
.xforms-readonly .xforms-output-output {
    margin-bottom: 10px;
    margin-left: 10px;
}

html body .orbeon .fr-formnavigation > span:first-child button {
    padding: 0px 20px 0px 20px;
}
html body .orbeon .fr-formnavigation > span button {
	padding: 0px 20px 0px 30px;
}
html body .orbeon .fr-formnavigation > span:last-child button {
	padding: 0px 20px 0px 30px;
}

body .orbeon .fr-formnavigation button.btn {
    min-width: auto !important;
    //min-width: 200px !important;
}
div.block-layout-vertical .xforms-label {
    display: inline-block;
    /*vertical-align: top;*/
    vertical-align: top;
}
/* if internet explorer */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    body .xforms-select1 > select {
        margin-top: 17px;
    }
    .xforms-label {
        /*line-height: 2.5 !important;*/
    }
}
body .orbeon .fr-formnavigation button.btn {
    min-width: 160px;
}
html body .xforms-form .xforms-initially-hidden {
    display: none !important;
}
.xforms-upload input.xforms-upload-select {
    margin-left: 10px;
}
.xforms-label {
    vertical-align: top;
    /*vertical-align: middle;*/
    /*line-height: 4.5;*/
}
.horizontal .xforms-items {
    vertical-align: middle;
    display: inline-block;
    width: 100px;
}
.orbeon .xforms-textarea textarea {
    width: 70%;
    margin-top: 10px;
    margin-bottom: 10px;
    vertical-align: middle;
    margin-left: 10px !important;
}
.xforms-label {
    width: 240px;
}
/*EDIT*/
div.block-layout-horizontal .xforms-label {
    display: inline-block;
    /* width: 230px; */
    margin-right: 10px;
    margin-left: 10px;
}
.fr-formnavigation {
    margin:0;
    max-width: inherit;
    width: 100%;
}
.button-relevant, .button-irrelevant {
  float:left;
  margin: 5px 0 5px 0;
}
.tab-visible {
  display:block;
}
.xforms-update-full {
  max-width: inherit;
  width: auto;
  margin: 0px;
}
.block_title {
    color: #e1004f;
    padding-top: 2em;
    padding-bottom: 1em;
}
.orbeon h2 .xforms-control .xforms-output-output {
    //font-size: 18px;
    //margin-left: 10px;
}
.xforms-input-input {
  width: 70% !important;
  border-radius: 3px;
}
.fr-formnavigation span {
  margin-right: 5px;
}
.yui-skin-sam .yui-button button, .orbeon button.close, .orbeon button.btn {
  font-family: Verdana, Arial, sans-serif;
  background-color: #fbeceb;
  border: 0px;
  color: #000;
}
.orbeon button.btn {
    background-color: #e1004f;
}/*
.orbeon button.btn {
  background-color: #fbeceb;
}*/
.orbeon .btn[disabled] {
  color: #000;
  background: #fbeceb;
}
.orbeon .btn[disabled]:hover {
  color: #000;
  background: #fbeceb;
  cursor: not-allowed;
}
.orbeon .btn[disabled]:before {
  display:inline-block;
  border-top-color: #fbeceb;
  border-bottom-color: #fbeceb;
  border-left-color: white;
}
.orbeon .btn[disabled]:hover:before {
  display:inline-block;
  border-top-color: #fbeceb;
  border-bottom-color: #fbeceb;
  border-left-color: white;
}
.orbeon .btn[disabled]:hover:after {
  border-left-color: #fbeceb;
}
.button-active button.btn {
  background: #e1004f;
}
.button-active button.btn:after {
  border-left-color: #e1004f;
}
.button-inactive button.btn {
  background: #fbeceb;
}
.button-inactive button.btn:after {
  border-left-color: #fbeceb;
}
/* RELEVANT TAB */
.button-relevant button.btn {
  background: #e1004f;
}
.button-relevant button.btn:hover {
  color: #fff;
}
.button-relevant button.btn:after {
  border-left-color: #e1004f !important;
}
.button-relevant button.btn:hover:after {
  border-left-color: #e1004f;
}
/* IRRELEVANT TAB*/
.button-irrelevant button.btn:before {
  border-left-color: white;
}
.button-irrelevant button.btn:after {
  border-left-color: #fbeceb;
}
/*.problem btn */
.orbeon .fr-formnavigation span.problem span button {
     border: 0px;
}
/*title to top */
.orbeon .fr-body h2 {
    margin-top: 0;
}
.fr-formnavigation > span:first-child .btn:before {
  display:none;
}
.fr-formnavigation > span .btn:before {
  display:inline-block;
  content: "";
  position: absolute;
  height: 0px;
  width: 0;
  top: -0.5px;
  border-top: 16.2px;
  border-bottom: 16px;
  border-left: 16px;
  border-right: 16px;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-left-color: white;
  border-right-color: transparent;
  border-style: solid;
  left: 0px;
  z-index: 900;
}
.fr-formnavigation > span .btn:after {
  display:inline-block;
  content: "";
  position: absolute;
  height: 0px;
  width: 0;
  top: -0.5px;
  border-top: 16.2px;
  border-bottom: 16px;
  border-left: 16px;
  border-right: 16px;
  border-style: solid;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #fbeceb;
  border-right-color: transparent;
  right: -32px;
  z-index: 3000;
}
.fr-formnavigation > span:last-child .btn:before {
  display:inline-block;
}
.fr-formnavigation > span:last-child .btn:after {
  display:none;
}
.fr-formnavigation > span:last-child .btn:hover:after {
  display:none;
}
.orbeon .btn:hover, .orbeon .btn:focus, .orbeon button.close:hover, .orbeon button.close:focus {
  color: #000;
  background-color : #e1004f;
  border : 0px;
  outline: none;
}
.orbeon .xforms-required input[type="radio"], .orbeon .xforms-required input[type="checkbox"] {
    box-shadow: none !important;
}
.xforms-label.xforms-mediatype-text {
    margin: 0px 0px 5px 0px;
}
.orbeon .fr-body {
    display: block;
    box-sizing: border-box;
    padding-bottom: 50px;
}
.nav-next {
    float: right;
}
.nav-next .xforms-control .xforms-trigger .xforms-trigger-appearance-full {

}
.xforms-label {
    /*line-height: 4.5;*/
}
.xforms-input {
    /*line-height:3.5;*/
    vertical-align: middle;
}
label.xforms-label {
    /*line-height:3;*/
    vertical-align: middle;
}
.vertical .xforms-items {
    display: inline-block;
    /*vertical-align: bottom;*/
    /*padding-top: 1%;*/
    /*padding-bottom: 1%;
    margin-bottom: 3px;*/
    vertical-align: middle;

}
.xforms-select1 > select {
    margin-top: 10px;
    vertical-align: middle;
    width: 70%;
}
.digidBox {  
  position: relative;
  top: -85px;
  right: 0px;
}
.xforms-readonly .xforms-output-output {
    margin-bottom: 10px;
    margin-left:10px !important;
}
.orbeon .xforms-invalid > .xforms-alert.xforms-active {
  margin-left:10px !important;
}
.orbeon .alert {
  //padding: 8px 0px 0px 10px !important;
  padding: 8px 0px 0px 0px !important;
}
/* tekst-lang */
.tekst-lang .xforms-items {
    margin-left: 240px;
}

.tekst-lang .xforms-label {
    width:100%;
}

.xforms-trigger [role="link"] {
    margin-left: 10px;
}
.orbeon .radio input[type="radio"] {
    //border-radius: 50%;
    //width: 10px !important;
}
body .orbeon label.radio input[type="radio"], 
body .orbeon label.checkbox input[type="radio"], 
body .orbeon label.radio input[type="checkbox"], 
body .orbeon label.checkbox input[type="checkbox"] {
	width: 15px !important;
}

.xforms-select1 .xforms-items {
    margin: auto 0px 0px 10px;
}

.orbeon h3 .xforms-control .xforms-output-output, 
.block_title div.xforms-output-output {
    font-size: 16px;
    margin-left: 10px;
}

.default-block.overzicht > div {
  margin-left:10px;
}

.default-block.overzicht .block_title div.xforms-output-output, .default-block.overzicht .xforms-readonly .xforms-output-output {
  margin-left:0 !important;
}

/*content-item only*/
/*.overzicht .block_title div.xforms-output-output {
    margin-left: 10px;
}
[id*="-content-item"] {
    margin-left: 10px;
}*/

@media only screen and (max-width: 728px) {

  .orbeon .fr-body h2 {
      margin-top: 0px;
      position: relative;
  }

}

@media only screen and (max-width:480px) {

  .button-relevant, .button-irrelevant {
      float: none;
      margin: 5px 0 5px 0;
  }

  .fr-formnavigation > span .btn:before {
      /*display:inline-block;*/
      display:none !important;
  }

  .xforms-items {
      margin-top: 5px;
  }

  .xforms-label {
      width: 100% !important;
  }

  .tekst-lang .xforms-items {
      margin-left: 0px;
      margin-top: 5px;
  }

}

@media only screen and (max-width:939px) {

  .tab-visible {
      display: inline-block;
      width: 100%;
  }

}

/* CALENDAR */
div#orbeon-calendar-div {
    width: 350px;
}

.yui-skin-sam .yui-calcontainer {
    background-color: #fff; 
    border: 1px solid #333;
    padding: 5px;
    border-radius: 10px;
    padding: 15px;
    height: 200px;
    width: 290px;
}

.yui-skin-sam .yui-calendar a.calnav {
    color: #000;
    border: 0px solid grey;
    font-weight: 700;
    /*zoom: 1.5;*/
    font-size: 1.5em;
    text-decoration: none;
}

.yui-skin-sam .yui-calendar {
    width:100%;
}

.yui-skin-sam .yui-calendar td.calcell.oom {
    /*background-color: #fbecebf5;*/
    background-color: rgba(251, 236, 235, 1);
    color: #b4a1a0;
    cursor: default;
}

.yui-skin-sam .yui-calendar td.calcell.selected a {
    background-color: #e1004f;
    color: #fff;
}

.yui-skin-sam .yui-calendar td.calcell a {
    color: #333;
}

.yui-skin-sam .yui-calendar td.calcell {
    border: 1px solid #333;
}
.yui-skin-sam .yui-calendar td.calcell.calcellhover a {
    background-color: #e1004f !important;
}
.yui-skin-sam .yui-calendar td.calcell.calcellhover {
    background-color: #ffffff;
    color: #fff;
    cursor: pointer;
}
/* Einde CSS toegevoegd Maikel */


/* Toegankelijkheidsfixes */
.xforms-readonly .xforms-label {
	color: #757575!important;
}
.orbeon .alert, .orbeon .alert h4 {
	color: #896c3b;
}
.orbeon .alert-success {
	color: #3c753d;
}
.yui-skin-sam .yui-button button, .orbeon button.close, .orbeon button.btn {
	color: #FFF;
}
.orbeon .btn:hover, .orbeon .btn:focus, .orbeon button.close:hover, .orbeon button.close:focus {
	color: #FFF;
}
.orbeon .xforms-hint {
	color: #6b6b6b;
}
.orbeon .xforms-hint a {
	color: #d7004b;
}
.yui-skin-sam .yui-calendar td.calcell.oom {
	color: #756968;
}
/* Einde Toegankelijkheidsfixes */