@import url('../../dist/custom.config.css');

:root {
    --mainBgColor: #4AAFC4;
    --mainBgEndColor: #daeff3;
    /*COLORS*/
    --white-color: #ffffff;
    --blackColor: #000000;
    --primaryColorWeb: #DE5329; /**first 222,83,41**/
    --secondaryColorWeb: #4AAFC4; /**second 74,175,196 **/
    --primaryColor: var(--primaryColorWeb);
    --webPrimaryColor: var(--primaryColorWeb);
    --secondaryColorWebOverlay: rgba(222,83,41,.4);
    --secondaryColor: var(--secondaryColorWeb);
    --webSecondaryColor: var(--secondaryColorWeb);
    /*--tertiaryColorWeb: #85C7E5;*/
    --tertiaryColorWeb: #EEAA16;
    /*--redColor: #d83530;*/
    --redColor: var(--primaryColorWeb);
    --highlightedInformationColor: #ffd001;
    --componentItemBgColor: #A55599;
    --buttonMoliri: var(--redColor);
    --primaryRGB: 222,83,41;
    --secondaryRGB: 222,83,41;
    /** glass mdf */
    --mdf-dialog-glass-effect-bg-color: rgba(222,83,41,.6); /* same as var(--mainBgColor) but with 0.6 opacity **/
    --fab-button-bg-image: linear-gradient(to right, #4aafc4, #DE5329, #7b0062, #DE5329, #4aafc4);
    /*------Aside navigation-------*/
    --asidemenuTextBase: var(--blackColor);
    --asidemenuDivider: var(--blackColor);
    --asidemenuTextPrimaryHover: var(--tertiaryColorWeb);
    --asidemenuTextSecondaryHover: var(--tertiaryColorWeb);
    --asidemenuBgStyleMainPanel: var(--mainBgColor); /* background color  */
    --timelineItemBgColor: var(--tertiaryColorWeb);
    --headerAsideLogoWidth: 265px;
    --headerAsideLogoHeight: 75px;
    /*Grid changer*/
    --gridchangeIconBase: rgba(255,255,255,.5);
    --noneBtnHoverTextColor: #ffffff;
    --gridchangeIconActive: #fff;
    /* <bui-accordion> */
    --accordionBtnBg: var(--primaryColorWeb);
    --accordionBtnText: var(--white-color);
    --accordionBtnBorder: transparent;
    /* bui-accordion-item */
    --accordionItemIconColor: var(--white-color);
    --accordionItemTextColor: var(--white-color);
    /*------ Custom CTA style ------*/
    --ctaiconboxTextColorBase: var(--white-color);
    --ctabuttonBorder: 1px solid var(--redColor);
    --ctaButtonSquareIconBgColor: transparent;
    --ctaButtonSquareIconColor: var(--white-color);
    --ctabannerBackgroundColorBase: var(--redColor);
    --ctabannerTextColorBase: var(--white-color);
    --ctabuttonLinkPickerTextColor: var(--white-color);
    --ctabuttonBackgroundColor: var(--redColor);
    --subsite-btn-color: var(--redColor);
    --inputFieldSubmitBtnBgColorBase: var(--redColor);
    --inputFieldSubmitBtnBorderColorBase: var(--redColor);
    /*blockHighlight*/
    --blockHighlightBaggroundColor: var(--tertiaryColorWeb);
    /*footer watermark*/
    --footerColumn3BgIconPlacementTopTablet: 4vh;
    --footerColumn3BgIconWidthTablet: 330px;
    --footerColumn3BgIconHeightTablet: 310px;
    /*--- div ---*/
    --componentItemBgColor: var(--tertiaryColorWeb);
    --ctaiconboxTextColorBase: var(--blackColor);
    /*black text*/
    --headerAsideMenuItemColor: var(--blackColor);
    --customHeadingColor: var(--blackColor);
    --headingColorBase: var(--blackColor);
    --textDataTypeColor: var(--blackColor);
    --breadcrumbitemTextColorBase: var(--blackColor);
    --breadcrumbitemTextColorActive: var(--blackColor);
    --breadcrumbitemDivider: var(--blackColor);
    --newslistHeadingColor: var(--blackColor);
    --newslistTextColor: var(--blackColor);
    --bbaLightedColor: var(--blackColor);
    --textitemTextColorBase: var(--blackColor);
    --socialmediashareHeadingColor: var(--blackColor);
    --newslistBgColor: transparent;
}
body {
    background: -webkit-gradient(linear, left top, left bottom, from(var(--mainBgColor, black)), to(var(--mainBgEndColor, transparent)));
    background: -o-linear-gradient(top, var(--mainBgColor, black) 0%, var(--mainBgEndColor, transparent) 100%);
    background: linear-gradient(to bottom, var(--mainBgColor, black) 0%, var(--mainBgEndColor, transparent) 100%);
    --webcardTagline: var(--blackColor);
    --webcardTaglineColor: var(--blackColor);
    --webcardHeading: var(--blackColor);
    --webcardTeaser: var(--blackColor);
    --ctaiconboxTextColorBase: var(--blackColor);
}

bui-cta-icon-box {
    --ctaiconboxTextColorBase: var(--primaryColorWeb);
}
.frontpage-main bui-cta-icon-box {
    --buttonMoliri: var(--primaryColorWeb);
    --buttonMoliriWhite: var(--primaryColorWeb);
}

.frontpage-main bui-cta-icon-box:hover {
    --buttonMoliriWhite: var(--white-color);
}


/*-- Timeline --*/
bui-timeline bui-block.timeline-item h2,
bui-timeline bui-block.timeline-item h3,
bui-timeline bui-block.timeline-item h4,
bui-timeline bui-block.timeline-item h5,
bui-timeline bui-block.timeline-item p {
    color: var(--blackColor);
}

bui-timeline-step button {
    color: white;
    border: 1px solid;
    border-radius: 50px;
    width: 80%;
    padding: 5px 0;
}

bui-timeline-step[active="true"] {
    border: 0;
}

bui-timeline-step[active="true"] button {
    background: var(--redColor);
}

/*--- Footer ---*/
bui-footer {
    --footerBackgroundColorBase: var(--primaryColorWeb);
    --footerColumn3GridTemplate: 3fr 4fr 2fr;
    --socialMediaPlaceContent: left;
}

@media(min-width: 768px) {
    bui-footer {
        text-align: start;
    }
        bui-footer .social-media-col-3 {
            text-align: left;
            --socialMediaPlaceContent: start;
        }
}


/*--- Footer bylinje ---*/
.design-as-bg.design-top-stretch-desktop {
    background-repeat: no-repeat;
    background-position: center bottom;
    max-width: 100%;
    margin: 0 auto -3px;
}

bui-footer.bg-icon-faded.has-top-design {
    --footerDesignMaxHeight: 13%;
    --footerDesignTopBgImagePaddingBottom: 22%;
}

@media (min-width: 1195px) {
    .footer-design ::slotted(.design-top-stretch-desktop) {
        padding-bottom: var(--footerDesignMaxHeight, 123px);
        background-repeat: no-repeat;
        background-size: auto;
        background-position: center bottom;
        margin: 0px auto -1px;
    }
}

/*-- secondary icon ---*/
bui-footer img[slot="bgIcon"] {
    width: 200px;
    height: 200px;
    top: 10px
}


main bui-raw-sp a {
    color: var(--redColor)
}

/*-----highlight-text-----*/
bui-block.highlight,
bui-block.highlight a
bui-block.highlight h1,
bui-block.highlight h2,
bui-block.highlight h3,
bui-block.highlight h4,
bui-block.highlight h5,
bui-block.highlight h6 {
    color: var(--blackColor);
}

/*-----highlight-bullet-----*/
bui-block.highlight ul li > a, bui-block.highlight ul li > p {
    color: var(--blackColor);
}

bui-block.highlight ul li::before {
    color: var(--blackColor);
}
bui-block.highlight bui-raw-sp * {
    color: var(--blackColor);
}
bui-web-banner bui-icon {
    --imageCtaBannerIconColor: var(--white-color);
    --iconBgColor: var(--redColor);
}

bui-input-field input {
    --bbaDarkBlueColor: var(--redColor);
}

/*-- Person Vaelger color --*/
a.people-square-contactlink, .contact-details {
    color: var(--white-color);
}

a.people-square-contactlink:hover {
    color: var(--white-color);
    background-image: linear-gradient(transparent, transparent), linear-gradient(var(--white-color), var(--white-color));
}
/*--- End ---*/


main bui-raw-sp, main bui-raw-sp a {
    color: var(--blackColor);
}
bui-header.header__scrolling {
    --headerAsideMenuItemColor: var(--blackColor);
}
:host([scrollactivated]) {
    --headerAsideMenuItemColor: var(--blackColor);
 }
.social-media-share__heading {
    --socialmediashareHeadingColor: var(--blackColor);
}

.newssection-base {
    --newslistBgColor: transparent;
    --weblistitemTagline: white;
    --weblistitemTextColorBase: white;
    --weblistLines: white;
    --standardCardIconColor: var(--primaryColor);
    --iconBgColor: var(--tertiaryColorWeb);
}