@media (max-width: 1200px) {
    .form-item{
        flex: 100%;
    }
}
@media (min-width: 1201px) {
    .form-item{
        flex: 45%;
    }
}

form{
    display: inline;
}

form input, form select{
    width: 100%;
    display: block;
    padding: 0.45rem 0.45rem;
    font-size: 0.9rem;
    font-weight: 400;
    color: #838c96;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    box-sizing: border-box;
}

form.customForm > div{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    gap: 1rem;
}

.form-item{
    text-align: start;
    margin-bottom: 1rem;
    box-sizing: border-box;
}

.form-item > label{
    display: block;
    line-height: 1.1rem;
    font-size: larger;
}

/* .form-container > form{
    width: 100%;
    padding: 25px 10px 10px 10px;
    box-sizing: border-box;
}

.form-row{
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

*/

.inline-field{
    display: flex;
    align-items: center;
}
.inline-field > label{
    white-space: nowrap;
} 

label.required:after {
    content: " *";
    color: red;
}


/****************************
        Switch checkboxes 
****************************/
.switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 25px;
    margin: auto;
}

.switch input { 
opacity: 0;
width: 0;
height: 0;
}

.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #aaa;
-webkit-transition: .4s;
transition: .4s;
}

.slider:before {
position: absolute;
content: "";
height: 17px;
width: 17px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}

input:checked + .slider {
background-color: #2196F3;
}

input:focus + .slider {
box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
-webkit-transform: translateX(24px);
-ms-transform: translateX(24px);
transform: translateX(24px);
}

/* Rounded sliders */
.slider.round {
border-radius: 34px;
}

.slider.round:before {
border-radius: 50%;
}