@import url('https://fonts.googleapis.com/css?family=Noto+Serif|Open+Sans:300,400');

/* di calc styles */
.di-calc .big{
    font-size:30px;
    font-weight:700;
    color: #002d73;
    padding: 0 2px;
}
.di-calc .topPrice{
  padding-bottom: 8px;
  line-height: 40px;
}
.di-calc .btn br{
  border-bottom: 1px solid black;
  display: block;
  content: "";
  margin-bottom: 8px;
}

.di-calc .slidervalue {
    font-size:28px;
    font-weight:700;
    position:absolute;
    right:40px;
    margin-top:-38px;
}

.di-calc label{
    font-size:20px;
    font-weight: 600;
    width: 100%;
    color: #002d73;
}

.di-calc .slidervalue:before{
    content:'$';
}

.di-calc .ui-widget-header{
    background: #61ccdc;
}

.di-calc .ui-slider{
    margin-bottom:30px;
}

.di-calc .sliderprompt{
    display:block!important;
    font-size: 20px;
    color: #333;
     margin: 4px 0 12px;
}

.di-calc .slidervalue.no_currency:before{
	content:"";
}
.ltd-choice-btn .btn,
.ltd-choice-btn .btn2{
    white-space:normal;
    margin-bottom:10px;
    border-radius: 4px;

    font-weight: 600;
    color: #000;
    background-color: #e3f2f4;
    background-image: none;
    border-color: #999;
    display: block;
    padding:  6px 16px;
    font-size: 16px;
}
.ltd-choice-btn .btn:hover{
    background-color:#a4d2d8;
}
.ltd-choice-btn .btn2:hover{
    background-color:#e3f2f4;
}
.di-calc .answer{
	margin-top: -58px;
}
/* journey beautification below this point*/

/* padding spacing*/
.ltd-calculator {
	color: #333;
	line-height: 1.5em;
}

.ltd-calculator h1{
	color: #333;
	line-height: 1.5em;
}
.ltd-calculator h6{
margin-bottom: 0;
}
.well-left label{
    margin-top: -4px;
}
.no_currency{
    display: none;
}
.btn2{
cursor:default;
}
@media (min-width: 480px) {
.no_currency{
    display: inline-block;
}
}
.footer a{
    color: #3174AE    
}

/****************** Jumbotron ******************/
.landing-image-frontpage {
    background-image: url(/uploads/00001251/tma-landing-bg.jpg);
    background-position: 35% 35%;
    background-color: #aaa4a4;
    background-size: cover;
    min-height: 260px;
    background-repeat: no-repeat;
}
@media(min-width:1800px){
.landing-image-frontpage {
    background-position: 35% 35%;
    background-size: 70%;
    }
}

/* Landing Info Area */
.blueBackground {
    color: #fff;
    background-color: #07639d;
}
/* Landing Icons */
.plansIcon {
    /*min-height: 340px;*/
}
@media(max-width: 767px) {
    .plansIcon:nth-child(n+1):nth-child(-n+7){
        min-height:0px;
        padding-bottom: 40px;
    }
}
@media(min-width: 768px){
.plansIcon:nth-child(n+4):nth-child(-n+5) {
padding-bottom: 30px;
	}
}
.circle span {
    /*background: url(/uploads/00001251/large_icon_sprite.png) no-repeat;*/
}
@media (min-width: 768px){
.jumbotron {
    padding: 30px 0;
    min-height: 260px;
    }
}
.jumbotron .footnote {
    font-size: 14px;
}


/****************** Anniversary Landing Page Section ******************/
.anniversary {
    padding-top: 28px;
    margin: 0 auto;
    text-align: center;
}
@media(max-width: 991px){
    .anniversary{
        padding-top: 0px;
        padding-bottom: 20px;
    }
}
/* Navbar updates */
/*ul.navbar-right{*/
/*    display: none;*/
/*}*/


/****************** Life Jumbotron ******************/

.landing-jumbotron-life{
    background-color: #e0e5e1;
}
@media(min-width: 768px) {
.landing-jumbotron-life {
    background-image: url(/uploads/00001251/tma-life-bg.jpg);
    background-color: #e0e5e1;
    background-repeat: no-repeat;
    }
}
@media (min-width: 768px){
.product-jumbotron {
    background-position: 30% 20%;
    background-size: 135%;
    }
}
@media (min-width: 1200px){
.product-jumbotron {
    background-position: -10% 20%;
    background-size: 110%;
    }
}
@media (min-width: 1500px){
.product-jumbotron {
    background-position: 130% 20%;
    background-size: 90%;
    }
}
.bg-red{
    background: rgba(0, 45, 115, .9);
}
.rounded{
    border-radius: 6px;
}
@media(max-width:767px){
.rounded{
    border-radius: 0px;
    }
}
.hero-par{
    min-height: 268px;
    display: flex;
    /*justify-content: center;*/
    align-items: center;
}


/****************** ADD Jumbotron ******************/

.landing-jumbotron-add{
    background-color: #f5ebe7;
}
@media(min-width: 768px) {
.landing-jumbotron-add {
    background-image: url(/uploads/00001251/tma-add-bg.jpg);
    background-color: #f5ebe7;
    background-repeat: no-repeat;
    }
}

/****************** ACC Jumbotron ******************/

.landing-jumbotron-acc{
    background-color: #d5cec8;
}
@media(min-width: 768px) {
.landing-jumbotron-acc {
    background-image: url(/uploads/00001251/tma-acc-bg.jpg);
    background-color: #d5cec8;
    background-repeat: no-repeat;
    }
}

/****************** CI Jumbotron ******************/

.landing-jumbotron-ci{
    background-color: #e7e8e9;
}
@media(min-width: 768px) {
.landing-jumbotron-ci {
    background-image: url(/uploads/00001251/tma-ci-bg.jpg);
    background-color: #e7e8e9;
    background-repeat: no-repeat;
    }
}

/****************** BOE Jumbotron ******************/

.landing-jumbotron-bo{
    background-color: #101d2a;
}
@media(min-width: 768px) {
.landing-jumbotron-bo {
    background-image: url(/uploads/00001251/tma-bo-bg.jpg);
    background-color: #a9a7ac;
    background-repeat: no-repeat;
    }
}


/****************** Card Selection Area ******************/

.landing-products{
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin-right: -15px;
    margin-left: -15px;
    padding: 0 15px;
}
.product-card{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 25%;
    flex: 1 0 25%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-right: 15px;
    margin-bottom: 0;
    margin-left: 15px;
    border: 2px solid #eaeaea;
    padding: 25px;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,0.12);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: .2s;
    transition-timing-function: ease-in;
    top: 0;
}
.product-card:hover {
    top: -5px;
    position: relative;
}
@media(max-width: 768px){
    .product-card{
        -ms-flex: 1 0 90%;
        flex: 1 0 90%;
    }
}
.product-card img {
    width: 75px;
    transition: .2s;
    transition-timing-function: ease-in;
    margin: 0 auto;
}
.product-card:hover img {
    width: 80px;
    margin: -6px auto 0 auto;
}
.benefitHighlights h4 {
    font-size: 16px;
    font-weight: 400;
}
.benefitHighlights a:hover {
    text-decoration: none;
}
.landing-products .btn{
    padding: 8px 24px;
    color: #fff;
    background-color: #07639d;
    border-color: #07639d;
    font-weight: 600;
    transition: .2s;
    transition-timing-function: ease-in;
}
.landing-products .btn:hover{
    background-color: #05446c;
    border-color: #021623;
}
.product-card:hover .btn{
    background-color: #05446c;
    border-color: #021623;
}
@media(max-width: 991px){
    .product-card h4{
    font-size: 15px;
    }
}
#trSTDEnrollCard .formSlider label{
    display: none;
}


/****************** Landing Contact Area ******************/
label {
    font-size: 15px;
    color: #333;
    font-weight: 500;
}
select {
    font-weight: 400;
    /*color: #b9b9b9;*/
}
.warning{
    font-size: 14px;
}
@media (min-width: 992px){
.contact-container {
    min-height: 530px;
    background-image: url(../../uploads/00001101/advisors.gif);
    background-repeat: no-repeat;
    background-position: left bottom;
    }
}


/****************** Landing FAQs Area ******************/
.life-faqs .panel-default>.panel-heading, .life-faqs .panel-group .panel-heading + .panel-collapse > .panel-body,
.add-faqs .panel-default>.panel-heading, .add-faqs .panel-group .panel-heading + .panel-collapse > .panel-body{
    background-color: #fff;
}


/****************** Life Articles Section ******************/
.life-related-articles{
    background: #F5F5F5;
}


/****************** Navbar ******************/
.navbar {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important
}


/****************** Enrollment Forms ******************/
.enroll-progress-bar .caption{
    font-size: 14px;
}
.step-indicator .step {
    background-color: #767676;
    color: #fff;
    width: 32px;
    height: 32px;
    line-height: 32px;
    border-radius: 20px;
    text-align: center;
    margin: 0 auto;
    font-size: 16px;
    /*outline: solid 5px #fff;*/
}


/****************** Product Page Articles Area ******************/

@media(max-width:767px){
.life-related-articles .img-responsive{
    margin-top: 40px;
    }
}

@media(min-width:767px){
.life-related-articles .img-responsive{
    margin-top: 20px;
    }
}


/****************** SPOUSE/CHILD LIFE01 - move eventually ******************/

.enrollButton.spouseButton .buttonState {
    background: url(/uploads/00001251/spouse-btn.svg);
    background-color: #f1f1f1;
    background-size: 72px 72px;
    background-repeat: no-repeat;
    background-position: center 12px;
}

.enrollButton.childButton .buttonState {
    background: url(/uploads/00001251/child-btn.svg);
    background-color: #f1f1f1;
    background-size: 72px 72px;
    background-repeat: no-repeat;
    background-position: center 12px;
}

.enrollButton .buttonState {
    text-align: center;
    border: 1px solid;
    border-radius: 4px;
    font-size: 16px;
    padding: 92px 12px 16px;
    border-radius: 4px;
    font-weight: 500;
    color: #000;
    border-color: #7a7a7a;
    display: block;
    width: 100%;
    margin-top: 16px;
}

.enrollButton .buttonState.active {
    color: #002d73;
    font-weight: 600;
    background: url(/uploads/00001251/check-btn.svg);
    background-size: 72px 72px;
    background-repeat: no-repeat;
    background-position: center 12px;
    border: 3px solid;
    /*border-color: #002d73;*/
    border-color: #002d73;
    background-color: #fff;
}


/****************** Enrollment 2 Section ****************/


.termButton .buttonState {
    text-align: center;
    border: 1px solid;
    border-radius: 4px;
    font-size: 15px;
    padding: 8px 12px;
    border-radius: 4px;
    font-weight: 600;
    color: #000;
    background-color: #e6e6e6;
    border-color: #fff;
    display: block;
    width: 100%;
}

.termButton .buttonState.active {
    color: #fff;
    background-color: #1470aa;
    background-image: linear-gradient(to top,#154d70 -25%,#1470aa 125%);
}

.termButton .productField {
    min-height: 10px;
}

.part2LongForm{
    display: none;
}

.answer {
    margin-bottom: 0;
}

/********** Styles to update BACK and NEXT buttons on mobile **********/
.hideMobile {
    display: none;
}
@media (min-width: 768px){
.hideMobile {
    display: inline-block;
    }
}
.btn.btn-fill {
    width: 100%;
}
@media (min-width: 768px){
.btn.btn-fill {
    width: auto;
    }
}

/********* ***********/
.sliderlabel span.sliderprompt{
    font-size: 20px;
    color: #333;
    margin: 0px 0 20px;
}

.ltd-landing-slider{
    margin: 40px 0 0 0px;
}


.newPolicy .productField{
    flex-wrap: wrap;
}

.newPolicy .buttonState{
	flex-basis: 100%;
}

.newPolicy .buttonState:last-child{
	margin-top: 25px;
}

/************** Fix CI Child Coverage options to stack on mobile 400px max **************/
@media(max-width: 400px){
    #trChildrenCardRow .productField{
        flex-direction: column;
    }
    #trChildOfferPriceDiv{
        position: inherit;
    }
}


/************** Fix BOE type of practice options to stack on mobile 400px max **************/
@media(max-width: 400px){
    .practice-type-row .productField{
        flex-direction: column;
        margin-top: 20px;
    }
    /*#trChildOfferPriceDiv{*/
    /*    position: inherit;*/
    /*}*/
}



/************* Fix minimum width of radio buttons on mobile to avoid becoming ovals ***********/
input[type="radio"] + label::before{
    min-width: 36px;
}

.std-elim .buttonState{
    min-width: 100%;
    margin-bottom: 14px;
}
.std-elim .productField{
    display: block;
}

.emailButton .buttonState:focus, .emailButton .buttonState:hover {
    background-color: #05446c;
    border-color: #021623;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: 2px;
}

.rout-check-num .buttonState:focus {
    outline: 2px solid #015fcc;
    outline-offset: 2px;
}

#trSTDEnrollCard .h3{
    font-weight: 600;
}
#trSTDEnrollCard .h6{
    font-weight: 500;
    margin-bottom: 0px;
}

.ui-widget :active, .ui-widget :focus {
    background: #fff;
    border: 2px solid #07639d !important;
}

.std-elim .answer .buttonState:focus {
    outline-offset: 4px;
    outline: 2px auto #07639d;
}

.productField input[type="radio"]:focus + label {
    border: 2px solid #07639d;
    padding: 5px;
    border-radius: 0px;
}

.yesNoBtn span span {
    padding: 8px 8px 10px 22px;
    color: #002d73;
    font-weight: 400;
    font-size: 15px;
    background: url(../../uploads/00001321/radio_bg.png);
    background-size: 36px 36px;
    background-repeat: no-repeat;
}

input[type="radio"] + label::before{
    content: '';
    display: inline-block;
    position: relative;
    width: 36px;
    height: 36px;
    margin-right: .5em;
    border: 2px solid #666;
    border-radius: 200px;
}


.land-apply {
    padding: 8px 24px;
    color: #fff;
    background-color: #07639d;
    border-color: #07639d;
    font-weight: 600;
    transition: .2s;
    transition-timing-function: ease-in;
    border-radius: 5px;
}


@media(max-width: 800px){
    .landing-products{
        margin-left: 0px;
        margin-right: 0px;
    }
}


.nav>li>a:focus, .nav>li>a:hover{
    background: none;
}

.landing-products a:focus{
    outline-offset: 16px;
}

.preview-form-link a{
    color: #0066CC;
    outline-offset: 2px;
}

.slider_limits{
    font-size:14px;
    padding-bottom: 15px;
}

.enrollButton.spouseButton .buttonState:focus, .enrollButton.childButton .buttonState:focus {
    outline: 2px auto #08639e;
    outline-offset: 6px;
}