@charset "UTF-8";
/*********************
Variables
*********************/
/*********************
COLORS
*********************/
/* base */
/* typography */
/* links */
/* Main Menu */
/* Mobile Menu */
/******** EDITORIAL ********/
/* Header and Footer */
/*Lines and borders*/
/* tables */
/*top-menu*/
/*Margins and heights*/
/*If changed also need to be updated in scripts.js*/
/*If changed also need to be updated in scripts.js*/
/******************************************************************
Version: 1.1.4
******************************************************************/
/*Usage
	@include MQ(M) {
		Content
	}
*/
/******************************************************************
Version: 1.2.21
******************************************************************/
/*********************
HYPHENS

p {
  // Använda standardvärden
  @include hyphenate-settings;

  // Använda anpassade värden
  @include hyphenate-settings(
    $hyphens: auto,
    $limit_chars: 6 3 3,
    $limit_lines: 2,
    $limit_last: always,
    $limit_zone: 8%
  );
}

****/
/*********************
Font awesome icon

.user-icon {
  @include fa-icon("\f007"); // Standard: solid i classic
}

.mail-icon {
  @include fa-icon("\f0e0", #ff5733, "light"); // Light-stil med röd färg
}

.sharp-user-icon {
  @include fa-icon("\f007", rgb(0, 150, 136), "solid", "sharp"); // Sharp solid med turkos färg
}

.brand-icon {
  @include fa-icon("\f099", #1da1f2, "brands"); // Twitter-logga i blå färg
}

*********************/
/*********************
IMAGE FILTERS

img { 
  @include filter(grayscale, 100%);
}

*********************/
/*********************
Alpha Background

@include alpha-attribute('background-color', rgba(black, 0.5), white);
@include alpha-attribute('background', opacify($color, 0.1), $background);
@include alpha-attribute('background', transparentize($color, 0.2), $background);

*********************/
/*********************
Text Background

@include text-background(2em, 1em, white);

*********************/
/*********************
Object Fit
*********************/
/*
This mixin can be used to set the object-fit:
@include object-fit(contain);
or object-fit and object-position:
@include object-fit(cover, top);
 */
/*********************
  Disable hyphens
*********************/
/*********************
Smooth Scroll for IOS
*********************/
/*

*/
/*********************
Hide Scroll bars
*********************/
/*********************
OPACITY

@include opacity(0.8);

*********************/
/*********************
Gradient
*********************/
/*********************
CSS3 GRADIENTS
*********************/
/*********************
Box shadow
*********************/
/*********************
PREFIXES
*********************/
/*********************
Colors
*********************/
/*********************
TRANSITIONS
*********************/
/*********************
SHOW/HIDE
*********************/
/*********************
OTHER
*********************/
/*
 https://joshbroton.com/quick-fix-sass-mixins-for-css-keyframe-animations/

 Using the mixins looks like this:

 @include keyframes(move-the-object) {
0%   { left: 100px; }
100% { left: 200px; }
 }

 .object-to-animate {
@include animation('move-the-object .5s 1', 'move-the-object-again .5s 1 .5s');
 } 

 */
/*********************
BACKGROUND POSITION
*********************/
/* 
 .container-with-floated-children {
@extend %clearfix;
 }
 */
/******************************************************************
Version: 1.0.18
******************************************************************/
/* Basic mixins */
/* Justify */
/* Align */
/* Other */
/******************************************************************
Version: 1.8
******************************************************************/
/*********************
TRANSITIONS

a {
  color: gray;
  @include transition(color .3s ease);
  &:hover {
    color: black;
  }
}
*********************/
html body.admin-bar .header, html body.admin-bar .section-menu, html body.admin-bar .mobile-menu {
  top: 46px;
}
@media only screen and (min-width: 1030px) {
  html body.admin-bar .header, html body.admin-bar .section-menu, html body.admin-bar .mobile-menu {
    top: 32px;
  }
}
html body .mobile-icons {
  cursor: pointer;
  z-index: 1000;
  display: flex;
}
html body .mobile-icons .menu-button {
  width: 44px;
  height: 50px;
  margin-left: 0.5rem;
  display: flex;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
}
html body .mobile-icons .menu-button span {
  /* the span element is used to create the menu icon */
  position: relative;
  display: block;
  width: 20px;
  height: 2px;
  background-color: #fff;
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
html body .mobile-icons .menu-button span:before, html body .mobile-icons .menu-button span:after {
  content: "";
  position: absolute;
  left: 0;
  background: inherit;
  width: 100%;
  height: 100%;
  /* Force Hardware Acceleration in WebKit */
  transform: translateZ(0);
  backface-visibility: hidden;
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
html body .mobile-icons .menu-button span:before {
  top: -6px;
  transform: rotate(0deg);
}
html body .mobile-icons .menu-button span:after {
  bottom: -6px;
  transform: rotate(0deg);
}
html body .mobile-menu {
  position: fixed;
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  transform: translateY(-100%);
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #333;
  z-index: 999;
}
html body .mobile-menu .mobile-menu-content {
  padding: 100px 15%;
  display: flex;
  -moz-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  height: 100%;
}
html body .mobile-menu .mobile-menu-content ul {
  list-style: none;
  padding: 0;
}
html body .mobile-menu .mobile-menu-content ul li {
  margin: 20px 0;
}
html body .mobile-menu .mobile-menu-content ul li a {
  color: white;
  text-decoration: none;
  font-size: 24px;
}
html body .mobile-menu .mobile-menu-content .dbase-language-switcher {
  border-top: 1px solid #ffffff;
  display: flex;
  grid-gap: 1em;
}
html body .mobile-menu .mobile-menu-content .dbase-language-switcher li a {
  text-transform: uppercase;
  font-size: 1em;
}
html body .mobile-extra-menu {
  display: flex;
  -moz-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
}
html body .mobile-extra-menu a {
  color: white;
  text-decoration: none;
}
html body .mobile-extra-menu .mobile-search a {
  color: white;
  font-size: 18px;
  text-decoration: none;
}
html body .mobile-extra-menu .mobile-search a:after {
  content: "\f002";
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  margin-left: 5px;
}
html body.menu-is-open .mobile-menu {
  transform: translateY(0);
}
html body.menu-is-open .mobile-icons .menu-button {
  box-shadow: none;
}
html body.menu-is-open .mobile-icons .menu-button span {
  background: transparent;
}
html body.menu-is-open .mobile-icons .menu-button span:before, html body.menu-is-open .mobile-icons .menu-button span:after {
  background: #fff;
}
html body.menu-is-open .mobile-icons .menu-button span:before {
  top: 0;
  transform: rotate(135deg);
}
html body.menu-is-open .mobile-icons .menu-button span:after {
  bottom: 0;
  transform: rotate(225deg);
}
html body header {
  background-color: #333;
  position: fixed;
  width: 100%;
  z-index: 999;
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  transform: translateY(0);
}
html body header.hide {
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  opacity: 1;
  filter: alpha(opacity=100);
  transform: translateY(-100%);
}
html body header .logo {
  display: flex;
}
html body header .logo a {
  display: flex;
}
html body header .inner-header {
  display: flex;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  background-color: inherit;
  color: white;
  height: 80px;
  padding: 0 20px;
}
@media only screen and (min-width: 1030px) {
  html body header .inner-header {
    padding: 0 50px;
  }
}
html body header .inner-header {
  position: relative;
}
html body header .inner-header a.search-icon {
  color: white;
  text-decoration: none;
  font-size: 30px;
}
@media only screen and (min-width: 1030px) {
  html body header .inner-header a.search-icon {
    font-size: 22px;
  }
}
html body header .inner-header a.search-icon {
  display: flex;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  padding: 10px;
  background-color: transparent;
}
html body header .inner-header a.search-icon:after {
  content: "\f002";
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  margin-left: 5px;
}
html body header .inner-header a.search-icon.open:after {
  content: "\f010";
}
html body header .inner-header .main-menu > div, html body header .inner-header .main-menu > ul, html body header .inner-header .main-menu a, html body header .inner-header .extra-menu > div, html body header .inner-header .extra-menu > ul, html body header .inner-header .extra-menu a {
  height: 100%;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}
html body header .inner-header .main-menu, html body header .inner-header .extra-menu {
  -moz-justify-content: flex-end;
  -o-justify-content: flex-end;
  justify-content: flex-end;
  -ms-flex-pack: flex-end;
  -ms-flex-pack: end;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  height: 100%;
  display: none;
}
html body header .inner-header .main-menu ul, html body header .inner-header .extra-menu ul {
  height: 100%;
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}
html body header .inner-header .main-menu ul li, html body header .inner-header .extra-menu ul li {
  margin-left: 20px;
  font-size: 15px;
}
html body header .inner-header .main-menu ul li a, html body header .inner-header .extra-menu ul li a {
  display: flex;
  -moz-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  color: white;
  text-decoration: none;
  background-color: transparent;
  padding: 10px 15px;
}
html body header .inner-header .main-menu ul li a:hover, html body header .inner-header .extra-menu ul li a:hover {
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  background-color: #555;
  color: #fff;
}
html body nav.section-menu {
  transform: translateY(-100%);
  opacity: 0;
  filter: alpha(opacity=0);
  overflow: hidden;
  position: fixed;
  top: 0;
  z-index: 9999;
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  background-color: #f4f4f4;
  padding: 10px 20px;
  width: 100%;
}
html body nav.section-menu .swiper {
  padding-right: 10%;
}
html body nav.section-menu.hide-section-menu {
  display: none;
}
html body nav.section-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}
html body nav.section-menu ul li {
  font-size: 14px;
  display: flex;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  list-style: none;
}
html body nav.section-menu ul li.swiper-slide {
  padding: 0;
  width: auto;
}
html body nav.section-menu ul li a {
  text-decoration: none;
  background-color: transparent;
  color: #333;
  padding: 5px 10px;
  display: flex;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
}
html body nav.section-menu ul li a:before {
  content: "\f061";
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  margin-right: 10px;
  display: inline-block;
}
html body nav.section-menu ul li a.active {
  color: white;
}
html body nav.section-menu ul li a.active:before {
  color: white;
}
html body.ready-2 header .inner-header {
  opacity: 1;
  filter: alpha(opacity=100);
}
html body.scroll-down .section-menu {
  opacity: 1;
  filter: alpha(opacity=100);
  transform: translateY(0);
}
html body.scroll-up .section-menu {
  opacity: 0;
  filter: alpha(opacity=0);
  transform: translateY(-100%);
}
@media only screen and (min-width: 992px) {
  html body .mobile-menu, html body .mobile-icons {
    display: none;
  }
  html body header .inner-header .main-menu, html body header .inner-header .extra-menu {
    display: flex;
  }
}

body .dropdown.search {
  display: flex;
  -moz-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
}
body .dropdown.search > .menu-wrap {
  display: flex;
  -moz-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -moz-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  min-height: 50vh;
  width: 100%;
}
body .dropdown.search > .menu-wrap .searchform {
  width: 90%;
}
@media only screen and (min-width: 1030px) {
  body .dropdown.search > .menu-wrap .searchform {
    width: 70%;
  }
}
body .dropdown.search > .menu-wrap .searchform label {
  display: block;
  font-size: 30px;
  margin-bottom: 1.5rem;
}
body .dropdown.search > .menu-wrap .searchform .inner-form {
  display: flex;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -moz-justify-content: flex-end;
  -o-justify-content: flex-end;
  justify-content: flex-end;
  -ms-flex-pack: flex-end;
  -ms-flex-pack: end;
  width: 100%;
}
body .dropdown.search > .menu-wrap .searchform .inner-form input#search-input {
  width: 100%;
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  border-style: none;
  border-radius: 1.3em;
  padding: 0.6em 1.3em;
  background-color: #ffffff;
}
body .dropdown.search > .menu-wrap .searchform .inner-form input#search-input:focus, body .dropdown.search > .menu-wrap .searchform .inner-form input#search-input:focus-visible {
  background-color: #ffffff;
  outline: 3px solid rgba(0, 0, 0, 0.5);
}
body .dropdown.search > .menu-wrap .searchform .inner-form button.submit {
  margin-top: 2rem;
  background-color: rgba(0, 0, 0, 0.1);
  border: none;
  cursor: pointer;
  border-radius: 1.3em;
  padding: 0.3em 1.3em;
}
body .dropdown.search > .menu-wrap .searchform .inner-form button.submit:hover {
  background-color: rgba(0, 0, 0, 0.2);
}/*# sourceMappingURL=right-menu-with-sections.css.map */