/* Set the maximum width of the labels of input elements for each event row */
.run-container .form-horizontal .form-group.align_horizontally .control-label {
    width: auto;
    max-width: 200px;
}

/* Align the labels of the input elements for each event row and give them some spacing */
.run-container .form-horizontal .label_as_placeholder .control-label {
    float: left;
    width: auto;
    padding-top: 5px;
    text-align: right;
    white-space: normal;
}
.run-container .form-horizontal .form-group.form-row.item-note.note_width300 .control-label {
    width: 300px; 
    text-align: right !important;
}

/* Set the maximum width of the input elements in each event row */
.run-container .form-horizontal .form-group.right80 .controls,
.run-container .form-horizontal .form-group.right80 .controls .form-control {
    max-width: 200px;
}

/* Hide the mermaid calendar container until the web page is loaded. It is made visible again via JavaScript */
.run-container .form-group .formr-mermaid {
    display: none;
}

/* specify the color of the filling of the first domain in the EHC */
.run-container .form-group.item-note .formr-mermaid .section1 {
    fill: #66FF99 !important;
}

/* specify the color of the filling of the third domain in the EHC */
.run-container .form-group.item-note .formr-mermaid .section3 {
    fill: #FF6666 !important;
}