.builder-form-container {

}

.builder-form {

}

.builder-form .form-title {

}

.builder-form .form-group {
    position: relative;
    margin-bottom: 0;
    padding: 5px;
    height: 100%;
    border: 1px solid transparent;
}

/* eventueel met :not(.form-group-1) */
.builder-form .form-group {
    margin-top:20px;
}

.builder-form .control-label {
    font-weight: normal;
    cursor: pointer;
}

.builder-form .form-control {
    border-radius: 0px;
    box-shadow: none;
    padding:20px;
}

.builder-form .form-control::placeholder {
    background-color: inherit;
}

.builder-form .form-control[disabled], .builder-form .form-control[readonly], .builder-form fieldset[disabled] .form-control {
    cursor: not-allowed;
    background-color: #FFFFFF;
}

.builder-form .form-control :after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 4px;
}

.builder-form textarea {
    resize: vertical;
}

.builder-form .btn.dropdown-toggle {
    border-radius: 0px;
    box-shadow: none;
}

.builder-form .btn.dropdown-toggle.btn-default:hover {
    background-color: inherit;
    border-color:#ccc;
    box-shadow: none;
}

.builder-form .btn-group.open .dropdown-toggle {
    box-shadow: none;
    background-color: inherit;
    border-color:#ccc;
}

.builder-form .bootstrap-select > .dropdown-toggle {
    border-radius: 0px;
    box-shadow: none;
    padding:10px;
}

.builder-form .bootstrap-select.btn-group .dropdown-toggle .filter-option {
    padding-left:10px;
}

.builder-form .bootstrap-select.open .dropdown-menu {
    margin-top:7px;
    border-radius:0px;
}

.builder-form .dropdown-menu > li > a {
    padding-top:8px;
    padding-bottom:8px;
}

.builder-form .field-required {
    color: red;
}

.builder-form .btn-file {
    padding: 10px 24px;
}

.builder-form .filename {
    z-index:0;
}

.builder-form .checkbox-group, .builder-form .radio-group {
    margin-bottom:-8px;
}

.builder-form .form-group-checkbox-container {
    padding-top:15px;
}

.builder-form .static-html {
    padding-top:15px;
    padding-bottom:20px;
}

.builder-form .form-group-agreement {
    padding-top:20px;
}

.builder-form .btn-form-submit {
    text-transform:uppercase;
    padding: 12px 24px;
    border-radius: 0px;
}

.builder-form-error-below {
    margin-top:25px;
}

.builder-form-error, .builder-form-send-error, .builder-form-send-success {
    border-radius:0px;
}



/* gestylde checkbox */

/*
.builder-form .checkbox-container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight:normal;
}

.builder-form .checkbox-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.builder-form .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #FFFFFF;
    border: solid #ccc 1px;
}


.builder-form .checkbox-container:hover input ~ .checkmark {
    background-color: #ccc;
}


.builder-form .checkbox-container input:checked ~ .checkmark {
    background-color: #FFFFFF;
}


.builder-form .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}


.builder-form .checkbox-container input:checked ~ .checkmark:after {
    display: block;
}


.builder-form .checkbox-container .checkmark:after {
    left: 8px;
    top: 4px;
    width: 7px;
    height: 13px;
    border: solid #000000;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
*/




/* gestylde radio */

/* The container */
.builder-form .radio-container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    /*font-size: 22px;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight:normal;
}

/* Hide the browser's default radio button */
.builder-form .radio-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.builder-form .radio-container .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #FFFFFF;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.builder-form .radio-container:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.builder-form .radio-container input:checked ~ .checkmark {
    background-color: #FFFFFF; /* de achtergrondkleur van de radio bij checked */
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.builder-form .radio-container .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.builder-form .radio-container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.builder-form .radio-container .checkmark:after {
    top: 8px;
    left: 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #000000; /* de kleur van de stip */
}

.jonthornton-timepicker.form-control {
    min-width:80px;
    min-height: 42px;
    padding-top: 0;
    padding-bottom: 0;
}



/* checkbox met font awesome */

/*
.checkbox-container-agreement { 
    width: 100%; 
    height: 30px; 
    padding: 0 0 0 10px; 
    margin: 5px 0 0 0; 
    border-radius: 3px; 
}

.checkbox-container-agreement label { 
    float: left; 
    padding: 0; 
    margin-top: 7px; 
}

.checkbox-container-agreement label .checkBoxTitle {
    width:100%;
    margin-top: -1px; 
    font-size: 12px;
}

.newCheck[type="checkbox"]:not(:checked), .newCheck[type="checkbox"]:checked { 
    position: absolute; 
    left: -9999px;
}
.newCheck[type="checkbox"]:not(:checked) + label, .newCheck[type="checkbox"]:checked + label { 
    width:90%; 
    position: absolute; 
    cursor: pointer; 
}
.newCheck[type="checkbox"]:not(:checked) + label:before, .newCheck[type="checkbox"]:checked + label:before { 
    content: ''; 
    position: absolute; 
    left: 0; 
    top: -1px; 
    width: 17px; 
    height: 17px; 
    border: 1px solid #aaa; 
    background: #f8f8f8; 
    border-radius: 3px; 
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
}
.newCheck[type="checkbox"]:not(:checked) + label:after, .newCheck[type="checkbox"]:checked + label:after { 
    content: '\f00c'; 
    font-family: FontAwesome; 
    padding-right: 5px; 
    position: absolute; 
    top: -8px; 
    left: 0;  
    font-size: 20px; 
    color: #555;
}
.newCheck[type="checkbox"]:not(:checked) + label:after { 
    opacity: 0;
}
.newCheck[type="checkbox"]:checked + label:after { 
    opacity: 1;
    color:#31708F;

    color:#00ABC9;
}
.newCheck[type="checkbox"]:checked + label span, .newCheck[type="checkbox"]:not(:checked) + label span { 
    position:absolute; 
    left:25px; 
}
*/