/* =========================================================================
   Accessibility support (WCAG 2.2 AA)
   Loaded after style.css, skins/omnant.css and custom.css so it wins on
   equal specificity.
   ========================================================================= */

/* ---- Skip link -------------------------------------------------------- */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 10000;
    padding: 12px 16px;
    background: #0B72A8;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

    .skip-link:focus,
    .skip-link:active {
        left: 16px;
        top: 16px;
        color: #fff;
        outline: 3px solid #1a1a1a;
        outline-offset: 2px;
    }

main:focus {
    outline: none;
}

/* ---- Base text size (was 14px) ---------------------------------------- */
body {
    font-size: 16px;
}

/* ---- Visible keyboard focus ------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #0B72A8;
    outline-offset: 2px;
}

.bg-primary a:focus-visible,
.site-button:focus-visible,
.call-to-action-wrap a:focus-visible {
    outline-color: #fff;
}

/* ---- Colour contrast ---------------------------------------------------
   Brand blue #1595D3 is 3.35:1 against white, below the 4.5:1 needed for
   normal-size text. #0B72A8 is 5.27:1 on white and 4.67:1 on the #f1f1f1
   breadcrumb bar. #1595D3 stays for borders, icons and decoration.
   ----------------------------------------------------------------------- */
a,
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover,
.text-primary,
button.scroltop,
.wt-breadcrumb li a,
.header-nav .nav > li:hover > a,
.header-nav .nav > li .sub-menu li a:hover,
.header-nav .nav > li .sub-menu li:hover > a,
.header-nav .nav > li.active > a,
.header-nav .nav > li.current-menu-item > a,
.date-style-3 .post-date strong,
.testimonial-1 .testimonial-position,
.testimonial-grid-1 .testimonial-position,
.testimonial-3 .testimonial-position,
.testimonial-grid-3 .testimonial-position,
.masonry-filter > li.active a,
.masonry-filter > li a:hover,
.masonry-filter > li a:active,
.masonry-filter > li a:focus,
.widget_categories ul li a:hover,
.widget_archive ul li a:hover,
.widget_meta ul li a:hover,
.widget_pages ul li a:hover,
.widget_recent_comments ul li a:hover,
.widget_nav_menu li a:hover,
.widget_recent_entries ul li a:hover,
.widget_services ul li a:hover,
.footer-dark .footer-top a:active,
.footer-dark .footer-top a:focus,
.footer-dark .footer-top a:hover,
.font-color-primary,
.recent-posts-entry .post-date,
.executive-summary {
    color: #0B72A8;
}

p a,
p a:hover,
p a:focus,
p a:active {
    color: #0B72A8;
}

.executive-summary {
    border-color: #0B72A8;
}

    .executive-summary:hover,
    .executive-summary:focus {
        background: #0B72A8;
        color: #fff;
    }

/* White text sits on these backgrounds. */
.bg-primary,
.site-button,
.searchform input[type="submit"],
.pagination > .active > a,
.pagination > .active > span,
.custom-pagination.pagination > .active > a,
.custom-pagination.pagination > .active > span,
.date-style-2 .post-date,
.pricingtable-price,
.testimonial-2 .testimonial-detail,
.testimonial-grid-2 .testimonial-detail,
.testimonial-4 .testimonial-detail,
.testimonial-grid-4 .testimonial-detail {
    background-color: #0B72A8;
}

.wt-info-has.bg-primary {
    background-color: rgba(11, 114, 168, 0.95);
}

/* The theme's gold hover (#E4A101) is 2.1:1 behind white text. */
.site-button:active,
.site-button:hover,
.site-button:focus,
.active > .site-button,
.searchform input[type="submit"]:hover,
.searchform input[type="submit"]:focus,
.searchform input[type="submit"]:active {
    background-color: #085A85;
    color: #fff;
}

/* ---- Heading-size utilities --------------------------------------------
   Lets a heading use the correct outline level while keeping the size it
   had before (e.g. an <h3> that should look like the theme's <h5>).
   ----------------------------------------------------------------------- */
.hs-h3 {
    margin-top: 20px;
    font-size: 20px;
    line-height: 24px;
    color: #3d474a;
    margin-bottom: 20px;
}

.hs-h4 {
    margin-top: 10px;
    font-size: 18px;
    line-height: 22px;
    color: #1a1a1a;
    margin-bottom: 15px;
}

.hs-h5 {
    margin-top: 10px;
    font-size: 16px;
    line-height: 22px;
    color: #1a1a1a;
    margin-bottom: 10px;
}

.hs-h6 {
    margin-top: 10px;
    font-size: 14px;
    line-height: 18px;
    color: #3d474a;
    margin-bottom: 10px;
}

.text-white.hs-h3,
.text-white.hs-h4,
.text-white.hs-h5,
.text-white.hs-h6 {
    color: #fff;
}

/* ---- Main navigation: keyboard access to sub-menus (desktop) ---------- */
@media only screen and (min-width: 992px) {
    .header-nav .nav > li:focus-within > .sub-menu,
    .header-nav .nav > li.open > .sub-menu {
        opacity: 1;
        visibility: visible;
        margin-top: 0;
    }
}

/* ---- Blog article hero image (was a CSS background) -------------------- */
.article-photo-frame {
    overflow: hidden;
}

.article-photo-img {
    display: block;
    width: 100%;
    height: 282px;
    object-fit: cover;
    object-position: center 35%;
}

@media only screen and (max-width: 767px) {
    .article-photo-img {
        height: 150px;
    }
}

/* ---- Blog filters rendered as links ------------------------------------ */
.tagcloud a.blog-filter,
.tagcloud a.blog-filter-clear {
    text-decoration: none;
}

/* ---- Comparison pages --------------------------------------------------- */
.compare-table {
    width: 100%;
    margin-bottom: 24px;
    border-collapse: collapse;
    background: #fff;
}

    .compare-table th,
    .compare-table td {
        padding: 12px 14px;
        border: 1px solid #e3e3e3;
        vertical-align: top;
        text-align: left;
    }

    .compare-table thead th {
        background: #0B72A8;
        color: #fff;
    }

    .compare-table tbody th {
        width: 26%;
        color: #1a1a1a;
    }

.compare-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.compare-note {
    font-size: 14px;
    color: #595959;
}