/* #region Error checking coloring and transition */

.addBorder {
    border: 4px solid rgb(255, 0, 0) !important;
}

[class*='contactUs_form']:not([class*='ui']),
.form-group,
.form-row {
    /* border: 0 solid; */
    /* border: 0 solid rgb(10, 190, 10); */
    transition-duration: .5s;
}

.addBorderOpacity {
    border: 4px solid rgb(24, 6, 21) !important;
}

/* #endregion */

/* #region has-float-label styling */

.form-group.has-float-label {
    margin-top: 20px;
}

.form-group.has-float-label label {
    margin-top: 0;
    pointer-events: none;
    color: #000;
    background: #fff;
    border-radius: 5px;
    padding: 5px !important;
    font-size: 94%;
    top: -1.0em;
    line-height: 0.8 !important;
    height: 15px;
    left: 1em;
}

.has-float-label .form-control:placeholder-shown:not(:focus)+label {
    font-size: 94%;
    opacity: .7;
    top: .5em;
    font-weight: normal;
    color: #000;
}

/* #endregion */

/* #region requiredSpan styling */

.requiredSpanText {
    text-align: left;
}

.requiredSpan::after {
    background: #fff !important;
    content: '*' !important;
    left: auto !important;
    right: auto !important;
    top: 0 !important;
    display: inline !important;
    border-radius: 0 3px 3px 0;
    padding: 3px 5px 5px 5px;
    font-size: 1.5em;
    color: red;
}

.has-float-label label::after {
    height: 20px;
}

.requiredSpan.captchaRequiredSpan::before {
    background: white;
    color: black;
    content: 'Captcha' !important;
    font-size: 94%;
    position: absolute;
    top: -12px !important;
    left: 26px !important;
    width: 92px !important;
    padding-left: 5px;
    height: 17px;
}

.requiredSpan.captchaRequiredSpan::after {
    content: '*' !important;
    position: absolute;
    top: -19px;
    left: 97px;
    width: 22px;
}

/* #endregion */

/* #region Bootstrap float: Hide the placeholder& remove outlines */

/* Hide the placeholder and outline on hover on input form items */
input::-webkit-input-placeholder {
    color: transparent !important;
}

input::-moz-placeholder {
    color: transparent !important;
}

input:-ms-input-placeholder {
    color: transparent !important;
}

input::-ms-input-placeholder {
    color: transparent !important;
}

input::placeholder {
    color: transparent !important;
}

/* Hide the placeholder and outline on hover on input form items */
textarea::-webkit-input-placeholder {
    color: transparent !important;
}

textarea::-moz-placeholder {
    color: transparent !important;
}

textarea:-ms-input-placeholder {
    color: transparent !important;
}

textarea::-ms-input-placeholder {
    color: transparent !important;
}

textarea::placeholder {
    color: transparent !important;
}

/* Hide the placeholder on click */
/* https://codepen.io/donaldlee/pen/kGaEm */
/* ------------------------------------------ */
input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {
    color: transparent;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;

}

input:focus:-moz-placeholder,
textarea:focus:-moz-placeholder {
    /* Firefox 18- */
    color: transparent;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;
}

input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {
    /* Firefox 19+ */
    color: transparent;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;
}

input:focus:-ms-input-placeholder,
textarea:focus:-ms-input-placeholder {
    color: transparent;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;
}

input:focus:input-placeholder,
textarea:focus:input-placeholder {
    color: transparent;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;
}


button:focus,
button:active,
button:hover,
.btn:active,
.btn.active{
    outline: none !important;
}

textarea:hover,
input:hover,
textarea:active,
input:active,
textarea:focus,
input:focus,
label:focus{
    outline: none !important;
    -webkit-appearance: none !important;
    box-shadow: none !important;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
}


/* #endregion */