body {
    font-family: Roboto !important;
}

/*dashboard css*/
.dashboardHeader {
    background-image: url(/dashboardImage);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    margin-left: -18px;
    margin-right: -18px;
    padding-bottom: 25px;
    margin-top: -18px;
    display: flex;
    margin-bottom: 15px;
}

.billingdetails{
  margin-top: -10px;
}
.dashboard-card-template {
    border-radius: 0px;
    background-color: #ffffff;
    padding-bottom: 30px;
    padding-left: 30px;
    padding-top: 10px;
    margin-top: 15px;
    padding-right: 30px;
    margin-bottom: 15px;
}

.billing-template{
background-color: #ffffff;
display: inline-block;
position: relative;
height: auto;
}

h6#dateTextDisplay {
    color: #001F5F;
    text-align: center;
    font-weight: bold;
    font-style: italic;
}

p.paymentVerbiage {
    position: relative;
    left: 29px;
    font-size: 15px;
    width: 85%;
    text-align: center;
    margin-top: 10px;
    color: #001F5F;
    font-family: Roboto;
    font-weight: bold;
}

p.paymentVerbiage1 {
    position: relative;
    font-size: 15px;
    text-align: center;
    margin-top: 10px;
    color: #001F5F;
    font-family: Roboto;
    font-weight: Bold;
}

.billingborderright{

border-right: 1px solid #979797;
}

.payment-rec-amount {
    line-height: 26px;
}

.pending-payment-records {
    font-family: Roboto;
}

.payment-date, .payment-amount{

border-top: 1px solid #D5D7DA;
font-size: 10px;
padding: 0px;
}

.payment-date-title, .payment-amount-title{

border-top: 1px solid #D5D7DA;
font-size: 11px;
font-weight: bold;
padding: 0px;
}
#viewyouraccounts {
   /* left: 5px; */
    padding-left: 22px !important;
    padding-right: 22px !important;
    position: relative;
    background-color: #f1b434;
    font-size: 12px !important;
    height: 34px !important;
    width: 165px;
    margin: 0 auto !important;
    display: block;
    /* float: none !important; */
}

#paymenthistory {
    font-size: 12px !important;
    height: 34px !important;
    margin: 0 auto !important;
    position: relative;
    width: 165px;
    display: block;

}



.upcoming-due-date {
  
  color: #001F5F;
  font-family: Roboto;
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 21px;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  max-width: fit-content;
}

.upcoming-no-pending {
  
  color: #001F5F;
  font-family: Roboto;
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 98px;
  margin-left: auto;
  margin-right: auto;
  max-width: fit-content;
  position: relative;
}

.dashboard-balance {

color: #0088CE;
  font-family: Roboto;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 21px;
  text-align: center;

}
.paymenthistory-account-type {
color: #001F5F;
  font-family: Roboto;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 21px;
  text-align: center;


}

.paymenthistory-account-name {

color: #001F5F;
  font-family: Roboto;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 21px;
  text-align: center;

}



.upcoming-due-date-variable {
 
  color: #0088CE;
  font-family: Roboto;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 32px;
  text-align: center;
}
.mobileDashboardCards{
    display: none;
}
.dashboard-card-heading {
    font-family: Roboto;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    color: #001f5f;
}

.headerText1, .headerText2 {
    font-family: Roboto;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.4px;
    color: #001f5f;
    width: auto;
}
.dashboard-plans-header{
    font-size: 36px;
    letter-spacing: 0;
    line-height: 42px;
}
.dashboard-benefits-header, .dashboard-popular-actions-header{
  font-size: 28px;
  letter-spacing: 0;
  line-height: 32px;
}
.waepa-dashboard-plan-icon{
    width: 35px;
    align-self: center;
}
.dashboard-plan-name{
    margin-left: 22px;
    margin-top: 5px;
}
.externalLinkIcon {
    height: 14px;
    width: 14px;
    margin-left: 5px;
    position: absolute;
    margin-top: 5px;
}

.mobileDashboardHeader {
    display: none;
}

.parentDashboardDiv {
    margin-left: 5px;
    margin-bottom: 15px;
    padding: 0 !important;
}

.dashboardContent {
    margin-right: 10px !important;
}


.dashboardText {
    font-family: Roboto;
    font-size: 24px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.4px;
    color: #ffffff;
    margin-left: 72px;
    padding-top: 54px;
}

.welcomeBackTxt {
    font-family: Roboto;
    font-size: 36px;
    line-height: 42px;
    letter-spacing: 0px;
    color: #ffffff;
    margin-left: 38px;
    padding-top: 20px;
}

.welcomeBackTxt2 {
    font-family: Roboto;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.4px;
    color: #001f5f;
    font-style: italic;
    text-align: right;
    padding: 0 35px 0 0;
    left: auto;
    max-width: 20%;
    margin: 35px 0 auto auto;
}

.insurancePlansDivMobile {
    display: none;
}

.dashboardAnnouncement {    
    margin-left: 0px;
    width: 100% !important;
    background-color: transparent;
    margin: 0 !important;
}

.externalLinkIconWhite {
    float: right;
    margin-right: 110px;
    margin-top: 21px;
    height: 20px;
}

.announcementTitle {
    padding-top: 25px;
    text-align: center;
    margin-left: 91px;
    margin-right: 75px;
  color: #FFFFFF;
  font-family: Roboto;
  font-size: 21px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 30px;
  text-align: center;
}



.announcementDescription {
    font-family: Roboto;
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 21px;
    letter-spacing: 0.4px;
    color: #ffffff;
    margin-top: 0px;
    padding-bottom: 35px;
    text-align: center;
    margin-left: 100px;
    margin-right: 100px;
    height: auto;
}

.insuranceDashboardHeader {
    background-color: #ebebeb;
    display: flex;
    margin-left: -25px;
    margin-top: 20px;
    padding-left: 38px;
    padding-top: 16px;
    padding-bottom: 9px;
    margin-right: -15px;
}

.insuranceHeader {
    font-family: Roboto;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.4px;
    color: #333333;
}

.insurance-header-style2 {
    margin-left: -24px;
}

.insurance-header-style3 {
    margin-left: 4px;
}

.insuranceDashboardContent {
    padding-top: 20px;
    padding-left: 0 !important;
}

.insurance-plan-name {
  color: #001F5F;
  font-family: Roboto;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 28px;
  padding-left: 10px;
}

.insurance-plan-name:hover, .insurance-plan-name:focus {
  color: #001F5F !important;
  text-decoration: none !important;
}

.insuranceContent{
  color: #001F5F;
  font-family: Roboto;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 24px;
  margin-bottom: auto;
  margin-right: 20px;
}
.insuranceDashboardPolicyNO {
    padding-left: 0 !important;
}

.insuranceDashboardPremium {
    padding-left: 7px !important;
}

.insuranceContentAddtnl {
    font-family: Roboto;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #545964;
}

/* duplicate page modal pop up */

#duplicatePage{

    position: fixed;
    top: 16px;
    right: 100px;
    bottom: 0px;
    left: 234px;
    z-index: 1050;
    width: 70%;
    opacity: 1;
    
}

#mod-header{

border-bottom: 0px solid #e5e5e5 !important;
}

#ok-button{
    margin-left: 40%;
    margin-bottom: 20px;
}

#title{
font-family: Roboto;
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.93px;
    color: #001f5f;

}

@media all and (min-width:319px) and (max-width: 767px) {
    #duplicatePage {
          left: 1% !important;
          position: fixed;
          top: 77px !important;
          width:96% !important;
}
     #ok-button{
    margin-left: 34% !important;
}
}

@media all and (min-width:768px) and (max-width: 819px) {
    #duplicatePage {
          width:97% !important;
          left: 1% !important;
}
    
}
}

@media all and (min-width:820px) and (max-width: 1180px) {
    #duplicatePage {
           left: 9% !important;
           width:84% !important;
}

}


/* duplicate pop up code ends here */

@media all and (min-width:319px) and (max-width: 768px) {
    .insuranceContentAddtnl {
        padding-left: 0px;
    }



.billing-template {
    background-color: #ffffff;
}

p.paymentVerbiage {
    left: -35px !important;
    font-size: 13px !important;
    width: 124% !important;
}

.viewyouraccounts{

margin-top:6px;
}

.billingborderright {
    border-right: 0px solid #979797;
    border-bottom: 1px solid #979797;
}
}

.moreDetailsInsurance {
    float: right;
    margin-top: -50px;
}

.moreDetailsInsurance-withoutcb {
    float: right;
    margin-top: 5px;
}

.getInTouchTxt1 {
    font-family: Roboto;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.63;
    letter-spacing: 0.4px;
    color: #555555;
    margin-top: 20px;
}

.getInTouchTxt2 {
    font-family: Roboto;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.63;
    letter-spacing: 0.4px;
    color: #555555;
}

.insurancePlansDiv {
    height: 392px;
    position: relative;
}

#dashboardCarousel {
    margin-left: -14px;
    margin-right: -14px;
    background-color: #0088CE;
}
.carousel-inner {
    margin-top: 15px;
    margin-bottom: 15px;
}
.carousel-indicators {
    top: 80% !important;
}

.carousel-control {
    width: 6% !important;
    background: none !important;
}

.carousel-control:hover,
.carousel-control:focus {
    text-decoration: underline !important;
    background: none !important;
}

.right .carousel-control {
    width: 3% !important;
    right: 61px !important;
    background: none !important;
}

#scrollableInsuranceDiv {
    height: 234px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 20px;
    margin-right: -15px;
    margin-left: -9px;
}

.benefitsSectionTopic {
    font-family: Roboto;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.63;
    letter-spacing: 0.2px;
    color: #333333;
    margin-top: 35px;
}

.benefitsSectionResourcesSection {
    font-family: Roboto;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.63;
    letter-spacing: 0.2px;
    color: #555555;
}

.coverageUpgradeDetails2 {
    font-family: Roboto;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.63;
    letter-spacing: 0.4px;
    color: #001f5f;
    padding-top: 10px;
    padding-bottom: 5px;
}

.coverageUpgradeDetails3 {
    font-family: Roboto;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.56;
    letter-spacing: 0.4px;
    color: #555555;
    padding-top: 7px;
    margin-bottom: 0px;
}

.coverage-today-header {
    margin-top: 20px;
    font-size: 16px !important;
}

.currentAddress {
    font-family: Roboto;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 24px;
    letter-spacing: 0.4px;
    color: #001F5F;
    margin-top: 30px;
}

.currentAddresDetails {
    font-family: Roboto;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.46px;
    color: #545964;
}

.coverageChangeButton {
    border: 0;
    margin-left: 25px;
    margin-bottom: 11px;
    height: 36px;
}

#decreaseCoverageForm {
    margin-top: 20px;
}


.contactWaepaInfo {
    margin-top: 15px;
}

.coverage-contact-waepa {
    padding-bottom: 30px;
    margin-left: 2.5rem;
}

.nYapplicationInfo {
    margin-right: 20px;
    font-family: Roboto;
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.38;
    letter-spacing: 0.4px;
    color: #555555;
}

#decCoverageIframe {
    min-height: 498px;
}

.iframealign {
    height: 63%;
    width: 100%;
    border-width: 0px;
}


#remCirModal,
#coverageModal,
#cancelCoverageModal {
    top: 10%;
}
#centered-plans-block {
    width: 100%;
    margin: 0;
    position: static;
    top: auto;
    -ms-transform: translateY(0%);
    transform: translateY(0%);
}
.insurancePlansDiv {
    height: auto;
}
#managePlanLink {
    margin-top: 30px;
}
#dashboard-plan-details-view{
    display: flex;
}
/*css for dashboard from 768 to 991px */
@media all and (min-width: 768px) and (max-width: 991px) {
    .coverageUpgradeTxt3,

    .coverageUpgradeTxt2 {
        font-size: 16px;
        font-weight: bold;
    }

    .mobileInsurancedividerDiv {
        border-bottom: 1px solid #cccccc;
    }

    .coverageUpdateSection {
        margin-top: -7px;
        width: 105% !important;
        padding-left: 0px !important;
        margin-left: -15px;
    }

    .profileUpdateSection {
        padding-left: 0px !important;
    }

    .dashboardContactNumber {
        display: block;
    }

    .parentDashboardDiv {
        width: 103% !important;
    }

    .updateProfileCard,
    .updateCovergaeCard {
        margin-top: 20px;
    }
}

@media all and (min-width:319px) and (max-width: 768px) {
    .mobileDashboardHeader {
        display: block;
        background-color: #001f5f;
        margin-top: -60px;
        margin-left: -15px;
        margin-right: -15px;
        padding-bottom: 39px;
    }

    .getInTouchHeader,
    .getInTouchTxt1,
    .getInTouchTxt2 {
        margin-left: 0px;
    }

    .mobileDashboardHeadertxt {
        font-family: Roboto;
        font-size: 24px;
        font-weight: bold;
        letter-spacing: 0;
        line-height: 28px;
        color: #ffffff;
        padding-top: 10px;
        padding-left: 25px;
        margin-bottom: -14px;
    }

    .dashboardText {
        display: none;
    }

    .dashboardHeader {
        height: auto;
        margin-right: -15px;
    }

    .welcomeBackTxt {
        font-family: Roboto;
        font-size: 24px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        color: #ffffff;
        margin-top: 0px;
        padding-top: 30px;
        margin-left: 25px;
        padding-right: 37px;
    }

    .welcomeBackTxt2 {
        font-family: Roboto;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.4px;
        color: #ffffff;
        margin-left: 55px;
        padding-right: 23px;
    }

    .parentDashboardDiv {
        margin-top: 0px;
        background-color: #f5f5f5;
        margin-left: -10px;
        width: 102% !important;
    }

    .externalLinkIconWhite {
        height: 20px;
        width: 20px;
        float: right;
        margin-right: 20px;
        margin-top: 25px;
    }

    .dashboardAnnouncement {
        width: 104% !important;
        margin-bottom: 10px;
    }

    .announcementTitle {
        font-size: 20px;
        margin-left: 45px;
        text-align: center;
        margin-right: 45px;
        margin-bottom: 10px;
        line-height: normal;

    }

    .announcementDescription {
        font-size: 16px;
        margin-left: 54px;
        margin-right: 54px;
        height: auto;
        white-space: normal;
    }

    #dashboardCarousel {
        /*height: 187px !important;*/
    }

    .insurancePlansDivMobile {
        display: block;
        background-color: #ffffff;
        margin-top: 20px;
        padding-bottom: 15px;
        width: 104% !important;
    }

    .getInTouchTxt2 {
        margin-top: 16px;
    }

    .insurancePlansDiv {
        
    }

    .insuranceDashboardHeaderMobile {
        background-color: #d8d8d8;
        margin-left: -15px;
        margin-right: -16px;
        padding-top: 15px;
        padding-bottom: 10px;
        padding-left: 23px;
        padding-right: 18px;
    }

    .change-coverage-validation-msg {
        margin-left: 0px !important;
    }

    .mobileInsuranceHeadertxt {
        font-family: Roboto;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.63;
        letter-spacing: 0.32px;
        color: #001f5f;
    }

    .viewAll {
        font-family: Roboto;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.63;
        letter-spacing: 0.4px;
        color: #1775d2;
        float: right;
        margin-top: -35px;
    }

    .mobile-policy-name {
        font-family: Roboto;
        font-size: 14px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.43;
        letter-spacing: 0.4px;
        color: #333333;
    }

    .policyDetailsMobile {
        margin-left: -7px;
        margin-top: 10px;
        padding-bottom: 10px;
    }

    .mobilepolicyTxt1 {
        font-family: Roboto;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.63;
        letter-spacing: 0.4px;
        color: #666666;
        margin-top: -7px;
    }

    .mobilepolicyTxt2 {
        font-family: Roboto;
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.29;
        letter-spacing: 0.4px;
        color: #666666;
        margin-top: -7px;
    }

    .movbilemoreDetailsDiv {
        margin-top: 37px;
    }

    .moreDetailsImg {
        width: 9px;
    }

    .coverageDetails1 {
        margin-left: -7px;
        padding-bottom: 10px;
    }

    .coverageDetails2 {
        margin-left: 7px;
    }

    .getInTouchDiv {
        margin-left: -15px;
        width: 119% !important;
        margin-top: -6px;
        padding-left: 26px !important;
        padding-right: 52px !important;
        padding-bottom: 20px !important;
    }

    .benefitsSection {
        margin-left: -13px;
        width: 119% !important;
        padding-bottom: 20px;
        margin-bottom: 60px;
        padding-left: 0px !important;
    }

    .coverageUpgradeTxt3,
    .coverageUpgradeTxt2 {
        font-size: 16px;
        font-weight: bold;
    }

    .mobileInsurancedividerDiv {
        border-bottom: 1px solid #cccccc;
    }

    .coverageUpdateSection {
        margin-top: -7px;
        width: 119% !important;
        padding-left: 0px !important;
        margin-left: -15px;
    }

    .profileUpdateSection {
        padding-left: 0px !important;
        width: 108% !important;
    }

    .dashboardContactNumber {
        display: block;
    }

    .quickActions {
        display: none !important;
    }

    .carousel-control {
        width: 0% !important;
        background: none !important;
    }

    .carousel-control.left {
        left: 30px !important;
    }

    .carousel-control.right {
        right: 30px !important;
    }

    .dashboard-card-template {
        width: 104% !important;
        padding-bottom: 30px;
        min-height: auto !important;
    }

    .beneficiarydiv {
        padding-left: 0rem !important;
    }


    .modal-dialog {
        width: 91% !important;
        margin: 17px !important;
    }

    .modal-title {
        padding-left: 0rem;
    }


    .dashboard-coverage-update-options {
        display: flex;
    }

    .coverageChangeButton {
        margin-left: 0px;
        margin-right: 10px;
    }

    .dashboard-coverage-update-options {
        display: flex;
    }

    .get-in-touch-card {
        padding-bottom: 20px;
    }

    .updateProfileCard,
    .updateCovergaeCard {
        margin-top: 10px !important;
    }
    .dashboardHeader{
        margin-bottom: 10px;
    }
    .dashboardAnnouncement, .dashboard-card-template {
        margin-top: 5px;
    }
 #dashboard-payment-history-card {

text-align: center

}
    .updateCovergaeCard {
        padding-bottom: 20px;
    }

    .updateCovergaeCard {
        padding-bottom: 20px;
    }

}
/*css for dashboard announcements card for Ipad*/

@media (max-width: 768px) and (min-width: 768px) {

    .dashboardAnnouncement {
        width: 104% !important;
    }
    .announcementTitle {
        font-size: 20px;
        margin-left: 54px;
        text-align: center;
        margin-right: 54px;
        height: auto !important;
        overflow-y: hidden;
        padding-bottom: 23px;
        text-align: center;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .externalLinkIconWhite {
        width: 20px;
        float: right;
        margin-top: 19px;
    }

    #dashboardCarousel {
        height: 120px;
    }

    .announcementDescription {
        font-size: 16px;
        margin-left: 84px;
        text-align: center;
        margin-right: 84px;
        margin-top: -23px;
        height: auto;
        overflow: visible;
        white-space: normal;
    }

    .dashboard-card-template {
        width: 104% !important;
    }

    .parentDashboardDiv {
        width: 99% !important;
    }

    .updateProfileCard,
    .updateCovergaeCard {
        margin-top: 20px;
    }

    /*profile header change for Ipad*/
    .headerdiv {
        margin-right: -34px;
        padding-top: 20px;
    }

    .mobileuserInfo {
        width: 106% !important;
    }

    .arrowMessageCenter {
        margin-top: 10px;
    }

    .messageDetailsHeader {
        margin-top: -59px !important;
    }

    /*Ipad changes for modal dialog*/
    .modal-dialog {
        margin: 33px !important;
    }
}



@media (max-width: 1023px) and (min-width: 769px) {
    .parentDashboardDiv {
        margin-left: -8px !important;
        width: 99% !important;
    }

    .updateProfileCard,
    .updateCovergaeCard {
        margin-top: 20px !important;
    }
}

@media (max-width: 1024px) and (min-width: 991px) {
    .externalLinkIconWhite {
        float: right;
        margin-right: 83px;
    }

    .announcementTitle {
        text-align: center;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .updateProfileCard,
    .updateCovergaeCard {
        margin-top: 20px !important;
    }
}

@media (max-width: 767px) and (min-width: 550px) {
    .parentDashboardDiv {
        margin-left: -10px;
        width: 99% !important;
    }

    .updateProfileCard,
    .updateCovergaeCard {
        margin-top: 20px !important;
    }
}

/*css for dashboard announcements card for Ipad ends here*/


#dashboard-plan-details-view {
    cursor: pointer;
}
.waepa-plan-icon{
    width: 40px;
}

/* payment history*/



.billing-summary {
  
  color: #001F5F;
  font-family: Roboto;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 32px;
}
/* Popular Actions */

.popular-actions-wrapper {
    margin-top: 15px;
}
.popular-actions {
    display: block;
    justify-content: space-between;
    border-bottom:  0.5px solid #979797;
    padding: 9px 0px;
    color: #001F5F;
    padding-right: 10px;
    text-decoration: none !important;
}

.makepaymentborder{
border-top: 0px !important;
}
.popular-action-first {
    border-top:  0.5px solid #979797;
    /*border-bottom:  0.5px solid #979797;*/
}

.popular-title {
    color: #001F5F;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 24px;
}

.popular-title:hover , .popular-title:focus {
  color: #001F5F !important;
  text-decoration: none !important;
}
.popular-actions-arrow {
    align-self: center; 
    float: right;
}


/* Update Profile */
.user-profile-wrapper {
    margin-top: 20px;
    margin-bottom: 15px;
    display: flex;
}

.dashboard-username {
  color: #001F5F;
  font-size: 36px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 42px;
}

.dasboard-user-icon {   
   height: 34px;
   width: 35px;
   margin: 1px 5px 20px -8px;
}

.dashboard-refund {
  color: #001F5F;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 26px;
}

.refund-amount {
  font-weight: bold;
  color: #0083BF;
  font-size: 18px;
}

.address-wrapper {
  margin: 10px 0 30px;
}

.currentAddress, .currentAddresDetails {
  margin-bottom: 0;
}

.edit-profile, .manage-your-plan {
  color: #001F5F;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 24px;
}
.edit-profile{
    display: flex;
}
.edit-profile:hover , .edit-profile:focus, .manage-your-plan:hover, .manage-your-plan:focus {
  color: #001F5F !important;
  text-decoration: none !important;
}

.edit-profile:before {
    content: '';
    position: relative;
    top: 0px;
    margin-right: 8px;
    display: inline-block;
    background: url(/dashboard-edit-profile);
    height: 24px;
    width: 24px;
}

.edit-profile:after {
    content: '';
    position: relative;
    top: 0px;
    margin-left: 8px;
    display: inline-block;
    background: url(/dashboard-right-arrow);
    height: 24px;
    width: 24px;
}

.manage-your-plan:before {
    content: '';
    position: relative;
    top: 7px;
    margin-right: 8px;
    display: inline-block;
    background: url(/dashboard-manage-plan);
    height: 24px;
    width: 24px;
}

.manage-your-plan:after {
    content: '';
    position: relative;
    top: 7px;
    margin-left: 8px;
    display: inline-block;
    background: url(/dashboard-right-arrow);
    height: 24px;
    width: 24px;
}
.dashboard-benefits-links{
    margin-top : 30px;
}

/* Promotional Block */ 


.promotional-image {
  display: block;
  width: 100%;
  margin: 20px auto 10px auto;
}

.promotional-text {
  color: #545964;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 24px;
  text-align: center;
  margin-bottom: 0px;
}

.promotional-cta {
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    padding: 0 24.35px;
}
#dashboard-promotional-card, #dashboard-popular-actions-card{
    padding-right: 30px;
}

#centered-plans-block{
    width: 97%;
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
#managePlanLink{
    margin-top: 280px;
}
.dashboard-2-plans-separator{
    margin: auto !important;
    width: 90% !important;
    border-top: 1px solid #979797 !important;
    margin-left: 25px !important;
    margin-top: 10px !important;
}
@media all and (max-width: 768px) {
    #centered-plans-block {
        width: 108%;
        margin: 0;
        position: static;
        top: auto;
        
    }
    .insurancePlansDiv {
        height: auto;
    }
    #managePlanLink {
        margin-top: 30px;
    }
    #dashboard-plan-details-view{
        display: flex;
        margin-top: 20px;
    }
    .dashboard-plan-name {
        margin-left: 15px;
    }
    .dashboard-2-plans-separator {
        display: none;
    }
    .promotional-image {
        max-width: none;
    }
    .mobileDashboardCards{
        display : block;
    }
    .dashboardParent{
        
    }
    .popular-actions {
        padding-right: 5px;
    }
    #dashboard-plan-details-view {
        margin-bottom: 10px;
    }
    .dashboardPayMyBill {
        float: none !important;
        margin-top: 20px !important;
        display: inline-block;
    }
}
.first-benefits-link{
    margin-top: 20px;
}
.dashboard-resources-link{
    line-height: 24px !important;
    text-decoration: none !important;
}
@media all and (min-width:768px) and (max-width: 768px) {
    .moreDetailsInsurance {
        float: right;
        margin-top: -50px;
        margin-right: 30px;
    }
    .dashboardParent{
      
    }
        .mobileDashboardCards{
        display : block;
    }
}
.announcement-cta{
    margin-top: 10px;
    margin-bottom: 0px;
    padding-left: 25px;
    padding-right: 25px;
}
/* for stripe integration */
.dashboardPayMyBill{
    float: right;
   margin-top: -40px; 
}
.dashboardPayMyBillhistory{
    float: right;
   margin-top: 5px !important; 
}
.dashboardPayMyBillaccounts{
    float: left;
   margin-top: 5px !important; 
}
/* styles for intro js plugin */
.introjs-button{
    font-family: Roboto ;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    font-size: 16px !important;
    letter-spacing: 0.33px;
    text-align: center !important;
    padding-left: 25px !important;
    padding-right: 25px !important;
    border-radius: 0px;
    color: #001f5f !important;
    text-shadow: 1px 1px 0 transparent !important;
    border-radius: 0px !important;
    padding: 1rem 2rem !important;

}
.introjs-button:hover{
    color: #001f5f;
    border: 1px solid #0083BF !important;
    box-shadow: 0px 11px 18px 0px rgb(50 50 50 / 20%);
    transform: translateY(-2px);
}
.introjs-prevbutton{
    border: solid 1px #f1b434 !important;
    background-color: #ffffff !important;
}

.introjs-nextbutton {
    border: none !important;
    background-color: #f1b434 !important;
}
.introjs-tooltiptext {
    padding: 20px;
    color: #001F5F !important;
  font-family: Roboto !important;
  font-size: 16px !important;
  font-weight: bold !important;
  letter-spacing: 0 !important;
  line-height: 22px !important;
  text-align: center !important;
  padding-top: 60px !important;
}
.introjs-fullbutton{
    float: none !important;
}   
.introjs-tooltipbuttons {
    text-align: center !important; 
    border: none !important;
    padding: 20px !important;
    padding-bottom: 25px !important;
    padding-top: 0px !important;
}

.introjs-helperLayer {
    box-shadow: rgb(0 136 206) 0px 0px 3px 3px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px !important;
    border-radius: 0 !important;
}
.introjs-tooltip-title {
  color: #0088CE !important;
  font-family: Roboto !important;
  font-size: 24px !important;
  font-weight: bold !important;
  letter-spacing: 0 !important;
  line-height: normal !important;
  text-align: center !important;
  margin-top: 30px !important;
  margin-left: 15px !important;
  margin-bottom: 20px !important;
}
#tourFirstSlide{
    margin-top: 15px;
    font-size: 18px !important;
    line-height: 24px !important;
    font-family: Roboto !important;
    padding-left: 10px;
    padding-right: 10px;
}
.introjs-tooltip{
    min-width: 415px !important;
    border-radius: 0 !important;
}
.introjs-skipbutton {
    padding: 0px 0px !important;
}
.introjs-button:focus {
    box-shadow: none !important;
}
  #tourExitModalLabel {
      font-size:  36px;
      font-weight: 700;
      margin: 1rem 0 0 2rem;
      letter-spacing: 0;
      line-height: 42px;
  }
.tourExitModaldesc {
    font-family: Roboto;
    font-size: 18px;
    line-height: 1.44;
    letter-spacing: 0.23px;
    color: #333;
    padding: .5rem 5rem 1.8rem;
    margin: 0;
    margin-top: -15px;
}
#tourExitModaldialog{
      width: 40% !important;
      top: 10%;
  }
.tour-exit-modal-button {
    padding: 0 5rem 3rem;
}
.tourmodalheader {
      border: none !important;
      margin-top: 30px;
}
.tourcrossbtn {
  opacity: 1 !important;
  margin: 1rem 1.5rem 0;
  position: absolute;
  right: 5px;
}
#tourmodalConfirmButton{
    margin-left: 2rem;
}
.introjs-tooltip-header{
    display: flex !important;
    float: right !important;
}
/*for tour*/
.waepa-begin-tour-section{
    position: absolute; 
    margin-left: 84%;
    top: 66px;
}
.tour-portal{
    color: #FFFFFF;
    font-family: Roboto;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 28px;
    cursor: pointer;

}
.tour-portal:focus, .tour-portal:hover{
    color: #FFFFFF !important;
    text-decoration: none !important;
}
.introjs-donebutton {
    border: solid 1px #f1b434 !important;
    background-color: #ffffff !important;
}
.tour-tab-text{
    padding-left: 10px;
    padding-right: 10px;
}
.introjs-fullbutton{
    visibility: hidden;
}
.introjs-fullbutton::after{
    content:'Begin Tour'; 
    visibility: visible;
    position: absolute;
    display: block;
    font-weight: bold;
    font-size: 16px !important;
    letter-spacing: 0.33px;
    text-align: center !important;
    border-radius: 0px;
    color: #001f5f !important;
    background-color: #f1b434 !important;
    top: -5px;
    left: -34%;
    padding: 1rem 2rem !important;
}
#tourWelcomeTitle{
    position: relative;
    right: 100%;
}
#noPlamsMessage{
  color: #007CBF;
  font-family: Roboto;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 21px;
  text-align: center;
  margin-left: 180px;
  margin-right: 180px;
}
/* for mobile view */

@media all and (min-width:820px) and (max-width: 1180px) {
.waepa-begin-tour-section {
   margin-left: 76% !important;
}
}

@media all and (min-width:319px) and (max-width: 768px) {
    #tourExitModaldialog {
        width: auto !important;
    }
    .waepa-begin-tour-section {
        margin-left: 10px !important;
        top: 110px !important;
    }
    .introjs-tooltip {
        min-width: 350px!important;
    }
    #noPlamsMessage {
        margin: auto !important;
        margin-top: 80px !important;
        width: 260px;
    }
}
#makePaymentLink, #makePaymentLinkEBill{
    cursor: pointer !important;
}

/* only for Safari */
@media not all and (min-resolution:.001dpcm){ 
    @supports (-webkit-appearance:none) and (not (stroke-color:transparent)) {

    .introjs-helperLayer{
        box-shadow: rgba(33,33,33,0.8) 0px 0px 1px 2px, rgba(33,33,33,0.498) 0px 0px 0px 5000px !important;
    }

}}

/* for ipad view */
@media all and (min-width:992px) and (max-width: 1150px) {
    .user-profile-wrapper {
        display: block;
    }

    .dashboard-username{
        font-size: 27px;
    }
}

@media all and (max-width:440px) {
/*
   .upcoming-due-date {
       left: 0px !important;
} 
 .upcoming-no-pending {
       left: 0px !important;
       line-height: 21px !important;
} */

}