@charset "utf-8";
@import url("styles/styles.css");
/* Hämtar Google Fonts - hämta egna fonter på https://www.google.com/fonts */
/*@import url("https://fonts.googleapis.com/css?family=Raleway");*/
@import url('https://fonts.googleapis.com/css?family=Roboto:300');
@import url('https://fonts.googleapis.com/css?family=Athiti:500&display=swap');


/* --------------------------------------------------------------------------------- */
/* EXTRA! CSS-kod som används i vissa sidor */
/* --------------------------------------------------------------------------------- */
/* Startsidan */
#startkolumn_1 {
	float: left;
	width: 50%;
	margin: 0 2% 0 0;
	padding: 10px;
	border: 1px solid rgba(0,0,0,0.05);
}
#startkolumn_1 ul li {
	margin: 20px 0 0 0;
	padding: 0;
}
#startkolumn_2 {
	float: left;
	width: 40%;
	margin: 0;
	padding: 10px 10px 10px 20px;
	border: 1px solid rgba(0,0,0,0.05);
}
/* NYHETSBOX startsida */
#news_box_intro {
	width: 95%; 
	height: auto; 
	border: 1px solid rgba(220,220,220,1);
	padding: 10px 2% 10px 2%; 
	float: left; 
	clear: both; 
	margin: 5px 0 5px 0px; 
	border-radius: 10px; 
	background-color: rgba(250,250,250,1);
}
/* CAPTION - bilder med bildtext */
figure.image {
	border: none;
	background: #fff;
}

/* --------------------------------------------------------------------------------- */
/* TECKENSNITT, TEXTSTORLEK och TEXTFÄRG */
body, td, p {
	font-family: 'Athiti', sans-serif;
	font-size: 18px;
	color: rgba(0,0,0,1);
}


/* UTSKRIFT - skriver bara ut sidinnehållet */ 
@media print {
  body * {
    visibility: hidden;
  }
  #kolumn_content , #kolumn_content  * {
    visibility: visible;
  }
  #kolumn_content  {
    position: absolute;
    left: 0;
    top: 0;
		height: inherit;
  }
}

/* Textinnehåll i stycken */
p {
	margin: 0 0 10px 0;
	padding: 0 3px 0 0;
	line-height: 25px;
/*	border: 1px solid #ccc;*/
}
body {
	padding: 0;
	margin: 0;
/* BAKGRUNDSFÄRG */ 
/*	background: rgba(210,210,210,1); */
	background: rgba(255,255,255,1);
	background-image: url(/wds_cms/bilder/bakgrund.jpg); 
	background-size: 100%;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center 100px;
/*	background-position: center -100px;*/
}

/* LÄNKAR - grundegenskaper där inget annat format angivits */
a { color: #006699; }

/* RUBRIKER */
h1, h2, h3 {
	font-family: 'Athiti', sans-serif;
	color: rgba(0,0,0,1.00);
}
h1 {
	font-size: 35px;
	letter-spacing: 1px;
/*	font-weight: normal;*/
	padding: 20px 0 20px 0;
	margin: 0;
}
h2 {
	font-size: 28px;
	letter-spacing: 1px;
/*	font-weight: normal;*/
	padding: 10px 0 15px 0;
	margin: 0;
}
h3 {
	font-size: 22px;
	letter-spacing: 1px;
/*	font-weight: normal;*/
	padding: 10px 0 15px 0;
	margin: 0;
}

/* --------------------------------------------------------------------------------- */
/* SIDHUVUD
/* --------------------------------------------------------------------------------- */
/*  Box som innehåller sidhuvudet och den horisontella huvudmenyn */
#sidhuvud_box {
	width: 90%;
	margin: 70px auto 0 auto;
	padding: 0;
/*	overflow: hidden; */
	border-radius: 0;
	box-shadow:	none;
	border-bottom: none;
	border-top: none;
/*	background-image: url(bilder/bakgrund.jpg); */
/*	background-repeat: repeat-x; */
/*	background-attachment: fixed; */
/*	background-position: 0 0; */
}
/* Maximal storlek på bilder i sidhuvudet */
#sidhuvud_box img {
	max-width: 100%;
	height: auto;
}
/* Box med innehållet i sidan "sidhuvud.php" */
#sidhuvud {
	float: left;
	width: 99%;
	height: 150px;
	margin: 0;
	padding: 10px 0 10px 1%;
	overflow: hidden;
	background-color: rgba(255,255,255,0.00);
	border-bottom: 2px solid rgba(82,87,160,1);
}
/* Box för rubrik eller logotype i sidhuvudet */
#sidhuvud_logo {
	float: left;
	width: 140px;
	height: 140px;
	overflow: visible;
	margin: 0 0 0 0;
	padding: 0;
	/*border: 1px solid #ccc;*/
}
#sidhuvud_rubrik {
	float: left;
	width: 58%;
	height: 150px;
	margin: 0px 0 0 0;
	padding: 0;
	/*border: 1px solid #ccc;*/
}
/* Rubrik i sidhuvudet */
#sidhuvud h1 {
	font-size: 60px;
	padding: 0;
	margin: 10px 0 0 20px;
	color: rgba(0,0,0,1.00);
	text-shadow: 0 0 5px rgba(255,255,255,1.00);
}

/* --------------------------------------------------------------------------------- */
/* Box som innehåller GOOGLE TRANSLATE */
/* --------------------------------------------------------------------------------- */
#google_translate_box {
	float: right;
	width: 120px;
	margin: 10px 0 0 0;
	padding: 0;
/*	border: 1px solid #ccc; */
}

/* --------------------------------------------------------------------------------- */
/* SÖKFUNKTION */
/* --------------------------------------------------------------------------------- */
#sokruta_sidhuvud {
	float: right;
	text-align: right;
	width: 25%;
	margin: 0 10px 0 0;
	padding: 0;
/*	border: 1px solid #ccc; */
}
/*  jQuery för sökfält i sökfunktion */
.q {
	padding: 0;
	margin: 0;
}
/* CSS för sökfält i sökfunktion */
.search_text {
	font-size: 18px;
	color: rgba(0,0,0,1);
	width: 70%;
	padding: 5px;
}
/* Sökfält i resultatsidan */
.search_text_resultat {
	font-size: 20px;
	width: 300px;
	padding: 5px;
	margin: 0;
}
/* jQuery-class för sökfält (med förvald text) */
.search_text_focus {color: rgba(153,153,153,1);}
.search_text_default {color: rgba(0,0,0,1);}

/* --------------------------------------------------------------------------------- */
/* SIDLAYOUT */
/* --------------------------------------------------------------------------------- */
/* CENTRERINGSBOX - för centrerade layouter */
#centerbox {
	width: 90%;
	margin: 0 auto 0 auto;
	padding: 0;
	border-radius: 0;
	border: none;
	box-shadow:	none;
	border-top: none;
	border-bottom: none;
}
/* Maximal storlek för bilder */
#centerbox img {
	max-width: 100%;
	height: auto;
}
/* KOLUMNBOX - box med menybox och sidinnehållsbox */
#kolumncontainer {
	width: 100%;
	margin: 0;
	padding: 0 0 30px 0;
	float: left;
	background-color: rgba(255,255,255,0.99);
/*	border: 1px solid #ccc;*/
	border-top: none;
	border-radius: 5px 5px 0 0;
/*	box-shadow: 1px 1px 10px rgba(0,0,0, 0.20);*/
}
/* KOLUMN MENY - menybox som innehåller huvudmeny */
#kolumn_menu {
	float: left;
	width: 19%;
	margin: 0;
	padding: 0 1% 0 0;
	background-color: rgba(255,255,255, 0.5);
	border-right: 1px dotted rgba(204,204,204,1);
/*	border: 1px solid #ccc;*/
}

/* EXTRA Qnyppling MC - KOLUMN BANNER */
#kolumn_banner {
text-align: center;
	float: left;
	width: 95%;
	margin: 2%;
	padding: 30px 1% 20px 2%;
	background-color: rgba(255,255,255, 0.5);
	/*border: 1px solid #ccc;*/
}

/* KOLUMN INNEHÅLL - sidinnehållsbox för sidornas innehåll */
#kolumn_content {
	float: left;
	/* BREDD på box med sidornas innehåll */
	width: 75%; /* Ange ett högre värde här om du inte använder "Huvudmeny 1" vertikal listmeny */
	/*min-height: 450px;*/
	margin: 0;
	padding: 10px 2% 5px 2%;
/*	border: 1px solid #ccc;*/
}
#kolumn_content hr {
	border: 2px solid rgba(190,190,190,1.00);
	margin: 10px 0 10px 0;
	padding: 0;
}
/* EXTRA - KOLUMN INNEHÅLL - sidinnehållsbox för sidornas innehåll */
/* Används när den VERTIKALA MENYN INTE visas, som tex på STARTSIDAN */
#kolumn_content_utan_meny {
	float: left;
	width: 96%;
	min-height: 450px;
	margin: 0;
	padding: 10px 2% 10px 2%;
/*	border: 1px solid #CCC;*/
}
/* KOLUMN INNEHÅLL - LISTOR */
#kolumn_content li { 
	padding: 0 0 10px 0; 
	line-height: 18px;
}
#kolumn_content ul ol {
	padding: 0 0 0 20px;
}

/* SIDFOT - box som innehåller sidfoten */
#sidfot {
	clear: both;
	width: 96%;
	height: 200px;
	margin: 0 auto 1000px auto;
	padding: 25px 2% 5px 2%;
	font-size: 14px;
	border-radius: 0 0 10px 10px;
	background-color: rgba(240,240,240,0.8); 
}
/* SIDFOT INNEHÅLL - extra boxar som kan användas för innehåll i sidfoten */
#sidfot_box1 {
	margin: 0;
	padding: 10px 40px 10px 10px;
	float: left;
	width: auto;
}
#sidfot_box2 {
	margin: 0;
	padding: 10px 40px 10px 10px;
	float: left;
	width: auto;
}
#sidfot_box3 {
	margin: 0;
	padding: 50px 10px 10px 10px;
	float: right;
	width: auto;
}
/* Länkar i sidfoten */
#sidfot a {
	color: rgba(0,0,0,1);;
	text-decoration: none;
}
#sidfot a:hover { 
	color: rgba(90,90,90,1); 
}
/* Länk till inloggning av WDS CMS */
#sidfot .wds_cms a {
	font-size: 14px;
	color: rgba(180,180,180,1);;
	text-decoration: none;
}

/* --------------------------------------------------------------------------------- */
/* MENY 1 - HORISONTELL HUVUDMENY Dropdownmeny */
/* --------------------------------------------------------------------------------- */
/* VANLIG MENY - döljer alla element som har "dropdown" som inledande attribut */
.toggle, [id^=dropdown] {
	display: none;
}
.notoggle, [id^=dropdown] {
	display: none;
}
/* MOBIL MENY - döljer alla element som har "dropdown" som inledande attribut */
.toggle_top, [id^=dropdown] {
	display: none;
}
/* HUVUDMENY - box */
nav {
	position: fixed; /* Visar menyn hela tiden */
	top: 0px; /* Menyns position */
	left: 0; /* Menyns position */
	right: 0; /* Menyns position */
	z-index: 9999; /* Positionerar boxen överst */
	float: left;
	width: 98%;
	margin: 0 0 30px 0;
	padding: 0 0 0 2%;
	background-image: linear-gradient(to bottom, rgba(82,87,160,0.90), rgba(43,48,119,0.90));
	background-repeat: repeat-x;
	/*border-radius: 5px;*/
	box-shadow: 3px 3px 10px rgba(0,0,0, 0.20);
	border: 2px solid rgba(255,255,255, 1);
}
/* Anger att menyboxen ska visas som en Tabell */ 
nav:after {
	content: "";
	display: table;
	clear: both;
}
/* HUVUDMENY - länkar text */
nav a {
	color: rgba(255,255,255, 1);
	display: block;
	padding: 0 10px;
	font-size: 20px;
	line-height: 60px;
	text-decoration: none;
font-family: 'Roboto', sans-serif;

}
nav a:hover {
	background-image: none;
	background-color: rgba(40,43,79,0.90);
	cursor: pointer;
}
nav ul {
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	position: relative;
}
/* HUVUDMENY - menyval */
nav ul li {
	margin: 0;
	display: inline-block;
	float: left;
	text-align: left;
	border-right: 1px solid rgba(0,0,0, 0.1);
}
nav ul li:last-child {
    border-right: none;
}
nav ul ul li:last-child {
	border-right: 1px solid rgba(0,0,0, 0.1);
}
/* UNDERMENY 1 */
nav ul ul {
	display: none;
	position: absolute;
	top: 60px;
}
/* UNDERMENY 1 - menyval */
nav ul ul li {
	/* BREDD (samma värde ska anges i "nav ul ul ul li" värdet "left" nedan) */
	width: 250px;
	float: none;
	display: list-item;
	position: relative;
	padding: 10px 0 10px 0;
	border: 2px solid rgba(255,255,255, 0.9);
	border-top: none;
	background-color: rgba(240,240,240,1);
	background-image: linear-gradient(to bottom, rgba(82,87,160,0.90), rgba(43,48,119,0.90));
	background-repeat: repeat-x;
}
/* UNDERMENY 1 - länkar text */
nav ul ul li a {
	font-size: 20px;
	line-height: 30px;
}
/* UNDERMENY 1 - hover-läge */

nav ul li ul li:hover {
	background-image: none;
	background-color: rgba(82,87,160,0.90);
}
/* UNDERMENY 2 - menyval */
nav ul ul ul li {
	position: relative;
	top: -60px;
	left: 250px;

}
/* VISAR dropdown-menyer i hover-läget */
nav ul li:hover > ul {
	display: inherit;
}
/*###########################################*/
/* DÖLJER ALLA DROPDOWNMENYER. 
Välj display: none; om du INTE vill använda dropdownmeny */
nav ul li:hover > ul {
/*	display: none; */
}
/*###########################################*/

/* --------------------------------------------------------------------------------- */
/* MENY 2 - HORISONTELL UNDERMENY som visas på varje sida */
/* --------------------------------------------------------------------------------- */
/* Menybox */
#meny_top_sub {
	clear: both;
	padding: 0;
	margin: 0 0 15px 0;
	font-size: 20px;
font-family: 'Roboto', sans-serif;
}
/* Menylistan, avstånd mellan menyraderna (vid visning i flera rader) */
#meny_top_sub li {
	display: inline-block;
	padding: 15px 15px 15px 15px;
	margin: 5px 10px 1px 0;
	background: none;
	box-shadow: none;
	background-color: rgba(240,240,240,1);
	background-image: linear-gradient(to bottom, rgba(82,87,160,0.90), rgba(43,48,119,0.90));
	background-repeat: repeat-x;
	border: 1px solid rgba(0,0,0, 0.1);
	border-radius: 0;
/*	box-shadow: 2px 2px 10px rgba(0,0,0, 0.10);*/
}
#meny_top_sub a {
	/* Anger att menyvalen inte får brytas. OBS! Gäller hela menyraden och inte enstaka menyval */
/*	white-space: nowrap;*/
}
/* Färg på menytext */
#meny_top_sub a:link, #meny_top_sub a:visited { 
	color: rgba(255,255,255,1);
	text-decoration: none;
}
#meny_top_sub li:hover {
	background-image: none;
	background-color: rgba(40,43,79,0.90);
}

/* Menybox RESPONSIV MENY - används endast i "@media only" screen nedan */
#meny_top_sub_container {
/*	border: 1px solid #ccc;*/
}
/* Döljer RESPONSIV MENY */
#meny_top_sub_responsive_container {
	display: none;
}

/* --------------------------------------------------------------------------------- */
/* MENY 3 - VERTIKAL HUVUDMENY med undermeny i flera nivåer */
/* --------------------------------------------------------------------------------- */
/* MENY NIVÅ 1 */
/* Menybox */
#meny {
	margin: 0 0 0 0;
	padding: 10px 0 0 10px;
	font-size: 18px;
/*	border: 1px solid #ccc;*/
/*	background: rgba(248,244,149,1);*/
	border-radius: 5px;
}
/* Undermeny <UL> */
#meny ul {
	margin: 0 0 0 15px;
	padding: 0 0 0 0;
	list-style-type: none;
	/* Lodrät linje före undermenyer */
	border-left: 1px solid rgba(160,160,160,1);
}
/* Listelement <LI>  */
#meny li {
	list-style-type: none;
	border: none;
	padding: 0;
	margin: 5px 0 0 0;
	/* Inre skugga och yttre skugga */
	box-shadow: none;
}
/* Menyval */
#meny a {
	text-decoration: none;
	padding: 5px 5px 5px 17px;
	margin: 0;
	border-radius: 5px;
	border: 1px solid rgba(0,0,0, 0.1);
	background: rgba(255,255,255,1);
	display: block;
	margin: 0;

}
#meny a:link, #meny a:visited { 
	color: rgba(0,0,0,1);
}
#meny a:hover {
	cursor: pointer; 
	background: rgba(0,0,0,0.05);
}
/* ROLLOVER Symbol eller innehåll EFTER menyval */
#meny a:hover:after {
	content: "";
}
/* Menyval för AKTUELL SIDA */
#meny a#current {
	font-weight: bold;
	background-color: rgba(235,235,235,1);
	background-image: linear-gradient(to bottom, rgba(255,255,255, 0.90), rgba(235,235,235, 0.90));
	background-repeat: repeat-x;
	border-radius: 5px;
	color: rgba(0,0,0,1);
	padding: 5px 5px 5px 17px;
}
/* MENY NIVÅ 2, 3, 4, 5 osv (expanderande undermeny) */
/* Listelement <LI>  */
#meny_sub2 li {
	border: none;
	padding: 0;
	margin: 0;
}
/* Menyval */
#meny_sub2 a {
	padding: 5px 0 5px 15px;
	margin: 3px 0 5px 0;
	/* Vågrät linje före menyval */
	background-image: url(bilder/menutree_line.gif);
	background-repeat: no-repeat;
	background-position: 0 14px;
	border: none;
/*	background-color: rgba(194,191,115,1);*/
	border-radius: 5px;
	/* Inre skugga och yttre skugga */
	box-shadow: none;
}
#meny_sub2 a:link, #meny_sub2 a:visited { 
	color: rgba(0,0,0,1);
	text-decoration: none;
}
/* Menyval för AKTUELL SIDA */
#meny_sub2 a#current {
	font-weight: bold;
	/* Vågrät linje före menyval */
	background-image: url(bilder/menutree_line.gif);
	background-repeat: no-repeat;
	background-position: 0 14px;
}
#meny_sub2 a:hover {
	cursor: pointer; 
	background: rgba(0,0,0,0.05);
	/* Vågrät linje före menyval */
	background-image: url(bilder/menutree_line.gif);
	background-repeat: no-repeat;
	background-position: 0 14px;
}
#meny_sub3 a { }

/* --------------------------------------------------------------------------------- */
/* SÖKVÄG MED LÄNKAR - Visar sökväg till den aktuella sidan med länkade sidnamn */
/* --------------------------------------------------------------------------------- */
#path_meny {
	float: left;
	width: 96%;
	margin: 0;
	padding: 3px 2% 3px 2%;
	font-size: 18px;
	text-align: left;
	color: rgba(0,0,0,1);
	font-weight: bold;
	background-color: rgba(245,245,245, 0.5);
	border-radius: 5px 5px 0 0;
}
/* LÄNKAR i sökvägen */
#path_meny a:link, #path_meny a:visited, #path_meny a:active {
	color: #006699;
	text-decoration: none;
	font-weight: normal;
}
#path_meny a:hover { 
	text-decoration: underline; 
}
/* Utskriftsbild */
#path_meny_print_icon {
	margin: 0;
	padding: 0 10px 0 0;
	border: none;
}
/* Menybox RESPONSIV MENY - används endast i "@media only screen" */
#path_meny_container {
/*	border: 1px solid #ccc;*/
/*	display: none;*/
}
/* Döljer RESPONSIV MENY */
#path_meny_responsive_container {
	display: none;
}
/* --------------------------------------------------------------------------------- */
/* MENYTRÄD - SITEMAP */
/* --------------------------------------------------------------------------------- */
#sitemap {
	margin: 10px 0 0 0;
	padding: 10px 10px 10px 5px;
	background: rgba(255,255,255,1);
}
#sitemap ul {
	margin: 5px 0 5px 20px;
	padding: 0 0 0 0;
	list-style-type: none;
	/* Lodrät linje före lista */
	border-left: 1px solid rgba(160,160,160,1);
}
#sitemap li {
	margin: 0;
	padding: 0 0 0 15px;
	letter-spacing: 1px;
	font-weight: bold;
	/* Vågrät linje före menyval */
	background-image: url(../admin/bilder/menutree_line.gif);
	background-repeat: no-repeat;
	background-position: 0 8px;
	list-style-type: none;
}
#sitemap a { text-decoration: none; }
#sitemap a:link, #sitemap a:visited {
	color: rgba(0,0,0,1);
}
#sitemap a:hover { text-decoration: underline; }

/* --------------------------------------------------------------------------------- */
/*  KONTAKTFORMULÄR */
/* --------------------------------------------------------------------------------- */
#layout_kontaktformular {
	font-size: 16px;
	width: 80%;
	float: left;
	margin: 0;
	padding: 20px 2% 15px 2%;
	border-radius: 8px;
	background-color: rgba(248,248,248,1);
	border: 1px solid rgba(0,0,0,0.1);
}
/* Ärende */
.kontakt_arende {
	font-size: 16px;
	font-weight: bold;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(226,226,226,1);
	border-radius: 5px;
}
/* Formulärfält */
.kontakt_fnamn,
.kontakt_enamn,
.kontakt_email,
.kontakt_adress,
.kontakt_postnummer,
.kontakt_ort,
.kontakt_mobil,
.kontakt_motorcykel,
.kontakt_medlemskap 
{
	font-size: 16px;
	width: 80%;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(226,226,226,1);
	border-radius: 5px;
}

/* Meddelande */
.kontakt_meddelande {
	font-family:"Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif;
	font-size: 16px;
	width: 90%;
	height: 300px;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(226,226,226,1);
	border-radius: 5px;
}
/* Bekräftelse på skickat meddelande */
.kontakt_meddelande_confirmation {
	font-size: 16px;
	width: 90%;
	height: 500px;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(226,226,226,1);
	border-radius: 5px;
}
/* CAPTCHA-kod */
.capcha_text {
	font-size: 16px;
	width: 200px;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(226,226,226,1);
	border-radius: 5px;
}
/* Kantlinje runt CAPTCHA-kod */
.capcha_kantlinje {
	width: 200px;
	border: 1px solid rgba(0,185,0,1);
	margin: 0 0 5px 0;
	border-radius: 5px;
}
.skicka_knapp {
	margin: 5px 0 0 0;
	padding:  3px 5px 3px 5px;
	font-size: 20px;
	font-weight: normal;
}
/* ------------------------------------ */
/* FELMEDDELANDE formmail_captcha.php */
.error_formfield {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	width: 80%;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(255,0,0,1);
	border-radius: 5px;
}
.error_textfield {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	width: 90%;
	height: 300px;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(255,0,0,1);
	border-radius: 5px;
}
.error_captcha {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	width: 200px;
	padding: 10px 2% 10px 2%;
	margin: 0 0 5px 0;
	border: 1px solid rgba(255,0,0,1);
	border-radius: 5px;
}
.error_text {
	font-weight: bold;
	color: rgba(255,0,0,1);
	border-radius: 5px;
}
/* Felmeddelande */
#error {
	padding: 10px 10px 10px 10px;
	border: 1px solid rgba(255,0,0,1);
	border-radius: 10px;
	width: 80%;
	min-height: 50px;
	margin: 10px 0 5px 0;
}
/* ------------------------------------ */

/* --------------------------------------------------------------------------------- */
/* LOGINFORMULÄR "medlem/medlem_login.php" */
/* --------------------------------------------------------------------------------- */
/* Box med skugga */
#layout_login_border {
	width: 600px;
	float: left;
	clear: both;
	margin: 30px 0 0 20px;
	padding: 3px;
	border-radius: 10px;
	box-shadow: 0px 0px 4px rgba(153,153,153,1);
	background-color: rgba(255,255,255,1);
}
/* Box med bakgrundsfärg 1 */
#layout_login {
	font-size: 16px;
	width: 555px;
	float: left;
	margin: 0;
	padding: 0 20px 5px 25px;
	border-radius: 8px;
	background-color: rgba(248,248,248,1);
}
/* Box med bakgrundsfärg 2 */
#layout_login_form {
	width: 450px;
	float: left;
	margin: 0;
	padding: 20px;
	border-radius: 10px;
/*	border: 1px solid #66CC66; */
	background: rgba(204,255,102,1);
}
/* Box med informationstexten under formuläret */
#layout_login_info {
	width: 90%;
	float: left;
	margin: 30px 0 0 20px;
	padding: 0;
/*	border: 1px solid #ccc; */
}
/* Formulärfält */
.login_user {
	width: 400px;
	font-size: 16px;
	padding: 5px;
	border: 1px solid rgba(204,204,204,1);
}
.login_pass {
	width: 400px;
	font-size: 16px;
	padding: 5px;
	border: 1px solid rgba(204,204,204,1);
}
.login_fnamn {
	width: 400px;
	font-size: 16px;
	padding: 5px;
	border: 1px solid rgba(204,204,204,1);
}
.login_enamn {
	width: 400px;
	font-size: 16px;
	padding: 5px;
	border: 1px solid rgba(204,204,204,1);
}

/* ################################################################################# */
/* ################################################################################# */
/* ################################################################################# */
/* --------------------------------------------------------------------------------- */
/* MOBILTELEFON och SMARTPHONE (portrait/stående)
/* --------------------------------------------------------------------------------- */
/*@media only screen and (max-width: 480px){*/
@media only screen and (max-width: 768px){
/* --------------------------------------------------------------------------------- */
/* EXTRA! CSS-kod som används i vissa sidor */
/* --------------------------------------------------------------------------------- */
/* Startsidan */
#startkolumn_1 {
	float: left;
	width: 94%;
	margin: 10px 1% 0 1%;
	padding: 0 1% 0 1%;
/*	border: 1px solid rgba(0,0,0,0.05);*/
}
#startkolumn_2 {
	float: left;
	width: 94%;
	margin: 10px 1% 0 1%;
	padding: 0 1% 0 1%;
/*	border: 1px solid rgba(0,0,0,0.05);*/
}
/* NYHETSBOX startsida */
#news_box_intro {
	width: 85%; 
	height: auto; 
	border: 1px solid #cccccc; 
	padding: 10px; 
	float: left; 
	clear: both; 
	margin: 5px 0 5px 0px; 
	border-radius: 10px; 
	background-color: #fff;
}
/* --------------------------------------------------------------------------------- */

body, td, p {
	padding: 0;
	margin: 0;
	font-size: 16px;
	background-size: 100%;
	background-position: center 0;
	background-attachment: scroll;
}
h1 {
	font-size: 25px;
	letter-spacing: 1px;
/*	font-weight: normal;*/
	padding: 20px 0 20px 0;
	margin: 0;
}
h2 {
	font-size: 20px;
	letter-spacing: 1px;
/*	font-weight: normal;*/
	padding: 10px 0 15px 0;
	margin: 0;
}
h3 {
	font-size: 18px;
	letter-spacing: 1px;
/*	font-weight: normal;*/
	padding: 10px 0 15px 0;
	margin: 0;
}
/* KOLUMN MENY - döljer box som innehåller huvudmeny */
#kolumn_menu {
	display: none;
}
/* DIV som ska DÖLJAS vid visning */
#hide_on_smartphone {
	display: none;
}
/* BILDER - maximal storlek på bilder */
#kolumn_content img, #kolumn_content_utan_meny img{
	width: 95%;
	height: auto;
}
#sidhuvud img {
	max-width: 95%;
	height: auto;
}
/* DIV - maximal storlek på boxar */
#kolumn_content div {
	max-width: 95%;
}
/* --------------------------------------------------------------------------------- */
/* SIDHUVUD
/* --------------------------------------------------------------------------------- */
/*  Box som innehåller sidhuvudet och den horisontella huvudmenyn */
#sidhuvud_box {
	overflow: hidden;
	width: 95%;
	margin: 10px auto 10px auto;
	padding: 0;
	background-position: 0 0;
	background-size: 120%;
}
/* Box med innehållet i "sidhuvud.php" */
#sidhuvud {
	width: 100%;
	height: 120px;
	padding: 10px 0 5px 0px;
	margin: 0;
	background-color: rgba(255,255,255,0);
	border-bottom: none;
}
/* Box för rubrik eller logotype i sidhuvudet */
#sidhuvud_logo {
	display: none;
	float: left;
	width: 30%;
	overflow: visible;
	margin: 0 0 0 0;
	padding: 0;
	/*border: 1px solid #ccc;*/
}
/* Box för rubrik eller logotype i sidhuvudet */
#sidhuvud_rubrik {
	position: relative;
	float: left;
	width: 70%;
	height: 50px;
	margin: 10px 0 0 0;
	padding: 0;
	/*border: 1px solid #ccc;*/
}
/* Rubrik i sidhuvudet */
#sidhuvud h1 {
	width: 100%;
	font-size: 22px;
	text-align: center;
	color: rgba(0,0,0,1.00);
	text-shadow: 0 0 5px rgba(255,255,255,1.00);
	margin: 0;
	padding: 0;
}
/* Box som innehåller GOOGLE TRANSLATE */
#google_translate_box {
	float: left;
	width: 110px;
	margin: 10px 5px 5px 0;
	padding: 0;
}
/* --------------------------------------------------------------------------------- */
/* SÖKFUNKTION */
/* --------------------------------------------------------------------------------- */
#sokruta_sidhuvud {
	float: left;
	text-align: left;
	width: 70%;
	margin: 10px 0 0 0; 
	padding: 0;
}
/* Sökfält i sökfunktion */
.search_text {
	font-size: 20px;
	width: 70%;
	padding: 5px;
	margin: 0;
}
/* Sökfält i resultatsidan */
.search_text_resultat {
	font-size: 20px;
	width: auto;
	padding: 5px;
	margin: 0;
}
/* --------------------------------------------------------------------------------- */
/* SIDLAYOUT */
/* --------------------------------------------------------------------------------- */
/* CENTRERINGSBOX - för centrerade layouter */
#centerbox {
	overflow: hidden;
	clear: both;
	width: 95%;
	padding: 0;
	margin: 0 auto 0 auto;
/*	border: 1px solid #cc0;*/
}
/* KOLUMNBOX - box med meny och innehåll */
#kolumncontainer {
	width: 99%;
	margin: 0;
	padding: 0 0 30px 0;
}
/* KOLUMN INNEHÅLL - box för sidornas innehåll */
#kolumn_content {
	width: 90%;
	padding: 5px 5% 5px 5%;
	margin: 0;
}
/* SIDFOT - box som innehåller sidfoten */
#sidfot {
	width: 100%;
	height: 300px;
	margin: 0 0 100px 0;
	padding: 0;
}
/* SIDFOT INNEHÅLL - boxar som kan användas i sidfoten */
#sidfot div {
	width: 95%;
}


/* --------------------------------------------------------------------------------- */
/* MENY 1 - HORISONTELL HUVUDMENY Dropdownmeny */
/* --------------------------------------------------------------------------------- */
/* MENY - box */
nav {
	position: relative; /* Anges för att menyn INTE ska vara fixerad */
	width: 99%;
	margin: 0 auto 0 auto;
	padding: 0;
	border-radius: 10px 10px 0 0;
	background-image: none;
	box-shadow: none;
}
/* MOBIL MENY BUTTON - knappen som visas i startläget */
.toggle_top {
	display: block;
	padding: 20px 0 20px 80px;
	margin: 0 auto 0 auto;
	background-color: rgba(82,87,160,0.90);
	background-image: url(/wds_cms/css/bilder/responsive_nav_icon_white.png);
	background-repeat: no-repeat;
	background-size: 40px 30px;
	background-position: 15px center;
	color: rgba(255,255,255,1);
	font-size: 28px;
	text-decoration: none;
	border: 1px solid rgba(210,210,210,1);
	border-radius: 10px 10px 0 0;
/*	box-shadow: 3px 3px 10px rgba(0,0,0, 0.20);*/
}
/* Teckensnitt Menyval */
.toggle_top, .toggle {
font-family: 'Roboto', sans-serif;
}
/* Döljer menyval i startläget */
.toggle + a,  .menu {
	display: none;
}
/* HUVUDMENY - alla menyval som har UNDERMENY */
.toggle {
	display: block;
	padding: 0 0 0 10px;
	color: rgba(255,255,255,1);
	font-size: 24px;
	line-height: 60px;
	text-decoration: none;
	border: none;
}
/* HUVUDMENY  */
nav ul ul {
	float: none;
	position: static;
}
/* HUVUDMENY - menyval */
nav ul li {
	margin: 2px 0 2px 0;
	display: block;
	width: 100%;
/*	background-color: rgba(240,240,240,1);*/
	background-image: linear-gradient(to bottom, rgba(82,87,160,0.90), rgba(43,48,119,0.90));
	border-bottom: 1px solid rgba(0,0,0, 0.1);
}
/* HUVUDMENY - länkar text */
nav a, 
nav ul li a, 
nav ul li ul li a,
nav ul li ul li ul li a {
	font-size: 24px;
}
/* HUVUDMENY - hover-läge */
nav a:hover,
nav li a:hover,
nav ul li a:hover,
nav ul ul li a:hover,
nav ul ul ul li a:hover,
nav ul ul ul ul li a:hover {
	background: rgba(147,147,147,1.00);
}
/* Visar symbol efter menyval
Unicode används - se fler symboler här: 
http://en.wikipedia.org/wiki/Miscellaneous_Symbols 
http://nealchester.com/special-characters
https://dev.w3.org/html5/html-author/charref */
.toggle:after {
/*	content: "\00A0\00A0\0002B"; */
	content: "\00A0\00A0\0003E"; /* "00A0" är hårt blanksteg (&nbsp;) */
	color: rgba(200,200,200,1);
	font-weight: bold;
/*	font-size: 14px; */
}

/* Visar alla element som har "dropdown" som inledande attribut och där checkbox är vald */
[id^=dropdown]:checked + ul {
	display: block;
}
/* UNDERMENY 1 */
nav ul ul li {
	margin: 0;
	padding: 0;
	display: block;
	width: 100%;
	border: none;
	border-top: 1px solid rgba(0,0,0, 0.1);
}
/* UNDERMENY 1 - menyval */
nav ul ul .toggle,  
nav ul ul a {
	padding: 0 0 0 20px;
	background-color: rgba(255,255,255,1);
	color: rgba(0,0,0,1);
}
/* UNDERMENY 1 - länkar text */
nav ul ul li a {
	font-size: 20px;
	line-height: 50px;
}

/* UNDERMENY 2 */
nav ul ul ul li {
	position: static;
	width: 100%;
	border-bottom: none;
}
/* UNDERMENY 2 - menyval */
nav ul ul ul .toggle,
nav ul ul ul a {
	padding: 0 0 0 40px;
	background-color: rgba(240,240,240,1);
	border-bottom: none;
}

/* UNDERMENY 3 */
nav ul ul ul ul li {
	position: static;
	width: 100%;
}
/* UNDERMENY 3 - menyval */
nav ul ul ul ul .toggle,
nav ul ul ul ul a {
	padding: 0 0 0 60px;
	background-color: rgba(255,255,255,1);
}

/* UNDERMENY 4 */
nav ul ul ul ul ul li {
	position: static;
	width: 100%;
}
/* UNDERMENY 4 - menyval */
nav ul ul ul ul ul .toggle,
nav ul ul ul ul ul a {
	padding: 0 0 0 80px;
	background-color: rgba(240,240,240,1);
}

/* UNDERMENY 5 */
nav ul ul ul ul ul ul li {
	position: static;
	width: 100%;
}
/* UNDERMENY 5 - menyval */
nav ul ul ul ul ul ul .toggle,
nav ul ul ul ul ul ul a {
	padding: 0 0 0 100px;
	background-color: rgba(255,255,255,1);
}

/* UNDERMENY 6 */
nav ul ul ul ul ul ul ul li {
	position: static;
	width: 100%;
}
/* UNDERMENY 6 - menyval */
nav ul ul ul ul ul ul ul .toggle,
nav ul ul ul ul ul ul ul a {
	padding: 0 0 0 110px;
	background-color: rgba(240,240,240,1);
}

/* Döljer undermenyer i hover-läge i Smartphone */
nav ul li:hover > ul,
nav ul ul li:hover > ul,
nav ul ul ul li:hover > ul,
nav ul ul ul ul li:hover > ul {
	display: none;
}

/* --------------------------------------------------------------------------------- */
/* MENY 2 - HORISONTELL UNDERMENY som visas på varje sida */
/* --------------------------------------------------------------------------------- */
/* DÖLJER Menybox som visas i normalt visningsläge */
#meny_top_sub_container {
	display: none;
}
/* VISAR Menybox som visas på smartphone */
#meny_top_sub_responsive_container {
	display: block;
}
/* Menybox */
#meny_top_sub {
	clear: both;
	width: auto;
	padding: 0 0 5px 5px;
	margin: 0 0 0 0;
	font-size: 22px;
	border: 1px solid rgba(0,0,0,0.1);
	border-radius: 0 0 10px 10px;
	background-color: rgba(250,250,250,1);;
}
#meny_top_sub li {
/*	border: 1px solid rgba(0,0,0,0.30);*/
}
/* --------------------------------------------------------------------------------- */
/* SÖKVÄG MED LÄNKAR - Visar sökväg till den aktuella sidan med länkade sidnamn */
/* --------------------------------------------------------------------------------- */
/* DÖLJER Menybox som visas i normalt visningsläge */
#path_meny_container {
	display: none;
}
/* VISAR Menybox som visas på smartphone */
#path_meny_responsive_container {
	display: block;
}
#path_meny {
	float: left;
	width: 96%;
	margin: 0 0 0 0;
	padding: 5px 2% 5px 2%;
	background-color: rgba(255,255,255,1);
	color: rgba(0,0,0, 0.4);
	border-radius: 0px;
	font-size: 22px;
	font-weight: bold;
	text-align: left;
}
/* LÄNKAR i sökvägen */
#path_meny a:link, #path_meny a:visited, #path_meny a:active {
	font-weight: bold;
}
#path_meny a:hover { 
	text-decoration: underline; 
}
/* --------------------------------------------------------------------------------- */
/*  KONTAKTFORMULÄR */
/* --------------------------------------------------------------------------------- */
/* Yttre Box runt formuläret */
#layout_kontaktformular_border {
	width: 95%;
	margin: 0;
	padding: 0;
}
/* Inre Box runt formuläret - med innehållet */
#layout_kontaktformular {
	font-size: 18px;
	width: 95%;
	margin: 0;
	padding: 10px;
}
/* Ärende */
.kontakt_arende {
	width: 95%;
}
/* Förnamn */
.kontakt_fnamn {
	width: 95%;
}
/* Efternamn */
.kontakt_enamn {
	width: 95%;
}
/* E-postadress */
.kontakt_email {
	width: 95%;
}
/* Meddelande */
.kontakt_meddelande {
	width: 95%;
}
/* Bekräftelse på skickat meddelande */
.kontakt_meddelande_confirmation {
	width: 95%;
}
/* CAPTCHA-kod */
.capcha_text {
	width: 70%;
}
/* Kantlinje runt CAPTCHA-kod */
.capcha_kantlinje {
	width: 70%;
}
.skicka_knapp {
	font-size: 20px;
}
/* --------------------------------------------------------------------------------- */
/* LOGINFORMULÄR "medlem/medlem_login.php" */
/* --------------------------------------------------------------------------------- */
/* Box med skugga */
#layout_login_border {
	width: 300px;
	margin: 10px 0 0 0;
	padding: 3px;
}
/* Box med bakgrundsfärg 1 */
#layout_login {
	width: 100%;
	margin: 0;
	padding: 0 5px 5px 5px;
}
/* Box med bakgrundsfärg 2 */
#layout_login_form {
	width: 100%;
	margin: 0;
	padding: 10px;
}
#layout_login_info {
	width: 100%;
}
/* Formulärfält */
.login_user {
	width: 95%;
}
.login_pass {
	width: 95%;
}
.login_fnamn {
	width: 95%;
}
.login_enamn {
	width: 95%;
}

}

@media only screen and (min-width : 768px) and (max-width: 1280px){
#sidhuvud_box {
	width: 90%;
	margin: 130px auto 0 auto;
	padding: 0;
}
body {
	padding: 0;
	margin: 0 0 0 0;
	background-size: 120%;
	background-position: center 70px;
}

#sidhuvud_rubrik {
	float: left;
	width: 77%;
	height: 80px;
	margin: 0px 0 0 0;
	padding: 0;
	/*border: 1px solid #ccc;*/
}
/* Rubrik i sidhuvudet */
#sidhuvud h1 {
	width: 100%;
	font-size: 50px;
	text-align: center;
	margin: 0;
	padding: 0;
}
#sokruta_sidhuvud {
	float: left;
	text-align: left;
	width: 50%;
	margin: 0 10px 0 0;
	padding: 0;
/*	border: 1px solid #ccc; */
}

}

/* --------------------------------------------------------------------------------- */
/* RESPONSIV TABELL */
/* --------------------------------------------------------------------------------- */
/*  Visar information om att tabellen kan scrollas */
#responsiv_tabell:before {
	display: none;
}
#responsiv_tabell {
	width: 90%;
	float: left;
	margin: 0px 30px 30px 30px;
	padding: 0;
	border-collapse: collapse;
	border-spacing: 0;
	white-space: normal;
/*	border: 1px solid #000;*/
}
#responsiv_tabell th {
	text-align: left;
	padding: 5px 5px 5px 15px;
	white-space: nowrap;
	background-color: rgba(0,0,0,0.1);
	border-bottom: 1px solid #ccc;
}
#responsiv_tabell td {
	text-align: left;
    vertical-align: top;
	padding: 5px 5px 5px 15px;
	border-bottom: 1px solid #ccc;
}
/* Radbrytning - Ange numret på den kolumn du INTE vill ha radbrytning i text  */
#responsiv_tabell td:nth-child(4) {
	white-space: nowrap;
}
#responsiv_tabell td:nth-child(2) {
	white-space: nowrap;
}
/* Bakgrundsfärg varannan rad  */
#responsiv_tabell tr:nth-child(even)  td {
	background-color: rgba(0,0,0,0.03);
}
/* Bakgrundsfärg första kolumnen rad  */
#responsiv_tabell tr > td:nth-child(3) {
	background-color: rgba(0,0,0,0.1);
}

/* ################################################################################# */
/* SMARTPHONE och LÄSPLATTA (portrait/stående) */
@media only screen and (max-width: 768px){
/* Visar information om att tabellen kan scrollas */
#responsiv_tabell:before {
	display: block;
	width: auto;
	float: left;
	margin: 0;
	padding: 10px;
/*	border-radius: 5px; */
	border: 2px solid #53fc4b;
	background: #fff;
	color: #000;
	content: "OBS! Scrolla tabellen i sidled för att se allt innehåll \00A0\21D2"; 
	/* "00A0" är hårt blanksteg (&nbsp;) */
}
/* Responsiv Tabell - Visar scrollning i tabellen */
#responsiv_tabell {
	width: 95%;
	margin: 30px 10px 30px 10px;
	overflow-x: auto;
	display: block;
	box-shadow: inset -5px -5px 15px rgba(0,0,0, 0.1);
}
/* Radbrytning - Ange numret på den kolumn du INTE vill ha radbrytning i text  */
#responsiv_tabell td:nth-child(7) {
	white-space: nowrap;
}

}
/* ################################################################################# */