/************************** Add EBGaramond Font START **************************/
@font-face {
    font-family: 'EBGaramond';
    src: url('/uploads/00001117/fonts/EBGaramond.ttf') format('truetype');
    font-style: normal;
    font-weight: 300;
}
@font-face {
    font-family: 'EBGaramond-Bold';
    src: url('/uploads/00001117/fonts/EBGaramond.ttf') format('truetype');
    font-style: normal;
    font-weight: 700;
}
@font-face {
    font-family: 'EBGaramond-Italic';
    src: url('/uploads/00001117/fonts/EBGaramond-Italic.ttf') format('truetype');
    font-style: normal;
    font-weight: 300;
}
@font-face {
    font-family: 'EBGaramond-Italic-Bold';
    src: url('/uploads/00001117/fonts/EBGaramond-Italic.ttf') format('truetype');
    font-style: normal;f
    font-weight: 700;
}
/************************** Add EBGaramond Font END **************************/

/************************** Add TradeGothic Font START **************************/
@font-face {
    font-family: 'TradeGothic';
    src: url('/uploads/00001117/fonts/TradeGothicLTStd-Cn18.otf') format('opentype');
    font-style: normal;
}
@font-face {
    font-family: 'TradeGothic-Bold';
    src: url('/uploads/00001117/fonts/TradeGothicLTStd-BdCn20.otf') format('opentype');
    font-style: normal;
}
@font-face {
    font-family: 'TradeGothic-Italic';
    src: url('/uploads/00001117/fonts/TradeGothicLTStd-Cn18Obl.otf') format('opentype');
    font-style: normal;
}
/************************** Add TradeGothic Font END **************************/

/************************** Add Calibri Font START **************************/
@font-face {
    font-family: 'calibri-regular';
    src: url('/uploads/00001203/fonts/calibri-regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'calibri-bold';
    src: url('/uploads/00001203/fonts/calibri-bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
/************************** Add Calibri Font END **************************/

/************************** Color Setup **************************/
:root {
    --white: #fff;
    --black: #333;
    --primary-color: #183059;
    --secondary-color: #0C2144;
    --tertiary-color: #E6EFF4;
    --text-color: #4C4C4E;
    --gold: #D8A429;
    --red: #6D0000;
    --green: #03351E;
}

body{
    font-size: 14px;
}
a{
    color: #3174AE;
}
label{
    margin-bottom: 5px;
}
.glyphicon{
    top: 3px;
}
.healthAnswers legend{
    display: none;
}
input[type="text"], input[type="password"], select{
    border: 1px solid #888;
}
.btn.back-btn{
    border-color: #888;
}
.btn.disabled, .btn[disabled], fieldset[disabled] .btn{
    opacity: .7;
    cursor: not-allowed;
}
input[type="radio"] + label:hover::before, input[type="checkbox"] + labelhover::before, input[type="radio"] + label:focus::before, input[type="checkbox"] + labelfocus::before, input[type="checkbox"] + label:hover::before {
    border: 3px solid #07639D;
}
.yesNoBtn .elementcaption {
    display: none;
}
.checkmark img{
    height: 60px;
    width: 60px;
}
.lifeOffer input[type="radio"] + label, .lgFormField input[type="radio"] + label {
    color: #002247;
    font-weight: 600;
}
.panel-default>.panel-heading, .panel-group .panel-heading + .panel-collapse > .panel-body, .panel-group .panel-heading + .panel-collapse > .list-group{
    background-color: #f5f5f5;
}

#trTestCal span{
    font-weight: 700;
}
.calculatorDiv legend{
    border: 0px;   
    display: none;
}




/************************** MIN-WIDTH: 992 PX AND MAX-WIDTH: 1199 PX **************************/
@media(min-width:992px) and (max-width:1199px){
    .ageField select{
        max-width: 130px;
    }
    .calc-enroll{
        margin-left: -10px;
    }
    .calculatorDiv{
        border-radius: 0 0 12px 12px;
    }
} 
.portal-home-image {
    background-color: #F8F8F7;
}
.infoData p{
    line-height: 1.6em;
}

input:checked + label::before{
    background-color: var(--primary-color);
}
input[type="radio"] + label:hover::before, input[type="checkbox"] + labelhover::before, input[type="radio"] + label:focus::before, input[type="checkbox"] + labelfocus::before, input[type="checkbox"] + label:hover::before{
    border: 3px solid var(--primary-color);
}

/************************** Product Cards **************************/
.jumbotron p, .productRow p{
    font-size: 16px;
    color: #333;
}
.prod-card-box{
    padding: 90px 24px 16px 24px;
    background-size: 70px;
    background-repeat: no-repeat;
    background-position: left top 28px;
    background-position-x: 24px;
    background-color: #E6EFF4;
    border-radius: 12px;
    /*border: 3px solid #FFF;*/
    box-shadow: 0 4px 5px 0 rgb(0 0 0 / 12%);
    transition: all 0.2s;
}
.ci-product:hover, .ltd-product:hover{
    text-decoration: none;
}
.prod-card-box:hover{
     transform: scale(1.02) perspective(1px); 
    background-color: #fff;
}
.prod-card-box h4, .prod-card-box .card-enroll{
    color: var(--primary-color);
}
.add-card{
    background-image: url(/uploads/00001117/add-icon.svg);
}
.life-card{
    background-image: url(/uploads/00001117/life-icon.svg);
}
.ci-card{
    background-image: url(/uploads/00001117/ci-icon.svg);
}
.ltd-card{
    background-image: url(/uploads/00001117/ltd-icon.svg);
}
.prod-card-box h4{
    font-family: 'Open Sans', sans-serif;
    color: var(--primary-color);
    line-height: 23px;
    margin-top: 20px;
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
}
.prod-card-box p.card-body {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 24px;
    /*font-family: 'EBGaramond';*/
    /*font-size: 18px;*/
}
.prod-card-box .card-enroll{
    /*font-family: 'EBGaramond-Bold'; */
    font-family: 'Open Sans', sans-serif;
    color: var(--primary-color);
    font-size: 18px;
}
.cov-card h5{
    margin-bottom: 5px;
}
.cov-card strong{
    font-weight: 700;
}
/************************** Product Cards END **************************/


/************************** MIN-WIDTH: 768 PX AND MAX-WIDTH: 991 PX START **************************/
@media (min-width: 768px) and (max-width: 991px){
    .prod-card-box {
        /*min-height: 330px; changed Aug 2024 - Tri agency update */
        min-height: 230px;
    }   
    .ci-card, .ltd-card{
        margin-top: 60px;
    }
        .calculatorDiv{
        border-radius: 12px;
    }
}

/************************** MIN-WIDTH: 992 PX **************************/
@media (min-width: 992px) {
    .productRow{
        /*margin-top: -70px;*/
    }
    .prod-card-box {
        /*min-height: 400px; changed Aug 2024 - Tri agency update */
        min-height: 290px;
        /*border: 1px solid #999;*/
    } 
    .portal-ty-image .ty-jumbo-msg{
        height: 320px;
        display: table-cell;
        vertical-align: middle;
        float: none;
    }
    .ty-jumbo-msg h1{
        padding: 0;
    }
    .portal-ty-image .container .row{
        height: 320px;
    }
    .calculatorDiv{
        border-radius: 0 0 12px 12px;
    }
    
}

/************************** MIN-WIDTH: 1366 PX **************************/
@media (min-width: 1366px) {
    .wide {
        background-size: 80%;
        background-position: 100% 20%;
        background-repeat:no-repeat;
    }
    .portal-home-image,
    .portal-home-image2 {
        background-size: 65%;
    }
    
    .portal-ltd-image {
        background-position: 100% 0%;
        background-size: 65%;
    }
}

/*************************** change focus color from blue to green on all elements START **************************/
.productField input[type="radio"]:focus + label {
    border: 2px solid var(--primary-color);
    padding: 5px;
    border-radius: 0px;
}
a:focus{
    outline-color: var(--primary-color);
}
select:active, select:hover, select:focus, input:focus, button:focus {
  outline-color: var(--primary-color)!important;
}
.buttonState:focus{
    border: 2px solid var(--primary-color)!important;    
}
.btn:first-child:active{
    color: var(--white);
}

.ui-widget :active, .ui-widget :focus {
    background: #fff;
    border: 2px solid var(--primary-color) !important;
}
/*************************** change focus color from blue to green on all elements END **************************/

.card-enroll-link{
    text-decoration-line: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

/*************************** Change buttonstate hover/active states ***************************/
.yesNoBtn .buttonState span:hover {
    background: url(/uploads/00001117/radio_vsb_bg_hover.png);
    background-size: 36px 36px;
    background-repeat: no-repeat;
}
.yesNoBtn .active span, .yesNoBtn .active span:hover {
    background: url(/uploads/00001117/radio_select_vsb_bg.png);
    background-size: 36px 36px;
    background-repeat: no-repeat;
}
.step{
    font-weight: 600;
}
.fa-arrow-right-long:before{
    margin-right: -6px;
}
.prod-card-box:focus{
    text-decoration: none!important;
}
#sliderlabelCICoverage,
.formSlider .spacer{
    display: none;
}

/************************** MAX-WIDTH: 500 PX **************************/
@media(max-width:500px){
    .pay-freq .productField, .etf-type .productField{
        display: inline;
    }    
    .pay-freq .productField label, .etf-type .productField label{
        width: 100%;
    }
}

/************************** MAX-WIDTH: 767 PX **************************/
@media(max-width:767px){
    .eSigCopy h3{
        /*border-top: 1px solid #ccc;*/
        padding-top: 40px;
        margin-top: 0px;
    }
    .life-calc-gender{
        margin-top: 20px;
    }
    .portal-landing-image{
        display: none;
    }
    .productRow {
        background-color: #ccc;
        padding-bottom: 30px;
        padding-top: 44px;
        background: url(/uploads/00001117/vsb-landing-bg.jpg);
    }  
    .jumbotron .crossSell, .productRow .crossSell {
        margin-bottom: 20px;
    }
    .calc-enroll, .jumbo-enroll{
        width: 100%;
    }
    .calculatorDiv{
        border-radius: 0px;
    }
    .portal-home-image{
        background-position: 400% 0%!important;
    }
    .jumbotron h1{
        font-size: 24px;
    }
    .prod-card-box p.card-body{
        font-size: 14px;
        line-height: 22px;
    }
    .prod-card-box h4{
        font-size: 20px;
        line-height: 28px;
    }
    .prod-card-box {
        padding: 80px 24px 16px 24px;
        background-size: 60px;
    }
}

/************************** MAX-WIDTH: 1199 PX **************************/
@media(max-width:1199px){
    .healthQuestions{
        padding: 16px 0 0 0;
    }
}

.healthRow .healthAnswers .ruleRight{
    padding-bottom: 10px;
}

/************************** MAX-WIDTH: 400 PX **************************/
@media(max-width: 400px){
    .healthAnswers .col-xs-5{
        width: 35%;
    }
    .healthAnswers .col-xs-7{
        width: 65%;
    }
    .healthAnswers .productField input[type="radio"] + label{
        padding: 0px;
    }
}

/************************** MIN-WIDTH: 768 PX **************************/
@media (min-width: 768px){

    .portal-landing-image {
        background-position: 10% 5%;
        background-size: 100%;
        background-repeat: no-repeat;
        background-color: #e8f0f2;
        background-image: url(/uploads/00001117/vsb-landing-bg.jpg);
        height: auto;
        position: relative;
    }
    .productRow .prod-card {
        margin-top: -30px;
    }
    .eSigCopy h3{
        margin-top: 30px;
    }
    .jumbotron{
        padding-top:0px;
        padding-bottom:0px;
    }
    .jumbo-prod {
        padding-top: 24px;
        min-height: 320px; 
    }
    .promoContent{
        margin-top: 20px;
    }
}

/************************** MIN-WIDTH: 1365 PX **************************/
@media(max-width:1365px){
    .ty-mem-jumbo{
        max-width: 300px;
    }
}

/************************** MAX-WIDTH: 991 PX  **************************/
@media(max-width:991px){
    .landingInfo{
        margin-bottom: 60px
    }
    .calculatorDiv{
        /*margin-top: 10px;*/
    }
    .ty-jumbo-msg h1{
        padding: 24px 0;
    }
    .jumbotron.portal-ty-image{
        background-color: #eee;
    }
    .ty-mem-jumbo{
        max-width: 900px;
    }
}

/************************** MIN-WIDTH: 1600 PX **************************/
@media(min-width:1600px){
    .portal-home-image{
        background-size: 1100px;
        background-position: 100% 10%;
    }
    .portal-ci-home-image{
        background-size: 1150px;
        background-position: 100% 0%;
    }
    .portal-ltd-home-image{
        background-size: 1250px;
        background-position: 100% 70%;
    }
    .portal-add-home-image{
        background-size: 1200px;
        background-position: 100% 8%;
    }  
    .portal-ty-image{
        background-size: 1000px;
        background-position: 100% 10%;
    }  
}

/************************** MIN-WIDTH: 1200 PX **************************/
@media (min-width: 1200px){
    .add-condition .answer{
        float:right!important;
    }  
    .portal-home-image h1, .portal-ci-home-image h1, .portal-ltd-home-image h1{
        margin-top: 40px;
    }
    .prod-card-box {
        /*min-height: 380px; changed Aug 2024 - Tri agency update*/ 
        min-height: 260px;
    }
    .container {
        width: 1170px
    }    
}

/************************** MIN-WIDTH: 1400 PX **************************/
/* update max container width to stay the same as BS3 after BS5 switch*/
@media (min-width: 1400px){
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1170px;
    }    
}







/************************** FAQs START **************************/
.accordion-button{
    padding: 17px 20px 17px 20px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
}
.discl-stat .accordion-button{
    background-color: #f5f5f5;
}
.accordion-button:not(.collapsed) {
    color: var(--white);
    background-color: var(--primary-color);
}
.accordion-button:not(.collapsed)::after{
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFFFFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.accordion-body{
    padding: 20px 20px 10px 20px;
}
.accordion-item:first-of-type {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}
.accordion-item:first-of-type .accordion-button {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}
.accordion-item:last-of-type {
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
}
.accordion-item:last-of-type .accordion-button.collapsed {
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
}
/************************** FAQs END **************************/

.footerNav a{
    text-decoration: none;
    /*color: var(--primary-color);*/
    font-weight: 700;
}
.footerNav a:hover, .footerNav a:focus{
    text-decoration: underline;
    color: var(--secondary-color);
}
.navbar{
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important
}
.landing-bullets p{
    line-height: 24px;
    margin-top: 4px;
}
.landing-bullets{
    margin-top: 50px;
}
.landing-bullets h2, .calculatorDiv h4{
    color: var(--primary-color);
}
.dollar-prefix input {
    background: #FFF url(/uploads/00001117/dollar-prefix.png) left center no-repeat;
    background-size: 9px;
    background-position: 10px 14px;
    padding: 0.5em 0.5em 0.5em 1.5em;
}
.tooltip{
    font-size: 14px;
    /*padding: 20px;*/
}
.tooltip-inner {
  padding: 10px; /* Adjust the padding as needed */
}
.crossSell a:hover{
    text-decoration: none;   
}
.x-sell-content{
    margin-top: 80px;
}
.glyphicon-chevron-right:before {
    content: "\e080";
}
.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus{
    outline-offset: 3px;
}
.prod-card a{
    text-decoration: none;
}
.jumbotron.portal-landing-image{
    z-index: -1;
}
.submit-card .h5, .card-default .h5, .calculatorDiv .h5{
    font-weight: normal;
}
.LandingInfo .h5{
    font-weight: normal;
}
.x-sell a{
    color: var(--primary-color);
    text-decoration: none;
}
.x-sell a:hover{
    color: var(--secondary-color);
}

/************************** remove double border in health questions **************************/
.health-row-2, .mem-ans-4, .spouse-ans-4, .spouse-ans-5{
    margin-top: -1px;
}

/*.submit-mail{*/
/*    background-image: url(https://memberenroll-stage.com/uploads/00001117/print-and-mail.svg);*/
/*    background-repeat: no-repeat;*/
/*    padding: 0 0 0 75px;*/
/*    background-position: left;*/
/*}*/

.age-warning a{
    color: #0066CC;
}
.age-warning p, .age-warning h6{
    color: #1A1D1E;
}
.accordion-button:focus {
    box-shadow: 0 0 0 2px #183059;
}

.card-enroll strong{
    font-weight: 500; 
    color: #333;
}

/* Tri-agency START */
    
.tri-agency{
    color: #333;
    border: 1px solid #cccccc;
    font-family: 'calibri-regular', sans-serif;
    font-size: 19px!important; 
}
.tri-agency a{
    color: #3174AE;
    font-weight: 600;
}
.tri-agency a:hover{
    text-decoration: none;
}
.tri-agency p, .tri-agency li{ 
    font-size: 19px!important; 
}
.tri-agency p, .tri-agency ul{
    margin-bottom: 0px;
}
.modal-body{
    /*padding: 16px;*/
}
.modal-header{
    /*background: #183059;*/
}
.modal-header h5{
    /*color: #FFF!important;*/
}
.btn-close {
    /*filter: brightness(0) invert(1);*/
}

.tri-agency a{
    color: #333;
    text-decoration: none;
    /*font-weight: 700;*/
    font-family: 'calibri-bold'!important;
}

.tri-details li{
    margin: 20px 0;
}
.tri-agency .bold{
    font-family: 'calibri-bold'!important;
}
.tri-agency .modal-title{
    text-align: center;
}

/* Tri-agency START */