@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */
html {
  scroll-behavior: smooth;
}
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
h1 {
	text-align:left;
	font-family: 'Barlow', sans-serif;
	/* font-size:55px; 
	font-size: clamp(1.75rem, 4vw, 3.1rem);*/
	font-size:24px;
	font-weight:600;
	margin-bottom:4%;
	margin-top: 1%;
	/* font-size: calc(16px + 6 * ((100vw - 320px) / 680)); */
	color:#000;
}

h2 {
	font-family: 'Lato', sans-serif;
	/* font-size:20px; */
	font-size:24px;
	font-weight:600;
	text-align:left;
	margin: 0px; padding: 0px;margin-bottom:4%;
	color:#000;
}

h3 {
	font-family: 'lato', sans-serif;
	/* font-size:20px; */
	font-size:20px;
	font-weight:600;
	text-align:center;
	margin-bottom:0%;
	margin: 0px; padding: 0px;
	color:#000;
}
	h4 {
	font-family: 'Barlow', sans-serif !important;
	font-size:21px !important;
	font-weight:100 !important;
	word-spacing: 0.1em !important;
	line-height: 1.5em !important;
	margin-bottom:4%!important;
	text-align:left!important;
	color:#000;
	}
#header_text {
	text-align:center;
	font-family: 'Barlow', sans-serif;
	/* font-size:55px; 
	font-size: clamp(1.75rem, 4vw, 3.1rem);*/
	font-size:24px;
	font-weight:600;
	margin-bottom:4%;
	margin-top: 1%;
	/* font-size: calc(16px + 6 * ((100vw - 320px) / 680)); */
}
	

.h2_form_left {
font-family: 'Lato', sans-serif;
	/* font-size:20px; */
	font-size:24px;
	font-weight:600;
	text-align:left;
	margin: 0px; padding: 0px;margin-bottom:4%;
	color:#000;
}	
.h2_center {
	font-family: 'Lato', sans-serif;
	/* font-size:20px; */
	font-size:24px;
	font-weight:600;
	text-align:left !important; /* Alltid vänster ställd på mobil */
	color:#000;
}
.h2_center_styrelse {
	font-family: 'Lato', sans-serif;
	/* font-size:20px; */
	font-size:24px;
	font-weight:600;
	text-align:center;
	color:#000;
}	
.h2_left {
	font-family: 'Lato', sans-serif;
	/* font-size:20px; */
	font-size:24px;
	font-weight:600;
	text-align:left;
	margin: 0px; padding: 0px;margin-bottom:4%;
	color:#000;
}
.h2_kontakt_left {
	font-family: 'Lato', sans-serif;
	/* font-size:20px; */
	font-size:24px;
	font-weight:600;
	margin: 0px; padding: 0px;
	margin-bottom:1%;
	text-align:left !important;
	color:#000;
}


.h3_kontakt_left  {
font-family: 'lato', sans-serif;
	/* font-size:20px; */
	font-size:20px;
	font-weight:600;
	text-align:left;
	margin-bottom:0%;
	margin: 0px; padding: 0px;
	color:#000;
}

.h3_form_left {
font-family: 'Lato', sans-serif !important;
	/* font-size:21px; */
	font-size:20px !important;
	font-weight:600;
	text-align:left;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
color:#000;
}
.h3_left {
font-family: 'lato', sans-serif !important;
	/* font-size:21px; */
	font-size:20px !important;
	font-weight:600;

	text-align:left;
	word-spacing: 0.1em;
	margin-bottom:-5%;
	color:#000;
	
}
.h3_center {
font-family: 'lato', sans-serif !important;
	/* font-size:21px; */
	font-size:20px !important;
	font-weight:600;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
	text-align:center;
	color:#000;
}
.desktop_center_mobile_left_h_tre
{
	font-family: 'Barlow', sans-serif;
	/* font-size:20px; */
	font-size:20px;
	font-weight:600;
	text-align:left;
	margin-bottom:0%;
	margin: 0px; padding: 0px;
	color:#000;
}
.p_kontakt_left  {
font-family: 'Barlow', sans-serif;
	/* font-size:21px; */
	font-size:16px;
	font-weight:200;
	text-align:left;
	word-spacing: 0.1em;
	line-height: 0.9em;
	margin-bottom:2%;
	color:#000;

}	


.ingress {
	font-family: 'Barlow', sans-serif !important;
	/* font-size:21px; */
	font-size:21px;
	font-weight:200;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
	text-align:left;
	color:#000;
}
.valkommen_till {
	font-family: 'Barlow', sans-serif !important;
	/* font-size:21px; */
	font-size:21px;
	font-weight:200;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:1%;
	text-align:left;
	color:#000;
}	

/* ORGINAL 	
.ingress_center
	{
		font-family: 'Lato', sans-serif !important;
		font-size:18px !important;
		font-weight:200;
		text-align:left;
		word-spacing: 0.1em;
		line-height: 1.5em;
		margin-bottom:4%;
		color:#000;
	}
*/	
.ingress_center
	{
		font-family: 'Lato', sans-serif !important;
		font-size:18px !important;
		font-weight:200;
		text-align:left;
		word-spacing: 0.1em;
		line-height: 1.5em;
		margin-bottom:4%;
		color:#000;
	}	
	
.ingress_center_mobil {
font-family: 'Barlow', sans-serif !important;
	/* font-size:21px; */
	font-size:20px !important;
	font-weight:200;
	text-align:left;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
	color:#000;
}
.ingress_center_mobil_tva {
	font-family: 'Barlow', sans-serif !important;
	/* font-size:21px; */
	font-size:20px !important;
	font-weight:200;
	text-align:left;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
	color:#000;
}
		
	
.ingress_mobile_left
{
font-family: 'Barlow', sans-serif !important;
	/* font-size:21px; */
	font-size:21px;
	font-weight:200;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
	text-align:left;
	color:#000;
}

.ingress_mobil_center
{
font-family: 'Barlow', sans-serif !important;
	/* font-size:21px; */
	font-size:20px !important;
	font-weight:200;
	text-align:left;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
color:#000;
}
.brodtext {
	font-family: 'Lato', sans-serif !important;
	font-size:18px;
	font-weight:400 !important;
	word-spacing: 0.1em;
	line-height: 1.5em;
	text-align:left;
	color: #000;
	
}
p {
	font-family: 'Lato', sans-serif !important;
	font-size:18px;
	font-weight:400 !important;
	word-spacing: 0.1em;
	line-height: 1.5em;
	text-align:left;
	color: #000;
	
}
.policy-banner {
font-family: 'Lato', sans-serif !important;
	/* font-size:21px; */
	font-size:12px !important;
	font-weight:200 !important;
	text-align:left !important;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:0%;
	color: #000 !important;
}

.brodtext_center {
font-family: 'Lato', sans-serif !important;
	/* font-size:21px; */
	font-size:18px !important;
	font-weight:400;
	text-align:left;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
	color:#000;
}
.brodtext_center_styrelse {
font-family: 'Lato', sans-serif !important;
	/* font-size:21px; */
	font-size:18px !important;
	font-weight:400;
	text-align:center;
	word-spacing: 0.1em;
	line-height: 1.5em;
	margin-bottom:4%;
	margin-top: -4%;
	color:#000;
}	

.brodtext_center_desktop_left_mobile {
	font-family: 'Lato', sans-serif;
	font-size:18px;
	font-weight:400 !important;
	text-align:left;
	word-spacing: 0.1em;
	line-height: 1.5em;
	color:#000;
}
#main {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#meny_box {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#styrelsen {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Aktuellt {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	
}
#Kontakt {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	
}
#FAQ {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	
}
#top {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#hem {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Styrelsen_ord {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Styrelsen_Center {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Hem_Vanster {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Hem_Hoger {
	clear: none;
	float: left;
	margin-left: 4.1666%;
	width: 100%;
	display: block;
}
#Styrelse_ett {
	clear: both;
	float: left;
	margin-left: 0;
	width: 30%;
	display: block;
}
#Styrelse_tva {
	clear: none;
	float: left;
	margin-left: 3%;
	width: 30%;
	display: block;;
}
#Styrelse_tre {
	clear: none;
	float: left;
	margin-left: 3%;
	width: 30%;
	display: block;
}
.header {
  background-color: Transparent;
  color: #f1f1f1;
  background-image:url(../images/bbgg.png);
}
#aktuellt_mini_meny_left {
  clear: both;
  float: left;
  margin-left: 0;
  width: 100%;
  display: block;
}
#aktuellt_mini_meny_right {
  clear: none;
  float: left;
  margin-left: 4.1666%;
  width: 100%;
  display: block;
}
#bakgrunds_banner_bla {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {
.gridContainer {
	width: 92.625%;
	padding-left: 1.1875%;
	padding-right: 1.1875%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#main {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#meny_box {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#styrelsen {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Aktuellt {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Kontakt {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#FAQ {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#top {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#hem {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Styrelsen_ord {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Styrelsen_Center {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Hem_Vanster {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Hem_Hoger {
	clear: none;
	float: left;
	margin-left: 2.5641%;
	width: 100%;
	display: block;
}
#Styrelse_ett {
	clear: both;
	float: left;
	margin-left: 0;
	width: 30%;
	display: block;
}
#Styrelse_tva {
	clear: none;
	float: left;
	margin-left: 3%;
	width: 30%;
	display: block;
}
#Styrelse_tre {
	clear: none;
	float: left;
	margin-left: 3%;
	width: 30%;
	display: block;
}
.header {
  padding: 5px 8px;
  background-color: Transparent;
  color: #f1f1f1;
  background-image:url(../images/bbgg.png);
}
#aktuellt_mini_meny_left {
  clear: both;
  float: left;
  margin-left: 0;
  width: 100%;
  display: block;
}
#aktuellt_mini_meny_right {
  clear: none;
  float: left;
  margin-left: 2.5641%;
  width: 100%;
  display: block;
}
#bakgrunds_banner_bla {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}	
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
	body {
		 background-image: url('../images/bg.png');
		 background-repeat: no-repeat;
  		 background-attachment: fixed;
 		 background-size: 100% 100%;
	}
.gridContainer {
	width: 100%;
	max-width: 100%;
	padding-left: 0%;
	padding-right: 0%;
	margin: auto;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 10%;
	width: 80%;
	display: block;
}
#main {
	clear: both;
	float: left;
	margin-left: 0%;
	width: 100%;
	display: block;
}
#meny_box {
	clear: both;
	float: left;
	margin-left: 0%;
	padding-left:5%;
	padding-right:5%;
	width: 90%;
	display: block;
	background-color:#FFF;
}
#styrelsen {
	clear: both;
	float: left;
	margin-left: 0;
	width: 70%;
	display: block;
	background-image:url('../images/styrelsen.png');
	background-repeat:no-repeat;
	color:#000;
	padding-left:15%;
	padding-right:15%;
	padding-top:5%;
	padding-bottom:15%;
}
#Aktuellt {
	clear: both;
	float: left;
	margin: 0%;
	padding: 0%;
	display: block;
	
}
#Kontakt {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;

}
#FAQ {
clear: both;
	float: left;
	margin-left: 0;
	display: block;
}
#top {
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
}
#hem {
	clear: both;
	float: left;
	margin-left: 0;
	width: 70%;
	display: block;
	background-image:url('../images/bengta.png');
	background-repeat:no-repeat;
	background-color:transparent;
	color:#000;
	padding-left:15%;
	padding-right:15%;
	padding-top:5%;
	padding-bottom:5%;
}
#Styrelsen_ord {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	vertical-align:middle;
	position: absolute;
	left: 45%;
}
#Styrelsen_Center {
	clear: both;
	float: left;
	width:auto;
	text-align:center;
	margin-left:35%;
	margin-right:25%;
	display: block;
	background-color: Transparent;
}
#Hem_Vanster {
	clear: both;
	float: left;
	margin-left: 0;
	width: 45%;
	display: block;
	background-image:url(../images/ruta.png);
	padding-left:1%;
}
#Hem_Hoger {
	text-align:left;
	clear: none;
	float: left;
	margin-left: 2%;
	width: 45%;
	display: block;
	background-image:url(../images/ruta.png);
	padding-left:1%;
}
#Styrelse_ett {
	clear: both;
	float: left;
	margin-left: 0;
	width: 30%;
	display: block;
}
#Styrelse_tva {
	clear: none;
	float: left;
	margin-left:3%;
	width: 30%;
	display: block;
}
#Styrelse_tre {
	clear: none;
	float: left;
	margin-left: 3%;
	width: 30%;
	display: block;
}
.header {
  padding: 10px 16px;
  background-color: Transparent;
  color: #f1f1f1;
  background-image:url(../images/bbgg.png);
}
#aktuellt_mini_meny_left {
  clear: both;
  float: left;
  margin-left: 0;
  width: 70%;
  display: block;
}
#aktuellt_mini_meny_right {
  clear: none;
  float: left;
  margin-left: 0%;
  width: 20%;
  display: block;
 
}
	.bakgrunds_banner_bla {
    clear: both;
    float: left;
    margin-left: 0;
    width: 100%;
    display: block;
	background-color:#f1f9ff;
	padding-top:0%;
	padding-bottom:0%;
	margin-bottom:5%;
	margin-top:4%;

	
}
.h2_left {
	font-family: 'Lato', sans-serif;
	/* font-size:20px; */
	font-size:24px;
	font-weight:600;
	text-align:left;
	margin: 0px; padding: 0px;margin-bottom:4%;
	color:#000;
}
	.brodtext_center {
	font-family: 'Lato', sans-serif sans-serif !important;
	font-size:18px;
	font-weight:400 !important;
	word-spacing: 0.1em;
	line-height: 1.5em;
	text-align:center;
	color: #000;
}
	header {
  padding: 20px 0;
  background: repeating-linear-gradient(45deg, #, # 20px, # 20px, # 40px);
  
  background-color: Transparent;
}
.logo-box {
  float: left;
  margin-right: 0;
  background-color: Transparent;
}
.logo-box a {
  outline: none;
  display: block;
  background-color: Transparent;
}
.logo-box img {display: block;}
nav {
  overflow: hidden;
  background-color: Transparent;
}
ul {
  list-style: none;
  margin: 0;
  padding: 0;
  float: right;
}
nav li {
  display: inline-block;
  margin-left: 25px;
  height: 70px;
  line-height: 70px;
  transition: .5s linear;
}
nav a {
  text-decoration: none;
  display: block;
  position: relative;
  color: #000;
  text-transform: uppercase;
}
nav a:after {
  content: "";
  width: 0;
  height: 2px;
  position: absolute;
  left: 0;
  bottom: 15px;
  background: #;
  transition: width .5s linear;  
}
nav a:hover:after {width: 100%;}

@media screen and (max-width: 660px) {
  header {text-align: center;}
  .logo-box {
    float: none;
    display: inline-block;
    margin: 0 0 16px 0;
  }
  ul {float: none;}
  nav li:first-of-type {margin-left: 0;}
}
@media screen and (max-width: 550px) {
nav {overflow: visible;}
nav li {
  display: block;
  margin: 0;
  height: 40px;
  line-height: 40px;
}
nav li:hover {background: rgba(0,0,0,.1);}
nav a:after {content: none;}
}
button {
    background-color: Transparent;
    background-repeat:no-repeat;
    cursor:pointer;
    overflow: hidden;
    outline:none;
	border:solid;
	border-color:#000;
	padding:1%;
}
/* unvisited link */
a:link {
  color:#000;
  text-decoration:none;
}

/* visited link */
a:visited {
  color:#000;
}

/* mouse over link */
a:hover {
 color:#ccc;
}

/* selected link */
a:active {
  color:#000;
}

.feedback {

  color: #000;
  padding: 10px 20px;
  border-radius: 4px;
  border-color: #000;
}

#mybutton {
  position: fixed;
  bottom: -4px;
  right: 10px;
  margin-right:5%;
  margin-bottom:5%;
}
.header {
  padding: 10px 16px;
  background-color: Transparent;
  color: #f1f1f1;

}

.content {
  padding: 16px;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}

.sticky + .content {
  padding-top: 5%;
}

/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
  opacity:0;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}

.fade-in.one {
  -webkit-animation-delay: 0.3s;
  -moz-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.fade-in.two {
  -webkit-animation-delay: 0.7s;
  -moz-animation-delay:0.7s;
  animation-delay: 0.7s;
}

.fade-in.three {
  -webkit-animation-delay: 1.6s;
  -moz-animation-delay: 1.6s;
  animation-delay: 1.6s;
}

.center {
	margin-left:50%;	
  text-align: center;
 
}
.footer,
.push {
  height: auto;
  width:80%;
  padding-left:10%;
  padding-right:10%;
  padding-bottom:2%;
  background-color:#CCC;
  text-align:center;
}