/* 

BOOTSTRAP 5 BREAKPOINTS:
https://getbootstrap.com/docs/5.0/layout/breakpoints/

X-Small     N/A     <576px
Small       sm	    ≥576px
Medium      md  	≥768px
Large       lg	    ≥992px
XL          xl	    ≥1200px
XXL         xxl     ≥1400px

*/

:root {
    /* Colors */
    --white: #fff;
    --black: #000;
    --primary-color: #036;
    --interactive-color: #0264F7;
    --focus-color: #036;
}

/*************** Basic ***************/
p {
    font-family: 'Yantramanav', sans-serif !important;
}
a {
    color: var(--interactive-color) !important;
}
.mainContent {
    padding-top: 12px;
    padding-bottom: 12px;
    margin-top: 76px;
    margin-bottom: 0;
}

/*************** Nav Bar ***************/
.navbar p {
    text-align:right;
    margin:0;
    display:flex;
    align-items: center;
    height: 100%;
}
.nav-link {
    font-size: 15px !important;
    margin-top: 8px !important;
    text-align: center;
}
.nav-link:hover, .nav-link:focus {
    text-decoration: underline;
}

/*************** Jumbotron ***************/
.jumbotron h1 {
    font-size: 24px;
    color: var(--primary-color);
    padding: 48px 0 12px 0;
}
.landing-image-nicmic {
    background-image: url(../../uploads/00001196/ncmic-ltd-bg2.jpg) !important;
    background-size: cover;
    background-color: #dddbcd;
    background-position: 58% 0% !important;
    background-repeat: no-repeat;
}
@media (max-width: 768px) { 
    .landing-image-nicmic {
       background-image: none !important;
    }
}
.landing-image-thank {
    background-image: url(../../uploads/00001196/ncmic-ltd-bg3.jpg) !important;
    background-size: 65%;
    background-color: #fef2dd;
    background-position: 100% 40% !important;
    background-repeat: no-repeat;
}
@media (max-width: 768px) { 
    .landing-image-thank {
       background-image: none !important;
    }
}

/*************** Misc. ***************/
.annualSalaryToggle {
    font-size: 14px;
    color: var(--primary-color);
    font-style: italic;
}
.annualSalaryToggle:focus {
    border: 2px solid var(--primary-color) !important;
}
.highlight{
    color: #1495ba !important;
}
.boxInfo {
    background: white !important;
}
.alert p {
    color: #000 !important;
}
.footnote {
    font-size: 14px !important;
}
.sectionName {
    font-size: 26px;
    margin-bottom: 20px;
}

/*************** Card ***************/
.card-default-blue {
    display: block;
    border-radius: 3px;
    transition: border-color .15s linear;
    background: #fff;
    color: #069;
    border: 1px solid #069;
}

/*************** Accordion ***************/
.ui-accordion .ui-accordion-header a {
    display: block;
    padding: .5em .5em .5em .7em;
    font-family: 'Yantramanav', sans-serif !important;
}
.accordion-button:focus {
    border-color: var(--focus-color) !important;
    box-shadow: 0 0 0 0.25rem var(--focus-color) !important;
}
.ui-widget-content {
    border: 2px solid #949494 !important;
}

/*************** Forms ***************/
input[type="text"], input[type="password"], select{
    border: 1px solid #888;
}
@media (max-width: 992px) {
    .productField {
        flex-direction: column;
    }
}
#trPaymentOptionBlock .productField label{
    width: 100%!important;
    display: block;
}
.label, .spacer {
    font-weight: 400 !important;
}
.healthRow .spacer {
    height: 0px !important;
}
.formSlider .sliderlabel {
    display: none !important;
}

/*************** Radio ***************/
.radioBlock legend {
    display: block !important;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.productField input[type="radio"] + label {
    border: 2px solid rgba(0, 0, 0, 0);
    padding: 2px !important;
}

/*************** Button ***************/
.btn:focus, .btn-primary:focus {
    outline: auto 5px -webkit-focus-ring-color; /* for webkit browsers */
    outline-offset: 5px;
}
.btn.back-btn {
    border-color: #888;
}
.btn-close:focus {
    box-shadow: 0 0 0 .25rem var(--focus-color) !important;
}

