.sv-cookie-consent-banner {
   background-color:#eee !important;
}
.sv-cookie-consent-banner * {
    font-family: 'Roboto';  
}
.sv-cookie-consent-banner .env-button--primary {
    background-color:#b2006e !important;
   border-color:#b2006e !important;
}
.sv-cookie-consent-banner .env-button--ghost {
    background-color:#fff !important;
   border-color:#b2006e !important;
   color:#b2006e!important;
}
.sv-cookie-consent-banner a {    
   color:#b2006e!important;
}
.sv-readspeaker_expandingplayer-portlet {
   width:70px;
   height:51px;
}
.sv-readspeaker_expandingplayer-portlet a {
   display:flex;
   text-decoration:none;
   justify-content:center;
   flex-wrap:wrap;
   align-items:center;
   font-size:12px;
}
.sv-readspeaker_expandingplayer-portlet img {
   width:35px;
   margin-bottom:7px;
}
.sv-readspeaker_expandingplayer-portlet .rsbtn {
   margin-left:-100px;
}



/* TOP MENU */
.mobile-navigation {
   display:none;
}
.searchbox-startpage {
   padding-top:15em;
}
.breadcrumb-flytta ul a {
      text-decoration:none !important;
      color:#b2006e;
      font-weight:bold;      
   }
.main-navigation ul {
	display: flex;
	justify-content: center;
   margin-top: auto;
}
.main-navigation ul li {
	margin:0 17px;
}
.kommun-logo {
   position:absolute;
   margin-top:-100px;
   margin-left:138px;
}
.kommun-logo img {
   width:75% !important;
}
#menutext {
   font-size:11px;
}

nav {
   list-style:none;
   margin:0;
   padding:0;
   text-align:center;
   width: 100%;
}

nav div {
	width: 100%;
}

nav li{
    display:inline;
}

nav.header-group a{
   display:inline-block;
	margin-left: 0;
}
.active-tranas-kommun {
   color:#fff;
   text-decoration:none;
   font-size:1.125em;
   font-family:roboto,sans-serif;
}
.active-tranas-kommun::after {
   content: '';
    display: block;
    width: 100% !important;
   margin-top:2px;
    height: 4px;
    background-color: rgba(255, 255, 255, 0.5);
}


.sv-font-menytext-rb-regular-400 {
   padding-top: 1.6em;
   padding-bottom: 0.6em;
   display: inline-block;
}

.top-menu-active-page {
   display: inline-block;
   font-family: Roboto Condensed,sans-serif;
	font-weight: bold;
   font-stretch: condensed;
	font-style: normal;
	font-size: 1.5em;
   letter-spacing: normal;
   text-align: center;
   box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
   text-decoration: none;
   padding-top: 1.4em;
   padding-bottom: 1.2em;
}

.li-for-active-page {
   padding-top: 0;
}

.flytta-hit {
   border-top: 5px solid #B2006E;
   color: #333;
   background: url(/images/18.61963f91177b0111e0d384/1616077538076/arrow-pink-small.png) no-repeat bottom;
}

.tranas-kommun {
   border-top: 5px solid #097b6e;
   color: #097b6e;
   background: url(/images/18.61963f91177b0111e0d2b1/1615461748241/arrow-up-green.png) no-repeat bottom;
}

.naringsliv {
   border-top: 5px solid #00667e;
   color: #00667e;
   background: url(/images/18.61963f91177b0111e0d2b0/1615461748195/arrow-up-blue.png) no-repeat bottom;
}

.besok-upplev {
   border-top: 5px solid #5d1e69;
   color: #5d1e69;
   background: url(/images/18.61963f91177b0111e0d2b3/1615461748326/arrow-up-purple.png) no-repeat bottom;
}

.flytta-hit-hover:hover {
   background: url(/images/18.61963f91177b0111e0d544/1616687915220/bakgrund-hover-flytta-hit.png) no-repeat top;
   background-repeat: repeat-x;
   color: #333;
}

.tranas-kommun-hover:hover {
   background: url(/images/18.61963f91177b0111e0d540/1616685855806/bakgrund-hover-tranas-kommun.png) no-repeat top;
   background-repeat: repeat-x;
   color: #097b6e;   
}

.naringsliv-hover:hover {
   background: url(/images/18.61963f91177b0111e0d543/1616687915175/bakgrund-hover-naringsliv.png) no-repeat top;
   background-repeat: repeat-x;
   color: #00667e;   
}

.besok-upplev-hover:hover {
   background: url(/images/18.61963f91177b0111e0d541/1616687531529/bakgrund-hover-besok-och-upplev.png) no-repeat top;
   background-repeat: repeat-x;
   color: #5d1e69;   
}



/* END TOP MENU */

.header-parent {
   display:flex;
   justify-content: space-between;
   height: 96px;
}

/* LOGO CONTAINER */
.header-parent .header-group:first-child {
   z-index: 10;
   position: relative;
   xleft: -10px;
}
/* END LOGO CONTAINER */

.skip-to-content {
   position: absolute;
   top: -1000px;
   left: 10px;
   background: #333333;
   text-decoration: none;
   font-size: 100%;
   padding: 10px 20px;
   border-radius: 15px;
}

.skip-to-content:focus{
   top:20px;
   left: 200px;
   color: #fff;
   z-index: 2;
}

.header-icons {
   display:flex;
   align-items:center;   
}

.header-icon {
   background-color:#fff;
   border:none;
   display:flex;
   justify-content:center;
   flex-wrap:wrap;   
}

.header-icon img {
   height:28px;
   margin-bottom: 7px;
   flex-basis:100%;
}

.header-icon span {
   align-self:center;
   font-size: 12px;
}

#bapluslogo span {
   font-size: 0.75em;
}

.header-group {
   display: flex;
   justify-content: center;   
}
.header-group:first-child img {
   width:165px;
   position:absolute;
   margin-left:20px;
   margin-top:30px;
}
.header-group:nth-child(2) {
   margin-left:176px;
}
.header-group:nth-child(3) {
   padding-right:20px;
}
.header-icon div {
   align-self:center;
   height:50px;
}

.link-icon {
   text-decoration:none;
}

/* SUB-MENU */

.sv-template-kampanjsida-flytta-hit header .sub-navigation .sub-menu-padding {
   background-color: #b2006e;
}

.sv-template-kampanjsida-tranas-kommun header .sub-navigation .sub-menu-padding {
   background-color: #097b6e;
}

.sv-template-kampanjsida-naringsliv header .sub-navigation .sub-menu-padding {
   background-color: #00667e;
}

.sv-template-kampanjsida-besok-och-upplev header .sub-navigation .sub-menu-padding {
   background-color: #5d1e69;
}

.sub-navigation .submenu-active {
	text-decoration: underline solid 4px !important;
   text-decoration-color: rgba(255,255,255, 0.5) !important;
	text-underline-offset: 6px !important;   
}

/*
html.sv-template-standardsida-flytta-hit header .sub-navigation .submenu-active,
html.sv-template-landningssida1-flytta-hit header .sub-navigation .submenu-active,
html.sv-template-landningssida2-flytta-hit header .sub-navigation .submenu-active,
html.sv-template-startsida-valkommen header .sub-navigation .submenu-active,
html.sv-template-landningssida1-valkommen header .sub-navigation .submenu-active,
html.sv-template-landningssida2-valkommen header .sub-navigation .submenu-active,
html.sv-template-kampanjsida-flytta-hit header .sub-navigation .submenu-active,
html.sv-template-mall-med-brodsmulor-bred-flytta-hit header .sub-navigation .submenu-active {
	text-decoration: underline solid 4px #d980b7 !important;
	text-underline-offset: 5px !important;
}

html.sv-template-standardsida-tranas-kommun header .sub-navigation .submenu-active,
html.sv-template-landningssida1-tranas-kommun header .sub-navigation .submenu-active,
html.sv-template-landningssida2-tranas-kommun header .sub-navigation .submenu-active,
html.sv-template-kampanjsida-tranas-kommun header .sub-navigation .submenu-active,
html.sv-template-mall-med-brodsmulor-bred-tranas-kommun header .sub-navigation .submenu-active {
	text-decoration: underline solid 4px #84bdb7 !important;
	text-underline-offset: 5px !important;
}

html.sv-template-standardsida-naringsliv header .sub-navigation .submenu-active,
html.sv-template-landningssida1-naringsliv header .sub-navigation .submenu-active,
html.sv-template-landningssida2-naringsliv header .sub-navigation .submenu-active,
html.sv-template-kampanjsida-naringsliv header .sub-navigation .submenu-active,
html.sv-template-mall-med-brodsmulor-bred-naringsliv header .sub-navigation .submenu-active {
	text-decoration: underline solid 4px #80b3bf !important;
	text-underline-offset: 5px !important;
}

html.sv-template-standardsida-besok-och-upplev header .sub-navigation .submenu-active,
html.sv-template-landningssida1-besok-och-upplev header .sub-navigation .submenu-active,
html.sv-template-landningssida2-besok-och-upplev header .sub-navigation .submenu-active,
html.sv-template-kampanjsida-besok-och-upplev header .sub-navigation .submenu-active,
html.sv-template-mall-med-brodsmulor-bred-besok-och-upplev header .sub-navigation .submenu-active {
	text-decoration: underline solid 4px #ae8fb4 !important;
	text-underline-offset: 5px !important;
}

*/

.sub-menu-padding {
    list-style:none;
    margin:0;
   padding-top: 1.3em;
   padding-bottom: 1em;
}

.sub-menu-padding ul li a:first-child {
   margin-left: 0;
}

.sub-menu-padding ul {
   display:flex;
   justify-content:center;
   margin:0;
}

.sub-menu-padding li{
    display:inline;
}

.sub-menu-padding a{
    display:inline-block;
    padding:0 0 4px 0;
   margin-right:20px;
   margin-top:4px;   
}
.sub-menu-padding a::after {
   content: '';
    display: block;
    width: 0;
    height: 4px;
   margin-top:2px;
    background-color: rgba(255, 255, 255, 0.5);
    transition: width .2s;
}

.sub-menu-padding a:hover::after{
   width: 100%;
}
/* RESPONSIVT 1614 */

@media all and (max-width: 1400px) {
   
/* LOGO CONTAINER */

   
   .header-group:first-child img {
   width:110px !important;
      margin-top:0;
}
   
}




/* RESPONSIVT 1090 */

@media all and (max-width: 1090px) {   
 .webplatsnamn {
    position:relative;
    top:-56px;
 }
    .webplatsnamn a, .webplatsnamn a:visited {
    text-decoration:none !important;
       color:#000 !important;
       margin:0;
       padding:0;
 }
   .webplatsnamn > div {
    display:flex;
      justify-content:center;
 }
   .searchbox-startpage {
   padding-top:5em;
}
   
 .mobile-navigation {
   display:inline-block;
    position:absolute;
    right:5px;
    top:15px;
    width:auto;
    margin-right:1em;
    margin-top:5px;
}
.mobile-navigation nav {
   margin-top:-3px;
}
.main-navigation {
	display:none;
} 
   .kommun-logo {
   position:relative;
   margin-top:-57px;
   margin-left:unset;
      text-align:center;
}
   .header-group {
   justify-content: unset;   
}
   .header-group:first-child img {
   width:75px !important;
      margin-left:10px;
}
.kommun-logo img {
   width:75px !important;
}
   .sub-menu-padding {
      height:2px;
      margin:0;
      padding:0;
      border:0;
   }
   .sub-menu-padding > div .sv-jcrmenu-portlet {
      display:none;
   }
  .breadcrumbs {
     margin-top:25px;     
  }
   .header-parent .header-group:nth-child(2) {
width:100%;
      display:block;
      
      xposition:relative !important;
      align-items:center;
      left:0 !important;
      z-index:1000;
}
.header-group:nth-child(2) {
   margin-left:0;
}
   .breadcrumb-flytta {
      xborder-top:solid 2px #b2006e;
      xpadding-top:10px;      
   }
   .breadcrumb-flytta ul {
      padding-left:10px;      
   }
   .breadcrumb-flytta ul a {
      text-decoration:none !important;
      color:#b2006e;
      font-weight:bold;
      
   }
.header-icons {
   display:none;
} 
   .header-parent {
   height: 63px;
}

.header-group {
   width:90px;
   top:0;
   left:0 !important;
   position:absolute !important;
}
   .header-group img {
   width:90px !important;
}
   
   /* TESTMENY */
   
   #menuToggle
{
  display: block;
  xposition: absolute;
   width:fit-content;
  right:10px;
  
  z-index: 1000;
  
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle a
{
  text-decoration: none;
  color: #232323;
  
  transition: color 0.3s ease;
}

#menuToggle a:hover
{
  color: tomato;
}


#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

/*
 * Just a quick hamburger
 */
#menuToggle span {
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;  
  background: #333;
  border-radius: 3px;  
  z-index: 1;  
  transform-origin: 4px 0px;  
  transition: transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.2s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.2s ease;
}

#menuToggle span:first-child {
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2) {   
  transform-origin: 0% 100%;
}
   #menuToggle span:last-child {
   margin-bottom:3px; 
}

/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-9px, -16px);
  background: #232323;
}

/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(-4px, 11px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#menu
{
  position: absolute;
  width: 300px;
  margin: -100px 0 0 -10px;
  padding: 50px;
  padding-top: 125px;
  
  background: #ededed;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(100%, 0);
  
  transition: transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0);
}

#menu li
{
  padding: 10px 0;
  font-size: 22px;
}

/*
 * And let's slide it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: none;
}
   
}


// HELVETES JÄ**A SITEVISION, sämsta CMS:et någonsin
.sv-decoration-puff-test p a {font-weight:normal!important;}