/* Bas-latin (snabbast) */
@font-face{
  font-family:"Inter";
  src:url("/download/18.5a46f2f4199cfd0402d76e0e/1760890654079/Inter-VariableFont_opsz,wght.woff2") format("woff2");
  font-weight:100 900;;
  font-style:normal;
  font-display:swap;
  unicode-range: U+0000-00FF, U+2000-206F, U+20A0-20CF;
}
/* Latin-ext (laddas bara när tecknen behövs) */
@font-face{
  font-family:"Inter";
  src:url("/download/18.5a46f2f4199cfd0402d76e0e/1760890654079/Inter-VariableFont_opsz,wght.woff2") format("woff2");
  font-weight:100 900;;
  font-style:normal;
  font-display:swap;
  unicode-range: U+0100-024F, U+1E00-1EFF;
}


/* Basstack + optisk storlek + undvik fejkade stilar */
:root {
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
               Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}
   
html { font-optical-sizing: auto; }
body { font-family: var(--font-sans); font-synthesis: none; }
   

@font-face {
  font-family: "Font Awesome 6 Free";
  font-style: normal;
  font-weight: 900; /* Solid */
  font-display: swap;
  src: url('/download/18.5a46f2f4199cfd0402d76e0c/1760890653932/fa-solid-900.ttf') format('truetype');
}


  

.h1-hero {
background-color: #002365;
  color: #fff;
  border-radius: 0 20rem 20rem 0;
  display: inline-flex;          /* inline + flex */
  align-items: center;           /* vertikal centrering av innehåll */
  font-size: clamp(2rem, 6vw, 3rem);
  line-height: 1.2;
  margin-bottom: 0;
  max-width: 40ch;
  padding: 1.5em;
}




.sv-font-sidfot-lankar-med-pil-vit:after {
   margin-left: 0.75em;
   font-size: 0.60em;
   vertical-align: middle;
	font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f105"; 
   
}
.sv-font-sidfot-lankar-med-pil-svart:after {
   margin-left: 0.75em;
   font-size: 0.60em;
   vertical-align: middle;
	font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f105"; 
   
}

.relateradInformation{
padding-bottom: 5px;   
   
}



.dropbtn {
    color: #000;
    border: none;
    cursor: pointer;
    font-weight: 400;
    font-size:100%;
    font-family:'Roboto';
   
    background:#ffffff;
}

.dropbtn:hover, .dropbtn:focus {
    background-color: #ffffff;
}

   
.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    min-width: 400px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}


.show {display:block;}
   
   

.cookiescript_link a {
    text-decoration: underline;
}

   .search-box{
padding-left:5px;
height:48px;
width:70%;
color:#000000;
font: 14px/1.0 'Inter','PT Sans', arial, helvetica, sans-serif;
}


.search-box-select {
width:100%;
padding:15px;
height:48px;
color:#000000;
font: 16px/1.0 'Inter','PT Sans', arial, helvetica, sans-serif;
}


.search-box-button {
border:none;
cursor:pointer;
text-align:center;
color:#fff;
background: #002365;
text-transform: uppercase;
font: 16px/1.0 'Inter','PT Sans', arial, helvetica, sans-serif;
}


.search-box-button {
	border:none;
   background:none;
}
  

 

.search-box {
   border:0;
   box-sizing: border-box;
	color:#000000 !important;
	font-family:'Inter','PT Sans', arial, helvetica, sans-serif;   
	font-size:100%;
   padding: 29px 20px 20px 5px;
   border-bottom:1px solid #666666;
    outline: 0;
   -webkit-box-shadow: none!important;
    box-shadow: none!important;
		
}

    
.search-box::placeholder {
font-family:'Inter','PT Sans', arial, helvetica, sans-serif;   font-size:100%;

    
}
   
   .search-box-button::before {
     font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #555555;  /* Grå färg som matchar sökikonen */
    font-size: 24px;
    transition: color 0.3s ease;
    content: '\f002';  /* Laptop med kod */
    /* Gör cirkeln */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;  /* Storlek på cirkeln */
    height: 70px;
    border: 2px solid #555555;  /* Kantlinje */
    border-radius: 50%;  /* Gör den cirkulär */
    background-color: transparent;  /* Bakgrundsfärg om du vill ha */
}

/* Top Action Links */
.sol-top-action-links {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Top Action Button */
.sol-top-action-button{
   margin-left:1em;
   margin-right:1em;
   appearance:none;
   background:0 0;
   border:none;
 	display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   font-size:1rem!important;
   padding:20px 20px 20px 20px; 
   font-family:'Inter','PT Sans', arial, helvetica, sans-serif;
   font-weight:500;
   text-align:center;
   color:#555555;
   cursor:pointer;
   text-decoration:none;
   line-height:normal;
   min-width:70px;
   position:relative;
   white-space:nowrap
     

}


/* Länkar */
a {
    color: var(--link-color);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: #29a2f7; /* Samma färg vid hover för enhetlighet */
}


   /* Grundläggande stil för alla ikoner */
.icon-button {
    border: 2px solid var(--border-color);
    background-color: transparent;
    height: var(--circle-size);
    width: var(--circle-size);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

/* Gemensam ikonstil */
.icon-button::before {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: var(--icon-size);
    color: var(--default-icon-color);
    transition: color 0.3s ease;
    content: attr(data-icon); /* Hämtar ikonens unicode från HTML */
   
}

/* Hover-effekter */
.icon-button:hover {
    background-color: #002365;
    border-color: #002365;
}

.icon-button:hover::before {
    color: #002365;
}

/* Specifika ikoner */
.e-tjanster::before { content: '\f5fc'; } /* Laptop-kod */
.lov-ledighet::before { content: '\f274'; } /* Kalender-check */
.skolskjuts::before { content: '\f207'; } /* Buss */
.skolmatsedel::before { content: '\f2e7'; } /* Bestick */
.korttidsvikariat::before { content: '\f508'; } /* Person med slips */
.vanliga-fragor::before { content: '\f059'; } /* Frågetecken */
.anhorigstod::before { content: '\f4c4'; } /* Hands helping (stöd) */
.fardtjanst::before { content: '\f1ba'; } /* Taxi */
.aldre::before { content: '\f182'; } /* User nurse (äldreomsorg) */
.barn::before { content: '\f77c'; } /* Baby */
.familjehem::before { content: '\e065'; } /* House user (familjehem) */
.boenden-aldre::before { content: '\e3af'; } /* House chimney */
.hitta-bostad::before { content: '\f689'; } /* Hus med check */
.atervinning::before { content: '\f1b8'; } /* Återvinning */
.bygglov::before { content: '\f807'; } /* Bygg (hjälm) */
.vatten-avlopp::before { content: '\e005'; } /* Vattenkran */
.natur-parker::before { content: '\f1bb'; } /* Träd och stad */
.kollektivtrafik::before { content: '\f55e'; } /* Tunnelbana/tåg */  
 .film-bio::before { content: '\f008'; } /* Filmrulle */
.turistinformation::before { content: '\f5a0'; } /* Karta med markering */
.friluftsliv-motion::before { content: '\f6ec'; } /* Person som vandrar */
.jobba-hos-oss::before { content: '\f0b1'; } /* Portfölj */
.arbetssokande::before { content: '\f508'; } /* Person med slips */
.foretag::before { content: '\f1ad'; } /* Byggnad */
.upphandlingar::before { content: '\f56c'; } /* Kontraktsdokument */
.tillstand-regler::before { content: '\f24e'; } /* Vågen (rättvisa, lagar) */
.mark-lokaler::before { content: '\f5a0'; } /* Kartmarkör */
.moten-protokoll::before { content: '\f15c'; } /* Dokument med text */
.organisation::before { content: '\f0e8'; } /* Organisationsstruktur */
.kommunledning::before { content: '\f66f'; } /* Stadshus / parlament */
.kommunfakta::before { content: '\f080'; } /* Statistik / stapeldiagram */
.krisinformation::before { content: '\f071'; } /* Varningstriangel */
.facebook::before {content: '\f09a'; font-family: 'Font Awesome 5 Brands'; }
.instagram::before {content: '\f16d'; font-family: 'Font Awesome 5 Brands'; }
.sakerhet-beredskap::before { content: "\f3ed"; } /* shield-halved (tid. shield-alt) */
.kartportal::before        { content: "\f5a0"; } /* map-location-dot (tid. map-marked-alt) */
.jobba-hos-oss::before     { content: "\f0b1"; } /* briefcase */
.bygglov::before           { content: "\f573"; } /* file-signature */
.e-tjanster::before        { content: "\f109"; } /* laptop */
.turism-evenemang::before  { content: "\f5ca"; } /* umbrella-beach */
.synpunkter-fel::before    { content: "\f7d9"; } /* screwdriver-wrench (tid. tools) */
.fullmaktige::before       { content: "\f66f"; } /* landmark */
.e-tjanster::before        { content: "\f5fc"; } /* laptop */
.barnomsorg::before        { content: "\f1ae"; } /* children (alt: school) */
.bygglov::before           { content: "\f1ad"; } /* building */
.batplats::before          { content: "\f13d"; } /* anchor */
.serveringstillstand::before { content: "\f57b"; } /* martini-glass */
.bulletin::before { content: "\f08d"; } /* anslagstavla */
.ansokan::before            { content: "\f044"; } /* pen-to-square / edit */
.kursutbud::before          { content: "\f19d"; } /* graduation-cap */
.studieinformation::before  { content: "\f05a"; } /* info-circle */
.industriell-symbios::before{ content: "\f1b8"; } /* recycle */
.social-symbios::before     { content: "\f2b5"; } /* handshake */
.projekt::before            { content: "\f0ae"; } /* tasks */
/* Bas: se till att rätt font används */
.fa-solid::before { font-family: "Font Awesome 6 Free"; font-weight: 900; }
.fa-brands::before { font-family: "Font Awesome 6 Brands"; font-weight: 400; }

/* Nya klasser */
.csn::before                 { content: "\f4d3"; } /* piggy-bank */
.arbetsformedlingen::before  { content: "\f0b1"; } /* briefcase */
.skolverket::before          { content: "\f549"; } /* school */
.integrationen::before       { content: "\f12e"; } /* puzzle-piece */
.sociala-medier::before      { content: "\f292"; } /* hashtag */
.vasttrafik::before          { content: "\f207"; } /* bus */
.youtube::before             { content: "\f167"; font-family: "Font Awesome 6 Brands"; font-weight: 400; } /* youtube */


.contactIcon:before{
   margin-right: 0.5em;
   font-size: 1.5em;
   vertical-align: middle;
	font-family: "Font Awesome 6 Free"; font-weight: 600; content: "\f2bb";    
  
 
}


/* Specifika ikoner */

/* Grundläggande stil för alla ikoner */
.icon-circle::before {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #666666;  /* Standardfärg */
    font-size: 32px;
    transition: all 0.3s ease; /* Smidig övergång */
    
    /* Skapar en cirkel */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    border: 2px solid #666666;
    border-radius: 50%;
    background-color: transparent;
    margin-bottom:0.5em;
}

/* Hover-effekt: Ändrar färg till blå */
.icon-circle:hover::before {
    background-color: #002365;  /* Blå bakgrund vid hover */
    color: #ffffff;  /* Ändrar ikonfärgen till vit */
    border-color: #002365;  /* Ändrar kantlinjefärgen */
}

/* Evenemang (Kalender-ikon) */
.evenemang::before {
    content: '\f073'; /* FontAwesome: fa-solid fa-calendar */
}

/* Bibliotek (Bok-ikon) */
.bibliotek::before {
    content: '\f02d'; /* FontAwesome: fa-solid fa-book */
}

/* Recover (Återställ/Återvända-ikon) */
.recover::before {
    content: '\f1b8'; /* FontAwesome: fa-solid fa-undo */
}

/* Anslagstavla (Nyheter/Anteckning-ikon) */
.anslagstavla::before {
    content: '\f303'; /* FontAwesome: fa-solid fa-thumbtack */
}

/* Simhall (Våg-ikon för vatten) */
.simhall::before {
    content: '\f5c5'; /* FontAwesome: fa-solid fa-water */
}

/* Lediga jobb (Kort-ikon för jobbannonser) */
.ledigajobb::before {
    content: '\f0b1'; /* FontAwesome: fa-solid fa-briefcase */
}

/* E-tjänster */
.e-services::before {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #555555;  /* Grå färg som matchar sökikonen */
    font-size: 24px;
    transition: color 0.3s ease;
    content: '\f5fc';  /* Laptop med kod */
    /* Gör cirkeln */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;  /* Storlek på cirkeln */
    height: 70px;
    border: 2px solid #555555;  /* Kantlinje */
    border-radius: 50%;  /* Gör den cirkulär */
    background-color: transparent;  /* Bakgrundsfärg om du vill ha */
    margin-bottom:0.5em;
}

/* Lyssna */
.listen::before {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #555555;  /* Grå färg som matchar sökikonen */
    font-size: 24px;
    transition: color 0.3s ease;
    content: '\f025';  /* Hörlurar */
    
    /* Gör cirkeln */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;  /* Storlek på cirkeln */
    height: 70px;
    border: 2px solid #555555;  /* Kantlinje */
    border-radius: 50%;  /* Gör den cirkulär */
    background-color: transparent;  /* Bakgrundsfärg om du vill ha */
    margin-bottom:0.5em;
	}
   
   .listen:hover::before, .contact:hover::before, .e-services:hover::before, .search-box-button:hover::before  {
    background-color: #002365;  /* Ljusblå bakgrund vid hover */
    color: #ffffff;  /* Ändra ikonfärgen till vit */
    border-color: #002365;  /* Ändra kantlinjefärgen */
}


/* Kontakt */
.contact::before {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #555555;  /* Grå färg som matchar sökikonen */
    font-size: 24px;
    transition: color 0.3s ease;
    content: '\f0e0';  /* Brev */
   
    /* Gör cirkeln */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;  /* Storlek på cirkeln */
    height: 70px;
    border: 2px solid #555555;  /* Kantlinje */
    border-radius: 50%;  /* Gör den cirkulär */
    margin-bottom:0.5em;
    background-color: transparent;  /* Bakgrundsfärg om du vill ha */
}

   .xezF9ru3TE5SSITf2YSh {
    position: fixed; 
    z-index: 2147483647;
    background-color: transparent!important;
    top: 80px!important;
 
    right: 0;
    bottom: 0;
    left: 0;
   width:100%;
  /* padding-top:50px!important;*/
   padding-left:0px!important;
   padding-right:0px!important;
    
    overflow-x: hidden;
    overflow-y: auto;
}
   
/* Brandskala – bas + tints av #002365 */
:root {
  --brand-900: #002365; /* bas */
  --brand-800: #26447C; /* +15% tint */
  --brand-700: #4C6593; /* +30% tint */
  --brand-600: #7386AA; /* +45% tint */
  --brand-500: #99A7C1; /* +60% tint */
}

.SBnE8X_5uU5yUCP4RBVU  {
  color: #ffffff !important;
  text-decoration: none;
  line-height: 1.5;
  background: var(--brand-900); /* tidigare #0067af */
  min-height: 0px !important;
}

.SBnE8X_5uU5yUCP4RBVU ul {
  padding-left: 0px !important;
  font-size: 16px;
  background: var(--brand-800); /* tidigare #0180d9 */
}

.SBnE8X_5uU5yUCP4RBVU ul li {
  font-size: 16px;
  background: var(--brand-700); /* tidigare #0180d9 */
}

.SBnE8X_5uU5yUCP4RBVU ul li a {
  margin-left: 16px;
  font-size: 16px;
}

.SBnE8X_5uU5yUCP4RBVU ul li li a {
  margin-left: 32px;
  font-size: 16px;
}

.SBnE8X_5uU5yUCP4RBVU ul li li li a {
  margin-left: 48px;
  font-size: 16px;
}

.SBnE8X_5uU5yUCP4RBVU ul li li {
  font-size: 16px;
  background: var(--brand-600); /* tidigare #0491f3 */
}

.SBnE8X_5uU5yUCP4RBVU ul li li li {
  font-size: 16px;
  background: var(--brand-500); /* tidigare #29a2f7 */
}

 /* ==== Grundstil ==== */
.sol-expandable {
  --sol-accent: #002365;
  --sol-font: 'Inter','PT Sans', arial, helvetica, sans-serif;

  position: relative;
  margin-bottom: 10px;
  background: var(--sol-accent);
  border-radius: 10px;       /* rundade hörn */
  overflow: hidden;          /* klipp så att bakgrunden/ikonen följer rundningen */
  color: #fff;               /* vit text som standard i komponenten */
}

/* ==== Header (knappen) ==== */
.sol-expandable__header {
  appearance: none;
  background: transparent;   /* behållarens bakgrund lyser igenom */
  border: 0;
  position: relative;
  display: block;
  width: 100%;
  padding: 18px 60px 18px 20px;
  cursor: pointer;
  text-align: left;
  font: 700 100%/1.4 var(--sol-font);
  color: #fff;               /* vit rubriktext */
}

/* Ikonfältet till höger (+ default) */
.sol-expandable__header::after {
  content: "\f067";
  font-family: "Font Awesome 6 Free";
  font-weight: 300;
  font-size: 1.25rem;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;               /* vit ikon */
  background: #002365;
  /* Ingen border-radius här – overflow:hidden på behållaren sköter rundningen */
}

/* Aktivt läge (– ikon) via klass eller aria-expanded */
.sol-expandable__header--active::after,
.sol-expandable__header[aria-expanded="true"]::after {
  content: "\f068";
}

/* ==== Innehåll ==== */
.sol-expandable__content,
.sol-expandable .sv-decoration-content {
  display: none;
  padding: 10px 20px;
  color: #fff;               /* vit brödtext */
}

/* Visa innehåll när headern är aktiv och ligger precis före content */
.sol-expandable__header--active + .sol-expandable__content,
.sol-expandable__header[aria-expanded="true"] + .sol-expandable__content {
  display: block;
}

/* (Valfritt) Fokus/hover för bättre tillgänglighet */
.sol-expandable__header:focus-visible,
.sol-expandable__header:hover {
  outline: 2px solid rgba(255,255,255,0.35);
  outline-offset: 2px;
}

@media (prefers-color-scheme: dark) {
   

/* Expandable Header */
.sol-expandable__header {
    appearance: none;
    background: transparent;
    border: none;
    position: relative;
    padding: 18px 60px 18px 20px;
    font-size: 1.125rem;
    font-weight: 700;
    font-family: quicksand, sans-serif;
    cursor: pointer;
    width: 100%;
    text-align: left;
    margin-bottom: -1px;
    color: var(--text-color); /* Ljus textfärg */
}

/* Expandable Box */
.sol-expandable {
    border: 1px solid var(--border-color); /* Mörk kantlinje */
    position: relative;
    margin-bottom: 10px;
    background: var(--background-color); /* Bakgrundsfärg */
    border-radius: 10px;
}

/* Expandable Content */
.sol-expandable .sv-decoration-content,
.sol-expandable__content {
    padding: 10px 20px;
    display: none;
    color: var(--text-color); /* Textfärg */
    background-color: #2f2f2f; /* Lite ljusare bakgrund för kontrast */
    border-radius: 0 0 10px 10px;
}

/* Ikon för att expandera (plustecken) */
.sol-expandable__header::after {
    display: inline-block;
    font-size: 1.25rem;
    font-family: "Font Awesome 6 Free";
    font-weight: 300;
    content: "\f067";    
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 55px;
    background-color: var(--link-color); /* Länkfärg som bakgrund för ikonen */
    display: flex;
    color: #ffffff; /* Vit ikonfärg */
    align-items: center;
    justify-content: center;
    border-radius: 0 10px 10px 0;
}

/* Ikon för att kollapsa (minustecken) */
.sol-expandable__header--active::after {
    font-family: "Font Awesome 6 Free";
    font-weight: 300;
    content: "\f068";
    border-bottom-right-radius: 0;
}

}

   .env-nav--menubar .env-nav__link {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: #002365;
    font-weight: 700;
    font-size: 85%;
}