﻿.submitError,
.submitError:hover {
    border-width: 2px;
    border-color: rgba(255,0,0,0.5) !important;
}

.validation-error {
    color: #a94442;
}

.input-validation-error {
    /*border: solid 2px red !important;
    background-color: rgba(255,0,0,0.25);
    */
    background-color: #febfc6 !important;
}

.required-custom-error {
    background-color: rgba(255,0,0,0.50) !important;
}

.accent-color {
    color: #44a4dc !important;
}

/*========================*/
.section-title.form-section {
    padding-top: 1rem;
    border-bottom: 1px solid #979797;
}    

.section-title h2.form-title {
    font-size: 27px;
    line-height: 44px;
    margin-bottom: 0;    
}

.section-title h2.form-title span {
    font-style: normal;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: #44a4dc;
}

.win-form-segment {
}

.win-form-segment h3 {
    font-size: 19px;
    margin: .5rem 0;    
}

.win-form-segment label {
    margin-bottom:0px;
    font-weight:bold;
}

.win-form-segment .form-check-label {
    font-weight:normal;
}


.win-form-segment label.label-tip {
    font-weight:normal;
    color:GrayText;
    font-size:10pt;
}
.win-form-segment label span {
    color: #D0021B;
}

.win-form-segment .form-control {
    border: 1px solid #DDDDDD;
    background-color: #E7F2FE;
    padding: .5rem !important;
}

.form-control.input-other {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom-width: 2px !important;
    background-color: transparent !important;
    padding-bottom: 1px !important;
}

.win-form-segment .custom-select {
    background-color: #E7F2FE;
}

.win-form-segment .ttm-btn{
    padding-top:6px;
    padding-bottom:6px;
}

.ttm-btn-selected {
    color: #FFF !important;
    background-color: #91C5E6 !important;
}

.ttm-btn-selected:hover {
    background-color: #44a4dc !important;
}

/* ===== Default Info Box ===== */
div.infoBox-topper {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    margin-left: -20px;
    margin-right: -20px;
    background-color: #000;
    color: #FFF;
    padding: 0 24px;
}

div.infoBox-topper h1 {
    color: #FFF;
    font-size: 1rem;
    margin: 0px;
}

div.infoBox {
    margin-top: 10px;
    padding: 0 20px 20px 20px;
    background-color: #FFF;
    border-radius: 10px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);
}

/* ===== Tag List ===== */
.form-control.tag-list-container {
    display: flex;
    flex-wrap: wrap;
    padding: 3px !important;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
}

.form-control.tag-list-container > div {
    color: #FFF;
    background-color: #6EB6EB;
    width: 100px;
    margin: 5px;
    text-align: center;
}

.form-control.tag-list-container > div a {
    margin-left: 6px;
    color: #fff;
}

.form-control.tag-list-container > div a:hover {
    color: #D0021B;
}

.tag-list-option-holder {
    display: flex;
    min-width: 300px;
    padding: 8px;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);
}

/* ===== Native HTML Range Input Styling ===== */
input[type="range"].form-range {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 5px;
    background: #D8D8D8;
    border-radius: 5px;
    outline: none;
    margin: 8px 0;
}

input[type="range"].form-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px;
    height: 22px;
    background: #44A4DC;
    border-radius: 50%;
    cursor: pointer;
    border: none;
    margin-top: -10px;
}

input[type="range"].form-range::-moz-range-thumb {
    width: 22px;
    height: 22px;
    background: #44A4DC;
    border-radius: 50%;
    cursor: pointer;
    border: none;
}

input[type="range"].form-range::-ms-thumb {
    width: 22px;
    height: 22px;
    background: #44A4DC;
    border-radius: 50%;
    cursor: pointer;
    border: none;
    margin-top: 0;
}

input[type="range"].form-range::-webkit-slider-runnable-track {
    height: 5px;
    background: #D8D8D8;
    border-radius: 5px;
}

input[type="range"].form-range::-moz-range-track {
    height: 5px;
    background: #D8D8D8;
    border-radius: 5px;
}

/* ===== JQuery Silder CSS custom CSS ===== */
.ui-widget-content {
    border: 1px solid #D8D8D8;
    background: #D8D8D8;
    color: #333333;
}
.ui-widget.ui-widget-content {
    border: 1px solid #D8D8D8;
}
.ui-slider-horizontal {
    height: 5px;
}

.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 22px;
    height: 22px;
    cursor: pointer;
    -ms-touch-action: none;
    touch-action: none; 
    border:none;
}

.ui-slider-horizontal .ui-slider-handle {
    top: -9px;    
    margin-left: -9px;
    background-color: #44A4DC;
    border-radius: 50%;
}
.ui-state-default {
    border: none;
    border-radius: 50%;
    background: #44A4DC;
    font-weight: normal;
    color: #FFF;
}

.ui-state-active,
.ui-state-hover,
.ui-state-focus {
    outline-style: none;
}

div.slider-grid {
    display: grid;
    grid-gap: .3rem;
    grid-template-columns: 110px auto 80px;
    grid-template-areas: 'slider-label slider slider-callout';
    padding: .5rem;
    margin-bottom: 3px;
}

div.slider-grid .slider-label {
    grid-area: slider-label;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Percentage tag next to slider label */
.slider-percent-tag {
    display: inline-block;
    background-color: #44A4DC;
    color: #FFF;
    font-size: 12px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 12px;
    min-width: 40px;
    text-align: center;
}
div.slider-grid .slider-holder {
    grid-area: slider;
padding:10px 24px;
}
div.slider-grid .slider-callout {
    grid-area: slider-callout;
    background-image: url('../../images/slider-callout.png');
    color: #FFF;
    text-align:center;
    padding-left:12px;
    background-repeat: no-repeat;
}

div.slider-summary-holder {
    border: 3px solid #687076;
    border-radius: 4px;
}

div.slider-summary-row {
    font-size: 1.2rem;
    color: #687076;
    font-weight: bold;
    padding: .5rem;
}

div.slider-summary-label,
div.slider-summary-percent {
    font-size: 1.2rem;
    color: #687076;
    font-weight: bold;
    padding: .5rem;
    text-align: center;
}

div.slider-summary-percent {
    font-size: 2rem;
}

div.slider-error-row {
    text-align: center;
    color: #F70D00;
}
/* ======================================== */

.btn-submit {
    line-height:45px;
    height:60px;
    width: 400px;
    background-color: #44A4DC;
    border-radius:30px;
    color:#FFF;
    font-weight:bold;
}

/* ======================================== */
/* Company Popups */
/* ======================================== */
.tool-tip {
    color: #6EB6EB;
}

.tool-tip:hover {
    color: #44a4dc;
}

/* Modal z-index override to appear above fixed header */
.modal-backdrop.show {
    z-index: 1040;
}

.modal.show {
    z-index: 1050;
}

/* Ensure fixed header stays below modal */
.fixed-header {
    z-index: 1030;
}

.modal-company-content {
    border: 1px solid #979797;
    border-radius:1rem;
}

.modal-company-content h4 {
    color:#000;
    font-size:1.2rem;
}
.modal-company-content h4 span {
    color: #44A4DC;
}

.modal-body h4 {
    margin: 1rem 0 0 0;
}

.company-about {
    color: #687076;
}


div[class|="companyLogo"] {
    vertical-align: middle;
    background-size:contain;
    width: 120px;
    height: 60px;
    background-repeat:no-repeat;
    margin-top:5px;
}

/*carrierLogo-<carrierTag>*/
div.companyLogo-FCIC {
    background-image: url('../../images/companyLogoFCIC.png');
}

div.companyLogo-USIC{
    background-image: url('../../images/companyLogoUSICTM.png');
}

div.companyLogo-TXR {
    background-image: url('../../images/companyLogoTXR.png');
}
div.companyLogo-Lonestar {
    background-image: url('../../images/companyLogoLoanstar.png');
}
div.companyLogo-WVN {
    background-image: url('../../images/WVNAIC_Logo_2C.png');
    margin-top: 20px;
}

/* ======================================== */
/* Company section */
/* ======================================== */
div.disabled * {
    color: #e6e6e6 !important;
}

div.disabled > a > i {
    display: none;
}
