﻿@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@200;300;400;500;600;700;800&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --baseMaxWidth: 960px;
    --mainBgColor: #F3F3F3;
    /* This is the right one */
    background-color: var(--mainBgColor);
    --headerNavHeight: 90px;
    --borderRadiusContainer: 10px;
    --borderRadiusButton: 5px;
    --borderRadiusInput: 5px;
    /*COLORS*/
    --white-color: #ffffff;
    --blackColor: #000000;
    --primaryColorWeb: #002F3C;
    --primaryColor: var(--primaryColorWeb);
    --webPrimaryColor: var(--primaryColorWeb);
    --secondaryColorWeb: var(--primaryColorWeb);
    --secondaryColorWebOverlay: rgba(2, 113, 143, .4);
    --secondaryColor: var(--secondaryColorWeb);
    --webSecondaryColor: var(--secondaryColorWeb);
    --tertiaryColorWeb: var(--primaryColorWeb);
    --highlightedInformationColor: var(--primaryColorWeb);
    --footerBackgroundColorBase: #002F3C;
    --primaryRGB: 0,47,60;
    --secondaryRGB: 2, 113, 143;
    /* --darkGreen: #224430;
    --lightTextColor: #FCEAFB; */
    /*-------Typography-----------*/
    --buttonFontWeight: 700;
    --fontFamily: 'Assistant', sans-serif;
    font-family: var(--fontFamily);
    line-height: 1.5;
    --typographyHeadingFontWeight: bold;
    --typographyH1BigFontSize: 60px;
    --typographyH1FontSize: 44px;
    --typographyH2FontSize: 25px;
    --typographyH2ListViewFontSize: 16px;
    --typographyH3FontSize: 20px;
    --typographyH4FontSize: 18px;
    --typographyH5FontSize: 16px;
    /*--typographyH6FontSize: 14px;*/
    --typographyManchetFontSize: 24px;
    --typographyParagraphFontSize: 16px;
    /**component Colors */
    --customHeadingColor: var(--primaryColorWeb);
    --buttonMoliri: var(--primaryColorWeb);
    /*------Breadcrumb-------*/
    --breadcrumbitemTextColorActive: var(--primaryColorWeb);
    --breadcrumbitemTextColorBase: var(--primaryColorWeb);
    --breadcrumbitemDivider: var(--primaryColorWeb);
    /* header**/
    --headerAsideMenuItemColor: var(--primaryColorWeb);
    /*--videoheaderMaxHeight: 66vh;*/
    --videoheaderMaxHeight: 500px;
    /* subpage header */
    --subpageheaderBackgroundColorBase: var(--secondaryColorWeb);
    --subpageheaderTextColorBase: var(--primaryColorWeb);
    --subpageheaderHeadingTextColorBase: var(--primaryColorWeb);
    /*------Aside navigation-------*/
    --asidemenuTextBase: var(--white-color);
    --asidemenuDivider: var(--white-color);
    --asidemenuTextPrimaryHover: var(--white-color);
    --asidemenuTextSecondaryHover: var(--white-color);
    --asidemenuBgStyleMainPanel: var(--primaryColorWeb);
    /* <bui-cta-button> */
    --ctabuttonBackgroundColor: var(--primaryColorWeb);
    /* <bui-accordion> */
    --accordionBtnBg: var(--primaryColorWeb);
    --accordionBtnText: var(--white-color);
    --accordionBtnBorder: transparent;
    /* bui-accordion-item */
    --accordionItemIconColor: var(--primaryColorWeb);
    --accordionItemTextColor: var(--primaryColorWeb);
    --accordionitemBackgroundColorBase: var(--white-color);
    /* <bui-quote>*/
    --quoteTextColor: var(--primaryColorWeb);
    --quoteCiteColor: var(--primaryColorWeb);
    /* long read **/
    --tableofcontentTitleColor: var(--primaryColorWeb);
    /*----Tidslinje----*/
    --timelinestepIconBgColor: var(--tertiaryColorWeb);
    --timelinestepIconActiveBgColor: var(--primaryColorWeb);
    /*--timelineLineBaseColor: var(--primaryColor);*/
    --timelineLineProcessColor: var(--primaryColorWeb);
    --timelinestepIconTextColor: var(--white-color);
    /* card */
    --webcardHeading: var(--primaryColorWeb);
    /*icon*/
    --iconBgColor: var(--primaryColorWeb);
    /* block **/
    --blockHighlightBaggroundColor: var(--highlightedInformationColor);
    /* heading **/
    --textDataTypeColor: var(--primaryColorWeb); /** Has to be changed to slotted when changed remove this  */
    /*------ Politiker galleri ------*/
    --personBgBlueColor: var(--webPrimaryColor);
    --personresumeBackgroundColorBase: var(--webPrimaryColor);
    --personIconColor: white;
    --personDarkBlueFadedColor: white;
    --bbaDarkBlueColor: var(--webPrimaryColor);
    --bbColorMenuBtnActive: var(--webPrimaryColor);
    --minicardBorderColor: var(--webPrimaryColor);
    --personTextColorHovered: var(--webPrimaryColor);
    /*------ Custom CTA style ------*/
    --ctabuttonLinkPickerTextColor: var(--primaryColorWeb);
    --ctabuttonBackgroundColor: #ffffff;
    --ctabuttonBorder: 1px solid #fc6221;
    --ctaButtonSquareIconBgColor: transparent;
    --ctaButtonSquareIconColor: #fc6221;
    --ctabannerBackgroundColorBase: var(--white-color);
    --ctabannerTextColorBase: var(--primaryColor);
    --guidestepRepeatDesktop: 2;
    /*------ Custom CTA BANNER variables ------*/
    --cta-banner-watermark-bg-size: 65% auto;
    --cta-banner-watermark-bg-size-mobile: 35% auto;
    --cta-banner-watermark-bg-size-tablet: 30% auto;
    --cta-banner-watermark-bg-size-desktop: 25% auto;
    --cta-banner-watermark-bg-size-desktop-lg: 18% auto;
    /*------ END Custom CTA BANNER variables ------*/
    --searchBarBtnColor: var(--secondaryColorWeb);
    --searchBarIconColor: var(--white-color);
    --searchBarBtnHoverColor: var(--secondaryColorWebOverlay);
    --searchBarIconHoverColor: var(--secondaryColorWeb);
    /*hearing portal*/
    --headingH1LineHeight: 52px;
    --subpageheaderImagewidthHeightTablet: 55vh;
    --div-image-bg-position: bottom center;
    --webbannerTitleFontSizeDesktopXl: 32px;
}

/*.forsidehovedsite392--body bui-section-grid {
    --sectiongrid4ColAmountMobile: 5;
}*/

.rectangle .web-banner__content-text ::slotted([slot=title]) {
    hyphens: auto;
}

.dtf-globaltindhold87 + .listpage-divider-3 {
    background: var(--white-color);
}
bui-news-list {
    --newslistSectionMarginBottom: 0;
}

.dtf-ctabilledebanner8966 {
    background: var(--white-color);
}

bui-person-resume a {
    color: var(--white-color);
}


/*Custom page content width*/
.frontpage-main, bui-video-header {
    --baseMaxWidth: 1400px;
}

.list_ContentType, .categorylistpage_ContentType, .listpage-main, .fordelingsside711_ContentType, .fordelingsside711_ContentType + bui-base {
    --baseMaxWidth: 1280px;
}

bui-cta-button {
    --borderRadiusContainer: 50px;
}

.frontpage-main {
    --sectiongridHeadingTextAlign: center;
}

bui-quote {
    font-style: italic;
}

bui-raw-sp p a {
    color: var(--primaryColorWeb);
}
bui-montage bui-raw-sp ul li * {
    color: var(--primaryColorWeb);
}

bui-cta-banner {
/*    --ctaBAnnerAlignContent: left;
    --ctaBannerLinksJustifyContent: left;*/
    --ctabannerPadding:4%;
}
bui-footer {
    --footerDefaultContentPadding: 64px 0 0px
}
    bui-footer address {
        font-style: normal;
    }
    bui-footer .dynamicFooterColumnTextContainer h2 {
        font-size: var(--footerHeaderH2FontSize, 16px);
        margin: 0 auto 8px;
    }
    bui-footer .dynamicFooterColumnTextContainer h3 {
        font-size: var(--footerHeaderH2FontSize, 16px);
        margin: 0 auto 8px;
    }
    bui-footer .dynamicFooterColumnTextContainer p {
        margin-top: 0;
    }

    bui-footer .dynamicFooterColumnText table {
        margin-bottom: 0px;
    }

    bui-footer bui-grid > div > *:first-child {
        margin-top:0;
    }

    bui-footer bui-grid div h2:first-child {
        line-height: 1;
    }

    bui-footer .dynamicFooterColumnTextContainer a {
        text-decoration: underline;
        color:white;
    }

    bui-footer .dynamicFooterColumnLinksList .footer-links {
        display: flex;
        align-items: center;
    }

        bui-footer .dynamicFooterColumnLinksList .footer-links::before {
            content: "";
            display: inline-block;
            width: 0;
            height: 2px;
            background-color: var(--footerHeadingBase, var(--primaryColorWeb));
            transition: all 250ms ease-out;
            white-space: nowrap;
        }

        bui-footer .dynamicFooterColumnLinksList .footer-links:hover::before {
            width: 1em;
            margin-right: 7px;
        }

/*----- Custom H font -----*/
h1, h2, h3, h4, h5, h6 {
    font-family: Montserrat;
}

/*-----custom-highlight colors-----*/
bui-block.highlight{margin-bottom:30px;}

bui-block.highlight ul {
    list-style: none;
}

bui-block.highlight, bui-block.highlight a, bui-block.highlight a[target=_blank]:after {
    color: var(--white-color);
    --linkListStyleATagColor: var(--white-color);
    fill: var(--white-color);
}
    bui-block.highlight bui-raw-sp.link-list-style ul a[target=_blank]:after {
        background: 50%/contain no-repeat url(data:image/svg+xml;base64,77u/PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuMC4wLWFscGhhMyBieSBAZm9udGF3ZXNvbWUgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbSBMaWNlbnNlIC0gaHR0cHM6Ly9mb250YXdlc29tZS5jb20vbGljZW5zZSAoQ29tbWVyY2lhbCBMaWNlbnNlKSAtLT48cGF0aCBkPSJNMzkyIDMyMGMtMTMuMjUgMC0yNCAxMC43NS0yNCAyNHYxMTJjMCA0LjQwNi0zLjU5NCA4LTggOGgtMzA0Yy00LjQwNiAwLTgtMy41OTQtOC04di0zMDRjMC00LjQwNiAzLjU5NC04IDgtOGgxMTJDMTgxLjMgMTQ0IDE5MiAxMzMuMyAxOTIgMTIwUzE4MS4zIDk2IDE2OCA5NmgtMTEyQzI1LjEzIDk2IDAgMTIxLjEgMCAxNTJ2MzA0QzAgNDg2LjkgMjUuMTMgNTEyIDU2IDUxMmgzMDRjMzAuODggMCA1Ni0yNS4xMiA1Ni01NnYtMTEyQzQxNiAzMzAuOCA0MDUuMyAzMjAgMzkyIDMyMHpNNDg4IDBIMzIwYy0xMy4yNSAwLTI0IDEwLjc1LTI0IDI0UzMwNi44IDQ4IDMyMCA0OGgxMTAuMUwxODMgMjk1Yy05LjM3NSA5LjM3NS05LjM3NSAyNC41NiAwIDMzLjk0QzE4Ny43IDMzMy43IDE5My44IDMzNiAyMDAgMzM2czEyLjI4LTIuMzQ0IDE2Ljk3LTcuMDMxTDQ2NCA4MS45NFYxOTJjMCAxMy4yNSAxMC43NSAyNCAyNCAyNFM1MTIgMjA1LjMgNTEyIDE5MlYyNEM1MTIgMTAuNzUgNTAxLjMgMCA0ODggMHoiIGZpbGw9IndoaXRlIiAvPjwvc3ZnPg==);
    }

    bui-block.highlight ul li::before {
        content: "\2022";
        color: var(--white-color);
        font-weight: bold;
        display: inline-block;
        width: 1em;
        margin-left: -1em;
    }

bui-web-icon-box {
    hyphens: auto
}

/*muni*/
@media screen and (max-width: 600px) {
    #chatbot-container.round, #chatbot-container-shadow.round {
        bottom: 4.5em !important;
    }
}

/*cludo*/

/*Instant Suggestions container*/
.search_autocomplete { /*subsites.furesoe.dk*/
    display: none;
}

.search-filters ul li.active, #cludo-search-results .search-filters ul li:hover {
    border-bottom: 4px solid var(--primaryColorWeb);
}

#cludo-search-results h2, #cludo-search-results h2 b, .search-result-count {
    color: var(--primaryColorWeb);
    font-weight: normal;
}

    #cludo-search-results h2 b {
        font-weight: bold;
    }

#cludo-search-results .cludo-banner {
    margin: 50px 0 20px 0;
    padding: 40px;
    background: #E1EFF3;
    color: var(--blackColor);
    border-radius: var(--borderRadiusContainer, 0);
}

    #cludo-search-results .cludo-banner a {
        color: var(--blackColor);
        word-break: break-word;
    }

    #cludo-search-results .cludo-banner h2 {
        margin-block-start: 0;
        color: var(--blackColor);
        font-size: var(--typographyH2FontSize);
    }

    #cludo-search-results .cludo-banner h3 {
        margin-block-start: 0;
        color: var(--blackColor);
        font-size: var(--typographyH3FontSize);
    }

    #cludo-search-results .cludo-banner a,
    #cludo-search-results .search-results-item span.path {
        text-decoration: underline;
        word-break: break-word;
    }

        #cludo-search-results .cludo-banner a:hover,
        #cludo-search-results .search-results-item span.path:hover {
            text-decoration: none;
        }

.search_autocomplete {
    width: 90%;
}
ul#search_autocomplete{
    width:50%;
}
/********/

.contentpage-divider-richtext758, .contentpage-divider-brdtekst958 {
    display: none;
}

@media screen and (max-width: 1200px) {
    .timeline-title h2{
        max-width:none;
    }
}

@media (max-width: 767px) {
    :root {
        /*------ Politiker galleri ------*/
        --personIconColor: var(--webPrimaryColor);
        --personTextColorHovered: var(--webPrimaryColor);
    }
}

a[href^="tel"] {
    color: inherit;
    text-decoration: none;
}

.subsite462--body bui-hero[variant="twin"],
.subsite462--body bui-hero[variant="colored"]
{
    height: 500px;
    display: grid;
}

.subsite462--body bui-video-header {
    --bigHeroHeight: 300px;
}


.subsite462--body bui-subpage-header[variant="img-right"],
.nyhedsfordelingssidemedbilleder96--body bui-subpage-header[variant="img-right"],
.fordelingssideaktiviteter567--body bui-subpage-header[variant="img-right"],
.longread448--body bui-subpage-header[variant="img-right"],
.subsiteskabelonskole188--body bui-subpage-header[variant="img-right"],
.forsidehovedsite392--body bui-subpage-header[variant="img-right"] {
    --subpageheaderImagewidthHeightTablet: 320px;
}

/*---MUNI /borger/borgerservice ---*/
@media (min-width: 767px) {
    .boost-trigger-button {
        bottom: 20px !important;
    }
}
/*------*/

bui-web-card.img-max-height {
    box-shadow: rgb(0 0 0 / 5%) 12px 12px 12px;
    padding: 0px 16px 6px;
    border-radius: var(--borderRadiusContainer, 0);
}

.forsidehovedsite392--body {
    --moliripublicheaderContentBgColor: rgba(65,128,96, 0.5);
}

    .forsidehovedsite392--body bui-grid .col-2 bui-heading,
    .forsidehovedsite392--body bui-grid .col-2 bui-divider{
        display: none!important;
    }



.hringsportal839_ContentType bui-heading[variant="slotted"] {
    -webkit-line-clamp: 4;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    word-break: break-word;
}