/******************************************************

CSN Generell

Generell styling som kan appliceras på samtliga sidor.

******************************************************/

/******************************************************
Sätt minsta fönsterbredd och fixa IE scrollbars
******************************************************/
html {
  min-width: 320px;
  -ms-overflow-style: scrollbar;
}

@media (max-width: 899px) {
  html.csn-lockscroll body {
    overflow: hidden;
  }
}



@media print {
	.sv-template-portlet, .sv-template-layout { 
   	all: initial;
    	all: unset;
   }
}

/******************************************************
Body inställning och minska letter spacing för akkurat
******************************************************/
body {
  overflow-y: scroll;
  background-color: #3c1e5f; /* Safari toolbars tint */
  background-image: -moz-linear-gradient(#fff, #fff);
  background-image: -webkit-linear-gradient(#fff, #fff);
  background-image: -o-linear-gradient(#fff, #fff);
  background-image: -ms-linear-gradient(#fff, #fff);
  background-image: linear-gradient(#fff, #fff);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#ffffff');
}

h1,
h2,
h3,
h4,
h5,
h6,
.csn-formatmall-utfallbar-yta-rubrik-h3,
.csn-formatmall-utfallbar-yta-rubrik-h4,
.csn-formatmall-stor-svart,
.csn-slogan {
  letter-spacing: -0.02em !important;
}

/* .csn-formatmall-brodtext, */
.csn-formatmall-brodsmulemeny {
  letter-spacing: normal;
}

/******************************************************
Rundade hörn
******************************************************/
.csn-rundande-horn-10px {
  border-radius: 10px;
  overflow: hidden;
}
.csn-rundande-horn-5px {
  border-radius: 5px;
  overflow: hidden;
}
/******************************************************
Tvinga bort toppmarginal på innehållsytor
******************************************************/
.pagecontent {
  margin-top: 0 !important;
}

/******************************************************
Sätt minimumhöjd på sida i desktopläge
******************************************************/
@media (min-width: 769px) {
  .csn-sidcontainer {
    min-height: 700px;
  }
}

/******************************************************
Radbrytningar
******************************************************/
.csn-break-word {
  word-wrap: break-word;
}

/******************************************************
Webkit font smoothing
******************************************************/
.csn-webkit-font-smoothing {
  -webkit-font-smoothing: antialiased;
}

/******************************************************
Språk
******************************************************/
.sv-text-portlet[dir="rtl"] * {
  unicode-bidi: inherit;
}

html[lang="ar"] .csn-sida-mittenspalt > .sv-layout,
html[lang="ckb"] .csn-sida-mittenspalt > .sv-layout,
html[lang="fa"] .csn-sida-mittenspalt > .sv-layout,
html[lang="prs"] .csn-sida-mittenspalt > .sv-layout,
html[lang="ps"] .csn-sida-mittenspalt > .sv-layout,
html[lang="yi"] .csn-sida-mittenspalt > .sv-layout,
html[lang="yid"] .csn-sida-mittenspalt > .sv-layout {
  float: right;
  width: 100%;
  box-sizing: border-box;
}

html[lang="ar"] .csn-feedback-betyg-kontextuellt,
html[lang="ckb"] .csn-feedback-betyg-kontextuellt,
html[lang="fa"] .csn-feedback-betyg-kontextuellt,
html[lang="prs"] .csn-feedback-betyg-kontextuellt,
html[lang="ps"] .csn-feedback-betyg-kontextuellt,
html[lang="yi"] .csn-feedback-betyg-kontextuellt,
html[lang="yid"] .csn-feedback-betyg-kontextuellt {
  float: right;
  text-align: right;
}

html[lang="ar"] .csn-feedback-betyg-kontextuellt form,
html[lang="ckb"] .csn-feedback-betyg-kontextuellt form,
html[lang="fa"] .csn-feedback-betyg-kontextuellt form,
html[lang="prs"] .csn-feedback-betyg-kontextuellt form,
html[lang="ps"] .csn-feedback-betyg-kontextuellt form,
html[lang="yi"] .csn-feedback-betyg-kontextuellt form,
html[lang="yid"] .csn-feedback-betyg-kontextuellt form {
  float: right;
}

html[lang="ar"] .csn-senast-publicerad,
html[lang="ckb"] .csn-senast-publicerad,
html[lang="fa"] .csn-senast-publicerad,
html[lang="prs"] .csn-senast-publicerad,
html[lang="ps"] .csn-senast-publicerad,
html[lang="yi"] .csn-senast-publicerad,
html[lang="yid"] .csn-senast-publicerad {
  text-align: right;
}

html[lang="ar"] .csn-breadcrumbs li,
html[lang="ckb"] .csn-breadcrumbs li,
html[lang="fa"] .csn-breadcrumbs li,
html[lang="prs"] .csn-breadcrumbs li,
html[lang="ps"] .csn-breadcrumbs li,
html[lang="yi"] .csn-breadcrumbs li,
html[lang="yid"] .csn-breadcrumbs li {
  float: right;
}

html[lang="ar"] .csn-breadcrumbs li:before,
html[lang="ckb"] .csn-breadcrumbs li:before,
html[lang="fa"] .csn-breadcrumbs li:before,
html[lang="prs"] .csn-breadcrumbs li:before,
html[lang="ps"] .csn-breadcrumbs li:before,
html[lang="yi"] .csn-breadcrumbs li:before,
html[lang="yid"] .csn-breadcrumbs li:before {
  float: right;
  transform: rotate(179deg);
}

html[lang="ar"] .csn-breadcrumbs li:last-child:after,
html[lang="ckb"] .csn-breadcrumbs li:last-child:after,
html[lang="fa"] .csn-breadcrumbs li:last-child:after,
html[lang="prs"] .csn-breadcrumbs li:last-child:after,
html[lang="ps"] .csn-breadcrumbs li:last-child:after,
html[lang="yi"] .csn-breadcrumbs li:last-child:after,
html[lang="yid"] .csn-breadcrumbs li:last-child:after {
  margin-left: 0;
  margin-right: 22px;
}

html[lang="ar"] .csn-feedback-betyg-kontextuellt .csn-betyg-buttons input,
html[lang="ckb"] .csn-feedback-betyg-kontextuellt .csn-betyg-buttons input,
html[lang="fa"] .csn-feedback-betyg-kontextuellt .csn-betyg-buttons input,
html[lang="prs"] .csn-feedback-betyg-kontextuellt .csn-betyg-buttons input,
html[lang="ps"] .csn-feedback-betyg-kontextuellt .csn-betyg-buttons input,
html[lang="yi"] .csn-feedback-betyg-kontextuellt .csn-betyg-buttons input,
html[lang="yid"] .csn-feedback-betyg-kontextuellt .csn-betyg-buttons input {
  margin: 0 0 8px 8px !important;
}

html[lang="ar"] .sv-language-portlet,
html[lang="ckb"] .sv-language-portlet,
html[lang="fa"] .sv-language-portlet,
html[lang="prs"] .sv-language-portlet,
html[lang="ps"] .sv-language-portlet,
html[lang="yi"] .sv-language-portlet,
html[lang="yid"] .sv-language-portlet {
  text-align: right;
}

/******************************************************
Grids
******************************************************/
.sv-grid-12-nostackmargin > .sv-row > .sv-layout,
.sv-grid-12-nostackmargin > .sv-row > .sv-layout ul,
.sv-grid-12-ingen-marginal > .sv-row > .sv-layout {
  margin-bottom: 0 !important;
}

/******************************************************
Tillåt absolut positionering relativt till sidans innehållsyta
******************************************************/
.pagecontent {
  position: relative;
}

/******************************************************
Dekoration för att dölja element
******************************************************/
.csn-dold {
  display: none !important;
}

/******************************************************
Dölj startsidans rubrik
******************************************************/
.csn-startsida-rubrik {
  position: absolute;
  top: -999px;
}

/******************************************************
Länkar
******************************************************/

a:focus,
a:focus-visible,
input:focus,
input:focus-visible,
button:focus,
button:focus-visible,
select:focus,
select:focus-visible,
textarea:focus,
textare:focus-visible,
section[tabindex="-1"]:focus,
label:focus-within,
.csn-hjalpbubbla__ikon:focus,
[role="button"]:focus {
  outline: #719dde solid 2px !important; /* #0077FF solid 2px;*/
  outline-color: #719dde !important; /* #0077FF */
  outline-offset: 3px !important;
  z-index: 1;
  opacity: 1;
}

.csn-sidfot-nedre a:hover, .csn-toppmeny.csn-meny-link:hover {
   color: #dddddd !important;
}


.csn-hide-outlines *:focus,.csn-hide-outlines *:focus-within {
    outline: none!important
}

.admin-link {
  color: #428bca !important;
}

.csn-infobox {
  border-radius: 2px;
}


.csn-infobox a,
.sv-text-portlet a,
.sv-toc-portlet a,
.sv-archive-portlet a,
.sv-predefinedsearch-portlet a,
.sv-nestedlistmenu-portlet a,
.csn-sitemap a:hover {
 /* border-bottom: 0.07em solid;
  text-decoration: none !important;
  padding-bottom: 1px;
   */
 text-decoration: underline;
 text-underline-offset: 3px;
 transition: text-decoration-thickness .1s;
 
}
.csn-infobox a:hover,
.sv-text-portlet a:hover,
.sv-toc-portlet a:hover,
.sv-archive-portlet a:hover,
.sv-predefinedsearch-portlet a:hover,
.sv-nestedlistmenu-portlet a:hover,
.csn-sitemap a:hover {
   text-decoration-thickness: 14% !important;
}

html .pagecontent .csn-infobox p:first-child {
  margin-top: 0;
}

html .pagecontent .csn-infobox p:last-child {
  margin-bottom: 0;
}

.pagecontent .sv-text-portlet a[href^="http"]:after,
.pagecontent .sv-archive-portlet a[href^="http"]:after,
.csn-sidfot-ovre a[href^="http"]:after {
  content: "";
  display: inline-block;
  background-image: url("/images/18.62fc105b15ddecaf46f166ea/ic_launch_turkos_24px.svg");
  background-size: 14px;
  background-repeat: no-repeat;
  width: 14px;
  height: 14px;
  margin-left: 4px;
  position: relative;
  vertical-align: top;
  top: 6px;
}

html .pagecontent .csn-infobox a[href^="http"]:after {
  background-image: url("/images/18.62fc105b15ddecaf46f166e8/ic_launch_black_24px.svg");
  opacity: 0.8;
}

html .csn-sidfot-ovre a[href^="http"]:after {
  background-image: url("/images/18.62fc105b15ddecaf46f166e8/ic_launch_black_24px.svg");
  opacity: 0.6;
}

/******************************************************
Disabled Elements med tooltip
******************************************************/
.disabled-element {
  cursor: not-allowed !important;
  opacity: 0.4 !important;
}

.disabled-element.disabled-element--keep-opacity {
  opacity: 1 !important;
}

.disabled-element * {
  cursor: not-allowed !important;
  opacity: 1 !important;
}

.csn-knapp-etjanst {
  cursor: not-allowed !important;
  opacity: 1 !important;
}

.tooltip {
  background: #ffe4a4;
  font-size: 1rem;
  color: #000;
  position: absolute;
  display: block;
  margin-right: 16px;
  padding: 8px;
  border-radius: 4px;
  opacity: 1;
  z-index: 15;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  cursor: pointer;
}

.tooltip:before {
  background-image: url("/images/18.7ec678a615ad7334aa9d12/ic_info_outline_black_24px.svg");
  display: inline-block;
  vertical-align: middle;
  content: "";
  background-size: 16px 16px;
  width: 16px;
  height: 16px;
  margin-right: 0.5rem;
  line-height: 1.5;
}

@media screen and (max-width: 480px) {
  .tooltip {
    left: 16px !important;
  }
}

/******************************************************
Bildzoom hover
******************************************************/
.csn-bildzoom-hover a {
  -webkit-transition: opacity 0.5s ease;
  -moz-transition: opacity 0.5s ease;
  -o-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
}

.csn-bildzoom-hover a img {
  -webkit-backface-visibility: hidden;
  -webkit-transition: transform 0.4s ease;
  -moz-transition: transform 0.4s ease;
  -o-transition: transform 0.4s ease;
  transition: transform 0.4s ease;
}

.csn-bildzoom-hover a:hover img {
  transform: scale(1.05);
}

.csn-bildzoom-hover .disabled-element a:hover img {
  transform: initial;
}

.csn-test-focus {
    outline: none!important;
    border: 2px solid #5cb3fd;
}
.sv-image-portlet a {
  display: inline-block;
  overflow: hidden;
  width: 100%;
}

/******************************************************
Laddningsanimation
******************************************************/
.csn-loading {
  margin: 70px auto 0;
  width: 70px;
  text-align: center;
}

.csn-loading > div {
  width: 18px;
  height: 18px;
  background-color: #bbb;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  float: left;
  margin-right: 5px;
}

.csn-loading .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.csn-loading .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}

@keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/******************************************************
Visa rubriknivåer i redaktörsgui
******************************************************/
.sv-editing-mode .csn-sidcontainer .sv-text-portlet h1:after,
.sv-editing-mode .csn-sidcontainer .sv-text-portlet h2:after,
.sv-editing-mode .csn-sidcontainer .sv-text-portlet h3:after,
.sv-editing-mode .csn-sidcontainer .sv-text-portlet h4:after,
.sv-editing-mode .csn-utfallbar-yta-h2 .sv-toolbar-title:after,
.sv-editing-mode .csn-utfallbar-yta-h3 .sv-toolbar-title:after,
.sv-editing-mode .csn-utfallbar-yta-h4 .sv-toolbar-title:after {
  font-size: 12px;
  font-weight: normal;
  color: #428bca;
  white-space: nowrap;
  margin-left: 8px;
  text-decoration: none !important;
}

.sv-editing-mode .csn-sidcontainer .sv-text-portlet h1 br,
.sv-editing-mode .csn-sidcontainer .sv-text-portlet h2 br,
.sv-editing-mode .csn-sidcontainer .sv-text-portlet h3 br,
.sv-editing-mode .csn-sidcontainer .sv-text-portlet h4 br,
.sv-editing-mode .csn-utfallbar-yta-h2 .sv-toolbar-title br,
.sv-editing-mode .csn-utfallbar-yta-h3 .sv-toolbar-title br,
.sv-editing-mode .csn-utfallbar-yta-h4 .sv-toolbar-title br {
  display: none;
}

.sv-editing-mode .csn-sidcontainer .sv-text-portlet h1:after {
  content: "(H1)";
}

.sv-editing-mode .csn-sidcontainer .sv-text-portlet h2:after,
.sv-editing-mode
  .csn-sidcontainer
  .csn-utfallbar-yta-h3
  .sv-toolbar-title:after {
  content: "(H2)";
}

.sv-editing-mode .csn-sidcontainer .sv-text-portlet h3:after,
.sv-editing-mode
  .csn-sidcontainer
  .csn-utfallbar-yta-h3
  .sv-toolbar-title:after {
  content: "(H3)";
}

.sv-editing-mode .csn-sidcontainer .sv-text-portlet h4:after,
.sv-editing-mode
  .csn-sidcontainer
  .csn-utfallbar-yta-h4
  .sv-toolbar-title:after {
  content: "(H4)";
}

/******************************************************
Inaktivera portlet cover i redaktörsgui
******************************************************/
.sv-editing-mode .csn-admin-disable-portlet-cover .sv-portlet-cover {
  display: none !important;
}

/******************************************************
Dölj labels på tillgängligt sätt
******************************************************/
label.svhidden {
  position: absolute;
  top: -9999px;
  word-break: break-all;
  display: inline !important;
}
/******************************************************
Ta bort fokus Brainsum när aria är hidden
******************************************************/
#cconsent-bar[aria-hidden="true"] div
{display:none;}
#cconsent-modal[aria-hidden="true"] div
{display:none;}

/******************************************************
Visa vågen som bakgrundsbild
******************************************************/
.csn-wave {
	/*background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="2325" height="593" viewBox="0 0 2325 593" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.249675 393L14.8413 0C165.55 5.59562 248.494 40.3614 316.061 69.396C317.289 69.9238 318.506 70.4476 319.714 70.9673C364.181 90.0978 395.701 103.658 474.198 106.573C552.694 109.487 585.133 98.3015 630.896 82.521C632.139 82.0924 633.392 81.6603 634.656 81.2251C704.19 57.2808 789.483 28.7615 940.192 34.3571C1090.9 39.9527 1173.84 74.7185 1241.41 103.753C1242.64 104.281 1243.86 104.805 1245.06 105.324C1289.53 124.455 1321.05 138.015 1399.55 140.93C1478.05 143.844 1510.48 132.659 1556.25 116.878L1556.41 116.821C1557.6 116.411 1558.8 115.998 1560.01 115.582C1629.54 91.6379 1714.83 63.1186 1865.54 68.7142C2016.25 74.3098 2099.2 109.076 2166.76 138.11C2167.99 138.638 2169.21 139.162 2170.42 139.681C2214.88 158.812 2246.4 172.373 2324.9 175.287L2316.82 393H2317V593H0V399.725V393H0.249675Z" fill="white"/></svg>');
    background-image: url(/images/18.2f748eaa18bf3b67f4c649/wave.svg);
   background-image: url(/images/18.576bb93d18c7ec11015210/csn_wave.png);
   */
   background-image: url(/images/18.576bb93d18c7ec11015212/wavesvg.svg);

   background-repeat: no-repeat no-repeat;
	background-position: center bottom;
	/*background-size: contain;*/
   background-size: auto;
	background-repeat: no-repeat;
   padding:0 !important;
}

.csn-footer-logo {
   float: right;
}
/******************************************************
Klass för att hantera marginaler responsivt för sv
******************************************************/
.csn-responsive-marginal{
   margin: 2.5rem 0 1rem !important;
}

@media screen and (min-width: 398px) {
   .csn-responsive-marginal {
      margin: 1.5rem 0 !important;
   }
}

@media screen and (min-width: 768px) {
   .csn-responsive-marginal {
      margin: 2rem 0 !important;
   }
}

@media screen and (min-width: 914px) {
   .csn-responsive-marginal {
      margin: 3.625rem 0 !important;
   }
}

