:root {
    /* FONTS */
    --primary-font: 'Verdana', sans-serif;
    --heading-font: 'Arial', sans-serif;
    --base-font-size: 16px;
    --base-line-height: 1.5;
    --h1-font: 600 1.5rem/2rem var(--heading-font);
    --h2-font: 600 1.25rem/1.75rem var(--heading-font);
    --h3-font: 600 1.125rem/1.5rem var(--heading-font);
    --h4-font: 600 1rem/1.25rem var(--heading-font);
    --h5-font: 600 0.875rem/1.125rem var(--heading-font);
    --p-big-font: 400 1.125rem/1.75rem var(--primary-font);
    --p-regular-font: 400 1rem/1.5rem var(--primary-font);
    --p-small-font: 400 0.875rem/1.25rem var(--primary-font);
    --preheader-font: 400 0.875rem/1.25rem var(--primary-font);
    --preheader-transform: uppercase;
    
    /* COLORS */
    --default-color: #1a73e8;
    --default-bgcolor: #c1c1c1;

    --text-color: #333333;
    --heading-color: #222222;
    
    --outer-page-bgcolor: #f0f0f0;
    --inner-page-bgcolor: #ffffff;
    
    --header-bgcolor: #ddd;
    --header-textcolor: #ffffff;
    
    --footer-bgcolor: #222222;
    --footer-textcolor: #ffffff;
    
    --menu-bgcolor: #dddddd;
    --menu-textcolor: #000000;
    
    --submenu-bgcolor: #f8f8f8;
    --submenu-textcolor: #333333;
    --submenu-header-bgcolor: #e0e0e0;
    
    --link-color: #1a73e8;
    --link-hover-color: #0c63d0;
    
    --button-bgcolor: #1a73e8;
    --button-textcolor: #ffffff;
    --button-hover-bgcolor: #0c63d0;
    --button-hover-textcolor: #ffffff;

    --input-bgcolor: #ffffff;
    --input-border-color: #cccccc;
    --input-text-color: #333333;

    --stroke-color: #1d1d1d;

    /* DIMENSIONS, PADDINGS, ETC */
    --breaker-padding: 50px; /* Padding for the breaker section */
    --block-spacing: 50px; /* Spacing between blocks */
    --internal-block-padding: 25px;
    --text-foto-padding: 25px;
    --loop-gap: 25px;
    --max-text-width: 800px; /* Maximum width of the text content */
    --max-page-width: 100vw; /* Maximum width of the page content */
    
    --hero-height-big: 500px;
    --hero-height-small: 300px;

    /* misc items */
    --default-border-radius: 10px;
    --default-border: 1px solid var(--stroke-color);

    --mobile-margins: 15px;
    --page-width: 1440px; /* Width of the page - including padding */
    --content-width: 1340px; /* Width of the content */
    --max-content-width: calc(100% - 2 * var(--mobile-margins)); /* Maximum width of the content */

    /* fullwidth item dimensions and placements */
    --fwitem-position: relative;
    --fwitem-width: var(--page-width);
    --fwitem-maxwidth: 100vw;
    --fwitem-right: var(--mobile-margins);
}
@media (min-width: 768px) {
    :root {
              --base-font-size: 16px;
        --base-line-height: 1.5;
        --h1-font: 600 1.5rem/2rem var(--heading-font);
        --h2-font: 600 1.25rem/1.75rem var(--heading-font);
        --h3-font: 600 1.125rem/1.5rem var(--heading-font);
        --h4-font: 600 1rem/1.25rem var(--heading-font);
        --h5-font: 600 0.875rem/1.125rem var(--heading-font);
        --p-big-font: 400 1.125rem/1.75rem var(--primary-font);
        --p-regular-font: 400 1rem/1.5rem var(--primary-font);
        --p-small-font: 400 0.875rem/1.25rem var(--primary-font);

        --breaker-padding: 50px; /* Padding for the breaker section */
        --block-spacing: 50px; /* Spacing between blocks */

        --hero-height-big: 500px;
        --hero-height-small: 300px;
    }
}
@media (min-width: 1440px) {
    :root {
        --fwitem-right: calc((var(--page-width) - var(--content-width)) / 2);
    }

}

/* GENERAL STYLES AND LOGICS */
/* ============= FONTS ================= */
.sp-pre-header {
    font: var(--preheader-font);
    text-transform: var(--preheader-transform);
}
.sp-main-header {
    font: var(--h2-font);
    color: inherit;
}
.sp-text-container:not([style*="color"]) .sp-main-header {
    color: var(--heading-color);
}
.sp-hero .sp-text-container:not([style*="color"]) .sp-main-header {
    color: white;
}
.sp-hero .sp-main-header {
    font: var(--h1-font);
}
.sp-repeater-item .sp-main-header {
    font: var(--h3-font);
}
.sp-center {
    text-align: center;
}
.sp-right {
    text-align: right;
}
/* GENERAL */
.sp-pre-header {
    margin-top: 0px;
    margin-bottom: 0;
}
.sp-intro {
    margin-bottom: 15px;
    max-width: 100%;
}

.sp-content-text {
    overflow: hidden;
}
/* linkbuttons */
.sp-linkbox {
    margin-top: 15px;
    display: flex;
    gap: 15px;
}
.sp-center .sp-linkbox {
    justify-content:center;
}
.sp-right .sp-linkbox {
    justify-content: right;
}
.sp-linkitem {
    width: fit-content;
}
.sp-linkitem a {
    display: block;
    width: fit-content;
}
a.sp-buttonlink-1 {
    padding: 12px 25px;;
    text-decoration: none;
    border-radius: var(--default-border-radius);
    border: var(--default-border);
}
a.sp-buttonlink-2 {
    background-color: var(--default-color);
    padding: 12px 25px;;
    text-decoration: none;
    border-radius: var(--default-border-radius);
}
a.sp-buttonlink-3 {
    background-color: var(--default-color);
    padding: 12px 25px;;
    text-decoration: none;
    border-radius: var(--default-border-radius);
}
a.sp-buttonlink-4 {
    background-color: var(--default-color);
    padding: 12px 25px;;
    text-decoration: none;
    border-radius: var(--default-border-radius);
}

/* ============= IMAGE ASPECTS ============= */
/* special edition for logos, to make sure the complete logo is visible. Wide, with max width and height 100% */
.sp-logocard-items .sp-image-content {
    aspect-ratio: 16 / 9;
    position: relative;
    overflow: hidden;
}

.sp-logocard-items .sp-image-content img {
    object-fit: contain;
    max-height: 100% !important;
    width: 100%;
}

/* SQUARE*/
.sp-square .sp-image-content,
.sp-square .sp-icon-content,
.sp-product-gallery-image,
.sp-product-gallery-thumb,
.sp-product-loop-image {
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

/* WIDE 16:9 */
.sp-wide .sp-image-content,
.sp-wide .sp-icon-content {
    aspect-ratio: 16 / 9;
    overflow: hidden;
}
.sp-wide .sp-image-content:has(iframe) {
    width: 100%;
}

/* TALL 9:16 */
.sp-tall .sp-image-content,
.sp-tall .sp-icon-content {
    aspect-ratio: 9 / 16;
    overflow: hidden;
}

/* ORIGINAL - NEEDS TWEAK */
.sp-original .sp-image-content,
.sp-original .sp-icon-content {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

/* ROUND */
.sp-quote-circular .sp-image-content {
    border-radius: 50%;
    display: block;
    padding-top: 100%;
    width: 100%;
    height: 0;
    overflow: hidden;
}

/* AUTOHEIGHT - MAYBE USE AS ORIGINAL? */
.sp-autoheight .sp-image-content {
    height: 100%;
    overflow: hidden;
}

.sp-autoheight .sp-image-content img {
    height: 100%;
    object-fit: cover;
}

/* COMMON FOR ALL IMG's WITH ASPECT, EXCEPT AUTOHEIGHT and LOGOS */
.sp-square .sp-image-content img,
.sp-square .sp-image-content iframe,
.sp-original .sp-image-content iframe,
.sp-wide .sp-image-content img,
.sp-wide .sp-image-content iframe,
.sp-tall .sp-image-content img,
.sp-tall .sp-image-content iframe,
.sp-quote-circular .sp-image-content img,
.sp-opt-pop-item .sp-image-content img,
.sp-repeater-item .sp-icon-content img,
.sp-repeater-item .sp-image-content img,
.sp-product-gallery-image img,
.sp-product-gallery-thumb img,
.sp-product-loop-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
}

.sp-video-image {
    height: 100%;
}

/* IMG FITTING PROPERTY */
.sp-image-content img {
    object-fit: cover;
}

.sp-contain .sp-image-content img,
.sp-contain .sp-icon-content img {
    object-fit: contain;
}

/* BREAKERS */
.sp-breaker {
    width: var(--page-width);
	max-width: 100vw;
	position: relative;
    left: calc( 0px - var(--mobile-margins) );
	padding: var(--breaker-padding) var(--mobile-margins) var(--breaker-padding) var(--mobile-margins);
}
@media (min-width: 768px) {
    .sp-breaker {
        left: calc( 0px - (var(--page-width) - var(--content-width)) / 2 );
        padding: var(--breaker-padding) calc( (var(--page-width) - var(--content-width)) / 2 );
    }
}

/* HERO */
.sp-hero.sp-hero-small {
    height: var(--hero-height-small);
}
.sp-hero.sp-hero-big {
    height: var(--hero-height-big);
}
.sp-hero {
    position: relative;
    height: var(--hero-height-big);
    width: var(--page-width);
    max-width: 100vw;
    left: calc( 0px - var(--mobile-margins) );
}
@media (min-width: 768px) {
    .sp-hero {
        left: calc( 0px - (var(--page-width) - var(--content-width)) / 2 );
    }
}
@media (max-width: 1390px) {
    .sp-hero {
        left: calc( 0px - var(--mobile-margins));
    }
}
.sp-hero .sp-image-container {
    overflow: hidden;
    z-index: 1;
}
.sp-hero .sp-image-content {
    height: 100%;
    width: 100%;
    display: flex;
}
.sp-hero .sp-image-container img {
    min-width: 100%;
    min-height: 100%;
    max-width: unset;
    z-index: 1;
    object-fit: cover;
    position: relative;
    overflow: visible;
}

.sp-hero.sp-hero-small .sp-image-container {
    height: var(--hero-height-small);
}
.sp-hero.sp-hero-big .sp-image-container {
    height: var(--hero-height-big);
}
.sp-hero .sp-text-container {
    width: var(--content-width);
    max-width: var(--max-content-width);
    position: absolute;
    left: var(--mobile-margins);
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}
@media (min-width: 768px) {
    .sp-hero .sp-text-container {
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
    }
}
/* HERO med video */
.sp-hero .sp-image-content iframe.sp-vimeo-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    transform: translate(-50%, -50%);
    max-height: unset;
    max-width: unset;
}
.sp-hero.sp-hero-big .sp-image-content iframe.sp-vimeo-video {
    min-height: var(--hero-height-big); 
}
.sp-hero.sp-hero-small .sp-image-content iframe.sp-vimeo-video {
    min-height: var(--hero-height-small); 
}
.sp-hero .sp-video-container:has(.sp-image-content iframe.sp-vimeo-video) {
    position: relative;
  overflow: hidden;
  min-width: 100%;
}
.sp-hero.sp-hero-big .sp-video-container:has(.sp-image-content iframe.sp-vimeo-video) {
    height: var(--hero-height-big); 
}
.sp-hero.sp-hero-small .sp-video-container:has(.sp-image-content iframe.sp-vimeo-video) {
    height: var(--hero-height-small); 
}
/* SKYPIM */
.sp-hero .sp-video-container video.sp-video-content {
    min-width: 100%;
    min-height: 100%;
    max-height: unset;
    max-width: unset;
    object-fit:cover;
}

/* PURE TEXT */
.sp-pure-text:not(.sp-breaker .sp-pure-text) {
    margin-top: var(--block-spacing);
    margin-bottom: var(--block-spacing);
    max-width: var(--max-text-width);
    margin-left: auto;
    margin-right: auto;
}
/* paddings in pure text with background-color */
.sp-pure-text.sp-bgcolor .sp-text-container {
    padding: var(--internal-block-padding);
    border-radius: var(--default-border-radius);
}
.sp-pure-text.sp-bgcolor .sp-text-container:not(:has(.sp-pre-header)) .sp-main-header {
    margin-top: unset;
}
/* --- */

/* TEXT-FOTO */
.sp-text-foto {
    border-radius: var(--default-border-radius);
    overflow: hidden;
    display: grid;
    margin: var(--block-spacing) 0;
}
.sp-text-foto .sp-image-content img.sp-image {
    overflow: hidden;
    display: block;
    min-width: 100%;
    min-height: 100%;
    position:  relative;
    width: 100%;
    height: 100%;
}
.sp-text-foto.sp-tf-padding {
    padding: var(--text-foto-padding);
}
.sp-text-foto.sp-no-tf-padding.sp-bgcolor, 
.sp-text-foto.sp-no-tf-padding.sp-border-1 {
    overflow: hidden;
    border: var(--default-border);
}
.sp-text-foto.sp-no-tf-padding.sp-bgcolor .sp-image-content, 
.sp-text-foto.sp-no-tf-padding.sp-border-1 .sp-image-content {
    border-radius: 0;
    border-top-left-radius: var(--default-border-radius);
    border-top-right-radius: var(--default-border-radius);
    position: relative;
    left: -1px;
    width: calc(100% + 2px);
    top: -1px;
}
@media (min-width: 768px) {
    .sp-text-foto.sp-no-tf-padding.sp-bgcolor .sp-image-content, 
    .sp-text-foto.sp-no-tf-padding.sp-border-1 .sp-image-content {
        border-radius: 0px;
        border-top-left-radius: unset;
        border-top-right-radius: unset;
        position: unset;
        left: unset;
        width: 100%;
        top: unset;
    }
}
.sp-text-foto.sp-no-tf-padding.sp-bgcolor .sp-text-container, 
.sp-text-foto.sp-no-tf-padding.sp-border-1 .sp-text-container {
    padding: var(--text-foto-padding);
}
.sp-text-foto .sp-image-container {
    order: 1;
}
.sp-text-foto .sp-text-container {
    order: 2;
}
@media screen and (min-width: 768px) {
    .sp-text-foto {
        grid-template-columns: repeat(2, 1fr);
    }
    .sp-text-foto .sp-text-container {
        order: unset;
        display: flex;
        align-items:anchor-center;
        
    }
    .sp-text-foto:not(.sp-flipright) .sp-text-container {
        order: 1;
        padding-right: var(--text-foto-padding);
    }
    .sp-text-foto:not(.sp-flipright) .sp-image-container {
        order: 2;
    }
    .sp-text-foto.sp-flipright .sp-text-container {
        order: 2;
        padding-left: var(--text-foto-padding);
    }
    .sp-text-foto.sp-flipright .sp-image-container {
        order: 1;
    }
}
.sp-text-foto .sp-image-content {
    border-radius: var(--default-border-radius);
    overflow: hidden;
}
.sp-text-foto.sp-text-over-image {
    display: block;
    position: relative;
}
.sp-text-foto.sp-text-over-image .sp-text-container {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index:2;
    width: 100%;
    justify-content:center;
    padding: var(--text-foto-padding);
}

/* LOOP BLOCKS */
.sp-repeater-item .sp-image-content {
    border-radius: var(--default-border-radius);
    overflow:hidden;
}
.sp-border-1 .sp-repeater-item {
    border: var(--default-border);
}
.sp-border-1 .sp-repeater-item .sp-image-content {
    border-radius: 0;
    border-top-left-radius: var(--default-border-radius);
    border-top-right-radius: var(--default-border-radius);
    position: relative;
    left: -1px;
    width: calc(100% + 2px);
    top: -1px;
}
.sp-border-1 .sp-repeater-item .sp-text-container,
.sp-bgcolor .sp-repeater-item .sp-text-container {
    padding: var(--internal-block-padding);
}
.sp-repeater {
        display: grid;
        gap: var(--loop-gap);
    }
@media screen and (min-width: 768px) {
    
    .sp-repeater.sp-col-2 {
        grid-template-columns: repeat(2, 1fr);
    }
    .sp-repeater.sp-col-3 {
        grid-template-columns: repeat(3, 1fr);
    }
    .sp-repeater.sp-col-4 {
        grid-template-columns: repeat(4, 1fr);
    }
    .sp-repeater.sp-col-5 {
        grid-template-columns: repeat(5, 1fr);
    }
    .sp-repeater.sp-col-6 {
        grid-template-columns: repeat(6, 1fr);
    }
    .sp-repeater.sp-col-7 {
        grid-template-columns: repeat(7, 1fr);
    }
    .sp-repeater.sp-col-8 {
        grid-template-columns: repeat(8, 1fr);
    }
}

/* FACT ICONS */
.sp-breaker:has(.sp-facticon-items) {
    padding-top: 15px;
    padding-bottom: 15px;
}
.sp-facticon-items {
    display: flex;
    flex-direction: column;
    font: var(--p-big-font);
}
.sp-facticon-items .sp-image-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.sp-facticon-items .sp-image-content img {
    display: block;
}
.sp-facticon-items .sp-main-header {
    font: var(--p-big-font);
}
@media screen and (min-width: 768px) {
    .sp-facticon-items {
        margin-top: 5px;
        margin-bottom: 5px;
        display: flex;
        flex-direction: row;
        gap: 50px;
    }
    .sp-facticon-items.sp-col-2 {
        grid-template-columns: repeat(2, 1fr);
    }
    .sp-facticon-items.sp-col-3 {
        grid-template-columns: repeat(3, 1fr);
    }
    .sp-facticon-items.sp-col-4 {
        grid-template-columns: repeat(4, 1fr);
    }
    .sp-facticon-items.sp-col-5 {
        grid-template-columns: repeat(5, 1fr);
    }
    .sp-facticon-items.sp-col-6 {
        grid-template-columns: repeat(6, 1fr);
    }
    .sp-facticon-items.sp-col-7 {
        grid-template-columns: repeat(7, 1fr);
    }
    .sp-facticon-items.sp-col-8 {
        grid-template-columns: repeat(8, 1fr);
    }
}
.sp-facticon-items .sp-repeater-item {
    display: flex;
    gap: 15px;
}
/* LOGOCARDS */
.sp-logocard-items {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--loop-gap);
}
@media screen and (min-width: 768px) {
    
    .sp-logocard-items.sp-col-2 {
        grid-template-columns: repeat(2, 1fr);
    }
    .sp-logocard-items.sp-col-3 {
        grid-template-columns: repeat(3, 1fr);
    }
    .sp-logocard-items.sp-col-4 {
        grid-template-columns: repeat(4, 1fr);
    }
    .sp-logocard-items.sp-col-5 {
        grid-template-columns: repeat(5, 1fr);
    }
    .sp-logocard-items.sp-col-6 {
        grid-template-columns: repeat(6, 1fr);
    }
    .sp-logocard-items.sp-col-7 {
        grid-template-columns: repeat(7, 1fr);
    }
    .sp-logocard-items.sp-col-8 {
        grid-template-columns: repeat(8, 1fr);
    }
}

/* SLIDERS - INCLUDING QUOTE SLIDERS */
.sp-multi-slideshow-wrapper.sp-bgcolor {
    padding: var(--internal-block-padding);
    overflow: hidden;
    border-radius: var(--default-border-radius);
}
.sp-slideshow {
    position: relative;
}
.sp-slideshow.sp-dotsandarrows {
     margin-bottom: 5px;
     padding-bottom: 132px;
     margin-top: 18px;
}
@media screen and (min-width: 768px) {
    .sp-slideshow.sp-dotsandarrows {
          padding-bottom: 32px;
     }
}
.sp-slideshowitems {
    display: flex;
    height: max-content;
    overflow: hidden;
    overflow-x: scroll;
    scroll-behavior:smooth;
  scroll-snap-type: x mandatory;
}
.sp-slideshowitems::-webkit-scrollbar {
  display:none;
}
.sp-slideshowitem {
    width: 100%;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: top;
    scroll-snap-align: start;
}
.sp-dotsandarrows .sp-slideshowitems {
    margin-left: 25px;
    margin-right: 25px;
}
.sp-noslidenav .sp-slideshowdots,
.sp-noslidenav .sp-slideshowdarrowprev,
.sp-noslidenav .sp-slideshowdarrownext {
    display: none;
}
.sp-slideshowdots {
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: 10;
    display: flex;
    width: 100%;
    justify-content: center;
    gap: 10px;
}
.sp-slideshowdot {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1px solid black;
}

.sp-slideshowdot:not(.active) {
    cursor: pointer;
}

.sp-slideshowdot.active {
    background-color: black;
}
.sp-slideshowdarrowprev,
.sp-slideshowdarrownext {
    z-index: 2;
    height: 100%;
    width: 15px;
    position: absolute;
    cursor: pointer;
}

.sp-slideshowdarrowprev {
    content: url(assets/icons/chewron-left.svg);
    left: 0;
    height: 100%;
}

.sp-slideshowdarrownext {
    content: url(assets/icons/chewron-right.svg);
    right: 0;
    height: 100%;
    margin-right: 5px;
}


/* video display - tekst-foto med text ovenpå billede */
.sp-text-foto.sp-text-over-image:has(.sp-video-container) {
    aspect-ratio: 16 / 9;
}
.sp-text-foto.sp-text-over-image .sp-image-container, 
.sp-text-foto.sp-text-over-image .sp-image-container iframe,
.sp-text-foto.sp-text-over-image .sp-image-container video {
    height: 100%;
    width: 100%;
}
/* youtube */
/* .sp-text-foto.sp-text-over-image .sp-image-content iframe.sp-youtube-video {
    width: 100%;
    height: 100%;
} */


/* video display - tekst-foto med text på siden */
/* skypim video */
.sp-text-foto:not(.sp-text-over-image) video.sp-video-content {
    width: 100%;
    height: 100%;
    min-height: 100%;
    min-width: 100%;
    max-height: unset;
    max-width: unset;
}
/* youtube video */
.sp-text-foto:not(.sp-text-over-image) .sp-image-content:has(.sp-youtube-video) {
    width: 100%;
    height: 100%;
    min-height: 100%;
    min-width: 100%;
    max-height: unset;
    max-width: unset;
    aspect-ratio: 16 / 9;
}
.sp-text-foto:not(.sp-text-over-image) .sp-image-content iframe.sp-youtube-video {
    width: 100%;
    height: 100%;
    min-height: 100%;
    min-width: 100%;
    max-height: unset;
    max-width: unset;
}


/* ============= VIDEO POPUP =============== */
/* Hide popup by default; use flex to center content when active */
.sp-video-popup-container {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.8);
    z-index: 1000;
    align-items: center;
    justify-content: center;
  }
  
  /* Show popup when active */
  .sp-video-popup-container.active {
    display: flex;
  }
  
  /* The inner popup element with relative positioning */
  .sp-video-popup {
    position: relative;
    background: #000; /* fallback background */
    max-width: 80%;
    box-sizing: border-box;
    width: 90%;
    aspect-ratio: 16 / 9;
  }
.sp-video-popup video {
    max-width: 100%;
}
  
  /* Close button inside the popup (upper right corner) */
  .popup-close {
    position: absolute;
    bottom: 100%;
    right: 0px;
    background: var(--default-color);
    border: none;
    color: #fff;
    font-size: 24px;
  }

/* DIVIDER */
.sp-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px 0;
  margin-left: auto;
  margin-right: auto;
}

.sp-dividerline {
  flex-grow: 1;
  height: 1px;
  background-color: var(--stroke-color);
}

.sp-divider .sp-image {
  margin: 0 10px; /* Adjust the margin to your needs */
  width: 40px; /* Adjust the size of the image */
  height: auto;
}

/* FILTERS */
/* styling sp-filters */
  .sp-filtergroup:has(.sp-filter-header-trigger) .sp-filter-dropdown {
    display: none;
  }
  /* slide down .sp-filter-dropdown.open */
  .sp-filtergroup:has(.sp-filter-header-trigger) .sp-filter-dropdown.open {
    display: block;
  }
.filter-options {
    display: flex;
    gap: 25px;
    
}
  .filter-option {
    display: flex;
    gap: 5px;
    padding: 10px;
      cursor: pointer;
      color: white;
    text-decoration: none;
    background-color: var(--bg-dark-color);
    padding: 10px 15px;
    border-radius: var(--default-button-border-radius);
  }
  .sp-filtergroup label {
    display: flex;
    gap: 5px;
    padding: 10px;
  }
.sp-filter-header-trigger {
    cursor: pointer;
}
.reset-filters {
    cursor: pointer;
    color: white;
    text-decoration: none;
    background-color: var(--bg-dark-color);
    padding: 10px 15px;
    border-radius: var(--default-button-border-radius);
}
.activefilter-item-deleter {
    cursor: pointer;
    padding: 4px;
    margin-bottom: 15px;
}
.filter-option.active {
    background-color: var(--bg-dark-color); /* Blå bakgrunn på aktivt valg */
    color: white;
    font-weight: bold;
}
label:has(input.disabled) {
    display: none;
}
.sp-certificates-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    text-align: center;
    border-radius: 16px;
    background-color: var(--default-bgcolor);   
}
@media screen and (min-width: 768px) {
    .sp-certificates-container {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.sp-certificates-container .sp-model-certifikat-image  {
    padding: 12px;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    height: 115px;
    align-items: center;
    justify-content: space-between;
}
@media screen and (min-width: 768px) {
    .sp-certificates-container .sp-model-certifikat-image {
        height: 124px;
        justify-content: center;
        gap: 8px;
    }
    
}
.sp-certificates-container .sp-model-certifikat-image-box {
    height: 57px;
    width: 100%;
    max-height: 57px;
    overflow: hidden;
    display: flex;
    justify-content:center;
}
.sp-certificates-container .sp-model-certifikat-image-box img {
    object-fit: contain;
    max-height: 100%;
    max-width: 100%;
    flex-shrink: 0;
}