/* ========================================================================
   BOOTSTRAP 4 COMPATIBILITY - ADAPTS BOOTSTRAP 3 LESS TO BOOTSTRAP 4
   Overrides Bootstrap 3 LESS patterns to work with Bootstrap 4 flexbox
   ======================================================================== */

/* ========== CRITICAL: OVERRIDE BOOTSTRAP 3 LESS NAVBAR PATTERNS ========== */
/* The LESS files use display: table + table-cell for horizontal navbar layout
   Bootstrap 4 uses flexbox - we need to force BS4 to behave like BS3 LESS expects */

@media (min-width: 960px) {
    /* Override BS3 LESS navbar.less line 242: float: left pattern */
    .navbar-nav.paramount > li,
    .navbar-nav.paramount > .nav-item {
        /* Keep Bootstrap 3 LESS display: table pattern from navbar.less line 248 */
        display: table !important;
        width: 16.66666667% !important; /* BS3 LESS navbar.less line 249 - 6 columns */
        float: left !important; /* BS3 LESS navbar.less line 242 */
        text-align: center !important;
        position: relative !important;
        height: 43px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

        /* Override BS3 LESS navbar.less line 255: 5-column layout */
        .navbar-nav.paramount > li.one-of-five,
        .navbar-nav.paramount > .nav-item.one-of-five {
            width: 20% !important;
        }

        /* Override BS3 LESS navbar.less line 340: anchors use display: table-cell */
        .navbar-nav.paramount > li > a,
        .navbar-nav.paramount > .nav-item > a,
        .navbar-nav.paramount > .nav-item > .nav-link {
            display: table-cell !important; /* BS3 LESS pattern */
            vertical-align: middle !important; /* BS3 LESS navbar.less line 341 */
            padding: 0 !important; /* BS3 LESS navbar.less line 342 */
            height: 42px !important; /* BS3 LESS navbar.less line 343 */
            width: 100% !important;
        }

        /* Override BS3 LESS navbar.less line 369: dropdown triggers (span/.dropdown-toggle) */
        .navbar-nav.paramount > li > span,
        .navbar-nav.paramount > .nav-item > .dropdown-toggle {
            display: table-cell !important; /* BS3 LESS pattern */
            height: 42px !important;
            padding: 0 24px !important;
            vertical-align: middle !important;
        }
}

/* ========== OVERRIDE BOOTSTRAP 3 LESS NAVBAR STRUCTURE ========== */
/* BS3 LESS navbar.less uses custom float-based horizontal tab layout */

@media (min-width: 960px) {
    /* Disable Bootstrap 4 flexbox for navbar - BS3 LESS expects block */
    .navbar {
        display: block !important;
    }

    .navbar-collapse {
        display: block !important;
    }

    .navbar-nav {
        display: block !important; /* Override BS4 flex */
    }

        /* BS3 LESS navbar.less line 245: .navbar-nav.paramount pattern */
        .navbar-nav.paramount {
            width: 100% !important;
            text-align: left !important;
            overflow: visible !important;
            max-height: 42px !important;
            margin: 0 !important;
        }
}

/* ========== OVERRIDE BS4 DROPDOWN FOR BS3 LESS COMPATIBILITY ========== */
/* BS3 LESS navbar.less line 396-419: dropdown menus as UL elements */

@media (min-width: 960px) {
    /* BS3 LESS pattern: dropdown as UL, not BS4 .dropdown-menu */
    .navbar-nav.paramount > li > ul,
    .navbar-nav.paramount > .nav-item > .dropdown-menu {
        display: none !important;
        width: 100% !important; /* BS3 LESS navbar.less line 396 */
        min-width: 190px !important;
        position: absolute !important;
        left: 0 !important;
        top: 42px !important; /* BS3 LESS navbar.less line 402 */
        background: #fff !important;
        border-bottom: 4px solid #e98300 !important; /* @brand-secondary = #e98300 (CORRECTED) */
        box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.05) !important;
        z-index: 1000 !important;
        border: none !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* BS3 LESS: show dropdown on hover */
    .navbar-nav.paramount > li.hovered > ul,
    .navbar-nav.paramount > .nav-item.hovered > .dropdown-menu,
    .navbar-nav.paramount > li:hover > ul,
    .navbar-nav.paramount > .nav-item:hover > .dropdown-menu {
        display: block !important;
    }

    /* BS3 LESS navbar.less line 410: dropdown link styling */
    .navbar-nav.paramount > li > ul li a,
    .navbar-nav.paramount .dropdown-item {
        padding: 10px 20px !important; /* BS3 LESS navbar.less line 410 */
        color: #e98300 !important; /* @brand-secondary = #e98300 (CORRECTED) */
        display: block !important;
        font-family: Arial, Helvetica, "Open Sans", sans-serif !important;
        border: none !important;
        background: transparent !important;
    }

        /* BS3 LESS navbar.less line 412: hover state */
        .navbar-nav.paramount > li > ul li a:hover,
        .navbar-nav.paramount .dropdown-item:hover {
            text-decoration: none !important;
            background: #e7e7e4 !important; /* @gray-lighter */
        }
}
/* ========== LOGIN PANEL OVERRIDES ========== */
/* BS3 LESS custom .user-panel patterns */

@media (min-width: 960px) {
    .user-panel .login-info-box {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
        min-width: 180px !important;
        background: #ededec !important; /* lighten(@gray-lighter, 5%) */
    }

        .user-panel .login-info-box > div {
            position: relative !important;
            color: #707271 !important; /* @gray-light */
            padding: 5px 40px 5px 30px !important;
        }

        .user-panel .login-info-box a {
            color: #009b3a !important; /* @brand-primary = #009b3a (GREEN - CORRECTED) */
            text-decoration: none !important;
        }

            .user-panel .login-info-box a:hover {
                text-decoration: underline !important;
            }
}

/* ========================================================================
   PARAMOUNT CUSTOM STYLES - COMPILED FROM paramount.less
   ======================================================================== */

/* ====================================================
1.0 HEADER
==================================================== */

header.main {
    height: 98px;
    background: #f5f4f1;
}

header.ghost {
    position: relative;
    z-index: 50000;
    background: #fff8a5;
}

.header-inner {
    position: absolute;
    z-index: 1000;
    width: 100%;
    height: 98px;
    background: #fff;
    border-bottom: 10px solid #1a3668;
}

.mobile-login-register {
    position: relative;
    z-index: 10000;
    background: white;
}

@media (min-width: 960px) {
    header.main {
        top: auto;
        height: auto;
    }

    .header-inner {
        position: relative;
        z-index: 0;
        height: 115px;
        border: none;
        background: #fff;
    }

        .header-inner:before {
            display: none;
        }
}

.user-panel {
    position: relative;
    top: 0;
    right: auto;
    width: 250px;
    background: #707271;
}

    .user-panel ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

        .user-panel ul li {
            font-family: "Roboto", "Open Sans", Arial;
            color: #009b3a;  /* CORRECTED: Should be GREEN (@brand-primary) not light gray */
        }

            .user-panel ul li a {
                font-family: "Roboto", "Open Sans", Arial;
                color: #009b3a;  /* CORRECTED: Should be GREEN (@brand-primary) not light gray */
                text-decoration: underline;
            }

                .user-panel ul li a:hover {
                    text-decoration: none;
                }

    .user-panel span.user-wrap {
        display: block;
        padding: 15px;
        font-size: 16px;
    }

    .user-panel span.welcome-wrap {
        display: block;
        padding: 15px;
    }

    .user-panel span.user-drop {
        position: relative;
    }

        .user-panel span.user-drop:after {
            content: '';
            position: absolute;
            right: -15px;
            top: 4px;
            border: 5px solid transparent;
            border-left-color: #009b3a;  /* CORRECTED: GREEN */
            transition: ease 300ms all;
        }

    .user-panel.expanded span.user-drop:after {
        top: 6px;
        transform: rotate(90deg);
    }

    .user-panel .panel-drop {
        display: none;
    }

        .user-panel .panel-drop li {
            display: block;
        }

            .user-panel .panel-drop li a {
                position: relative;
                padding: 10px 15px 10px 15px;
                display: block;
                border-top: 1px solid #808080;
                text-decoration: none;
                color: #009b3a;  /* CORRECTED: GREEN */
            }

                .user-panel .panel-drop li a:hover {
                    background: #555;
                }

                .user-panel .panel-drop li a:after {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    border-top: 1px solid #a39f9c;
                }

        .user-panel .panel-drop span {
            display: block;
            padding: 0 15px 5px 15px;
            font-weight: normal;
        }
@media (min-width: 960px) {
    .promedica-portal-logo {
        display: inline-block;
        width: 140px;
        height: 37px;
        background: url(../img/logos/promedica-portal-logo.png) no-repeat;
        float: right;
        margin: 3px 15px 0 0;
    }

    .user-panel {
        position: absolute;
        top: -115px;
        right: 10px;
        width: auto;
        font-family: "Roboto", "Open Sans", Arial;
        background: transparent;
    }

        .user-panel span.welcome-wrap {
            display: block;
            padding: 5px;
        }

            .user-panel span.welcome-wrap a {
                color: #1a3668;
                text-decoration: none;
            }

                .user-panel span.welcome-wrap a:hover {
                    text-decoration: underline;
                }

        .user-panel span.user-wrap {
            display: block;
            padding: 5px;
            font-size: 13px;
        }

        .user-panel span.user-drop {
            color: #1a3668;
            cursor: default;
        }

            .user-panel span.user-drop:after {
                content: '';
                position: absolute;
                right: -15px;
                top: 5px;
                border: 5px solid transparent;
                border-top-color: #707271;
                transition: ease 300ms all;
            }

        .user-panel > ul {
            list-style: none;
            padding: 0;
            margin: 0;
            min-width: 180px;
            background: #ededec;
        }

            .user-panel > ul > li {
                position: relative;
                color: #707271;
                padding: 5px 40px 5px 30px;
            }

                .user-panel > ul > li ul.panel-drop {
                    display: none;
                    position: absolute;
                    top: 36px;
                    left: 0;
                    width: 100%;
                    z-index: 100;
                    box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.05);
                    background: #ededec;
                }

                    .user-panel > ul > li ul.panel-drop li {
                        padding: 0;
                        border-top: 1px solid #e7e7e4;
                    }

                        .user-panel > ul > li ul.panel-drop li > span {
                            display: block;
                            padding: 10px 10px 0 10px;
                            color: #555;
                        }

                        .user-panel > ul > li ul.panel-drop li a {
                            padding: 10px 10px 10px 10px;
                            display: block;
                            color: #1a3668;
                            border: 0;
                            font-family: "Roboto", "Open Sans", Arial;
                        }

                            .user-panel > ul > li ul.panel-drop li a:hover {
                                text-decoration: none;
                                background: #e7e7e4;
                            }

                            .user-panel > ul > li ul.panel-drop li a:after {
                                display: none;
                            }

                        .user-panel > ul > li ul.panel-drop li ul {
                            display: block;
                            padding-left: 30px;
                        }

                            .user-panel > ul > li ul.panel-drop li ul li {
                                border: 0;
                            }

                .user-panel > ul > li > a {
                    position: relative;
                    font-family: "Roboto", "Open Sans", Arial;
                }

                    .user-panel > ul > li > a:hover {
                        text-decoration: none;
                    }
}

/* ====================================================
3.0 BRANDING/LOGOS
==================================================== */

.main-logo {
    width: 190px;
    height: 47px;
    background-size: contain;
    -ms-behavior: url(/content/js/lib/backgroundsize.min.htc);
    display: block;
    background-color: #fff;
    background-image: url(../img/logos/par-main-mobile-2x.png);
    background-position: center center;
    background-repeat: no-repeat;
    margin: 20px auto 0;
}

.myn-main-logo {
    width: 190px;
    height: 47px;
    background-size: contain;
    -ms-behavior: url(/content/js/lib/backgroundsize.min.htc);
    display: block;
    background-color: #fff;
    background-image: url(../img/logos/PRO_MyNavigator_270x92.png);
    background-position: center center;
    background-repeat: no-repeat;
    margin: 20px auto 0;
}

.pmp-main-logo {
    width: 190px;
    height: 47px;
    background-size: contain;
    -ms-behavior: url(/content/js/lib/backgroundsize.min.htc);
    display: block;
    background-color: #fff;
    background-image: url(../img/logos/PRO-HP-Medicare.png);
    background-position: center center;
    background-repeat: no-repeat;
    margin: 20px auto 0;
}

@media (min-width: 960px) {
    .main-logo {
        width: 270px;
        height: 98px;
        display: block;
        background-color: #fff;
        background-image: url(../img/logos/par-main-mobile-2x.png);
        background-position: center 21px;
        background-repeat: no-repeat;
        background-size: 100%;
        margin: 0;
    }

    .myn-main-logo {
        width: 270px;
        height: 98px;
        display: block;
        background-color: #fff;
        background-image: url(../img/logos/PRO_MyNavigator_270x92.png);
        background-position: center 5px;
        background-repeat: no-repeat;
        background-size: 100%;
        margin: 0;
    }

    .pmp-main-logo {
        width: 270px;
        height: 98px;
        display: block;
        background-color: #fff;
        background-image: url(../img/logos/PRO-HP-Medicare.png);
        background-position: center 5px;
        background-repeat: no-repeat;
        background-size: 100%;
        margin: 0;
    }
}

.steps2health-logo {
    width: 100%;
    padding: 23px 20px 0px;
}

@media (min-width: 768px) and (max-width: 959px) {
    .main-logo {
        margin: 10px auto 0;
        width: 279px;
        height: 62px;
        display: block;
        background-color: #fff;
        background-image: url(../img/logos/par-main-tablet-2x.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
    }

    .myn-main-logo {
        margin: 10px auto 0;
        width: 279px;
        height: 62px;
        display: block;
        background-color: #fff;
        background-image: url(../img/logos/PRO_MyNavigator_270x92.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
    }

    .pmp-main-logo {
        margin: 10px auto 0;
        width: 279px;
        height: 62px;
        display: block;
        background-color: #fff;
        background-image: url(../img/logos/PRO-HP-Medicare.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
    }
}

/* ====================================================
4.0 GLOBAL CLASSES
==================================================== */

.page-header h1 {
    margin: 0;
    font-weight: normal;
}

/* Orange message count flag */
.message-flag {
    background: #1a93be;
    padding: 3px 5px;
    color: #fff;
    border: 1px solid #fff;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    min-width: 24px;
    width: auto;
    display: block;
    font-family: "Roboto", "Open Sans", Arial;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
}

/* Glimpse HUD */
.glimpse-nowrap {
    z-index: 9999 !important;
}

/* ====================================================
5.0 MODULES
==================================================== */

/* MODULE: Member Info Box */
.member-info-box {
    text-align: right;
}

    .member-info-box .member-name {
        display: inline-block;
    }

    .member-info-box .member-name,
    .member-info-box .program-name {
        font-size: 12px;
        margin-bottom: 0;
    }

    .member-info-box .coverage-period {
        margin: 0;
    }

/* MODULE: Collapse Group */
.collapse-group .collapse-toggle {
    font-size: 15px;
}

.collapse-group .collapsible[data-visible="false"] {
    display: none;
}

/* MODULE: Phone Contact Group */
.phone-group .contact-name {
    color: #000;
    font-size: 15px;
    line-height: 15px;
}

.phone-group .tel {
    display: inline-block;
    color: #707271;
}

.need-some-help .phone-group {
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .need-some-help .phone-group {
        margin-bottom: 20px;
    }
}

/* MODULE: News Article */
article.news {
    margin-bottom: 10px;
}

    article.news span.date {
        font-size: 11px;
        font-weight: 600;
        display: block;
    }

    article.news a.title {
        font-size: 18px;
        margin-top: 10px;
        display: block;
        color: #1a3668;
    }

    article.news.post span.date {
        font-size: 15px;
        margin-bottom: 5px;
    }

    article.news.post h1 {
        margin-top: 0;
        color: #1a3668;
    }

/* MODULE: Sidebars */
.sidebar-list li a {
    display: block;
    font-weight: bold;
    margin-bottom: 10px;
}

/* MODULE: Scrollable content */
.scroll-content {
    height: 300px;
    overflow: auto;
    padding: 20px;
    box-shadow: inset 0 0 8px 0 rgba(0, 0, 0, 0.25);
}

@media (min-width: 768px) and (max-width: 959px) {
    .scroll-content {
        height: 450px;
    }
}

@media (min-width: 960px) {
    .scroll-content {
        height: 800px;
    }
}

/* MODULE: News Lists */
.news-lists ul {
    list-style: none;
    padding: 0;
    margin-bottom: 20px;
}

.news-lists li {
    margin-bottom: 10px;
}

.news-lists .news-date {
    color: #999;
    font-family: "Roboto", "Open Sans", Arial;
    font-size: 11px;
}

.news-lists a {
    font-size: 14px;
    font-family: "Roboto", "Open Sans", Arial;
}

/* MODULE: Wellness Checklist */
.wellness-checklist .steps-completed {
    margin-bottom: 5px;
}

    .wellness-checklist .steps-completed b {
        font-family: "Roboto", "Open Sans", Arial;
        font-size: 26px;
        margin-right: 10px;
    }

.wellness-checklist ul {
    list-style: none;
    padding: 0;
    margin-bottom: 20px;
}

.wellness-checklist li {
    margin-bottom: 13px;
}

.wellness-checklist .fa-check:before {
    position: relative;
    top: 1px;
    font-size: 20px;
    color: #f5f4f1;
    -webkit-text-stroke: 1px #b6b6b6;
    text-shadow: -1px -1px 0 #b6b6b6, 1px -1px 0 #b6b6b6, -1px 1px 0 #b6b6b6, 1px 1px 0 #b6b6b6;
}

.wellness-checklist .checked .fa-check:before {
    top: 2px;
    color: #593060;
    text-shadow: none;
    font-size: 18px;
}

/* Dashboard Progress blocks */
.deductible-value {
    margin-bottom: 5px;
    text-align: right;
}

    .deductible-value b {
        font-weight: normal;
        font-size: 18px;
        font-family: "Roboto", "Open Sans", Arial;
    }

.member-number {
    font-size: 12px;
    display: block;
    color: #707271;
    margin-top: 10px;
}

.dashboard-view-id-card {
    position: relative;
    top: -1px;
}

.progress-range .milestones {
    position: relative;
    height: 25px;
}

    .progress-range .milestones .marker {
        position: absolute;
        width: 1px;
    }

        .progress-range .milestones .marker:before {
            content: "";
            display: block;
            width: 1px;
            height: 15px;
            background: #555;
        }

        .progress-range .milestones .marker span {
            display: block;
            width: 30px;
            text-align: center;
            margin-left: -15px;
            font-family: "Roboto", "Open Sans", Arial;
            font-size: 12px;
        }

/* Dashboard orange disclaimer */
.disclaimer-orange {
    color: #1a93be;
    font-size: 13px;
    line-height: 15px;
}

/* MODULE: Messages */
.panel-body.messages {
    padding: 0;
    margin: 0;
}

    .panel-body.messages .message {
        padding: 20px;
    }

        .panel-body.messages .message:nth-child(even) {
            background: #faf9f8;
        }

        .panel-body.messages .message.unread h3.sender {
            font-family: "Roboto", "Open Sans", Arial;
        }

        .panel-body.messages .message.unread .subject {
            font-weight: bold;
        }

        .panel-body.messages .message .controls {
            display: block;
            float: left;
            vertical-align: top;
            text-align: center;
            margin-right: 10px;
            padding-top: 2px;
        }

            .panel-body.messages .message .controls input[type="checkbox"] {
                margin: 0;
                display: block;
            }

            .panel-body.messages .message .controls .fa.fa-circle {
                margin-top: 20px;
                color: #235a50;
            }

        .panel-body.messages .message .info {
            position: relative;
            display: block;
            margin-left: 20px;
        }

            .panel-body.messages .message .info a {
                color: #707271;
                display: block;
            }

                .panel-body.messages .message .info a:hover {
                    text-decoration: none;
                }

                .panel-body.messages .message .info a h3.sender {
                    margin-top: 0;
                    color: #707271;
                    padding-right: 100px;
                }

                .panel-body.messages .message .info a .subject {
                    display: block;
                    padding-right: 100px;
                }

                .panel-body.messages .message .info a .ecerpt {
                    display: block;
                    padding-right: 100px;
                }

                .panel-body.messages .message .info a .date {
                    position: absolute;
                    top: 0;
                    right: 0;
                }

                .panel-body.messages .message .info a .time {
                    position: absolute;
                    top: 20px;
                    right: 0;
                }

/* Module: "Tabs" on mobile */
.nav-tabs-xs {
    list-style: none;
    padding: 0;
    width: 100%;
    display: table;
}

    .nav-tabs-xs li {
        width: 50%;
        display: table-cell;
        vertical-align: middle;
        background: #34b233;
        text-align: center;
        padding: 18px 15px;
        color: #fff;
        cursor: pointer;
    }

        .nav-tabs-xs li a {
            width: 100%;
            display: block;
        }

        .nav-tabs-xs li:hover {
            background: #2a9629;
        }

        .nav-tabs-xs li.active {
            background: #fff;
            color: #707271;
            cursor: default;
        }

    .nav-tabs-xs.mobile {
        display: block;
        border-top: 0;
        padding: 18px 15px 4px 15px;
    }

        .nav-tabs-xs.mobile li {
            width: 100%;
            box-sizing: border-box;
            display: block;
            margin-bottom: 4px;
            padding: 0;
        }

            .nav-tabs-xs.mobile li a {
                color: #fff;
                padding: 6px 15px;
            }

            .nav-tabs-xs.mobile li.active {
                border: 1px solid #e7e7e4;
            }

                .nav-tabs-xs.mobile li.active a {
                    color: #707271;
                }

.tab-selector ul {
    list-style: none;
    padding: 0;
    margin-bottom: -19px;
}

    .tab-selector ul li {
        display: block;
        padding: 10px 15px;
        margin-bottom: -1px;
        background-color: #fff;
        border-top: 1px solid #ddd;
    }

        .tab-selector ul li:first-child {
            border-top: 0;
        }

.message-heading #show {
    width: 125px;
}

/* Homepage banner */
body[data-page="homepage"] .wrapper {
    top: -8px;
    padding-top: 0;
    background-image: url(../img/homepage-banner-top-new.jpg);
    background-repeat: no-repeat;
    background-position: center -8px;
}

    body[data-page="homepage"] .wrapper .container.body-content {
        background: transparent;
    }

@media (min-width: 768px) and (max-width: 959px) {
    body[data-page="homepage"] .wrapper {
        background-position: right -155px top -8px;
    }
}

@media (max-width: 767px) {
    body[data-page="homepage"] .wrapper {
        background-size: auto 199px;
        background-position: right -120px top -8px;
    }
}

.home-banner {
    min-height: 390px;
    padding-top: 150px;
    padding-left: 30px;
    margin-bottom: 60px;
    line-height: 1.2;
    color: white;
    font-size: 50px;
    font-family: "Roboto", "Open Sans", Arial;
    text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.39);
}

@media (max-width: 767px) {
    .home-banner {
        min-height: 199px;
        padding-top: 52px;
        margin-bottom: 20px;
        padding-left: 10px;
        font-size: 25px;
        line-height: 1.4;
    }
}

.home-content .panel-primary .panel-body {
    color: #707271;
}

    .home-content .panel-primary .panel-body:before {
        content: '';
        display: block;
        width: 100%;
        height: 190px;
        background-repeat: no-repeat;
        background-position: center top;
        margin-bottom: 10px;
    }

    .home-content .panel-primary .panel-body p {
        margin-bottom: 10px;
    }

.home-content .panel-providers .panel-body:before {
    background-image: url(../img/homepage-banner-providers-new.jpg);
    cursor: pointer;
    cursor: hand;
}

/* CRITICAL FIX: Panel Homepage Video Background Image */
.panel-homepage-video .panel-body:before {
    background-image: url(../img/myparamount-features-video.jpg);
    cursor: pointer;
    cursor: hand;
    height: 190px;
}

.home-content .panel-homepage-video .panel-body:before {
    background-image: url(../img/myparamount-features-video.jpg);
    cursor: pointer;
    cursor: hand;
    height: 190px;
}

.home-content .panel-homepage-video-embed {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    margin-bottom: 20px;
    margin-top: -20px;
    height: 0;
}

    .home-content .panel-homepage-video-embed iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

/* Banner ads */
.banners-top {
    margin-bottom: 10px;
}

@media (min-width: 960px) {
    .banners-top {
        margin-top: -20px;
    }
}

/* Status messages */
.status-success,
.status-failure {
    display: none;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 0;
}

.status-success {
    background-color: #dff0d8;
    border-color: #d6cdb2;
    color: #3c763d;
}

.status-failure {
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}

.product-line-name {
    display: block;
    word-break: break-all;
    font-weight: bold;
}

/* Focus selection on profile/account screen */
.focus-selector thead th {
    text-transform: none;
    font-weight: bold;
    font-size: 15px;
}

    .focus-selector thead th.pan {
        padding: 0;
        margin: 0;
    }

    .focus-selector thead th.pbm {
        padding-bottom: 10px;
        margin: 0;
    }

.focus-selector tbody .profile-row {
    border-bottom: 1px solid #1a3668;
}

.focus-selector tbody td {
}

    .focus-selector tbody td.pan {
        padding: 0;
        margin: 0;
    }

    .focus-selector tbody td.pbm {
        padding-bottom: 10px;
        margin: 0;
    }

    .focus-selector tbody td.focus-name {
        vertical-align: middle;
    }

.provider-address {
    font-size: 15px;
    background: #eee;
    padding: 20px;
    position: relative;
    left: -10px;
    margin-bottom: 10px;
}

.or-row {
    position: relative;
    padding: 20px 0;
}

    .or-row div {
        background: white;
        position: relative;
    }

        .or-row div span {
            font-family: "Roboto", "Open Sans", Arial;
            color: #000;
            display: inline-block;
            padding: 0 15px;
            background: white;
            position: relative;
            z-index: 10;
        }

        .or-row div:after {
            content: "";
            display: block;
            border-bottom: 1px solid #000;
            width: 100%;
            position: absolute;
            top: 48%;
            z-index: 5;
        }

/* ====================================================
6.0 FOOTER
==================================================== */

footer {
    margin-top: 40px;
    background: #8c897d;
    padding: 40px 0 60px;
    color: #fff;
    font-size: 12px;
}

    footer .credits {
        margin-top: 30px;
        color: #e7e7e4;
    }

        footer .credits a {
            color: #e7e7e4;
        }

        footer .credits span {
            display: inline-block;
            margin-right: 30px;
        }

    footer .footer-intro {
        padding-top: 50px;
        padding-right: 25%;
        line-height: 1.5 * 1.4;
    }

    footer .link-section {
        margin-top: 5px;
        padding-bottom: 5px;
        border-bottom: 1px solid #fff;
        font-family: "Roboto", "Open Sans", Arial;
        text-transform: uppercase;
    }

    footer ul {
        list-style-type: none;
        margin: 0 0 30px 0;
        padding: 0;
    }

        footer ul li a {
            display: inline-block;
            padding: 5px 0;
            color: #e7e7e4;
        }

            footer ul li a:hover {
                color: #e7e7e4;
            }

/* ====================================================
No Spinner Arrows on Number Input
==================================================== */

.no-spinners [type='number'] {
    -moz-appearance: textfield;
}

.no-spinners::-webkit-outer-spin-button,
.no-spinners::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Minimum Height for form divs */
div .form-group.col-md-6 {
    min-height: 90px;
}

input[readonly] {
    background-color: #f3f2ee;
    color: #bbbbbb;
}

/* ========================================================================
   BS3 PANEL / WELL COMPONENTS — MISSING FROM BOOTSTRAP 4
   Compiled from LESS variables.less + panels.less + wells.less
   These MUST load after BS4 bootstrap.css to restore panel styling
   ======================================================================== */

/* --- Panel Base --- */
.panel {
    margin-bottom: 19px;
    background-color: #fff;
    border-top: 6px solid transparent;
    border-radius: 0;
}

    .panel.panel-primary {
        box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.05);
    }

    .panel.panel-secondary {
        background-color: #f5f4f1;
    }

/* --- Panel Body --- */
.panel-body {
    padding: 20px;
}

    .panel-body::after {
        display: block;
        clear: both;
        content: "";
    }

    .panel-body.panel-full-width {
        padding: 20px 0;
    }

/* --- Panel Heading --- */
.panel-heading {
    border-bottom: 1px solid transparent;
}

.panel-primary > .panel-heading {
    padding: 23px 20px 21px;
}

.panel-secondary > .panel-heading {
    padding: 23px 20px 21px;
}

/* --- Panel Title --- */
.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
    color: inherit;
}

    .panel-title > a {
        color: inherit;
    }

/* --- Panel Footer --- */
.panel-footer {
    padding: 10px 15px;
    background-color: #fff;
    border-top: 1px solid #ddd;
    font-size: 12px;
}

.panel-primary > .panel-footer {
    padding: 23px 20px 21px;
}

.panel-secondary > .panel-footer {
    background-color: #f5f4f1;
    padding: 20px;
}

.panel-footer p:last-child {
    margin-bottom: 0;
}

/* --- Panel Contextual Variants --- */
/* .panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) */

.panel-primary {
    border-top-color: #e98300; /* @brand-secondary / @par-orange */
}

    .panel-primary > .panel-heading {
        color: #000;
        background-color: #fff;
        border-bottom-color: #e7e7e4;
    }

    .panel-primary > .panel-footer {
        border-top-color: #e7e7e4;
    }

.panel-secondary {
    border-top-color: #707271; /* @gray-light */
}

    .panel-secondary > .panel-heading {
        color: #000;
        background-color: #f5f4f1; /* @par-beige */
        border-bottom-color: #e7e7e4;
    }

    .panel-secondary > .panel-footer {
        border-top-color: #e7e7e4;
    }

.panel-default {
    border-top-color: #ddd;
}

    .panel-default > .panel-heading {
        color: #333;
        background-color: #f5f5f5;
        border-bottom-color: #ddd;
    }

/* --- Well --- */
.well {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #ededed;
    border-radius: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

.well-lg {
    padding: 24px;
    border-radius: 0;
}

.well-sm {
    padding: 9px;
    border-radius: 0;
}

/* --- BS4 Override: Row flexbox breaks BS3 float grid inside panels --- */
.panel .row {
    display: flex;
    flex-wrap: wrap;
}

/* --- BS4 Override: .collapse used by advanced search --- */
.collapse-group .collapsible.closed {
    display: none;
}

.collapse-group .collapsible {
    display: block !important;
}

    .collapse-group .collapsible.closed {
        display: none !important;
    }

/* --- BS4 Override: .btn-primary should use Paramount green, not BS4 blue --- */
.btn-primary {
    color: #fff;
    background-color: #009b3a;
    border-color: #008a33;
}

    .btn-primary:hover {
        color: #fff;
        background-color: #008030;
        border-color: #00742b;
    }

    .btn-primary:focus,
    .btn-primary.focus {
        color: #fff;
        background-color: #008030;
        border-color: #00742b;
        box-shadow: 0 0 0 0.2rem rgba(0, 155, 58, 0.5);
    }

/* --- BS4 Override: hidden-xs/sm/md/lg responsive utilities removed in BS4 --- */
.hidden-xs {
    display: none !important;
}

.hidden-sm {
    display: none !important;
}

@media (min-width: 768px) {
    .hidden-xs {
        display: initial !important;
    }
}

@media (max-width: 767px) {
    .hidden-sm {
        display: initial !important;
    }

    .hidden-md,
    .hidden-lg {
        display: initial !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
        display: none !important;
    }
}

@media (min-width: 992px) {
    .hidden-md {
        display: none !important;
    }

    .hidden-sm {
        display: initial !important;
    }
}

@media (min-width: 1200px) {
    .hidden-lg {
        display: none !important;
    }
}

/* --- BS4 Override: visible-xs/sm responsive utilities --- */
.visible-xs,
.visible-sm {
    display: none !important;
}

@media (max-width: 767px) {
    .visible-xs {
        display: block !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm {
        display: block !important;
    }
}

/* --- Content form spacing --- */
.content-form {
    padding: 20px;
}

    .content-form.nomargin {
        margin-left: -20px;
        margin-right: -20px;
        padding: 20px;
    }
/* ========================================================================
   BS3→BS4 MIGRATION COMPATIBILITY SHIM
   Loaded after bootstrap.css to restore BS3 patterns the site depends on.
   ======================================================================== */

/* ====================================================
   1.0 GLOBAL RESETS — match BS3 LESS scaffolding.less
   ==================================================== */
html, body {
    height: 100%;
    min-height: 100%;
}

body {
    font-family: Arial, Helvetica, "Open Sans", sans-serif;
    font-size: 13px;
    line-height: 1.5;
    color: #707271;
    background-color: #f5f4f1;
}

a {
    color: #009b3a;
}

    a:hover,
    a:focus {
        color: #006e29;
    }

h1, h2, h3, h4, h5, h6 {
    font-family: "Roboto", "Open Sans", Arial;
    font-weight: 500;
    color: #000;
}

h1 {
    font-size: 26px;
}

h2 {
    font-size: 18px;
}

h3 {
    font-size: 18px;
}

h4 {
    font-size: 15px;
}

h5 {
    font-size: 13px;
}

h6 {
    font-size: 13px;
}

/* ====================================================
   2.0 WRAPPER — from scaffolding.less
   ==================================================== */
.wrapper {
    position: relative;
    z-index: 0;
    width: 100%;
    background: #f5f4f1;
    padding-top: 10px;
}

.container.body-content {
    position: relative;
    background: #f5f4f1;
}

/* ====================================================
   3.0 PANELS — BS4 removed .panel; restore from panels.less
   ==================================================== */
.panel {
    margin-bottom: 19px;
    background-color: #fff;
    border-top: 6px solid transparent;
    border-radius: 0;
}

    .panel.panel-primary {
        box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.05);
    }

    .panel.panel-secondary {
        background-color: #f5f4f1;
    }

.panel-body {
    padding: 20px;
}

    .panel-body::after {
        display: block;
        clear: both;
        content: "";
    }

    .panel-body.panel-full-width {
        padding: 20px 0;
    }

.panel-heading {
    border-bottom: 1px solid transparent;
}

.panel-primary > .panel-heading {
    padding: 23px 20px 21px;
    color: #000;
    background-color: #fff;
    border-bottom-color: #e7e7e4;
}

.panel-secondary > .panel-heading {
    padding: 23px 20px 21px;
    color: #000;
    background-color: #f5f4f1;
    border-bottom-color: #e7e7e4;
}

.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
    color: inherit;
}

    .panel-title > a {
        color: inherit;
    }

.panel-footer {
    padding: 10px 15px;
    background-color: #fff;
    border-top: 1px solid #ddd;
    font-size: 12px;
}

.panel-primary > .panel-footer {
    padding: 23px 20px 21px;
    border-top-color: #e7e7e4;
}

.panel-secondary > .panel-footer {
    background-color: #f5f4f1;
    padding: 20px;
    border-top-color: #e7e7e4;
}

.panel-footer p:last-child {
    margin-bottom: 0;
}

.panel-primary {
    border-top-color: #e98300;
}

.panel-secondary {
    border-top-color: #707271;
}

.panel-default {
    border-top-color: #ddd;
}

    .panel-default > .panel-heading {
        color: #333;
        background-color: #f5f5f5;
        border-bottom-color: #ddd;
    }

/* Panel fill pattern from panels.less */
.panel .panel-fill {
    margin-right: -20px;
    margin-left: -20px;
}

    .panel .panel-fill:first-child {
        margin-top: -20px;
    }

/* ====================================================
   4.0 WELLS — BS4 removed .well; restore from wells.less
   ==================================================== */
.well {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #ededed;
    border-radius: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

.well-lg {
    padding: 24px;
}

.well-sm {
    padding: 9px;
}

/* ====================================================
   5.0 FORM CONTROLS — match BS3 LESS forms.less inside panels
   ==================================================== */

/* Forms inside .panel-primary get beige background, no border */
.panel-primary .form-control {
    background-color: #ece9e2;
    border-width: 0;
}

    .panel-primary .form-control:focus {
        border-width: 1px;
        border-color: #009b3a;
        padding: 5px 11px; /* -1px to compensate for border */
        box-shadow: none;
    }

    .panel-primary .form-control[disabled] {
        background-color: #f0ede7;
        color: #aba9a7;
    }

/* Content form layout from forms.less */
.content-form {
    padding: 20px;
}

    .content-form.nomargin {
        margin-left: -20px;
        margin-right: -20px;
        padding: 20px;
    }

    .content-form label,
    .content-form .mock-label {
        font-weight: normal;
        text-transform: uppercase;
        line-height: 16px;
        margin-bottom: 5px;
        color: #000;
    }

@media (min-width: 576px) {
    .content-form label,
    .content-form .mock-label {
        margin-bottom: 14px;
    }
}

.content-form .form-group {
    margin-bottom: 20px;
}

@media (min-width: 576px) {
    .content-form .form-group {
        margin-bottom: 36px;
    }
}

.content-form.nomargin .form-group {
    margin-bottom: 0;
}

/* Custom select arrow for gt-ie9 (from forms.less) */
.gt-ie9 select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(../img/ui/ui-select-trigger.png);
    background-repeat: no-repeat;
    background-position: center right;
    background-size: contain;
    padding-right: 46px;
}

/* ====================================================
   6.0 BUTTONS — override BS4 blue with Paramount green
   ==================================================== */
.btn-primary {
    color: #fff;
    background-color: #009b3a;
    border-color: #008a33;
}

    .btn-primary:hover {
        color: #fff;
        background-color: #008030;
        border-color: #00742b;
    }

    .btn-primary:focus,
    .btn-primary.focus {
        color: #fff;
        background-color: #008030;
        border-color: #00742b;
        box-shadow: 0 0 0 0.2rem rgba(0, 155, 58, 0.5);
    }

    .btn-primary:not(:disabled):not(.disabled):active,
    .btn-primary:not(:disabled):not(.disabled).active {
        color: #fff;
        background-color: #00742b;
        border-color: #006825;
    }

/* ====================================================
   7.0 RESPONSIVE UTILITIES — BS4 removed these; restore
   ==================================================== */
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
    display: none !important;
}

@media (max-width: 767.98px) {
    .visible-xs {
        display: block !important;
    }

    table.visible-xs {
        display: table !important;
    }

    tr.visible-xs {
        display: table-row !important;
    }

    th.visible-xs, td.visible-xs {
        display: table-cell !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .visible-sm {
        display: block !important;
    }

    table.visible-sm {
        display: table !important;
    }

    tr.visible-sm {
        display: table-row !important;
    }

    th.visible-sm, td.visible-sm {
        display: table-cell !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .visible-md {
        display: block !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg {
        display: block !important;
    }
}

@media (max-width: 767.98px) {
    .hidden-xs {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .hidden-sm {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .hidden-md {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .hidden-lg {
        display: none !important;
    }
}

/* ====================================================
   8.0 BREADCRUMBS — match BS3 LESS look
   ==================================================== */
.breadcrumb {
    padding: 0;
    background-color: transparent;
    border-radius: 0;
    font-size: 12px;
}

.breadcrumb-item + .breadcrumb-item::before {
    content: ">";
}

/* BS3 used <li> directly, keep compat */
.breadcrumb > li {
    display: inline;
}

    .breadcrumb > li + li::before {
        content: "> ";
        padding: 0 5px;
        color: #707271;
    }

    .breadcrumb > li.active {
        color: #707271;
    }

/* ====================================================
   9.0 COLLAPSE GROUP — custom JS-driven expand/collapse
   The site uses .collapsible.closed, NOT BS4 .collapse
   ==================================================== */
.collapse-group .collapse-toggle {
    font-size: 15px;
}

.collapse-group .collapsible.closed {
    display: none;
}

/* CRITICAL: Prevent BS4 .collapse rule from hiding .collapsible elements.
   The site's .collapsible class is NOT a BS4 collapse — it's controlled
   by custom jQuery in main.js via slideUp/slideDown. */
.collapse-group .collapsible:not(.closed) {
    display: block;
}

/* ====================================================
   10.0 SPACING HELPERS — compiled from spacing.less
   BS3 LESS defined .ptn, .mbl, .pvs, etc.
   ==================================================== */
.ptn, .pvn, .pan {
    padding-top: 0 !important;
}

.pts, .pvs, .pas {
    padding-top: 5px !important;
}

.ptm, .pvm, .pam {
    padding-top: 10px !important;
}

.ptl, .pvl, .pal {
    padding-top: 20px !important;
}

.pth, .pvh, .pah {
    padding-top: 30px !important;
}

.ptg, .pvg, .pag {
    padding-top: 40px !important;
}

.prn, .phn, .pan {
    padding-right: 0 !important;
}

.prs, .phs, .pas {
    padding-right: 5px !important;
}

.prm, .phm, .pam {
    padding-right: 10px !important;
}

.prl, .phl, .pal {
    padding-right: 20px !important;
}

.prh, .phh, .pah {
    padding-right: 30px !important;
}

.prg, .phg, .pag {
    padding-right: 40px !important;
}

.pbn, .pvn, .pan {
    padding-bottom: 0 !important;
}

.pbs, .pvs, .pas {
    padding-bottom: 5px !important;
}

.pbm, .pvm, .pam {
    padding-bottom: 10px !important;
}

.pbl, .pvl, .pal {
    padding-bottom: 20px !important;
}

.pbh, .pvh, .pah {
    padding-bottom: 30px !important;
}

.pbg, .pvg, .pag {
    padding-bottom: 40px !important;
}

.pln, .phn, .pan {
    padding-left: 0 !important;
}

.pls, .phs, .pas {
    padding-left: 5px !important;
}

.plm, .phm, .pam {
    padding-left: 10px !important;
}

.pll, .phl, .pal {
    padding-left: 20px !important;
}

.plh, .phh, .pah {
    padding-left: 30px !important;
}

.plg, .phg, .pag {
    padding-left: 40px !important;
}

.mtn, .mvn, .man {
    margin-top: 0 !important;
}

.mts, .mvs, .mas {
    margin-top: 5px !important;
}

.mtm, .mvm, .mam {
    margin-top: 10px !important;
}

.mtl, .mvl, .mal {
    margin-top: 20px !important;
}

.mth, .mvh, .mah {
    margin-top: 30px !important;
}

.mtg, .mvg, .mag {
    margin-top: 40px !important;
}

.mrn, .mhn, .man {
    margin-right: 0 !important;
}

.mrs, .mhs, .mas {
    margin-right: 5px !important;
}

.mrm, .mhm, .mam {
    margin-right: 10px !important;
}

.mrl, .mhl, .mal {
    margin-right: 20px !important;
}

.mrh, .mhh, .mah {
    margin-right: 30px !important;
}

.mrg, .mhg, .mag {
    margin-right: 40px !important;
}

.mbn, .mvn, .man {
    margin-bottom: 0 !important;
}

.mbs, .mvs, .mas {
    margin-bottom: 5px !important;
}

.mbm, .mvm, .mam {
    margin-bottom: 10px !important;
}

.mbl, .mvl, .mal {
    margin-bottom: 20px !important;
}

.mbh, .mvh, .mah {
    margin-bottom: 30px !important;
}

.mbg, .mvg, .mag {
    margin-bottom: 40px !important;
}

.mln, .mhn, .man {
    margin-left: 0 !important;
}

.mls, .mhs, .mas {
    margin-left: 5px !important;
}

.mlm, .mhm, .mam {
    margin-left: 10px !important;
}

.mll, .mhl, .mal {
    margin-left: 20px !important;
}

.mlh, .mhh, .mah {
    margin-left: 30px !important;
}

.mlg, .mhg, .mag {
    margin-left: 40px !important;
}

/* ====================================================
   11.0 HEADER / NAVBAR — from paramount.less + navbar.less
   ==================================================== */
header.main {
    height: 98px;
    background: #f5f4f1;
}

header.ghost {
    position: relative;
    z-index: 50000;
    background: #fff8a5;
}

.header-inner {
    position: absolute;
    z-index: 1000;
    width: 100%;
    height: 98px;
    background: #fff;
    border-bottom: 10px solid #1a3668;
}

.mobile-login-register {
    position: relative;
    z-index: 10000;
    background: white;
}

@media (min-width: 960px) {
    header.main {
        top: auto;
        height: auto;
    }

    .header-inner {
        position: relative;
        z-index: 0;
        height: 115px;
        border: none;
        background: #fff;
    }

        .header-inner:before {
            display: none;
        }
}

/* --- Navbar: mobile sidebar via Snap.js — MOBILE ONLY --- */
@media (max-width: 959px) {
    .navbar {
        position: fixed;
        left: 0;
        top: 0;
        width: 250px;
        max-width: 250px;
        min-width: 250px;
        height: 100%;
        overflow: hidden;
        background: #009b3a;
        color: #fff;
        border: 0;
        margin-bottom: 0;
        padding: 0;
        border-radius: 0;
    }

    .navbar-nav.paramount {
        text-align: left;
        overflow: hidden;
        margin: 0;
        padding: 0;
        background: #009b3a;
        display: block;
        height: 100%;
        width: 250px;
        list-style: none;
    }

        .navbar-nav.paramount > li {
            font-family: "Roboto", "Open Sans", Arial;
            display: block;
            border-bottom: 1px solid #00a83f;
            position: relative;
            float: none;
            width: auto;
        }

            .navbar-nav.paramount > li:before {
                content: '';
                position: absolute;
                width: 100%;
                background: #2b9e28;
                height: 1px;
                bottom: 0;
            }

            .navbar-nav.paramount > li > a {
                color: #cfe0d2;
                display: block;
                padding: 10px 15px;
                line-height: 19px;
            }

                .navbar-nav.paramount > li > a:hover {
                    color: #fff;
                    background: transparent;
                    text-decoration: none;
                }
}

.navbar-collapse.collapse {
    display: block !important;
    border: 0;
}

/* --- Desktop navbar: horizontal tabs --- */
@media (min-width: 960px) {
    .mobile-nav-trigger,
    .mobile-message-center {
        display: none !important;
    }

    .navbar {
        position: relative;
        background: transparent;
        width: 100%;
        max-width: 100%;
        height: auto;
        overflow: visible;
        z-index: 1;
        display: block;
    }

    .navbar-header {
        background: #009b3a;
    }

    .navbar-collapse {
        display: block !important;
    }

    .navbar-nav {
        display: block !important;
    }

        .navbar-nav.paramount {
            width: 100%;
            text-align: left;
            overflow: visible;
            max-height: 42px;
            display: block;
            height: auto;
            flex-direction: row;
        }

            .navbar-nav.paramount > li {
                display: table;
                width: 16.66666667%;
                margin: 0;
                text-align: center;
                position: relative;
                overflow: visible;
                float: left;
                border-bottom: 0;
                height: 43px;
            }

                .navbar-nav.paramount > li.one-of-five {
                    width: 20%;
                }

                .navbar-nav.paramount > li:before {
                    right: 0;
                    height: 17px;
                    border-right: 1px solid #008733;
                    top: 13px;
                    background: transparent;
                    width: 0;
                }

                .navbar-nav.paramount > li:after {
                    content: '';
                    position: absolute;
                    right: -1px;
                    height: 17px;
                    border-right: 1px solid #2b9e28;
                    top: 13px;
                }

                .navbar-nav.paramount > li:last-child:before,
                .navbar-nav.paramount > li:last-child:after {
                    display: none;
                }

                .navbar-nav.paramount > li > a {
                    font-family: "Roboto", "Open Sans", Arial;
                    display: table-cell;
                    vertical-align: middle;
                    padding: 0;
                    height: 42px;
                    color: rgba(255,255,255,0.65);
                    position: relative;
                    width: 100%;
                }

                    .navbar-nav.paramount > li > a:hover {
                        color: #fff;
                        border-bottom: 0;
                    }

                .navbar-nav.paramount > li > span {
                    font-family: "Roboto", "Open Sans", Arial;
                    display: table-cell;
                    height: 42px;
                    padding: 0 24px;
                    vertical-align: middle;
                    color: rgba(255,255,255,0.65);
                    cursor: default;
                    position: relative;
                    border-bottom: 0;
                    line-height: 1.25;
                }

                /* Hover / active states */
                .navbar-nav.paramount > li:hover,
                .navbar-nav.paramount > li.hovered,
                .navbar-nav.paramount > li.active {
                    background: #fff;
                }

                    .navbar-nav.paramount > li:hover:before,
                    .navbar-nav.paramount > li.hovered:before,
                    .navbar-nav.paramount > li.active:before {
                        display: none;
                    }

                    .navbar-nav.paramount > li:hover > a,
                    .navbar-nav.paramount > li.hovered > a,
                    .navbar-nav.paramount > li.active > a,
                    .navbar-nav.paramount > li:hover > span,
                    .navbar-nav.paramount > li.hovered > span,
                    .navbar-nav.paramount > li.active > span {
                        color: #e98300;
                        border-color: #e98300;
                        background-color: #fff;
                        box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.05);
                    }

                    .navbar-nav.paramount > li.active > a {
                        color: #e98300;
                        border-bottom: 4px solid #e98300;
                        height: 46px;
                        background: #fff;
                        width: 100%;
                    }

                /* Dropdown menus */
                .navbar-nav.paramount > li > ul {
                    display: none;
                    width: 100%;
                    min-width: 190px;
                    box-sizing: border-box;
                    list-style-type: none;
                    margin: 0;
                    padding: 0;
                    position: absolute;
                    left: 0;
                    top: 42px;
                    background: #fff;
                    border-bottom: 4px solid #e98300;
                    box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.05);
                    z-index: 1000;
                }

                .navbar-nav.paramount > li.hovered > ul,
                .navbar-nav.paramount > li:hover > ul {
                    display: block;
                }

                .navbar-nav.paramount > li > ul li {
                    text-align: left;
                }

                    .navbar-nav.paramount > li > ul li a {
                        padding: 10px 20px;
                        color: #e98300;
                        display: block;
                        font-family: Arial, Helvetica, "Open Sans", sans-serif;
                    }

                        .navbar-nav.paramount > li > ul li a:hover {
                            text-decoration: none;
                            background: #e7e7e4;
                        }

                    .navbar-nav.paramount > li > ul li span {
                        display: block;
                        padding: 5px 20px;
                        color: #707271;
                        border-bottom: 1px solid #e7e7e4;
                    }
}

/* --- Mobile nav trigger --- */
.mobile-nav-trigger.fa {
    color: #009b3a;
    position: absolute;
    font-size: 30px;
    left: 10px;
    top: 50%;
    margin-top: -15px;
    cursor: pointer;
}

.mobile-message-center {
    position: absolute;
    right: 10px;
    top: 0;
    font-size: 30px;
}


/* ====================================================
   13.0 BRANDING / LOGOS — from paramount.less
   ==================================================== */
.main-logo {
    width: 190px;
    height: 47px;
    background-size: contain;
    display: block;
    background-color: #fff;
    background-image: url(../img/logos/par-main-mobile-2x.png);
    background-position: center center;
    background-repeat: no-repeat;
    margin: 20px auto 0;
}

@media (min-width: 960px) {
    .main-logo {
        width: 270px;
        height: 98px;
        background-position: center 21px;
        background-size: 100%;
        margin: 0;
    }
}

@media (min-width: 768px) and (max-width: 959px) {
    .main-logo {
        margin: 10px auto 0;
        width: 279px;
        height: 62px;
        background-image: url(../img/logos/par-main-tablet-2x.png);
        background-size: contain;
    }
}

.myn-main-logo {
    width: 190px;
    height: 47px;
    background-size: contain;
    display: block;
    background-color: #fff;
    background-image: url(../img/logos/PRO_MyNavigator_270x92.png);
    background-position: center center;
    background-repeat: no-repeat;
    margin: 20px auto 0;
}

@media (min-width: 960px) {
    .myn-main-logo {
        width: 270px;
        height: 98px;
        background-position: center 5px;
        background-size: 100%;
        margin: 0;
    }
}

.pmp-main-logo {
    width: 190px;
    height: 47px;
    background-size: contain;
    display: block;
    background-color: #fff;
    background-image: url(../img/logos/PRO-HP-Medicare.png);
    background-position: center center;
    background-repeat: no-repeat;
    margin: 20px auto 0;
}

@media (min-width: 960px) {
    .pmp-main-logo {
        width: 270px;
        height: 98px;
        background-position: center 5px;
        background-size: 100%;
        margin: 0;
    }
}

/* ====================================================
   14.0 PAGE HEADER
   ==================================================== */
.page-header {
    padding-bottom: 9px;
    margin: 20px 0 10px;
    border-bottom: 1px solid #e7e7e4;
}

    .page-header h1 {
        margin: 0;
        font-weight: normal;
    }

/* ====================================================
   15.0 OR-ROW divider — used in provider search form
   ==================================================== */
.or-row {
    position: relative;
    padding: 20px 0;
}

    .or-row div {
        background: white;
        position: relative;
    }

        .or-row div span {
            font-family: "Roboto", "Open Sans", Arial;
            color: #000;
            display: inline-block;
            padding: 0 15px;
            background: white;
            position: relative;
            z-index: 10;
        }

        .or-row div:after {
            content: "";
            display: block;
            border-bottom: 1px solid #000;
            width: 100%;
            position: absolute;
            top: 48%;
            z-index: 5;
        }

/* ====================================================
   16.0 FOOTER — from paramount.less
   ==================================================== */
footer.site-footer {
    margin-top: 40px;
    background: #8c897d;
    padding: 40px 0 60px;
    color: #fff;
    font-size: 12px;
}

footer .credits {
    margin-top: 30px;
    color: #e7e7e4;
}

    footer .credits a {
        color: #e7e7e4;
    }

footer .footer-intro {
    padding-top: 50px;
    padding-right: 25%;
    line-height: 2.1;
}

footer .link-section {
    margin-top: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid #fff;
    font-family: "Roboto", "Open Sans", Arial;
    text-transform: uppercase;
}

footer ul {
    list-style-type: none;
    margin: 0 0 30px 0;
    padding: 0;
}

    footer ul li a {
        display: inline-block;
        padding: 5px 0;
        color: #e7e7e4;
    }

/* ====================================================
   17.0 MISC MODULE OVERRIDES
   ==================================================== */

/* Orange message flag */
.message-flag {
    background: #e98300;
    padding: 3px 5px;
    color: #fff;
    border: 1px solid #fff;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    min-width: 24px;
    display: block;
    font-family: "Roboto", "Open Sans", Arial;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
}

/* Input readonly */
input[readonly] {
    background-color: #f3f2ee;
    color: #bbb;
}

/* Min height for form groups in columns */
div .form-group.col-md-6 {
    min-height: 90px;
}

/* Homepage banner */
body[data-page="homepage"] .wrapper {
    top: -8px;
    padding-top: 0;
    background-image: url(../img/homepage-banner-top-new.jpg);
    background-repeat: no-repeat;
    background-position: center -8px;
}

    body[data-page="homepage"] .wrapper .container.body-content {
        background: transparent;
    }

/* Status messages */
.status-success,
.status-failure {
    display: none;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 0;
}

.status-success {
    background-color: #dff0d8;
    border-color: #d6cdb2;
    color: #3c763d;
}

.status-failure {
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}

.collapsible.closed {
    display: none;
}