select[multiple="multiple"]
{
    margin-bottom: 5px;
}

textarea.resizable
{
    resize:    both;
}

.input-row-address-helper{
    font-style: italic;
    padding: 0px 0px 9px 0px;
    font-weight: bold;
}
.input-row-address-helper .input-label{
}
/*
input[type="text"], input[type="password"], select, textarea{
    border-radius: 3px;
    border: 1px solid #CCCCCC;
    background-color: #ffffff;
    box-sizing: border-box;
    color: #000000;
    text-align: left;
    padding-left: 10px;
    height: 30px;
}
*/
input[type="text"], input[type="password"], select[multiple], textarea{
    border-radius: 3px;
    border: 1px solid #CCCCCC;
    background-color: #ffffff;
    box-sizing: border-box;
    color: #000000;
    text-align: left;
    padding-left: 10px;
}
input[type="text"], input[type="password"], select:not([multiple]), textarea{
    height: 30px;
    border: 1px solid #CCC;
    border-radius: 3px;
}

input[type="text"]:focus-visible, input[type="password"]:focus-visible, select:focus-visible, textarea:focus-visible {
    background-color: rgba(0, 153, 204, .1) !important;
    outline: #fff !important;
    box-shadow: none;
    border: 1px solid #09c !important;
}

input[type="text"]:focus, input[type="password"]:focus, select:focus, textarea:focus {
    background-color: rgba(0, 153, 204, .1) !important;
    outline: #fff !important;
    box-shadow: none;
    border: 1px solid #09c !important;
    border-radius: 3px;
}

.content-multicheckbox, .content-checkbox{
    padding: 0px;
}

.content-multicheckbox{
    width: 90%;
}

.content-multicheckbox input[type="radio"] , .content-checkbox input[type="checkbox"], .content-multicheckbox input[type="checkbox"]{
    width: auto;
}

input[type="radio"], input[type="checkbox"]{
   margin: 2px;
}

.multicheckbox-normal label.input-label {
    font-weight: normal;
}

div.input-label{
    margin: 8px 0px 3px 0px;
    padding-left: 5px;
    background-color: rgba(255, 255, 255, 0);
    box-sizing: border-box;
    color: #333333;
    text-align: left;
    line-height: normal;
    font-weight: bold;
}

/*.input-label .required::after{*/
/*    content: '*';*/
/*    color: red;*/
/*    font-size: 16px;*/
/*    font-weight: bolder;*/
/*}*/

form{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: start;
    width: 100%;
    padding: 5px;
}


.display-group-vertical{
    align-self: stretch;
}

.display-group-contact{
    display: flex;
    width: 101%;
}

form > .display-group, .display-group-contact > .display-group, div.flex > .display-group
{
    padding: 1px;
    align-self: stretch;
    width: 49%;
}

#Form_StakeholderMelPairing .display-group {
    width: 100%;
}

#Form_ConfirmRehabilitationState .display-group {
    width: 55%;
}

.display-group-wide
{
    width: 98.6% !important;
}


div.display-group-horizontal{
    width: 98% !important;
    padding: 3px;
}

div.display-group-horizontal fieldset{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: start;
    width: 98%;
    padding: 5px;
}

div.display-group-horizontal div.input-row {
    padding: 3px;
    margin: 0px;
}

.display-group-wide, .display-group-wide .input-row
{

}

.display-group fieldset,
form fieldset
{
    border:            none;
    padding:           0 0 5px 0px;

}


.input-optional, .input-required
{
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: start;
    align-items: stretch;
    justify-content: space-around;
}

.input-optional input, .input-required input, .input-optional select, .input-required select, .input-optional textarea, .input-required textarea,
.input-optional > .input-row, .input-required > .input-row
{
    width: 90%;
}

.input-optional .input-container, .input-required .input-container
{
    width: 100%;
}

.input-optional .input-validator-container, .input-required .input-validator-container
{
    width: 9%;
    background-size: 20px;
    min-width: 20px;
}

.input-required .input-validator-container, .input-optional .input-validator-invalid
{
    background-image: url("/skins/base/images/required.svg");
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;

}
.input-required .input-validator-valid
{
    background-image: url("/skins/base/images/icons/tick.png");
    background-repeat: no-repeat;
    background-position: center;
}

.input-group {
    position: relative;
    display: table;
    border-collapse: separate;
}

.input-group .input-group-addon {
    padding: 6px 12px;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
    display: table-cell;
}

.input-group input {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0;
    display: table-cell;
    padding: 6px 12px;
    border: 1px solid #ccc;
    margin: 0;
}

.input-group.suffix input {
    border-radius: 4px 0px 0px 4px;
}
.input-group.suffix .input-group-addon {
    border-left: 0;
    border-radius: 0px 4px 4px 0px;
}
.input-group.prefix input {
    border-radius: 0px 4px 4px 0px;
}
.input-group.prefix .input-group-addon {
    border-right: 0;
    border-radius: 4px 0px 0px 4px;
}
.input-group.presuffix input {
    border-radius: 0px;
}
.input-group .input-group-addon.prefix {
    border-radius: 4px 0px 0px 4px;
    border-right: 0;
}
.input-group .input-group-addon.suffix {
    border-radius: 0px 4px 4px 0px;
    border-left: 0;
}

.signup-sh-type {
    justify-content: left;
}

.signup-radio-desc {
    margin:0 25px;
}

textarea {
    height: 168px;
}

textarea.textarea-100{
    height: 40px;
}



ul.input-error
{
    background:        url( /skins/base/images/icons/error.png ) no-repeat;
    position:          relative;
    border:            1px dashed #D00;
    color:             #D00;
    margin:            3px 0 4px 0;
    padding:           0;
    text-align:        left;
}

ul.input-error li
{
    margin:            0 0 0 35px;
    list-style-type:   disc;
}

ul.ul-disc li
{
    margin:            0 0 0 35px;
    list-style-type:   disc;
}

.tooltip-error ul.qtip-input-error
{
    background:        url( /skins/base/images/icons/error.png ) no-repeat;
    text-align:        left;
}

.tooltip-error ul.qtip-input-error li
{
    margin:            0 0 0 35px;
    padding-right:     5px;
    list-style-type:   disc;
}
div.textarea-counter
{
    font-size: 10px;
    text-align: right;
    font-style: italic;
    width: 90%;
}

div.textarea-counter-error
{
    color: red;
}

.input-row input[type="checkbox"]{
    margin-right: 5px;
}



textarea.form-image-paster{
    height:75px;
    width: 90%;
    border: 1px solid #aaa;
    clear: both;
    background-repeat: no-repeat; // for pasted image
    background-size: 100% 100%; // for pasted image
}

textarea.form-image-paster-active{
    box-shadow: 0px 0px 3px 3px rgba(58, 121, 184,.4);
}


#Form_DownloadResults #csvfields{
    min-height: 150px !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
}


.form-display-group-button
{
    width:				100%;
    margin: 20px 0px;
}

.form_error
{
    display:none;
    margin-left: 	5px;
    width:			380px;
    width:			490px;
    overflow:		hidden;
}
.error {

    display:block;
}

input[type="submit"]:disabled {
    opacity: 0.5;
    background: #999999;
}

.g-recaptcha{
    margin: 15px 0px;
}

.ui-datepicker-trigger {
    position: absolute;
    width: 27px;
    margin-left: -30px;
    height: 27px;
    margin-top: 2px;
}

.inlineDatepicker input {
    width: 150px;
    margin-right:50px;
}


.multilineDatepicker {
    display: flex;
}


.multilineDatepicker .input-container{
    width: 50%;
    min-width: 150px;
}

.multilineDatepicker .input-container  input.hasDatepicker{
    width: 98%;
}

.input-optional .input-container.multilineDatepicker, .input-required .input-container.multilineDatepicker
{
    width: 90%;
}

.input-required .inlineDatepicker .input-container, .input-optional .inlineDatepicker .input-container {
    display:inline;
}
.multilineDatepicker select, .inlineDatepicker select {
    width: auto;
}

.multilineDatepicker .datepicker-time {
    float: right;
    margin-right: 44px;
}



.input-info-label{
    margin: 0px 0px 10px 10px;
}

.input-info-label-rh-site{
    margin: 10px;
}

.content-checkbox {
    width: 90%;
    display: flex;
    align-items: center;
}

.input-lat-long .input-row {
    width: 45%;
    margin: 0px 2px;
}

.input-lat-long, .input-address-holder {
    display: flex;
    flex-wrap: nowrap;
}


.input-address-holder .input-row {
    margin: 0px 2px;
    width: auto;
}

.input-address-holder .street-number{
    max-width: 125px;
}

.input-address-holder .unit-number{
    max-width: 75px;
}

.input-address-holder .street-name{
    width: 55%;
}

.input-address-holder .province, .input-address-holder .country{
    width: 48%;
}

.input-address-holder .postal-code{
    width: 25%;
}

.input-address-holder .region-administrative{
    width: 73%;
}

.input-address-holder .address-finder{
    width: 75%;
}

.clear-display-group{
    clear: both;
    height: 1px;
    overflow: hidden;
    width: 100%;
}


/* Radio btn */
ul.radio-btn-container {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: auto;
    display: flex;
}

ul.radio-btn-container  li{
    color: #AAAAAA;
    position: relative;
}

ul.radio-btn-container  li input[type=radio]{
    position: absolute;
    visibility: hidden;
}

ul.radio-btn-container  li label{
    display: block;
    position: relative;
    font-weight: 300;
    font-size: 1.35em;
    padding: 25px 25px 25px 80px;
    margin: 10px auto;
    height: 30px;
    z-index: 9;
    cursor: pointer;
}

ul.radio-btn-container  li:hover label{
    color: black;
}

ul.radio-btn-container  li .check{
    display: block;
    position: absolute;
    border: 3px solid #AAAAAA;
    border-radius: 100%;
    height: 25px;
    width: 25px;
    top: 30px;
    left: 20px;
    z-index: 5;
}

ul.radio-btn-container  li:hover .check {
    border: 3px solid black;
}

ul.radio-btn-container  li .check::before {
    display: block;
    position: absolute;
    content: '';
    border-radius: 100%;
    height: 15px;
    width: 15px;
    top: 5px;
    left: 5px;
    margin: auto;
}
.radio-btn-container  input[type=radio]:checked ~ .check {
    border: 3px solid black;
}

.radio-btn-container input[type=radio]:checked ~ .check::before{
    background: #60c0cd;
}

.radio-btn-container input[type=radio]:checked ~ label{
    color: black;
}

.content-checkbox label {
    position: relative;
    display: inline-block;

    /*16px width of fake checkbox + 6px distance between fake checkbox and text*/
    padding-left: 30px;
}

/*Outer box of the fake checkbox*/
.content-checkbox label::before{
    height: 16px;
    width: 16px;
    border: 1px solid #797979;
    left: 0px;
    top: 4px;
}

.content-multicheckbox .content-checkbox label::before{
    left: 0px;
    top: -1px;
}

/*Hide the checkmark by default*/
.content-checkbox input[type="checkbox"] + label::after {
    content: none;
}

/*Unhide on the checked state*/
.content-checkbox input[type="checkbox"]:checked + label::after {
    content: "";
}


/*Unhide on the checked state*/
.content-checkbox input[type="checkbox"]:disabled + label {
    opacity: 0.7;
}

.content-multicheckbox .content-checkbox{
    width: 100%
}

/* Checkbox */
.content-checkbox input[type="checkbox"] {
    opacity: 0;
    display: none;
}

/*Checkmark of the fake checkbox*/
.content-checkbox label::after {
    height: 5px;
    width: 10px;
    border-left: 3px solid #60c0cd;
    border-bottom: 3px solid #60c0cd;
    transform: rotate(-45deg);
    left: 3px;
    top: 8px;
}

.content-multicheckbox .content-checkbox label::after{
    left: 3px;
    top: 3px;
}

.content-checkbox label {
    position: relative;
    display: inline-block;

    /*16px width of fake checkbox + 6px distance between fake checkbox and text*/
    padding-left: 30px;
}

.content-checkbox label::before,
.content-checkbox label::after {
    position: absolute;
    content: "";

    /*Needed for the line-height to take effect*/
    display: inline-block;
}

.input-readonly {
    padding-left: 10px;
}

option {
    font-weight: normal;
    background-color: white;
}

select[multiple] option:hover, select[multiple] option:focus, select[multiple] option:active, select[multiple] option:checked {
    background-color: rgb(35, 176, 186);
    color:white;
}

.category-container {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: left;
}

.category-container .card {
    height: inherit;
    margin-bottom: 20px;
    min-width: 32%;
    padding: 5px 5px;
}

.category-container .card .card-content{
    height: 100%;
    border-top: 2px solid rgb(35, 176, 186);
    padding: 0px;
    box-shadow: 0 3px 8px 0 rgba(0,0,0,0.2);
    transition: 0.1s;
}

.category-container .card .card-content .input-optional, .category-container .card .card-content .input-required {
    justify-content: left;
}


.content-checkbox .input-label{
    line-height: 25px;
    font-size: 13px;
}

.content-multicheckbox .content-checkbox .input-label{
    line-height: 17px;
}

.consent-container .input-row{
    width: 130px;
}