BODY,A,H1,H2,H3,P,DIV,DIR,LI,PRE,UL,OL,TABLE,INPUT,TEXTAREA,SELECT,EM,STRONG
{
  font-size:      1.00em;
  font-style:     normal;
  font-variant:   normal;
  font-weight:    normal;
  font-family:    arial,helvetica,sans-serif;
  letter-spacing: 0.01em;
  line-height:    1.40em;
}

BODY
{
  color:            #404040;
  background-color: #ffffff;
/*  background-color: #214A5E;*/
/*  background-image: url(hembild/top_moln.jpg) top left no-repeat fixed; */
  margin-top:    0;
  margin-right:  0;
  margin-bottom: 0;
  margin-left:   0;
  height:		100vh;;
  width:		100%;
}

.full-screen {
  height: 	100%;
  width:	100%;
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
}

.full-height { height: 	100%; }

#toppmeny { 
	display: flex; 
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}

.hjust {
	display: 			flex;
	justify-content: 	right;
	align-items: 		center;
}

FORM  	{ display: inline; }
input  	{ display: inline; }

p { font-size:    0.75em;}
div,dir { font-size:    11pt;}
.text75 { font-size:    0.75em; vertical-align: middle; }

/*h2:after { content: ' \2261'; }*/

img { max-width: 100%; height: auto; width: auto\9; /* ie8 */ }

.img_left  { float: left; padding-right: 10px; }
.img_right { float: right; padding-left: 10px; }

.vitrand {
  width: 100%;
  height: 50px;
  line-height: 50px;
  position: absolute;
  bottom: -50px;
  right: 0px;
  overflow: hidden;
  -webkit-transform: skewx(-3deg);
  transform: skewy(-3deg);
  transform-origin: bottom left;
  background: rgba(255, 255, 255, .5);
  text-align: center;
}

.text_li
{
  font-size:      11pt;
  font-style:     normal;
  font-variant:   normal;
/*  font-weight:    normal;*/
  font-family:    arial,helvetica,sans-serif;
  letter-spacing: 0;
  vertical-align: middle;
/*  line-height:    10pt;*/
}
.text_li_red
{
  color:          #C43636;
  font-size:      11pt;
  font-style:     normal;
  font-variant:   normal;
/*  font-weight:    normal;*/
  font-family:    arial,helvetica,sans-serif;
  letter-spacing: 0;
  vertical-align: middle;
/*  line-height:    10pt;*/
}
.text_li_gray
{
  color:          #808080;
  font-size:      11pt;
  font-style:     normal;
  font-variant:   normal;
/*  font-weight:    normal;*/
  font-family:    arial,helvetica,sans-serif;
  letter-spacing: 0;
  vertical-align: middle;
/*  line-height:    10pt;*/
}
.text_stor_gray
{
  color:          #808080;
  font-size:      18pt;
  font-family:    myriad,arial,helvetica,sans-serif;
  letter-spacing: 0;
}

@font-face {
    font-family: myFont;
    src: url(LibreBaskerville-Bold.otf);
}
.rubrik 
{
  font-size: 		1.60em;
  font-style: 		normal;
  font-weight: 		normal;
  font-family:    	arial,helvetica,sans-serif;
  padding-top: 		2px;
  padding-bottom: 	2px;
  color: 			#505050;
}

.aknapp:link, .aknapp:visited, .aknapp:active { text-decoration: none; font-weight : bold; margin-right: 10px;}
.aknapp:link IMG { border: none; }
.aknapp:hover { text-decoration: underline; }

.ak:link, .ak:visited, .ak:active { text-decoration: none; font-weight : bold; font-size: 1.20em; margin-right: 10px;}
.ak:link IMG { border: none; }
.ak:hover { text-decoration: underline; }

.over 
{ 
	background-color: 	#FD705F;
	text-align: 		center; 
	vertical-align: 	middle;
	cursor:				pointer; 
	font-size: 			1.20em;
	font-style: 		normal;
	font-weight:		normal;
	color: 				#ffffff;
	line-height:    	1.50em;
}
.out  
{ 
	background-color: 	#E81B03;
	text-align: 		center; 
	vertical-align: 	middle;
	cursor:				default;
	font-style: 		normal;
	font-weight:		normal;
	font-size: 			1.20em;
	color: 				#ffffff;
	line-height:    	1.50em;
}
.over_kat 
{ 
	background-color: 	#BBB39C;
	text-align: 		left; 
	vertical-align: 	middle;
	cursor:				pointer; 
	font-size: 			0.90em;
	font-style: 		normal;
	font-weight:		bold;
	color: 				#ffffff;
	line-height:    	1.50em;
}
.out_kat  
{ 
	background-color: #969EAF;
  text-align: 			left; 
  vertical-align: 	middle;
	cursor:						default;
  font-style: 			normal;
  font-weight:			bold;
  font-size: 				0.90em;
  color: 						#ffffff;
  line-height:    	1.50em;
}
.over_green 
{ 
	background-color: #78CF52;
  text-align: 			left; 
  vertical-align: 	middle;
	cursor:						pointer; 
  border:	 					1px solid #646A78;
  padding-left: 		5px;
  margin-bottom: 		5px;
}
.out_green  
{ 
	background-color: 	#AAE391;
  	text-align: 		left; 
	vertical-align: 	middle;
	cursor:				default;
	border:	 			1px solid #646A78;
	padding-left: 		5px;
	margin-bottom: 		5px;
}
.over2,.over_medl,.over_prog
{ 
	background-color: 	#BBB39C;
	text-align: 		left; 
	vertical-align: 	middle;
	cursor:				pointer; 
	border:	 			1px solid #646A78;
	border-radius:		7px;
	padding: 		5px 5px 5px 5px;
	color: 				#404040;
	font-weight:		bold;
/*	height: 			25px; */
	line-height:    	25px;
}
.out2,.out_medl,.out_prog  
{ 
	background-color: #ffffff;
  	text-align: 		left; 
  	vertical-align: 	middle;
	cursor:				default;
  	border:	 			1px solid #646A78;
	border-radius:		7px;
	padding: 		5px 5px 5px 5px;
	color: 				#404040;
	font-weight:		bold;
/*	height: 			25px;*/
	line-height:    	25px;
}
.out_gul  
{ 
	font-size: 			0.75em;
	text-align: 		left; 
	vertical-align: 	inline;
	cursor:				default;
	border:	 			1px solid #646A78;
  	padding-top: 		5px;
  	padding-bottom: 	5px;
  	padding-left:		10px;
  	padding-right:		10px;
	margin-bottom: 		15px;
	background: 		linear-gradient(45deg, #FDF8DA, #FFFFFF);
}
.out_gul_dark  
{ 
	background-color: #F6D883;
  text-align: 			left; 
  vertical-align: 	middle;
	cursor:						default;
  border:	 					1px solid #646A78;
  padding-left: 		5px;
  margin-bottom: 		5px;
}

.textruta  
{ 
	background-color: #fff5f5;
  text-align: 			left; 
  vertical-align: 	middle;
	cursor:						default;
  border:	 					1px solid #B5C1D0;
	padding: 					5px;
  font-size:      	9pt;
  font-style:     	normal;
  font-variant:   	normal;
  font-weight:    	normal;
  font-family:    	arial,helvetica,sans-serif;
  letter-spacing: 	0;
  line-height:    	12pt;
}

.textruta_gul  
{
	background-color: 	#FDF8DA;
	text-align: 		left; 
	vertical-align: 	middle;
	cursor:				default;
	border:	 			1px solid #D9BB07;
	padding: 			12px;
	margin: 			10px 20px 15px 0px;
	font-size:      	12pt;
	line-height:    	16pt;
	font-weight:    	bold;
	color:				Tomato;
}

.border_min
{
  background-color: 		#E7EAF0;
  border-style: 				solid;
  border-width: 				1px;
  border-top-color: 		black;
  border-left-color: 		black;
  border-bottom-color: 	#444444;
  border-right-color: 	#444444;
}

.border_dashed
{
  border-style: 		dashed;
  border-width: 		1px;
  border-top-color: 	#c0c0c0;
  border-left-color: 	#c0c0c0;
  border-bottom-color: 	#c0c0c0;
  border-right-color: 	#c0c0c0;
}

.vitruta
{
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: #444444;
  border-left-style: solid;
  border-left-width: 1px;
  border-left-color: #444444;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: black;
  border-right-style: solid;
  border-right-width: 1px;
  border-right-color: black;
  background-color: white;
  padding: 3px;
}

.text
{
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: #444444;
  border-left-style: solid;
  border-left-width: 1px;
  border-left-color: #444444;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: black;
  border-right-style: solid;
  border-right-width: 1px;
  border-right-color: black;
  background-color: white;
  width: 100%;
  padding: 3px;
  font-size:    10pt;
}
.vit  { background-color: #ffffff; }
.bg  { background: #BBB39C; }
.gray  { background-color: #969EAF; }
.gray_li  { background-color: #c0c0c0; }
.text_svart { color: #000000; }
.red { color: #C43636; font-weight: bold; }

.huvud
{
	background: 	#839CBB url(hembild/top_moln.jpg) top left no-repeat fixed;
	padding-top: 	5px;
	padding-bottom: 5px;
	padding-left: 	10px;
	padding-right: 	10px;
	text-align: 	center; 
	vertical-align: middle;
	font-size:      32pt;
	color: 			#ffffff;
}

.huvud2 { background: #486EAA; }

.ruta_bla_kant { background-color: #F6EED7; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; }

.ruta_vit
{
	background:       #ffffff;
	padding-top: 		50px;
	padding-bottom: 	20px;
	padding-left: 		20px;
	padding-right: 		20px;
	text-align: 		left;
	vertical-align: 	top;
}

.ruta
{
  padding-top: 			0px;
  padding-bottom: 	10px;
  padding-left: 		5px;
  padding-right: 		5px;
  text-align: 			left; 
  vertical-align: 	top;
}

.ruta_kant
{
  background-color: #E7EAF0;	
  padding-top: 			5px;
  padding-bottom: 	5px;
  padding-left: 		5px;
  padding-right: 		5px;
}
.ruta_kant_h
{
	background:       #FBEC9B url(hembild/skabersjo.gif) top center no-repeat fixed;	
  padding-top: 			5px;
  padding-bottom: 	5px;
  padding-left: 		5px;
  padding-right: 		5px;
/*  text-align: 			left; 
  vertical-align: 	top;*/
}
.rubrik_vit
{
  font-style: normal;
  font-weight: normal;
  padding-top: 2px;
  padding-bottom: 2px;
  font-size: 1.20em;
  color: #21559E;
}

.spalt {
  font-style: normal;
  font-weight: normal;
  padding-top: 2px;
  padding-bottom: 2px;
  vertical-align: top;
  color: #505050;
  border-left: 1px solid #698147;
}
.input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
  padding: 15px;
  color: MediumSeaGreen;
}

.input[type=radio]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
  padding: 15px;
}

.menyknappar {
	border: 		1px solid #AAAAAA;	
	background: 	linear-gradient(45deg, #F0F0F0, #FFFFFF);
	font-size: 		0.75em;
	margin-bottom: 	15px; 
}
.lbox_syn {
  float:		left;
  padding-right: 10px;
  display:		inline-block;
  text-align:	center;
  text-decoration: none;
}
.rbox_syn {
  float:		right;
  padding-left: 10px;
  display:		inline-block;
  text-align:	center;
  text-decoration: none;
}

.box_osynlig {
  display:		none;
}

.over_ram_meny 	{ border: 1px solid #dddddd; cursor: pointer; width: 40%; margin-top: 5px;}
.out_ram_meny  	{ border: 1px solid #f0f0f0; cursor: default; width: 40%; margin-top: 5px;}

/* TABELL */

.tabell_stor {
	margin: auto;
	width: 90%;
}
.tabell_rad {
	padding: 5px;
	border-bottom: 1px solid #c0c0c0;
}
.tabell_rad:nth-child(odd) {
  background: #f0f0f0;
}
.tabell_head {   
	background: MediumAquaMarine;
	height: 30px;
	padding: 3px;
	text-transform: capitalize;
	text-align: center;
	font-weight: bold;
}

/* FLEX */

/* wrap, 2 col, 2:a lång 1000px som förslag och input är 100% */
.flex-container2 {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
}
.child {
  flex: 0 1 auto;
}
.child-two {
  flex: 0 1 1000px;
}
.child-two > input { width: auto; }

/* wrap med mellanrum */
.flex-container_wrap {
  display: flex;
  flex-wrap: wrap;
}
.flex-container_wrap > div {
  margin-bottom: 10px;
  margin-right: 10px;
  text-align: left;
  box-sizing: border-box;
  flex: 0 1 auto;

}
/* nowrap */
.flex-container {
  display: flex;
  flex-wrap: nowrap;
}
.flex-container > div {
  margin: 0px 0px 10px 0px;
  text-align: left;
}
.flex-container_col {
  display: flex;
  flex-direction: column;
}
.flex-container_col > div {
  margin: 0px 0px 10px 0px;
  text-align: left;
}

.flex-container_col_rev {
  display: flex;
  flex-direction: column-reverse;
}
.flex-container_col_rev > div {
  margin: 0px 0px 10px 0px;
  text-align: left;
}

/* FORM - ANMÄLAN */

.div_anmalan {
/*	float: left; */
/*	display: flex; */
/*	flex: auto; */
	box-sizing: border-box; 
/*	margin-top: 20px; 
	margin-right: 20px;
	margin-bottom: 20px;*/
/*	width: 60%;*/
	width: auto;
}
.div_anmalan > div,input,textarea,select { font-size: 1.00em; padding: 6px; border-radius:7px; border: 1px solid LightGray; }
.div_anmalan > div,input,textarea { box-sizing: border-box; width:100%; margin-bottom:5px; margin-right:15px;}

.anmalan {
	padding: 20px 30px 20px 20px;
	border-radius: 10px; 
	background: linear-gradient(45deg, #F0F0F0, #FFFFFF);
	border: 1px solid #A0A0A0;	
	font-weight: bold;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);	
}
.anmalan > input,textarea { font-size: 1.00em; padding: 7px; border-radius:7px; border: 1px solid LightGray; box-sizing: border-box; width:100%;}
.anmalan > input[type=checkbox] { color: MediumSeaGreen; }
.input_anmalan  { width: auto; }
.label_anmalan	{ font-size: 1.00em; font-weight: bold; }

/* DIV GRAY SKUGGA & FORM med grid i 2 col */

.div_gray_skugga {
	margin: 		20px;
	padding: 		20px;
	border-radius: 	10px; 
	background: 	linear-gradient(45deg, #F0F0F0, #FFFFFF);
	border: 		1px solid #c0c0c0;	
	box-shadow: 	0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);	
}
.div_green_skugga {
	margin: 		20px;
	padding: 		20px;
	border-radius: 	10px; 
/*	background: 	linear-gradient(45deg, #FFFFd0, #FFFFFF); */
	background: 	#F0FFF0;
	border: 		1px solid #c0c0c0;	
	box-shadow: 	0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.div_gray_skugga, .div_green_skugga > div {
	box-sizing: border-box; 
}

.grid2				{ display: grid; grid-template-columns: minmax(auto, 20%) minmax(auto, 80%); padding:1rem; }
.grid2 > div		{ box-sizing: border-box; }
.grid2 > label		{ font-weight:bold; }
.grid2 > input		{ box-sizing: border-box; width:100%; padding: 5px; border-radius:6px; border: 1px solid #c0c0c0; }
.grid2 > textarea	{ box-sizing: border-box; width:100%; padding: 5px; border-radius:6px; border: 1px solid #c0c0c0; }
.grid2 > input[type=checkbox] { width: auto; color: MediumSeaGreen; }

.grid2_rad		{ width:100%; grid-column: 1 / 3; }
.grid2_rad input	{ padding: 5px; border-radius:6px; border: 1px solid #c0c0c0;}
.grid2_rad textarea	{ padding: 5px; border-radius:6px; border: 1px solid #c0c0c0; width:100%; }
.grid2_rad input[type=checkbox] { color: MediumSeaGreen; }

.grid_tabell2col		{ display: grid; grid-template-columns: minmax(auto, 20%) minmax(auto, 80%); padding:1rem; }
.grid_tabell2col > div	{ box-sizing: border-box; align-items: left; }

@media screen and (max-width: 800px) {
  .grid2		{ display: grid; grid-template-columns: 1fr; align-items: stretch; padding:0px; }
  .grid2_rad	{ flex-direction: column; align-items: stretch; }
  
  .grid_form { width: 100%; flex-direction: column; align-items: stretch; }
}
/* DIV INLINE CONTAINER 3 col */
.div_3col { display: flex; flex-wrap: wrap; }
.div_3col > div { flex:0 0 33.3333%; justify-content: start;}

@media (max-width: 800px) {
.div_3col { flex-direction: column;  align-items: stretch; }
.div_3col > div { flex:0 0 100%; }
}

/* FORM INLINE (flex)*/

.form-inline { display: flex; flex-flow: row wrap; }
.form-inline label { margin: 5px 10px 5px 0; }
.form-inline input { margin: 5px 10px 5px 0; padding: 10px; background-color: #fff; vertical-align: middle; border: 1px solid #ddd; border-radius:6px;} 
  
.form-inline button { padding: 10px 20px; background-color: dodgerblue; border: 1px solid #ddd; color: white; cursor: pointer; }
.form-inline button:hover { background-color: royalblue; }

@media (max-width: 800px) {
  .form-inline input { margin: 10px 0; } 
  .form-inline { flex-direction: column; align-items: stretch; }
}


/* ÖVRIGT */
.div_osynlig 	{ display: none; }

#osynlig { display: none; }
#osynlig_bild { display: none; }
#osynlig_lank { display: none; }
#osynlig_wa   { display: none; }
#nyhet { display: none; }
#redigera_nyhet { display: show; }
#knappar_redigera_medlem { display: none; }

#meny { margin-top: 20px; } /* sidmeny */

.spalter {
    -webkit-columns:    3 150px; /* Chrome, Safari, Opera */
    -moz-columns: 	   3 150px; /* Firefox */
    columns: 		   3 150px;
    -webkit-column-gap: 2em; /* Chrome, Safari, Opera */
    -moz-column-gap: 	2em; /* Firefox */
    column-gap: 		2em;
}
.box
{
  padding: 2px;
  color: #505050;
  background-color: #f0f0f0;
  border: 1px solid #000000;
}
.bg_gray {
	background-color: #F7F7F7;
  font-style: 			normal;
  font-weight: 			normal;
  vertical-align: 	middle;
  text-align: 			center;
  color: #505050;
  border-top: 			1px solid #c0c0c0;
}
.div_gray { margin-bottom: 10px; padding: 5px; background-color:#f1f1f1; }
.linje	{ border-top: 1px dotted #B5C1D0; }

.ram 			{  border:	1px dotted #B5C1D0; }
.over_ram      	{ border:	2px solid #C43636; cursor: pointer; }
.out_ram       	{ border: 2px solid #cccccc; cursor: default; }
.mark_ram      	{ border: 2px solid #ff00ff; cursor: default; }
.med_skugga {
		box-shadow:
		0.3px 0.5px 0.7px hsl(23deg 93% 31% / 0.36),
		0.8px 1.6px 2px -0.8px hsl(23deg 93% 31% / 0.36),
		2.1px 4.1px 5.2px -1.7px hsl(23deg 93% 31% / 0.36),
		5px 10px 12.6px -2.5px hsl(23deg 93% 31% / 0.36);

}
.over_ram_link 	{ border: 1px solid #dddddd; cursor: pointer; height: fit-content; }
.out_ram_link  	{ border: 1px solid #ffffff; cursor: default; height: fit-content; }

.knapp 
{ 
	padding: 			2px;
	color: 				#092567;
	background-color: 	#f0f0f0;
	width: 				30px; 
	height: 			30px; 
	border: 			1px solid #83979D;
	border-radius:		5px;
	vertical-align: 	middle;
	text-align: 		center; 
	font-size: 			11pt;
	font-weight: 		bold;
	cursor:				pointer;
	margin:				2px;
}
.knapp_li 
{ 
	color: 						#092567;
  background-color: #f0f0f0;
	width: 						21px; 
	height: 					20px; 
	border: 					1px solid #83979D;
  vertical-align: 	middle;
  text-align: 			center; 
  font-size: 				11pt;
	font-weight: 			bold;
}

.knapp_flex 
{
  padding: 					5px 9px;
  border: 					1px solid #AAAAAA;	
  background-color: 		#f0f0f0;
  -webkit-border-radius:	3px; 
  -moz-border-radius: 		3px; 
  border-radius: 			3px; 
  text-decoration: 			none;
  display: 					inline-block;
}

.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 80px;
  height: 80px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* .mySlides {display:none}*/

/* Slideshow container */
.slideshow-container { max-width: 1000px; position: relative; margin: auto; }

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 20%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: gray;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next { right: 0; border-radius: 3px 0 0 3px; }

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover { background-color: rgba(0,0,0,0.5); }

/* Caption text */
.undertext {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: gray;
  font-size: 18px;
  font-weight: bold;
  padding: 8px 12px;
  position: absolute;
  top: 0px;
}

/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 13px;
  width: 13px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}