/* 2022-05-24: COPY of ~/assets/styles/b4.main.css */
/* DEVNOTE: url()'s for images and icons had to be modified to be relative to the root instead of relative to this file. */

@charset "UTF-8";

/** DEVNOTE: Google fonts api was down December 2024 and caused unresponsive websites across the world. 
  (2024-12)  Since then, we decided to go with a CDN option. We load the files via a <link> file instead of using CSS @import
             so that CSS files can be downloaded concurrently.
*/
/*@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Open+Sans:wght@400;600;700&display=swap);*/

html {
    height: 100%;
    box-sizing: border-box;
}

body {
    font-family: "Open Sans", Helvetica, Arial, sans;
    line-height: 1.375rem;
    color: #1f1f1f;
}

.page-wrap {
    z-index: 10;
    /* min-height: 625px; DEVNOTE: Replaced withproper  sticky footer */
}

.row.no-gutter {
    margin-right: 0;
    margin-left: 0;
}

.no-gutter-left {
    padding-right: 30px;
    padding-left: 0;
}

.row.no-gutter > [class*=" col-"],
.row.no-gutter > [class^=col-] {
    padding-right: 0;
    padding-left: 0;
}

.ui-autocomplete {
    z-index: 100004 !important;
}

.content-area {
    position: relative;
    width: 100%
}

    .content-area .bkg-img {
        position: absolute;
        z-index: 1;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center top;
        height: 610px;
        display: none;
        width: 100%
    }

    .content-area .bkg-home {
        background-image: url(/iaclarington/images/bkg-home.jpg)
    }

    .content-area .bkg-about {
        background-image: url(/iaclarington/images/bkg-about.jpg)
    }

    .content-area .bkg-highlight {
        background-image: url(/iaclarington/images/bkg-highlight.jpg)
    }

    .content-area .bkg-portfolio {
        background-image: url(/iaclarington/images/bkg-portfolio.jpg)
    }

    .content-area .bkg-basic,
    .content-area .bkg-basics {
        background-image: url(/iaclarington/images/bkg-basic.jpg)
    }

    .content-area .bkg-ai {
        background-image: url(/iaclarington/images/bkg-active.jpg)
    }

    .content-area .bkg-hub {
        background-image: url(/iaclarington/images/bkg-hub.jpg)
    }

    .content-area .bkg-pp {
        background-image: url(/iaclarington/images/bkg-pp.jpg)
    }

    .content-area .bkg-contact {
        background-image: url(/iaclarington/images/bkg-contact.jpg)
    }

    .content-area .bkg-active {
        background-image: url(/iaclarington/images/bkg-active.jpg)
    }

    .content-area .bkg-new1 {
        background-image: url(/iaclarington/images/bkg-new1.jpg)
    }

    .content-area .bkg-new2 {
        background-image: url(/iaclarington/images/bkg-new2.jpg)
    }

    .content-area .bkg-gradient {
        height: 100%;
        width: 100%;
        z-index: 2;
        position: absolute;
        top: 0;
        display: block
    }

    .content-area #contents {
        position: relative;
        top: 0;
        margin-bottom: 0;
        z-index: 3
    }

        .content-area #contents .breadcrumb {
            background-color: transparent;
            border-radius: 0;
            padding: 10px 20px
        }

            .content-area #contents .breadcrumb li {
                color: #1f1f1f;
            }

                .content-area #contents .breadcrumb li a,
                .content-area #contents .breadcrumb li + li:before {
                    color: #003da5;
                    font-size: 14px;
                    font-weight: 300
                }

            .content-area #contents .breadcrumb li {
                font-size: 14px;
            }

                .content-area #contents .breadcrumb li a:hover {
                    color: #064DD9;
                }

        .content-area #contents .page-header {
            padding: 0 30px;
            border: none;
            margin: 25px 0 60px;
            min-height: 100px
        }

            .content-area #contents .page-header h1 {
                padding-bottom: .1em
            }

        .content-area #contents .main-content {
            background-color: #fff;
            padding: 30px;
            margin-bottom: 30px
        }

            .content-area #contents .main-content .blue-highlight {
                background-color: #064dd9;
                color: #fff
            }

                .content-area #contents .main-content .blue-highlight .txt-area {
                    padding: 30px
                }

                    .content-area #contents .main-content .blue-highlight .txt-area h1,
                    .content-area #contents .main-content .blue-highlight .txt-area h2,
                    .content-area #contents .main-content .blue-highlight .txt-area h3,
                    .content-area #contents .main-content .blue-highlight .txt-area h4,
                    .content-area #contents .main-content .blue-highlight .txt-area h5 {
                        color: #fff
                    }

                        .content-area #contents .main-content .blue-highlight .txt-area h1 span.nobold,
                        .content-area #contents .main-content .blue-highlight .txt-area h2 span.nobold,
                        .content-area #contents .main-content .blue-highlight .txt-area h3 span.nobold,
                        .content-area #contents .main-content .blue-highlight .txt-area h4 span.nobold,
                        .content-area #contents .main-content .blue-highlight .txt-area h5 span.nobold {
                            font-weight: 400
                        }

                    .content-area #contents .main-content .blue-highlight .txt-area .content-link {
                        margin-top: 20px;
                        color: #fff;
                        display: block;
                        padding-left: 45px;
                        position: relative
                    }

                        .content-area #contents .main-content .blue-highlight .txt-area .content-link span.link-caret {
                            background-color: #e35025;
                            padding: 4px 10px;
                            display: inline-block;
                            position: absolute;
                            left: 0;
                            top: -3px
                        }

                            .content-area #contents .main-content .blue-highlight .txt-area .content-link span.link-caret span {
                                font-size: 1.5em;
                                font-weight: 500
                            }

                    .content-area #contents .main-content .blue-highlight .txt-area .content-link {
                        margin-top: 20px;
                        color: #fff;
                        display: block;
                        padding-left: 45px;
                        position: relative
                    }

                        .content-area #contents .main-content .blue-highlight .txt-area .content-link span.link-caret {
                            background-color: #e35025;
                            padding: 4px 10px;
                            display: inline-block;
                            position: absolute;
                            left: 0;
                            top: -3px
                        }

                            .content-area #contents .main-content .blue-highlight .txt-area .content-link span.link-caret span {
                                font-size: 1.5em;
                                font-weight: 500
                            }

                    .content-area #contents .main-content .blue-highlight .txt-area .content-btn {
                        margin-top: 20px;
                        color: #fff;
                        position: relative;
                        background-color: #e35025;
                        display: inline-block;
                        padding: 4px 10px;
                        text-decoration: none
                    }

                        .content-area #contents .main-content .blue-highlight .txt-area .content-btn span {
                            padding: 0 10px
                        }

                .content-area #contents .main-content .blue-highlight .img-area {
                    padding: 30px
                }

                .content-area #contents .main-content .blue-highlight .right-align {
                    text-align: right
                }

        .content-area #contents .sidebar .sidebar-block {
            margin-bottom: 15px;
            border-top: 5px solid #064dd9;
            background-color: rgba(239, 241, 244, 0.5);
            padding: 2em 1em
        }

.form-control,
.form-control::placeholder {
    color: #1f1f1f;
    opacity: 1
}



    h1.offscreen {
        clip-path: inset(100%);
        clip: rect(1px 1px 1px 1px);
        clip: rect(1px, 1px, 1px, 1px);
        height: 1px;
        overflow: hidden;
        position: absolute;
        white-space: nowrap;
        width: 1px
    }

h2 + h3 {
    margin-top: 5px !important
}

.row + h3 {
    margin-top: 15px !important
}

.sidebar h2 {
    font-family: "Open Sans", Helvetica, Arial, sans;
    font-size: 1.25em
}

.sidebar h3 {
    font-size: 1em;
    color: #000
}

.main-content a:not(.btn) {
    color: #064DD9;
    text-decoration: underline;
}

    .main-content a:not(.btn):active,
    .main-content a:not(.btn):focus,
    .main-content a:not(.btn):hover,
    .main-content a:not(.btn):visited {
        text-decoration: none;
        color: #2962ff;
    }

.main-content .contact-callout a:not(.btn) {
    color: white;
}

    .main-content .contact-callout a:not(.btn):active,
    .main-content .contact-callout a:not(.btn):focus,
    .main-content .contact-callout a:not(.btn):hover,
    .main-content .contact-callout a:not(.btn):visited {
        text-decoration: none;
        color: #f0f1f2;
    }

button:focus-visible,
button:focus {
    outline-width: 1px !important;
    outline-style: solid !important;
    outline-offset: -5px
}

a:focus-visible {
    outline: 1px solid !important;
    outline-offset: 0
}

a.locked::after,
button.locked::after {
    content: "";
    background: url(/iaclarington/images/icons/icon-lock-white.svg) right center/11px no-repeat transparent !important;
    padding: 0 16px 0 0
}

.btn.btn-orange,
.btn.btn-primary,
.std-btn,
a.primary-button {
    background-color: #d44300;
    color: #fff !important;
    display: inline-block;
    padding: 9px 15px;
    text-decoration: none;
    white-space: nowrap;
    border: none
}

    .btn.btn-orange:focus,
    .btn.btn-orange:hover a.primary-button:focus,
    .btn.btn-primary:focus,
    .btn.btn-primary:hover,
    a.primary-button:hover,
    a.std-btn:focus,
    a.std-btn:hover {
        background-color: #003da5
    }

a.blue-btn,
a.secondary-button {
    background-color: #003da5;
    color: #fff !important;
    display: inline-block;
    padding: 9px 15px;
    text-decoration: none;
    white-space: nowrap;
    border: none
}
/* Introduced 2023-02-15 - AdvisorHub Login Page*/
a.btn-secondary-outlined {
    color: #003da5;
    border-color: #003da5;
    display: inline-block;
    padding: 9px 48px;
    text-decoration: none;
    white-space: nowrap;
    border: 2px solid;
}

.blue-text {
    color: #003da5;
}

.newLoginRightContainer {
    border-left: none;
}

@media (min-width: 992px) {
    .newLoginRightContainer {
        border-left: 1px solid #dee2e6;
    }
}

a.btn.btn-secondary-outlined:hover,
a.btn.btn-secondary-outlinedfocus {
    background-color: #003da5;
    color: #FFF;
    border-color: #fff;
}

/*End New Login Page*/
a.blue-btn:focus,
a.blue-btn:hover,
a.secondary-button:focus,
a.secondary-button:hover {
    background-color: #d44300
}

.btn.btn-grey,
.btn.btn-tertiary,
.std-btn-grey,
a.tertiary-button {
    background-color: #6d787f;
    color: #fff !important;
    display: inline-block;
    padding: 9px 15px;
    text-decoration: none;
    white-space: nowrap;
    border: none
}

    .btn.btn-grey:focus,
    .btn.btn-grey:hover,
    .btn.btn-tertiary:focus,
    .btn.btn-tertiary:hover,
    a.std-btn-grey:focus,
    a.std-btn-grey:hover,
    a.tertiary-button:focus,
    a.tertiary-button:hover {
        background-color: #003da5
    }

.orange-caret-bullet,
.orange-caret-list li,
.primary-caret-bullet,
.primary-caret-list {
    list-style-type: none;
    list-style-position: outside;
    padding: 3px 0;
    margin-left: 20px
}

    .orange-caret-bullet::before,
    .orange-caret-list li::before,
    .primary-caret-bullet::before,
    .primary-caret-list li::before {
        font-size: 1.25em;
        padding-right: .5em;
        content: "»";
        margin-left: -20px;
        color: #1f1f1f !important;
    }

    /* NEW 2022-08-16 - Market Insight lists not left-aligned due to inherent inline spacing. */
    .primary-caret-list li {
        position: relative;
    }

        .primary-caret-list li::before {
            position: absolute;
            right: 100%;
            margin-left: 0;
            top: 1px; /* NEW 2022-12-28: Fix vertical alignment with text */
        }
    /* END (NEW 2022-08-16) */

    .orange-caret-list li,
    .primary-caret-list li {
        padding: 3px 0;
    }

        .orange-caret-bullet a,
        .orange-caret-list li a,
        .primary-caret-bullet a,
        .primary-caret-list li a {
            color: #064DD9;
            text-decoration: none;
        }

            .orange-caret-bullet a:focus,
            .orange-caret-bullet a:hover,
            .orange-caret-list li a:focus,
            .orange-caret-list li a:hover,
            .primary-caret-bullet a:focus,
            .primary-caret-bullet a:hover,
            .primary-caret-list li a:focus,
            .primary-caret-list li a:hover {
                text-decoration: underline;
                color: #003DA5;
            }

.list-horizontal li {
    display: inline;
    margin-right: 25px
}

.list-h4 {
    padding-left: 1em;
    margin-bottom: 20px
}

    .list-h4 li {
        font-weight: 700;
        color: #000
    }

.blue-disk-list {
    margin-left: -20px
}

    .blue-disk-list li {
        color: #003da5 !important
    }

        .blue-disk-list li p,
        .blue-disk-list li span {
            color: #1f1f1f
        }

.main-content ol.indent,
.main-content ul.indent {
    margin-left: 0 !important
}

.chart-title {
    font-weight: 600
}

.chart-source {
    font-size: 13px;
    line-height: 1
}

.chart-legend {
    font-size: 13px;
    line-height: 1
}

.table-condensed > tbody > tr > td,
.table-condensed > tbody > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > thead > tr > th {
    padding: 5px
}

.table > caption + thead > tr:first-child > td,
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > td,
.table > thead:first-child > tr:first-child > th {
    border-top: 0
}

.table-striped > tbody > tr:nth-child(even) > td,
.table-striped > tbody > tr:nth-child(even) > th {
    background-color: #eff1f4
}

.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
    background-color: #fff
}

.table-style-1 {
    font-size: 14px;
    display: block;
    overflow-x: auto
}

    .table-style-1 thead tr {
        background-color: #003da5;
        color: #fff
    }

    .table-style-1 tr td:first-of-type,
    .table-style-1 tr th:first-of-type {
        border-right: 1px solid #ff585d
    }

    .table-style-1 tr td:not(:first-of-type):not(:last-of-type),
    .table-style-1 tr th:not(:first-of-type):not(:last-of-type) {
        border-right: 1px solid rgba(109, 120, 127, .5)
    }

    .table-style-1 tr td {
        border-top: 1px solid rgba(109, 120, 127, .25) !important
    }

.primary-highlight {
    background-color: #eff1f4;
    padding: 10px 20px 5px;
    margin: 1em 0;
    color: #000
}

    .primary-highlight strong {
        font-weight: 600
    }

    .primary-highlight .title {
        font-weight: 700
    }

.contact-callout {
    background-color: #064dd9;
    padding: 10px 20px;
    margin: 1.75em 0 0;
    color: #fff
}

.info-box,
.notice-box {
    background-color: #eff1f4;
    padding: 10px 15px 5px;
    margin: 0 0 1.5em;
    color: #1f1f1f;
    border: 3px solid #064dd9;
}

    .info-box:before,
    .notice-box:before {
        float: left;
        margin-right: 15px
    }

    .notice-box:before {
        content: url(/images/default-source/icons/notice_icon.png)
    }

    .info-box:before {
        content: url(/images/default-source/icons/info-icon.png?ver=5)
    }

.contact-callout a {
    color: #fff
}

    .contact-callout a:hover,
    .contact-callout a:focus,
    .contact-callout a:active,
    .contact-callout a:visited {
        color: #eff1f4;
    }

.disclaimer {
    font-size: 13px;
    font-weight: 400;
    line-height: 1
}

.small {
    font-size: 14px
}

hr {
    margin: 1em 0 2em;
    border-top: 1px solid rgba(109, 120, 127, .5) !important
}

.panel hr:last-of-type {
    margin-bottom: 10px
}

.align-center {
    text-align: center
}

.pdf:after {
    content: "";
    background: url(/images/default-source/icons/icon-pdf.png) right center/16px no-repeat transparent !important;
    padding: 0 22px 4px 0
}

.calendar::after {
    content: "\e109";
    padding: 0 1px 4px 7px;
    font-family: 'Glyphicons Halflings';
    font-size: 11px
}

.no-margin-bottom {
    margin-bottom: 0 !important
}

.no-margin-top {
    margin-top: 0 !important
}

.divider {
    margin: 1em 0 2em;
    border-bottom: 1px solid #d7e3e8;
}

.image-container img {
    width: 100%;
    margin-bottom: 0.5em;
}

.align-right {
    text-align: right
}

.noshow {
    display: none
}

.content-area #contents h1.utop,
.content-area #contents h2.utop,
.content-area #contents h3.utop,
.content-area #contents h4.utop,
.content-area #contents h5.utop,
.content-area #contents h6.utop {
    border-top: 5px solid #064dd9;
    padding-top: .5em;
    margin-top: .5em
}

.sub-menu {
    display: flex;
    border-bottom: 3px solid #064dd9;
    margin-bottom: 30px
}

    .sub-menu .tab {
        margin-bottom: 1px;
        padding: 10px 15px
    }

        .sub-menu .tab.menu-active {
            background-color: #064dd9 !important;
            border-right: 1px solid #fff
        }

    .sub-menu > .tab:not(.menu-active):not(:last-child) {
        border-right: 1px solid #ccc
    }

    .sub-menu > .tab:not(.menu-active):focus,
    .sub-menu > .tab:not(.menu-active):hover {
        background-color: #2962ff !important
    }

        .sub-menu > .tab:not(.menu-active):focus > a,
        .sub-menu > .tab:not(.menu-active):hover > a {
            color: #fff !important
        }

    .sub-menu a {
        /*color: #003da5 !important;*/
        text-decoration: none;
        font-weight: 600
    }

    .sub-menu .menu-active a {
        color: #fff !important;
        text-decoration: none
    }

.main-content .panel-group {
    margin-bottom: 10px
}

.main-content .panel .panel-heading {
    background-color: transparent
}

    .main-content .panel .panel-heading a {
        text-decoration: none
    }

        .main-content .panel .panel-heading a h3,
        .main-content .panel .panel-heading a h4 {
            margin-top: 0
        }

            .main-content .panel .panel-heading a h2:focus,
            .main-content .panel .panel-heading a h2:hover,
            .main-content .panel .panel-heading a h3:focus,
            .main-content .panel .panel-heading a h3:hover {
                color: #d44300
            }

        .main-content .panel .panel-heading a.panel-title {
            font-size: 1em;
            color: #1f1f1f;
            font-family: 'Open Sans', sans-serif;
            font-weight: 700;
            line-height: 1em;
            display: block;
            transition: all .3s ease-in-out 0s
        }

.main-content .panel.panel-default .panel-collapse {
    padding: 5px 15px 10px
}

    .main-content .panel.panel-default .panel-collapse ul:not(.orange-caret-list) li:not(:last-of-type) {
        border-bottom: 1px solid rgba(109, 120, 127, .25);
        padding-bottom: 5px;
        margin-bottom: 5px
    }

.main-content .panel.panel-content {
    border: 0;
    box-shadow: none
}

    .main-content .panel.panel-content .panel-heading {
        padding: 0
    }

        .main-content .panel.panel-content .panel-heading .indicator {
            padding-left: 3px
        }

.main-content .sidebar .panel .panel-heading a h2 {
    padding-bottom: 0
}

/* Collapsable Cards */
/* Disclaimer card*/
.card.card-disclaimer {
    border: 0;
}

    .card.card-disclaimer .card-header {
        background: #FFF;
        border: 0;
        padding: 0;
    }

        .card.card-disclaimer .card-header .btn-collapse {
            background: #FFF;
            border: 0;
            padding: 0;
            margin: 0;
            font-weight: 600;
            color: #064DD9;
            font-size: 13px;
        }

            .card.card-disclaimer .card-header .btn-collapse:active, .card.card-disclaimer .card-header .btn-collapse:hover {
                text-decoration: underline;
            }

            .card.card-disclaimer .card-header .btn-collapse .fa-chevron-up,
            .card.card-disclaimer .card-header .btn-collapse .fa-chevron-down {
                margin-right: 10px;
            }

            .card.card-disclaimer .card-header .btn-collapse .fa-chevron-up {
                transform: rotate(180deg);
            }

            .card.card-disclaimer .card-header .btn-collapse[aria-expanded="true"] .fa-chevron-up {
                transform: none;
            }

            .card.card-disclaimer .card-header .btn-collapse[aria-expanded="true"] .fa-chevron-down {
                transform: rotate(180deg);
            }

    .card.card-disclaimer .card-body {
        padding: 15px 0 0 0;
    }

.video-wrapper {
    position: relative;
    padding-bottom: 52.25%;
    padding-top: 25px;
    height: 0;
    text-align: center
}

    .video-wrapper embed,
    .video-wrapper iframe,
    .video-wrapper object {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

.content-area #contents .sidebar .video-wrapper {
    padding-bottom: 56.5%;
    padding-top: 0
}

    .content-area #contents .sidebar .video-wrapper iframe {
        border: 1px solid #99a1a6
    }

@media (max-width:767px) {
    .container {
        max-width: unset;
    }

    #content {
        margin-top: 55px
    }

    .content-area #contents .page-header {
        margin: 40px 0 25px !important
    }

    .content-area .bkg-img {
        height: 290px;
        display: block;
        width: 100%;
        top: -10px
    }

    .content-area #contents .breadcrumb {
        display: none
    }

    .content-area #contents .page-header {
        padding: 0 30px;
        border: none;
        margin: 15px 0 25px;
        min-height: 50px
    }

        .content-area #contents .page-header h1 {
            padding-bottom: .1em
        }

    .content-area #contents .main-content {
        background-color: #fff;
        padding: 10px 15px;
        position: relative
    }

        .content-area #contents .main-content .sidebar {
            padding-top: 1em;
            border-top: 1px solid rgba(109, 120, 127, .5);
            margin-top: 2em
        }

    .list-horizontal li {
        margin-right: 15px
    }

    .desktop {
        display: none
    }
}

@media (min-width:768px) {
    html {
        scroll-padding-top: 100px
    }

    .container {
        width: 750px;
        max-width: 750px
    }

    .content-area .bkg-img {
        height: 325px
    }

    .content-area #contents .main-content {
        background-color: #fff;
    }

    .mobile,
    .mobile_only {
        display: none !important
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .content-area #contents .main-content {
        padding: 15px 20px
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .container {
        width: 970px;
        max-width: 970px
    }

    .content-area .bkg-img {
        height: 425px
    }
}

@media (min-width:1200px) {
    .container {
        width: 1170px;
        max-width: 1170px
    }
}