.bfQuickMode .bfbs5-form-group-actions, .bfQuickMode .form-group-actions{
    margin-bottom: 25px;
    min-height: 34px;
}

.bfQuickMode .bfbs5-btn, .bfQuickMode .btn{
    font-size: 14px
}

.bfQuickMode .bfSummarize{
    vertical-align: middle !important;
}

/* fixing if a template has the idea to change that (e.g. T3) */
.bfQuickMode fieldset .form-group, .bfQuickMode .form-horizontal .form-group {
    margin-left: 0;
    margin-right: 0;
}

/* fixing if a template has the idea to change that (e.g. T3) */
.bfQuickMode section [class^="col-"], .bfQuickMode section [class*=" col-"],
.bfQuickMode fieldset [class^="col-"], .bfQuickMode fieldset [class*=" col-"]{
    padding-right: 15px;
    padding-left: 15px;
}

.bfQuickMode .bfbs5-nonform-control, .bfQuickMode .nonform-control{
    display: inline-block;
    vertical-align: top;
    width: 69%;
}

@media all and (max-width: 767px) {

    .bfQuickMode .bfbs5-nonform-control, .bfQuickMode .nonform-control, .bfQuickMode .form-label {
        width: 100%;
    }
}

.bfQuickMode input[type=file] {
    display: inline-block;
}

.bfQuickMode input[type=checkbox]:hover, .bfQuickMode input[type=radio]:hover,.bfQuickMode input[type=date]:hover, .bfQuickMode input[type=time]:hover  {
    cursor:pointer;
}

.bfQuickMode input[type=checkbox], .bfQuickMode .bfbs5-checkbox-inline input[type=checkbox], .bfQuickMode .bfbs5-radio input[type=radio], .bfQuickMode .bfbs5-radio-inline input[type=radio],
.bfQuickMode .checkbox-inline input[type=checkbox], .bfQuickMode .radio input[type=radio], .bfQuickMode .radio-inline input[type=radio] {
    position: relative;
    margin-right: 5px;
    width:18px;
    height:18px;
}
/* BEGIN CHECKBOX DESIGN TOGGLE */
.bfQuickMode input[type=checkbox].switcher {
    appearance: none;
    position:relative;
    width: 44px;
    height: 24px;
    border: 2px solid transparent;
    background-color:rgb(143,143,156);
    border-radius: 1em;
    vertical-align: middle;
    transition:.15s;
}
.bfQuickMode input[type=checkbox].switcher:hover {
    background-color:rgb(103,103,115);
}
.bfQuickMode input[type=checkbox].switcher:before {
    content:"";
    position:absolute;
    left:0;
    width:20px;
    height:20px;
    background-color:white;
    border-radius:1em;
    transition:.15s;
}
.bfQuickMode input[type=checkbox].switcher:checked {
    background-color:rgb(55,123,246);
}
.bfQuickMode input[type=checkbox].switcher:checked:hover {
    background-color:rgb(55,103,214);
}
.bfQuickMode input[type=checkbox].switcher:checked:before {
    left:calc(100% - 20px);
}

/* END CHECKBOX DESIGN TOGGLE */

/* DESIGN INVALID EMAIL BEGIN */

.bfQuickMode input[type="email"]:invalid {
    border-color:red;
}
/* END DESIGN EMAIL INVALID */


.bfQuickMode .bfbs5-radio-inline.bfbs5-inline, .bfQuickMode .bfbs5-checkbox-inline.bfbs5-inline,
.bfQuickMode .bfbs5-radio-inline.inline, .bfQuickMode .checkbox-inline.bfbs5-inline {
    padding-top: 5px;
}

.bfQuickMode .bfbs5-radio-form-group, .bfQuickMode .bfbs5-checkbox-form-group,
.bfQuickMode .radio-form-group, .bfQuickMode .checkbox-form-group {
    padding-top: 5px !important;
}

.bfQuickMode .bfbs5-other-form-group{
    padding-top: 0 !important;
}

.bfQuickMode .bfbs5-radio-inline .ff_elem, .bfQuickMode .bfbs5-checkbox-inline .ff_elem,
.bfQuickMode .radio-inline .ff_elem, .bfQuickMode .checkbox-inline .ff_elem {
    margin-top: -3px;
}


@media all and (max-width: 767px) {

    .bfQuickMode .bfbs5-radio-inline.bfbs5-inline, .bfQuickMode .bfbs5-checkbox-inline.bfbs5-inline,
    .bfQuickMode .bfbs5-radio-inline.inline, .bfQuickMode .checkbox-inline.bfbs5-inline {
        padding-top: 0;
    }

    .bfQuickMode .bfbs5-radio-form-group, .bfQuickMode .bfbs5-checkbox-form-group,
    .bfQuickMode .radio-form-group, .bfQuickMode .checkbox-form-group {
        padding-top: 0;
    }
}

.bfQuickMode .bfElemWrap {
    margin-bottom: 15px;
}

.bfQuickMode section,
.bfQuickMode fieldset{
    /* padding-right: 25px; */
}

.bfQuickMode section:last-child,
.bfQuickMode fieldset:last-child{
    padding-right: 0px;
}
.bfQuickMode section:first-child,
.bfQuickMode fieldset:first-child{
    padding-left: 0px;
}

.bfQuickMode section .bfbs5-row, .bfQuickMode section .row,
.bfQuickMode fieldset .bfbs5-row, .bfQuickMode fieldset .row{
    margin-left: 0;
    margin-right: 0;
}

.bfQuickMode section section .bfbs5-row, .bfQuickMode section section .row,
.bfQuickMode fieldset .bfbs5-row, .bfQuickMode fieldset .row{
    margin-left: 0;
    margin-right: 0;
}

@media all and (max-width: 767px) {

    .bfQuickMode section,
    .bfQuickMode fieldset{
        padding-right: 0px;
    }

    .bfQuickMode section .bfbs5-row, .bfQuickMode section .row,
    .bfQuickMode fieldset .bfbs5-row, .bfQuickMode fieldset .row{
        margin-left: 0;
        margin-right: 0;
    }

    .bfQuickMode section section .bfbs5-row, .bfQuickMode section section .row,
    .bfQuickMode fieldset .bfbs5-row, .bfQuickMode fieldset .row{
        margin-left: 0;
        margin-right: 0;
    }

    /* fixing if a template has the idea to deal with that */
    .bfQuickMode section [class^="col-"], .bfQuickMode section [class*=" col-"],
    .bfQuickMode fieldset [class^="col-"], .bfQuickMode fieldset [class*=" col-"],
    .bfQuickMode section [class^="bfbs5-col-"], .bfQuickMode section [class*=" bfbs5-col-"],
    .bfQuickMode fieldset [class^="bfbs5-col-"], .bfQuickMode fieldset [class*=" bfbs5-col-"]{
        padding-right: 0;
        padding-left: 0;
    }
}

/** Inputs **/


.bfQuickMode .bfbs5-form-group .bfbs5-col-sm-12, .bfQuickMode .form-group .col-sm-12 {
    padding-left: 0;
    padding-right: 0;
}

.bfQuickMode .bfSignature {
    width: 100%;
    display: inline-block;

}

.bfQuickMode .bfSignature canvas {
    width: 100%;
    height: 200px;
}

.bfQuickMode .bfSignatureCanvasBorder {
    width: 100%;
    height: 210px;
    border: 5px solid #F0F0FF;
    border: 5px solid rgba(0, 0, 0, 0.05);
    margin-bottom: 5px;
}

.bfCalendarResponsiveContainer .picker__button--today,
.bfCalendarResponsiveContainer .picker__button--clear {
    color: black !important;
    outline: none !important;
    border: none !important;
    text-shadow: none !important;
    height: auto !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    border-radius: 0 !important;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    margin: 0 !important;
}

.bfCalendarResponsiveContainer .picker__select--year, .bfCalendarResponsiveContainer .picker__select--month {
    float: none !important;
    margin-left: .25em !important;
    margin-right: .25em !important;
    font-size: .8em !important;
    display: relative !important;
    width: auto !important;
    max-width: none !important;
    min-width: 1px !important;
}

@media (min-height: 33.875em) {
    .bfCalendarResponsiveContainer .picker__box {
        display: inline-block !important;
    }
}

@media (min-width: 24.5em) {
    .bfCalendarResponsiveContainer .picker__select--month, .bfCalendarResponsiveContainer .picker__select--year {
        font-size: .8em !important;
        margin-top: -.5em !important;
    }
}

.bfQuickMode .fas.fa-asterisk, .bfQuickMode .bfbs5-fas.bfbs5-fa-asterisk {
    font-size: 9px;
    vertical-align: top;
    color: red;
}

.bfQuickMode input[type="text"],
.bfQuickMode input[type="email"],
.bfQuickMode textarea,
.bfQuickMode select,
.bfQuickMode .uneditable-input {

    min-height: 32px;
}

.bfQuickMode .bfbs5-form-inline .bfbs5-form-group, .bfQuickMode .form-inline .form-group {
    width: 100%;
}

.bfQuickMode .bfbs5-jumbotron, .bfQuickMode .jumbotron {
    padding-left: 30px;
    padding-right: 30px;
}

.bfQuickMode textarea {
    height: 300px;
}


.bfQuickMode .form-inline .form-group, .bfQuickMode .form-inline label,
.bfQuickMode .bfbs5-form-inline .bfbs5-form-group, .bfQuickMode .bfbs5-form-inline label{
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}


/** Labels **/
@media all and (max-width: 767px) {



    .bfQuickMode .bfSignature {
        width: 100%;
        max-width: 100%;
        min-width: 100%;
    }

    .bfQuickMode .bfbs5-form-inline .bfbs5-col-form-label, .bfQuickMode .form-inline .col-form-label {
        max-width: 90% !important;
        min-width: 90% !important;
        width: 90% !important;
        display: block !important;
    }

    .bfQuickMode .bfbs5-input-group{
        display: block;
    }

    .bfQuickMode .bfbs5-input-group input, .bfQuickMode .input-group {
        width: 185px;
        min-width: 185px;
        max-width: 185px;
    }
}

.bfQuickMode .bfElemWrap .form-inline input[type="text"], 
.bfQuickMode .bfElemWrap .form-inline input[type="email"], 
.bfQuickMode .bfElemWrap .form-inline input[type="password"], 
.bfQuickMode .bfElemWrap .form-inline input[type="number"], 
.bfQuickMode .bfElemWrap .form-inline input[type="date"], 
.bfQuickMode .bfElemWrap .form-inline input[type="time"], 
.bfQuickMode .bfElemWrap .form-inline textarea, 
.bfQuickMode .bfElemWrap .form-inline select {
    display: inline-block;
    max-width: 70%;
    vertical-align: middle;
}
.bfQuickMode .bfElemWrap .form-inline select {
    padding-right:60px;
}
/* DATE / TIME FIELD BY EDDY-VH */
.bfQuickMode .bfElemWrap .form-inline input[type="date"], 
.bfQuickMode .bfElemWrap .form-inline input[type="time"] {
    max-width:40%;
}

/* PASSWORD FIELD BY EDDY-VH */
.bfQuickMode .bfElemWrap .form-inline .bfPassword {
    display:flex;
    flex-wrap:wrap;
    position:relative;
}
.bfQuickMode .bfElemWrap .form-inline .bfPassword label {
    margin-right:15px;
}
.bfQuickMode .bfElemWrap .form-inline .bfPassword input {
    max-width:calc(70% - 52px);
    border-top-right-radius:0;
    border-bottom-right-radius:0;
    border-right:0;
    z-index:1;
}
.bfQuickMode .bfElemWrap .form-inline .bfPassword button {
    margin-bottom:0;
    border-top-left-radius:0;
    border-bottom-left-radius:0;
}

.bfQuickMode .bfElemWrap .form-inline label {
    min-width: 25%;
}



.bfQuickMode .bfElemWrap .bfLabelBlock + input[type="text"], 
.bfQuickMode .bfElemWrap .form-inline input[type="email"], 
.bfQuickMode .bfElemWrap .bfLabelBlock + input[type="password"], 
.bfQuickMode .bfElemWrap .bfLabelBlock + input[type="number"], 
.bfQuickMode .bfElemWrap .bfLabelBlock + input[type="range"],
.bfQuickMode .bfElemWrap .bfLabelBlock + textarea, 
.bfQuickMode .bfElemWrap .bfLabelBlock + select{
    
    max-width: 100%;
}

.bfQuickMode .bfElemWrap div.range {
    display: flex;
    flex-wrap:wrap;
    align-items:center;
}
.bfQuickMode .bfElemWrap .bfLabelBlock {
  width: 100%;
}


.bfQuickMode .bfElemWrap input[type="range"] {
    appearance:auto;
    box-shadow:none;
    cursor:ew-resize;
    margin-left:5px;
    width:calc(70% - 75px);
}

.bfQuickMode .bfElemWrap .bfLabelBlock + input[type="range"] {
    width:calc(100% - 75px) !important;
    margin-left:0;
}

.bfQuickMode .bfElemWrap input[type="range"] + span {
    position: relative;
    font-weight: 600;
    width: 55px;
    margin-left: 20px;
    background: rgb(143,143,156);
    color: white;
    border-radius: 0.15rem;
    text-align: center;
    line-height: 32px;
}
  
.bfQuickMode .bfElemWrap input[type="range"] + span:after {
    position: absolute;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 10px solid rgb(143,143,156);
    top: 8px;
    left: -10px;
    CONTENT: "";
}

.bfQuickMode .bfElemWrap label{
    min-width: 100px;
    cursor: pointer;
}

/** Safari Hack **/
@media screen and (-webkit-min-device-pixel-ratio: 0) {

    .bfQuickMode fieldset legend {
        margin-bottom: 0px;
    }

    .bfQuickMode fieldset .bfbs5-row, .bfQuickMode fieldset .row {
        padding-top: 18px;
    }

}

.bfQuickMode .bfbs5-form-group .bfbs5-col-form-label, .bfQuickMode .form-group .col-form-label {
    width: 30%;
    min-width: 110px;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    padding: 0;
}

.bfLabelBlock {
    display: block !important;
}

/** Fieldset **/
.bfQuickMode fieldset {
    margin-bottom: 3px;
}

/** Buttons **/
.bfQuickMode .bfCancelButton {
    margin-left: 10px;
    margin-right: 10px;
}

/** Captcha **/
.bfQuickMode #recaptcha_image img{
    margin-bottom: 15px;
}

@media all and (max-width: 767px) {
    .bfQuickMode #recaptcha_image, .bfQuickMode #recaptcha_image img {
        /** we must force relative dimensions for responsivness **/
        width: 95% !important;
        height: 60px !important;
    }

    .bfQuickMode .input-recaptcha {
        margin-bottom: 8px;
    }

    .bfCaptchaField {
        width: 84%;
        max-width: 84%;
        min-width: 84%;
    }
}

.ff_capimg {
    margin-top: 9px;
    margin-bottom: 0;
}

/* ##### Uploader ##### */

#bfFileQueue {
    margin-bottom: 10px;
    position: absolute;
}

#bfSubmitMessage {
    border: 2px solid #E5E5E5;
    background-color: #F5F5F5;
    margin-top: 5px;
    padding: 10px;
    width: 350px;
    -moz-border-radius-bottomright: 50px 25px;
    border-bottom-right-radius: 50px 25px;
}

#bfFileQueue {
    border: 2px solid #E5E5E5;
    background-color: #F5F5F5;
    margin-top: 5px;
    padding: 10px;
    width: 300px;
    -moz-border-radius-bottomright: 50px 25px;
    border-bottom-right-radius: 50px 25px;
    z-index: 1100;
}

.bfFileQueueItem {
    border: 2px solid #E5E5E5;
    background-color: #F5F5F5;
    margin: 5px;
    padding: 10px;
}

.bfQuickMode input[type="text"].bfCalendar, .bfQuickMode .bfbs5-uneditable-input.bfCalendar, .bfQuickMode .uneditable-input.bfCalendar,
.bfQuickMode input[type="text"].custom-form-control, .bfQuickMode .bfbs5-uneditable-input.custom-form-control, .bfQuickMode .uneditable-input.custom-form-control{
    max-width: 130px !important;
    min-width: 130px !important;
    width: 130px !important;
}

@media (max-width: 767px) {
    .bfQuickMode input[type="text"].bfCalendar, .bfQuickMode .bfbs5-uneditable-input.bfCalendar, .bfQuickMode .uneditable-input.bfCalendar {
        width: 1%;
        min-width: 0;
    }
}

.bfQuickMode .bfFlashFileQueueClass{
    margin-left: -5px;
}

.bfPage.bfQuickModeOnePage{
    clear: both;
    margin-bottom: 75px;
}

.bfQuickMode .bfLabelBlock ~ input[type="text"].form-control, 
.bfQuickMode .bfLabelBlock ~ input[type="email"].form-control, 
.bfQuickMode .bfLabelBlock ~ select.form-control,
.bfQuickMode .bfLabelBlock ~ textarea.form-control,
.bfQuickMode .bfLabelBlock ~ .nonform-control,
.bfQuickMode label.col-form-label.bfLabelBlock {
    width: 100%;
}
.bfQuickMode .bfElemWrap .form-inline .bfPassword .bfLabelBlock ~ input[type="password"].form-control, 
.bfQuickMode .bfElemWrap .form-inline .bfPassword .bfLabelBlock ~ input[type="text"].form-control {
    max-width:calc(100% - 52px);
}

.bfQuickMode label.col-form-label.bfLabelBlock{
    margin-bottom: .5rem;
}

.bfQuickMode fieldset fieldset{
    width: 100%;
}

.bfQuickMode fieldset fieldset fieldset{
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 20px;
}

.bfQuickMode fieldset fieldset fieldset fieldset,
.bfQuickMode fieldset fieldset fieldset fieldset fieldset,
.bfQuickMode fieldset fieldset fieldset fieldset fieldset fieldset,
.bfQuickMode fieldset fieldset fieldset fieldset fieldset fieldset fieldset{
    margin-top: 20px;
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .bfQuickMode fieldset,
    .bfQuickMode fieldset fieldset,
    .bfQuickMode fieldset fieldset fieldset,
    .bfQuickMode fieldset fieldset fieldset fieldset,
    .bfQuickMode fieldset fieldset fieldset fieldset fieldset,
    .bfQuickMode fieldset fieldset fieldset fieldset fieldset fieldset,
    .bfQuickMode fieldset fieldset fieldset fieldset fieldset fieldset fieldset{
        margin-left: 0;
        width: 100%;
    }
    
    /* DATE / TIME FIELD BY EDDY-VH */
    .bfQuickMode .bfElemWrap .form-inline input[type="date"], 
    .bfQuickMode .bfElemWrap .form-inline input[type="time"] {
        max-width:100%;
    }
}
