@font-face {
	font-family: "Montserrat";
	src: url("/fonts/Montserrat/Montserrat-Regular.ttf") format("truetype");
	font-weight: normal;
    font-style: normal;
}
@font-face {
	font-family: "Montserrat";
	src: url("/fonts/Montserrat/Montserrat-SemiBold.ttf") format("truetype");
	font-weight: 600;
    font-style: normal;
}
@font-face {
	font-family: "Montserrat";
	src: url("/fonts/Montserrat/Montserrat-Bold.ttf") format("truetype");
	font-weight: bold;
    font-style: normal;
}
#CountryMenu {display:none !important;}
* {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	font-family: 'Montserrat', sans-serif;
}
::-webkit-scrollbar {width: 10px;}
::-webkit-scrollbar-track {background: #f1f1f1;}
::-webkit-scrollbar-thumb {background: #4c4b55;}
::-webkit-scrollbar-thumb:hover {background: #333;}
ul {list-style-type: none;}
figure {margin:0;}
a {text-decoration: none;color:blue;}
a:hover {color: #505050;}
html {
	scroll-behavior: smooth;
	min-height: 100%;
	display:flex;
	flex-direction: column;
	}
body {
	flex-grow:1;
	margin:0;
	background-image: linear-gradient(135deg,#98dada,#fff4dc);
	display:flex;
	flex-direction: column;
	}
button {border:none; all: unset; cursor: pointer;}
h1, h2, h3, h4{font-weight: 600;}
.Rotate_180{transform:rotate(180deg);}
		/*TOP MENU*/
.Top_Menu aside {
	padding:0.8rem 1rem;
	background-image:linear-gradient(45deg,#305050, #149284);
	color: white;
	box-shadow: 0 0 10px #000;
	margin:0;
	height:5rem;
	position: relative;
	z-index: 3;
	}
.Top_Menu aside a {display: inline-block; height:100%;}
#MainLogo {max-height: 100%;}
.Top_Menu aside > div {float: right;}
.Top_Menu nav {
	width: 100%;
	height:3.5rem;
	background: #303030;
	box-shadow: 0 0 5px #000;
	border-bottom: 0.15rem solid #222;
	position: relative;
	z-index: 1;
	display: flex;
	}
.Top_Menu ul:first-of-type {display:flex;margin:0; padding:0 1rem; overflow-x: auto; scrollbar-width: none;}
.Top_Menu li {height:100%; white-space: nowrap;}
.Top_Menu nav > ul > li > a, #CountryMenu > button {
	display: flex;
	padding: 0rem 1rem;
	color: white;
	height: 100%;
    align-items: center;
	}
.Top_Menu nav a:hover, #CountryMenu button:hover, #CountryMenu a:hover {background: #149284;}
.Top_Menu > div {
	color: white;
    text-align: center;
    background: linear-gradient(#690404, #9b0000);
	padding: 1rem;
	display: none;
	box-shadow: 0 1px 4px #000;
	}
.Top_Menu ul.ShadowEffect {background-image: linear-gradient(to right, #111, transparent 3%, transparent 97%, #111);}
#CountryMenu ol {padding: 0; list-style-type: none; display:none;}
#CountryMenu ol.block {display: flex; flex-direction: column;}
#CountryMenu > ol {
    grid-template-columns: auto auto auto;
    color: white;
    background: #303030;
	position: absolute;
	max-height: 400px;
	overflow-x: hidden;
	}
#CountryMenu > ol button {padding: 1rem; display: block;}
#CountryMenu li {display: contents;}
#CountryMenu form {display: block;}
#CountryMenu input {
	font-size: 1rem;
    padding: 0.5rem;
    margin: 0.5rem;
	height: inherit;
	width: inherit;
	}
#CountryMenu a {padding: 0.5rem 2rem; background: #242424; color: white; display: block;}
#CountryMenu button span{float:right;display:block; transition: transform 0.6s ease; margin-left: 0.5rem;}
.TopMenuSlider, .TopMenuSlider svg {aspect-ratio: 1;}
.TopMenuSlider svg {
	border: #149184 double;
    border-radius: 50px;
    margin: 0.5rem;
    background: #314d4c;
	box-shadow: 0 0 3px #000;
	}
.TopMenuSlider path {stroke: #fefefe;}
.TopMenuSlider {background: #252525; display: none;}
.TopMenuSlider:hover svg {background: #1e2f2e; border: #0f6d64 double;}
.TopMenuSlider:hover path:first-of-type {animation: pulse 0.6s infinite alternate;}
.TopMenuSlider:hover path:last-of-type {animation: pulse 0.6s infinite alternate; animation-delay: 0.2s;}
@keyframes pulse {from {transform: scale(1);} to {transform: scale(0.8);}}
		/*MOBILE MENU*/
#MobileMenuButton {background: #222; height:100%; display: none;}
#MobileMenuButton:hover {background:#aaa;}
#MobileMenuButton svg {height: 100%; aspect-ratio: 1;}
#MobileMenuButton line { stroke:#149284; stroke-width:10; transition: 0.6s ease; transform-origin: 50% 50%;}
#MobileMenuButton.open line:first-of-type {transform: rotate(45deg) translateY(25px);}
#MobileMenuButton.open line:nth-of-type(2) {transform: scaleX(0);}
#MobileMenuButton.open line:last-of-type {transform: rotate(-45deg) translateY(-25px);}
		/*MAIN*/
#MainGrid {display:grid; grid-template-columns: 25% 50% 25%; margin-top: 4rem;}
main {flex-grow:1; overflow:hidden;}
.MainFlex {display: flex; flex-direction: column;}
.Index > div {
	padding: 2rem 0;
	display:grid;
	grid-template-columns: calc(50% - 1rem) calc(50% - 1rem);
	gap: 2rem;
	margin-bottom: 20rem;
	}
.Index > div > a {
	background: #fefefe;
	padding: 2rem 2rem;
	display: block;
	color: black;
	box-shadow: 0 2px 4px #303030;
	transition: 0.6s ease;
	}
.Index > div > a:hover {
	background:#305050;
	background-image: linear-gradient(to left, #305050e3, #305050e3),
						url("/images/ekosnurra-background.svg");
	box-shadow: inset 0 3px 7px #000;
	color:white;
   }
.Index > div header{text-align: center;}
.Main_Top_Ad, .Main_Converter_Ad, .Main_Top_Ad::after, .Main_Converter_Ad::after, 
.Main_Converter_Formula, form fieldset, .Main_Top_Ad, .Ad_To_Left, .Ad_To_Right, 
.Ad_To_Left::after, .Ad_To_Right::after, .Main_Explanation, #arbavgifttabell,
.Index > div a {border-radius: 1rem;}
label, form fieldset legend, form select, 
form input{border-radius:0.6rem;}
#MainGrid > header, .Main_Top_Ad, .Main_Converter_Ad, form, .Main_Converter_Formula, .Main_Skatt_Arbgift, #arbavgifttabell, #NoPage404 main a,
main > div {grid-column: 2;}
#MainGrid > header {
	text-align: center;
    /*padding: 1rem 20% 2rem 20%;*/
	padding: 1rem 0 2rem 0;
    margin: 0 0 1rem 0;
    background-color: #305050;
    color: white;
	background-image: 	linear-gradient(to top,#333 0%, transparent 0.3rem),
						linear-gradient(to bottom,#000 0%, transparent 0.5rem),
						linear-gradient(to left, #305050e3, #305050, #305050e3),
						url("/images/ekosnurra-background.svg");
    grid-column: 1 / 4;
	}
#MainGrid > header p {font-size:1.5rem; width: 53%; margin:auto;}
#RiktkursLista, #UtdelningLista {
	background: #305050;
	color: white;
	border-spacing: 0;
	padding: 0.5rem;
	font-size: 0.9rem;
	}
#RiktkursLista td, #UtdelningLista td {padding:0.3rem; font-weight: bold; text-align: center;}
#RiktkursLista tr:nth-child(even), #UtdelningLista tr:nth-child(even) {background: linear-gradient(to bottom, #000 0%, #133 0.3rem, #133 calc(100% - 0.2rem), #000 100%);}
#RiktkursLista tr:nth-child(odd):not(:first-child), #UtdelningLista tbody tr:nth-child(odd) {background: #2b726a;}
#RiktkursLista th {Padding: 0.5rem 0}
#RiktkursLista tbody th {border-bottom: 0.2rem solid black;}
#RiktkursLista tbody th span {display:inline-block; transition: 0.6s ease;}
#RiktkursLista tbody:not(:first-of-type) th {border-top: 0.2rem solid black;}
#RiktkursLista tbody tr:first-child {cursor:pointer;}
#RiktkursLista tbody tr:first-child:hover {background: #808080;}
#RiktkursLista .RiktkursListaHigher {
	background: linear-gradient(to top, #38c438 0%, #60da60 5%, #60da60 95%, #83f783 100%);
	color: black;
	font-size: 0.8rem;
	}
#RiktkursLista .RiktkursListaLower {
	background: linear-gradient(to top, #9b0000 0%, red 5%, red 95%, #ff6363 100%);
	color: black;
	font-size: 0.8rem;
	}
#RiktkursLista .RiktkursListaStarting {
	background: linear-gradient(to top, #b8b800 0%, yellow 15%, yellow 85%, #ffff80 100%);
	color: black;
	font-size: 0.8rem;
	}
#UtdelningLista th {padding:0.5rem 1rem;}
#UtdelningLista td {padding:1rem 0.3rem;}
.Aktiesammanfattning {display: grid;grid-template-columns: auto auto;}
.Main_Top_Ad, .Main_Converter_Ad {
	position: relative;
	overflow:hidden;
	margin:1.5rem 0 1.5rem 0;
	display:none;
	}
form {display: grid; grid-template-columns: 49% 49%; column-gap: 2%;}
form fieldset, .Main_Explanation {
	border: none;
	padding: 0 3rem 3rem 3rem;
	box-shadow: 0 2px 4px #303030;
	background-color: #fff;
	}
form fieldset legend {padding: 1rem 2.5rem; margin: auto;}
form fieldset h2 {font-size: 1.3rem; margin-top:2rem;}
#Trossamfund h2 {font-size: 1.5rem;}
form fieldset legend, #Trossamfund fieldset {
	font-size:1.5rem;
	font-weight:600;
	background-color: #305050;
	background-color: #2b726a;
	color:white;
	box-shadow: 0 2px 2px #000;
	}
.MomsLayout fieldset:first-child {padding: 0 1rem 3rem 1rem;}
form select, form input {
	font-size: 1.5rem;
	padding: 1rem;
	background-color: #305050;
	color:white;
	border:0.2rem solid #303030;
	box-shadow: inset 0 0 5px #333;
	}
#RaknaUtLon input[name="birthyear"] {width: 10rem;}
.ArbetsgivLayout div {display:inline-block;}
.ArbetsgivLayout div:last-of-type {float:right;}
.ArbetsgivLayout fieldset:last-of-type, .MomsLayout fieldset {text-align: center;}
::placeholder {color: #a0a0a0;}
.MomsLayout input, .MomsLayout fieldset div {margin-top: 1.5rem;}
.MomsLayout fieldset:first-child div {margin: 1.5rem 2rem 0 2rem;}
label[for="year"] {display:block; margin: 1rem 0;}
#Trossamfund div {
    display: grid;
    justify-content: center;
    grid-template-columns: 49% 49%;
    column-gap: 2%;
    row-gap: 1rem;
	text-align: center;
	}
#Trossamfund label, .MomsLayout fieldset label {
	padding:6% 0;
	background-color: #2b726a;
	background-color: #305050;
	color: white;
	font-size: 1rem;
	font-weight: initial;
	border:0.2rem solid #303030;
	box-shadow: inset 0 0 10px #333;
	}
.MomsLayout fieldset div {display:flex;gap:1rem;}
.MomsLayout fieldset label {flex:1; font-size: 1.5rem;}
#Trossamfund label:hover, form input[type=submit]:hover,.MomsLayout fieldset label:hover {
	background-color: #467474;
	border: 0.2rem solid #406060;
	}
form fieldset:nth-child(3), 
form fieldset:nth-child(4), input:last-child, #Trossamfund fieldset {grid-column: 1 / 3;}
input[type=radio] {display:none;}
#Trossamfund label:has(input[type=radio]:checked), .MomsLayout fieldset label:has(input[type=radio]:checked){
	background-color: #022;
	border: 0.2rem solid #133;
	}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {
  	-webkit-appearance: none;
  	margin: 0;
	}
#Lista_Over_Kommuner, #Lista_Over_Forsamlingar {display:block;}
#Trossamfund {padding: 2rem 2rem;}
#Trossamfund fieldset {
    border-radius: 0.6rem;
    border: 0.2rem solid #404040;
	background-color: #2b726a;
    box-shadow: 0 0 0 #303030;
	margin: 1rem 0 0 0;
	box-shadow: inset 0 0 10px #333;
	text-align: center;
	}
#Trossamfund fieldset:disabled {display:none;}
#Lista_Over_Forsamlingar {
	width: 75%;
    background-color: #ffffff;
    color: black;
	margin-top:2rem;
	margin:1rem auto;
	}
.ExtentDay {text-align: center; padding: 0 0 3rem 0;}
form input[type=submit]{
	width: 100%;
	cursor:pointer;
	margin: 2rem 0 4rem 0;
	}
.Main_Converter_Formula {
	text-align:center;
	padding: 3rem 1rem;
	background-color: #1c534d;
	background-image: 	linear-gradient(to left, #1c534de3, #1c534d, #1c534de3),
						url("/images/ekosnurra-background.svg");
	color: white;
	font-weight: bold;
	font-size:1.5rem;
	margin: 1rem 0;
	box-shadow: inset 0 3px 7px #000;
	}
.Main_Converter_Formula h2 {
	margin-top:0;
	font-size:2rem;
	color: white;
	}
.Main_Converter_Formula ul {padding: 0;}
.Main_Converter_Formula li:first-of-type {padding-bottom: 1rem;}
.Main_Skatt_Arbgift, #arbavgifttabell {text-align:center; margin: 0.5rem 0;}
#arbavgifttabell {
	padding:2rem;
	background:white;
	box-shadow: 0 2px 4px #333;
	}
#arbavgifttabell.DayTable {padding: 2rem 0;}
#arbavgifttabell.DayTable table {
	-webkit-border-vertical-spacing: 0;
    -webkit-border-horizontal-spacing: 0;
	}
.DayTable thead th, .DayTable tbody tr td {padding: 0.5rem;}
.DayTable tbody tr:nth-of-type(odd) {background: #1c534d; color: white;}
.DayTable tbody tr td:first-of-type {font-weight: bold;}
.Main_Skatt_Arbgift header {
	font-size: 1.2rem;
	border-bottom: 0.1rem solid black;
	}
.Main_Skatt_Arbgift section {
	width:50%;
	float:left;
	height:100%;
	padding: 2rem;
	font-size: 1.1rem;
	}
#skatter {
	background-color: #fff;
	box-shadow: 0 2px 4px #333;
	border-top-left-radius: 1rem;
	border-bottom-left-radius: 1rem;
	}
.Main_Skatt_Arbgift p{font-weight: 600;}
#arbavgift {
	background-color: #1c534d;
	border-top-right-radius: 1rem;
	border-bottom-right-radius: 1rem;
	box-shadow: inset 0 3px 7px #000;
	color: white;
	}
.Main_Skatt_Arbgift table, #arbavgifttabell table{
	text-align: left;
	-webkit-border-vertical-spacing: 1rem;
	-webkit-border-horizontal-spacing: 1rem;
	margin:auto;
	}
.Main_Skatt_Arbgift td {width: 70%;}
.Main_Skatt_Arbgift table td:nth-child(2){float:left; white-space: nowrap;}
.Main_Skatt_Arbgift tfoot, #arbavgifttabell tfoot{font-weight: 600;}
.Main_Explanation {
	padding: 2% 16% 4% 16%;
	text-align: left;
	grid-column: 1 / 4;
  	margin: 4rem 0 0 0;
	border-radius: 0;
	font-size: 1.1rem;
	align-self: flex-start;
	display: flex;
	gap: 4rem;
	background: #fefefe;
	}
.MainFlex > section {
	display: grid;
	grid-template-columns: auto 30%;
	gap: 0 2rem;
	}
.MainFlex > section > header {grid-column: 1/3;}
.MainFlex > section > p {font-size: 1.2rem; line-height: 2.5rem;}
.MainFlex figure img {width: 100%;}
.MainFlex figure p {font-size: 1.6rem;}
.NoFlex {display:block;}
.Main_Explanation > div {flex: 0 1 80%;}
.Main_Explanation > aside {flex: 0 1 20%;}
.Main_Explanation header p {font-weight: 600;}
.Main_Explanation h2 {margin-top: 5rem;}
.Main_Explanation h2:not(:first-child) {margin-top:2.5rem;}
.Main_Explanation p {line-height: 1.5rem; margin-top: 0.5rem;}
.Main_Explanation li {margin: 0.5rem 0;}
.Ad_To_Left, .Ad_To_Right {
	grid-column: 1;
    grid-row: 2/6;
    width: 75%;
    margin: 1.5rem auto;
	position: relative;
	overflow:hidden;
	}
.Main_Explanation nav h2 span {display:none;}
.Main_Explanation nav ul {
    list-style-type: none;
	border-left: thin solid black;
	line-height: 2rem;
	font-size: 1.2rem;
	padding-bottom:2rem;
	}
		/*FÖR ARBETSGIVARAVGIFT TEXT*/
.DividedLayout {
	display:grid;
	grid-template-columns: auto auto;
	column-gap: 2rem;
	row-gap:1rem;
	margin-top:2rem;
	}
.DividedLayout section {display: contents;}
.DividedLayout h3, .DividedLayout p {margin-top:0rem;}
.Main_Explanation a {color: #2f56cb}
.Main_Explanation nav a {color: #000}
.Main_Explanation a:hover {color: #888;}
.Arbetsgivaravgifttext svg {
	margin: 2rem 0 0 0;
	padding: 0 15%;
	width:100%;
	}
.Main_Explanation svg path {stroke-width:3;}
.Main_Explanation svg text:last-of-type {transform: scale(2);}
.ScalingEffect > circle, .ScalingEffect > circle:not(:first-of-type) {
	fill:none;
	stroke-width:60;
	stroke-dasharray:0 1200;
	}
.ScalingEffect > circle:first-of-type {
	fill:none;
	stroke-width:66;
	stroke-dasharray:1400;
	opacity: 0;
	}
.ScalingEffect > circle:nth-of-type(2){animation-delay: 0s;	--dash-length: 149;}
.ScalingEffect > circle:nth-of-type(3){animation-delay: 0.2s;--dash-length: 108;}
.ScalingEffect > circle:nth-of-type(4){animation-delay: 0.4s;--dash-length: 431;}
.ScalingEffect > circle:nth-of-type(5){animation-delay: 0.6s;--dash-length: 24;}
.ScalingEffect > circle:nth-of-type(6){animation-delay: 0.8s;--dash-length: 110;}
.ScalingEffect > circle:nth-of-type(7){animation-delay: 1s;--dash-length: 6;}
.ScalingEffect > circle:nth-of-type(8){animation-delay: 1.2s;--dash-length: 490;}
.DrawingEffect{animation: draw 1s ease-out forwards;}
@keyframes draw{from{stroke-dasharray: 0 1400;}	to{stroke-dasharray: var(--dash-length) 1400;}}
.Main_Explanation svg path, .Main_Explanation svg text{
	opacity: 0;
	font-size:1.2rem;
	animation-delay: 1.8s;
	}
.Main_Explanation svg path{animation-delay: 3s;}
.FadeInEffect{animation: fadeIn 2s ease-out forwards;}
.OpacityEffect{animation: fadeIn 1s ease-out forwards;}
@keyframes fadeIn{to {opacity:1;}}
.ScalingEffect{transform: rotate(-90deg);}
.ScalingEffectAnimation{animation: ScaleUp 3.8s ease-out forwards;}
@keyframes ScaleUp{from {transform: scale(0.8) rotate(-90deg);}	to {transform: scale(1.0) rotate(-90deg);}}
.FormatedTable {
	width:100%;
	-webkit-border-vertical-spacing: 0.2rem;
	-webkit-border-horizontal-spacing: 0;
	}
.FormatedTable th, .FormatedTable td {padding: 1rem 0 1rem 1rem;}
.FormatedTable td {background:#dee3e0;}
.FormatedTable td:nth-child(even) {background: #c0cbc4;}
.GeneralTable td, .GeneralTable th {padding: 0.5rem;}
.Ad_To_Right {grid-column: 3;}

		/*FOOTER*/
#Main_Footer {
	background-color: #151412;
	padding: 0 2rem;
	width: 100%;
	height: 4rem;
	color: white;
	font-size: 0.9rem;
	display:flex;
	align-items: center;
	}
#Main_Footer a {
	display:inline-block;
	height:100%;
	border-left: #808080 solid 0.1rem;
	padding: 0 2rem;
	color: white;
	margin:0;
	align-content: center;
	}
#Main_Footer a:first-child {margin-left:auto;}
#Main_Footer a:hover {background: #707070;}

		/* NO PAGE 404 */
#NoPage404 main{text-align: center;}
#NoPage404 main a{
	align-self: flex-start;
    font-size: 2rem;
    background-color: white;
    border-radius: 5% 47%;
    padding: 5rem 4rem;
    box-shadow: 6px 8px 5px #333;
    color: black;
    margin: 5% auto;
	}
#NoPage404 h1 {margin:0; font-size:10rem;}

		/*ANNONSER*/
.MainBodyAd {
	grid-column: 2;
	color:white !important;
	font-size:1.5rem;
	background:#305050;
	margin:1rem 0;
	text-align:center;
	line-height: 3rem;
	box-shadow: 0 0 5px inset #000;
	display: flex;
	flex-direction: column;
	}
.MainBodyAd:hover {color:white !important;}
.MainBodyAd img {width:100%;}
.MainBodyAd.MobileActive{display:none;}

		/*REG/COUNTY PAGES*/
#StatBackground {
	background-image: var(--county);
    background-position: center;
    background-size: cover;
    position: fixed;
    background-repeat: no-repeat;
    z-index: -1;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
	}
#StatHeader {
	background: #222222bd;
    padding: 3rem 25%;
    backdrop-filter: blur(22px);
	color: white;
	display: grid;
    grid-template-columns: auto auto;
	}
#StatHeader dd a {text-decoration: underline; color: #149284;}
#StatHeader > dl {display: grid; grid-template-columns: auto auto; white-space: nowrap; margin: 1rem 2rem;}
#StatHeader > dl > dt {background: #1e2323; padding: 0.5rem 1rem 0.5rem 1rem; margin: 0; font-weight: bold;}
#StatHeader > dl > dd {background: #141c1c6b; padding:0.5rem 1rem 1rem 1rem; margin: 0;}
#StatHeader dd ul {padding: 0;}
#StatHeader dd li {padding-bottom: 0.3rem;}
#StatHeader dd small {display: block; margin-left: 1rem;}
#StatHeader img {aspect-ratio: 1; width: 10rem; margin: 1rem 0 1rem 1rem; float:right;}
#StatHeader h1 {grid-column: 1 / 3; grid-row: 1;}
#StatHeader > p {grid-row: 2; grid-column: 1 / 3; margin: 0;font-size: 1.5rem;}
#StatHeader > p > span {font-weight: bold; position: relative; cursor: help;}
#StatHeader > p > span:last-of-type {color:#c1b6b6;}
#StatHeader > p > span::after, #SectionPoliticDistribution ul li::after {
	content: attr(data-text);
	position: absolute;
	bottom: 125%;
	left: 50%;
	transform: translateX(-50%);
	background: #333;
	color: #fff;
	padding: 4px 8px;
	border-radius: 4px;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s;
	font-size: 1.3rem;
	}
#StatHeader > p > span:hover::after, #SectionPoliticDistribution ul li:hover::after {opacity: 1;}
.info {
    position: absolute;
    top: -0.8rem;
    right: -0.4rem;
    font-size: 0.6rem;
    width: 1rem;
    height: 1rem;
    align-content: center;
    text-align: center;
    border-radius: 50%;
    background: #333;
    color: #fff;
    font-weight: bold;
	}
#StatHeader div p {line-height: 1.5rem;}
#StatSection {
	background: #343434;
	display: grid;
    grid-template-columns: 48% 48%;
    gap: 4%;
    row-gap: 4rem;
    padding: 4% 11%;
	}
#StatSection h2, #SectionPolitics h2 {grid-column: 1 / 3; color: white; font-size: 2.5rem; text-align: center;}
.CountyChart table {display: none; margin: auto 0;}
.CountyChart thead th:first-of-type {text-align: right;}
.CountyChart tbody td {text-align: center;}
.CountyChart tbody th {text-align: right;}
.CountyChart {
	display: flex;
    border-radius: 30px;
    background: #ffffff;
	box-shadow: 0 2px 5px #000;
	height: 500px;
	}
.CountyChart header {
	align-content: center;
	overflow: auto;
	padding: 2rem 1rem 2rem 2rem;
	background: #b5d5e0;
	border-top-left-radius: 30px;
	border-bottom-left-radius: 30px;
	flex-basis: 33%;
	}
.CountyChart h3 {text-align: center; font-size: 1.5rem;}
.CountyChart header p {font-size: 1rem; font-weight: bold; /*text-align: right;*/}
.CountyChart small {display: block; margin-left: 1rem;}
.CountyChart > div {
	display: flex;
	flex-direction: column;
	padding: 2rem 2rem 2rem 0;
	flex-basis: 67%;
	overflow: auto;
	}
.CountyChart div > div {display: contents;}
.CountyChart nav {text-align: right;}
.CountyChart button {
	background: #133;
	border: 0.2rem solid #000000;
    padding: 1rem;
    color: white;
	}
.CountyChart caption {margin-bottom: 1rem; font-weight: bold; font-size: 1.2rem;}
.CountyChart button.on{
	background: #266;
    border: 0.2rem solid #149284;
	}
#StatSectionToolTip {
	position: absolute;
	opacity: 0;
	background: #333;
	color: #fff;
	padding: 5px 8px;
	border-radius: 4px;
	font-size: 0.85rem;
	pointer-events: none;
	}
data {color: gray;}
data.Red {color: #d50000;}
data.Green {color: green;}
#SectionPolitics {
	background: #008561;
	padding: 4% 11%;
	display: grid;
    gap: 4%;
	row-gap: 4rem;
	}
#SectionRuler, #SectionParticipation, #SectionPoliticDistribution {
    background: white;
    border-radius: 30px;
    padding: 1rem 2rem 2rem 2rem;
    box-shadow: 0 2px 5px #000 inset;
	}
#SectionPolitics h3 {font-size: 1.5rem; margin-bottom: 0; text-align: center;}
#SectionRuler header p, #SectionPoliticDistribution header p {text-align: center; font-size: 1.5rem; margin-top: 0;}
#SectionRuler ul {display: flex; padding: 0; gap: 1rem; justify-content: center;}
#SectionRuler li {
    color: white;
    padding: 1rem;
    border-radius: 10px;
    box-shadow: 0 2px 2px #000;  
	}
#SectionRuler li h4 {margin-bottom: 0;}
#SectionRuler li p {margin-top: 0; font-weight: bold;}
#SectionParticipation {display: flex; flex-direction: column;}
#SectionParticipation p {font-size: 2rem; text-align: center; margin: auto;}
#SectionPoliticDistribution {grid-column: 1/3;}
#SectionPoliticDistribution ul {
	display: flex;
    color: white;
    border-radius: 20px;
    position: relative;
	padding: 0;
	}
#SectionPoliticDistribution ul::before {
	content: "";
    position: absolute;
    inset: 0;
    border-radius: 20px;
    pointer-events: none;
    box-shadow: 0 1px 5px #000 inset;
	z-index: 2;
	}
#SectionPoliticDistribution ul li {
	text-align: center;
    display: flex;
    padding: 1rem 0;
    flex-basis: calc(var(--mandates) / var(--mandatestotal) * 100%);
    flex-direction: column;
	position: relative;
	}
#SectionPoliticDistribution ul li:first-of-type{
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
}
#SectionPoliticDistribution ul li:last-of-type{
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
}
.Moderaterna {background: #2c51da;}
.Sverigedemokraterna {background: #c1c229;}
.Kristdemokraterna {background: #251f75;}
.FramtidIAle {background: #f7a323;}
.Vansterpartiet {background:#a7020a;}
.Socialdemokraterna {background: #e32127;}
.Miljopartiet {background: #8ccd44;}
.Centerpartiet {background:#309839;}
.Liberalerna {background: #77b8ea;}
.FolketsRost {background: #ff7800;}

@media screen and (max-width: 2200px) {
	#MainGrid {grid-template-columns: 20% 60% 20%;}
	}
@media screen and (max-width: 1800px) {
	#MainGrid {grid-template-columns: 15% 70% 15%;}
	#StatHeader {padding: 3rem 19rem;}
	#StatSection {padding: 3rem 4rem;}
	}
@media screen and (max-width: 1500px) {
	#MainGrid {grid-template-columns: 10% 80% 10%;}
	.Ad_To_Left, .Ad_To_Right {display:none;}
	.Main_Top_Ad, .Main_Converter_Ad {display:block;}
	.Main_Explanation {padding: 2% 2rem 4% 2rem;}
	#StatHeader {padding: 3rem 10rem;}
	.CountyChart {height: 400px;}
	#SectionPolitics {padding: 2rem 4rem;}
	}
@media screen and (max-width: 1200px){
	#MainGrid {grid-template-columns: 5% 90% 5%;}
	.Main_Skatt_Arbgift section {padding: 2rem 0;}
	#NoPage404 h1 {font-size:6rem;}
	#NoPage404 > a {
		font-size:1.5rem;	
		padding: 10%;
		margin:20% 0;
		}
	#StatHeader {padding: 3rem 2rem;}
	#StatSection {display: flex; flex-direction: column; padding: 2rem 1rem;}
	#SectionPolitics {padding: 2rem 1rem;}
	#StatSection h2, #SectionPolitics h2 {font-size: 2rem;}
	#SectionRuler ul {display: grid; grid-template-columns: auto auto;}
	}
@media screen and (max-width: 1000px) {
	html{font-size:75%;}
	.Main_Explanation svg text{font-size: 2rem;}
	#MainGrid {grid-template-columns: 2% 96% 2%;}	
	#GenHeader {margin: 2rem 0 1rem 0; padding: 1rem 4rem 4rem 4rem;}
	#GenHeader p{width:100%;}
	form select, form input{height:5rem;}
	.Main_Skatt_Arbgift table{-webkit-border-horizontal-spacing: 2rem;}
	.Main_Skatt_Arbgift table td:nth-child(2) {white-space: nowrap; float:left;}
	form input[type=submit]{
		margin: 1rem 0 0 0;	
		padding: 1rem 0;
		height:5rem;
		}
	.Main_Explanation, .Main_Explanation nav ul{font-size: 1rem;}
	}
@media screen and (max-width: 770px) {
	#MobileMenuButton {display: block;}
	#Top_Menu nav > ul {display: none;}
	#MobileMenuButton.open ~ ul {
		display: flex;
		flex-direction: column;
		position: absolute;
        top: 100%;
		background:#133;
		padding: 2rem 0;
	}
	#Top_Menu ul > li a, #Top_Menu ul > li button {padding: 1rem;}
	#CountryMenu {display: flex; flex-direction: column;}
	#CountryMenu > button {display: block;}
	#CountryMenu > ol {position: unset;}
}
@media screen and (max-width: 750px) {
	.Main_Skatt_Arbgift section{
		float: none;
		width: 100%;
		height: initial;
		}
	#skatter {
		border-top-right-radius: 1rem;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;;
		}
	#arbavgift {
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		border-bottom-left-radius: 1rem;
		}
	.Top_Menu ul:first-child > li > a, #Main_Footer a {display:none;}
	#StatHeader {display: flex; flex-direction: column; padding: 3rem 1rem;}
	#StatHeader dl {margin: 0;}
	}
@media screen and (max-width: 700px) {
	.Main_Explanation {flex-flow: column-reverse; gap:0;}
	.Main_Explanation section {margin-top:0;}
	.Main_Explanation nav {border: 0.2rem solid black; margin:2rem 0;}
	.Main_Explanation nav ul {display:none; border-left: none;}
	.Main_Explanation nav h2{
		text-decoration: underline;
		margin:0;
		padding:2rem;
		}
	.Main_Explanation nav h2 span{
		float:right;
		display:block;
		transition: transform 0.6s ease;
		}
	.Arbetsgivaravgifttext svg{padding: 0 0;}
	.MainBodyAd.MobileActive{display:flex;}
	.MainBodyAd.MobileInactive{display: none;}
	}
@media screen and (max-width: 650px) {
	.Top_Menu aside > div {display: none;}
	.Top_Menu > div {display: block;}
	.Main_Skatt_Arbgift table{margin:auto;}
	#GenHeader{padding: 1rem 2rem 4rem 2rem;}
	form{display: block;}
	#StatSection {padding: 2rem 1rem;}
	#SectionPolitics {display: flex; flex-direction: column; padding: 2rem 1rem;}
	}
@media screen and (max-width: 500px) {
	.Index > div {display:block; margin-bottom: 4rem;}
	.Index > div > a {margin-bottom: 2rem;}
	.CountyChart {display: flex; flex-direction: column; height: 550px;}
	.CountyChart header {border-bottom-left-radius: unset; flex-basis: unset; padding: 1rem;}
	.CountyChart > div {flex-basis: unset;}
	}
@media screen and (max-width: 430px) {
	form fieldset {margin: 0.5rem 0;}
	form input {width: 100%;}
	.Main_Explanation {font-size: 1.1rem;}
	.DividedLayout {display:block;}
	.MainFlex > section {display: flex; flex-direction: column;}

	#StatHeader dl {display: flex; flex-direction: column;}
	.CountyChart {height: 470px;}
	}
@media screen and (max-width: 350px) {
	.FormatedTable th {font-size: 0.9rem;}
}
@media screen and (max-width: 320px) {
    #SectionRuler ul {display: flex; flex-direction: column;}
}