@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap");

:root {
    --gp-green: #00a85a;
    --gp-green-dark: #00643b;
    --gp-green-light: #28aa1e;
    --gp-green-apple: #6ab023;
    --gp-green-lime: #97d700;
    --gp-green-highlight: #27e663;
    --gp-green-tint: #e6f4ec;
    --gp-blue-midnight: #001f4e;
    --gp-teal: #00606a;
    --gp-turquoise: #00a499;
    --gp-blue-sky: #41b6e6;
    --gp-violet: #410076;
    --gp-purple: #824ee4;
    --gp-red: #df1317;
    --gp-morello: #bc0c29;
    --gp-pink: #e83e6a;
    --gp-blush: #ff8a8c;
    --gp-yellow: #fae100;
    --gp-peach: #ffc399;
    --gp-orange: #ff5b0f;
    --gp-brown: #713400;
    --gp-black: #231f20;
    --gp-grey-dark: #333333;
    --gp-grey-mid: #999999;
    --gp-grey-100: #f5f5f5;
    --gp-grey-border: #cccccc;
    --gp-white: #ffffff;
    --gp-font: 'Manrope', 'Helvetica Neue', Arial, sans-serif;
    --gp-link-color: var(--gp-green-dark);
    --gp-link-hover: var(--gp-green);
    --gp-text-color: #000000;
}

body {
    font-family: var(--gp-font);
    color: var(--gp-text-color);
    line-height: 1.55;
}

[data-id="article_Title"],
.KbDetailLtContainer__detailHeader.commonStyle__detailHeader {
    font-family: 'Bebas Neue', var(--gp-font);
    color: var(--gp-green-dark);
    font-weight: 700;
    letter-spacing: 0.04em;
}

.Header__searchTitle {
    font-family: 'Bebas Neue', var(--gp-font);
    color: var(--gp-white);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

h1,
h2,
h3,
h4 {
    color: var(--gp-green-dark);
    font-family: var(--gp-font);
    font-weight: 700;
    letter-spacing: -0.015em;
}

a {
    color: var(--gp-link-color);
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: underline;
}

a:focus-visible {
    outline: 2px solid var(--gp-green-highlight);
    outline-offset: 2px;
}

.Button,
.btn,
.ArticleLayout__main a.button {
    background: var(--gp-green);
    color: var(--gp-white) !important;
    border-radius: 4px;
    padding: 0.65em 1.3em;
    font-weight: 600;
    transition: background 0.15s ease;
}

.Button:hover,
.btn:hover {
    background: var(--gp-green-dark);
}

.Button:focus,
.btn:focus,
button:focus,
input[type="button"]:focus,
input[type="submit"]:focus {
    outline: 2px solid var(--gp-green-highlight);
    outline-offset: 2px;
}

.btn.secondary,
.Button.secondary {
    background: var(--gp-grey-100);
    color: var(--gp-green-dark);
    border: 1px solid var(--gp-green);
}

.btn.secondary:hover,
.Button.secondary:hover {
    background: var(--gp-green);
    color: var(--gp-white);
}

.Footer {
    background: var(--gp-green-dark);
    color: var(--gp-white);
}

.Footer a {
    color: var(--gp-white);
}

.Footer a:hover {
    color: var(--gp-green-highlight);
}

@media (min-width: 1024px) {
    .articleDetail .Layout__twoColumn {
        max-width: 1600px !important;
        width: 100% !important;
        margin: 0 auto;
    }
}

.ArticleCard {
    border-top: 4px solid var(--gp-green);
    box-shadow: none;
    border-radius: 4px;
    background: var(--gp-grey-100);
}

.kbLanding .Banner {
    background: var(--gp-green-tint);
    padding: 4rem 0;
}

img {
    max-width: 100%;
    height: auto;
}

.inputBox {
    border-radius: 4px;
    border: 1px solid var(--gp-grey-border);
}

.articleDetail .RightContainer {
    display: none;
}

.articleDetail h2:before {
    background: var(--gp-green);
}

ul.zd_hc_header_tabs {
    list-style: none;
    margin: 0;
    padding: 0;
    border-bottom: 2px solid var(--gp-green-lime);
}

ul.zd_hc_header_tabs>li {
    display: inline-block;
    margin-right: 0.35em;
}

ul.zd_hc_header_tabs>li>a,
ul.zd_hc_header_tabs>li>.zd_hc_tab_title {
    color: var(--gp-white) !important;
    border-radius: 999px;
    padding: 0.45em 0.9em;
    display: inline-block;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

ul.zd_hc_header_tabs>li>a:hover,
ul.zd_hc_header_tabs>li>.zd_hc_tab_title:hover,
ul.zd_hc_header_tabs>li>a:focus,
ul.zd_hc_header_tabs>li>.zd_hc_tab_title:focus {
    color: var(--gp-white) !important;
    background: transparent !important;
    text-decoration: underline;
}

ul.zd_hc_header_tabs>li.zd_hc_active>a,
ul.zd_hc_header_tabs>li.zd_hc_active>.zd_hc_tab_title {
    text-decoration: underline;
    border-bottom: 2px solid var(--gp-green-lime);
    color: var(--gp-white) !important;
}

.breadcrumb {
    background: var(--gp-grey-100);
    color: var(--gp-green-dark);
    padding: 0.5em 1em;
}

.breadcrumb a {
    color: var(--gp-green-dark);
}

.breadcrumb a:hover {
    color: var(--gp-green);
    text-decoration: underline;
}

.ArticleListRightContainer__widgetSection {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.ArticleListRightContainer__widgetSection .ArticleListRightContainer__fLeft {
    float: none !important;
    flex: 0 0 auto;
}

.ArticleListRightContainer__widgetSection [data-id="category_logo"] {
    width: 88px;
    height: 88px;
    border-radius: 10px;
}

.ArticleListRightContainer__widgetSection [data-id="category_logo"] img[data-id="category_logo_image"] {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: contain;
    display: block;
}

.ArticleListRightContainer__widgetSection .ArticleListRightContainer__deskHeading {
    flex: 1 1 0;
    min-width: 0;
    margin-left: 12px;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-word;
    line-height: 1.2;
}

.ArticleListRightContainer__widgetSection .ArticleListRightContainer__categoryDescription,
.ArticleListRightContainer__widgetSection .ArticleListRightContainer__followOption,
.ArticleListRightContainer__widgetSection .ArticleListRightContainer__subscribeDescription,
.ArticleListRightContainer__widgetSection .ArticleListRightContainer__followerCount {
    flex: 0 0 100%;
    margin-left: 0 !important;
    padding-left: 12px;
    margin-top: 8px;
}

.footer-powered-by,
.powered-by-zoho,
div[class*="poweredby"],
div[class*="poweredBy"],
.Footer__container2 {
    display: none !important;
}

.AppContainer__backToTop,
[data-id="toparrow"],
.commonStyle__zt3BrandBg {
    background-color: var(--gp-orange) !important;
    color: var(--gp-white) !important;
}

.AppContainer__backToTop svg,
[data-id="toparrow"] svg,
.commonStyle__zt3BrandBg svg {
    fill: var(--gp-white) !important;
}

button svg,
.btn svg,
.Button svg,
.articleDetail h2:before,
a.button svg {
    fill: var(--gp-white) !important;
}

svg path,
svg circle,
svg rect {
    fill: inherit;
}

input[type="button"]:hover,
input[type="submit"]:hover,
button:hover,
.submit-ticket-button:hover,
[data-id="submit_ticket"]:hover {
    background-color: var(--gp-orange) !important;
    color: var(--gp-white) !important;
    border-color: var(--gp-orange) !important;
}

.pagination .active,
.pagination li.active a {
    background-color: var(--gp-green) !important;
    border-color: var(--gp-green) !important;
}

.Footer__footerQus {
    font-size: 0 !important;
    color: transparent !important;
    display: inline-block !important;
}

.Footer__footerQus::after {
    content: "Can't find what you're looking for?";
    font-size: 36px !important;
    line-height: 1.2 !important;
    font-weight: 700;
    color: var(--gp-green-dark) !important;
    display: block !important;
    visibility: visible !important;
}

.Footer__footerDescription span {
    font-size: 0 !important;
    color: transparent !important;
    display: inline-block !important;
}

.Footer__footerDescription span::after {
    content: "Raise a ticket and a member of the Digital Support team will get back to you.";
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: var(--gp-green-dark) !important;
    display: block !important;
    visibility: visible !important;
    text-align: center;
    white-space: normal;
}

.KbDetailLtContainer__articleContent,
.KbDetailLtContainer__description,
.articleDetail .ArticleLayout__main {
    padding-left: 20px !important;
}

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

    .Header__navbar,
    #navBar {
        background-color: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
    }

    .Header__name {
        font-size: 0 !important;
    }

    .Header__name::before {
        content: "Digital Support";
        font-size: 20px;
        font-weight: 600;
        color: inherit;
        line-height: 1.2;
    }

    .KbDetailLtContainer__articleContent,
    .KbDetailLtContainer__description,
    .articleDetail .ArticleLayout__main {
        padding-left: 16px !important;
    }
}

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
