Eyebrow titel

Custom CSS

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Generel CSS

				
					/* Gør at ankerlinks stopper under headeren */
html {
	scroll-padding-top: 120px;
}

/* Tilføjer blur-effekt på baggrund */
.bg-blur {
	backdrop-filter: blur(10px);
}

/* Tilføjer blur-effekt på knapper */
.bg-blur-btn .elementor-button {
	backdrop-filter: blur(10px);
}

/* Begrænser anmeldelsestekst til 3 linjer */
.anmeldelse {
   overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
}

/* FAQ & Accordion - start */

/* Tilføjer blød overgang ved hover */
.pp-faq-item,
.pp-accordion-item {
	transition: all 0.2s ease, scale 0.2s ease;
}

/* Løfter elementet let ved hover og forstørrer ikonet */
.pp-faq-item:hover, .pp-accordion-item:hover {
    translate: 0px -2px;
    .pp-accordion-toggle-icon {
	    scale: 1.1;
    }
}

/* FAQ & Accordion - slut */

/* Scrollbar - start */

/* Gør scrollbarens farver dynamiske via globale CSS-variabler */
* {
  scrollbar-width: auto;
  scrollbar-color: var(--cta) var(--primaer);
}

/* Scrollbar - slut */

/* Skjuler Cookiebot-widget */
div#CookiebotWidget {
	display: none;
}

/* Giver afstand under lister i teksteditor */
.elementor-widget-text-editor ol,
.elementor-widget-text-editor ul {
    margin-bottom: 10px;
}

/* Giver afstand mellem listepunkter */
.elementor-widget-text-editor li {
    margin-bottom: 7px;
}
				
			

Header CSS

				
					/* header - START */

/* Tilføjer blur-baggrund bag navigationen */
.blur-bg-nav::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background: rgba(255, 255, 255, 0.15);
}

/* Giver dropdown-menu blur-effekt og CTA-farvet kant */
.sub-menu {
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border-left: 5px solid var(--cta) !important;
}

/* Gør dropdown hvid når headeren er sticky */
.elementor-location-header .elementor-sticky--effects .sub-menu {
  background: white !important;
}

/* Gør headeren hvid ved sticky state */
.elementor-location-header .elementor-sticky--effects {
  background: white;
}

/* Ændrer menulinks til tekstfarven ved sticky state */
.elementor-sticky--effects .pp-advanced-menu--main li a,
.pp-menu-off-canvas li a {
  color: var(--tekst) !important;
  fill: var(--tekst) !important;

  /* Gør linktekst hvid ved hover */
  &:hover {
    color: white !important;
    fill: white !important;
  }
}

/* Giver menulinks CTA-baggrund ved hover */
.elementor-location-header .pp-advanced-menu--main li a:hover {
  background: var(--cta) !important;
}

/* Giver menupunkter afrundede hjørner */
.elementor-location-header .pp-advanced-menu li a {
  border-radius: 7px 7px 7px 7px;
}

/* Ændrer dropdown-pilens farve ved sticky state */
.elementor-sticky--effects svg.e-font-icon-svg.e-fas-angle-down {
  fill: var(--tekst) !important;
}

/* Ændrer hero-knappens tekstfarve ved sticky state */
.elementor-sticky--effects .hero-btn .elementor-button-content-wrapper {
  color: var(--tekst);
  fill: var(--tekst);
}

/* Ændrer hamburgerikonets farve ved sticky state */
.elementor-sticky--effects .pp-hamburger-inner,
.elementor-sticky--effects .pp-hamburger-inner:before,
.elementor-sticky--effects .pp-hamburger-inner:after {
  background-color: var(--tekst) !important;
}

/* Skjuler overflow i dropdown-menuen */
.sub-menu {
  overflow: hidden;
}

/* Fjerner afrunding på dropdown-links */
.sub-menu li a {
  border-radius: 0px !important;
}

/* Styling af aktivt menupunkt */
.elementor-location-header .pp-advanced-menu .pp-menu-item-active,
.pp-menu-off-canvas .pp-advanced-menu .pp-menu-item-active {
  color: white !important;
  background: var(--primaer) !important;
}

/* Styling af markeret dropdown-menupunkt */
.elementor-location-header .pp-advanced-menu--main li a.highlighted {
  color: white !important;
  fill: white !important;
  background: var(--cta) !important;
  border-radius: 7px 7px 0px 0px;

  /* Beholder CTA-farve ved hover */
  &:hover {
    background: var(--cta) !important;
  }
}

/* Gør logo og toggle hvidt på transparent header */
.filter-logo img,
.top-toggle img {
  filter: brightness(0) invert(1);
  -webkit-filter: brightness(0) invert(1);
}

/* Gør logo og toggle mørkt når headeren er sticky */
.elementor-location-header .elementor-sticky--effects .filter-logo img,
.elementor-location-header .elementor-sticky--effects .top-toggle img {
  filter: brightness(1) invert(0);
  -webkit-filter: brightness(1) invert(0);
}

/* Justerer placering af luk-knap i mobilmenu */
.pp-advanced-menu--dropdown.pp-menu-off-canvas.pp-menu-off-canvas-right .pp-menu-close-wrap {
  right: 20px;
  left: auto;
  top: 20px;
}

/* header - SLUT */