@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;
	}
* {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	font-family: 'Montserrat', sans-serif;
	}
::-webkit-scrollbar{width: 15px;}
::-webkit-scrollbar-track{background: #f1f1f1;}
::-webkit-scrollbar-thumb{background: #4c4b55;}
::-webkit-scrollbar-thumb:hover{background: #333;}
.hide{display:none;}
.show{display:block;}
div#CookiebotWidget, div#CookiebotWidget * {z-index: 3;}
ul, ol{list-style-type: none;}
figure{margin:0;}
a{
	text-decoration: none;
	color:black;
	}
a:hover{color: #505050;}
html{
	scroll-behavior: smooth;
	min-height: 100%;
	display:flex;
	flex-direction: column;
	}
body{
	flex-grow: 1;
	margin: 0;
	background:#232323;
	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  */
body > header{
	padding:1.2rem 5rem;
	position: absolute;
	width: 100%;
	text-align: center;
	}
body > header > a{
	display: inline-block;
	height: 5rem;
}
body > header img{max-height: 100%;}
.Top_Menu{
	height:3.5rem;
	display: contents;
	}
.Top_Menu ul:last-of-type{
	height: inherit;
	display:flex;
	margin:0;
	padding:0;
	justify-content: center;
	}
.Top_Menu a{
	display:block;
	padding: 0rem 2rem;
	color: white;
	height: 100%;
    align-content: center;
	}
#Shopping_Cart_Box:hover svg{
background-color: #d32223;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in; 
    -o-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in; 
    transition: all 0.2s ease-in; 
}
#Shopping_Cart_Box{
	position: fixed;
	right:5rem;
    height: 5rem;
	color: white;
	display: inline-flex;
	align-items: center;
	z-index: 3;
}
#Shopping_Cart_Box svg{height: inherit; border-radius:1rem; background: #232323;}
#Shopping_Cart_Box span:first-of-type{
	position:absolute;
	bottom:-8%;
	left: -3%;
	background: #c29757;
	border-radius: 2rem;
	min-width:1.9rem;
	padding:0.2rem;
	text-align: center;
	font-size: 1.2rem;
}
#Shopping_Cart_Box:hover g{
	animation-name: CartAnimation;
	animation-duration: 2s;
	}
@keyframes CartAnimation{
0%  {transform: rotate(0deg) translateX(0);}
10% {transform: rotate(-20deg);}
40% {transform: translateX(8rem);}
41% {transform: translateX(-5rem);}
75% {transform: rotate(-20deg) translateX(0);}
100%{transform: rotate(0deg);}
}
.AddedToCart{
	animation-name: AddedCartAnimation;
	animation-duration: 2s;
	}

@keyframes AddedCartAnimation{
	0%  {transform: scale(0.8);}
	40% {transform: scale(1.2); background: #1e0ad1;}
	75% {transform: scale(0.9);}
	100%{transform: scale(1); background: #232323;}
	}
		/* MOBILE MENU */
.MobileMenuButton{
	transition: 0.6s ease;
	height: 5rem;
	aspect-ratio: 1;
	position:fixed;
	left:5rem;
	background: #232323;
	border-radius: 1rem;
	z-index:3;
	}
.MobileMenuButton:hover{background:#aaa;}
.Top_Menu button span{
	background: #c29757;
	width:70%;
	height: 10%;
	position: absolute;
	left:15%;
	transition: 0.5s ease;
	}
.MobileMenuSpan0{top:20%;}
.MobileMenuSpan1{top:45%;}
.MobileMenuSpan2{bottom:20%;}
.MobileMenuAnimation0{transform: rotate(45deg);top:45%;}
.Top_Menu .MobileMenuAnimation1{width:0;left: 50%;}
.MobileMenuAnimation2{transform: rotate(-45deg);bottom:45%;}
.Top_Menu ul:first-of-type, .Shopping_Cart{
	background:#c29757;
	position:fixed;
	z-index: 4;
	top:0;
	height:100vh;
	box-shadow: 0 0.1rem 0.25rem #000;
	margin:0;
	padding: 0;
	white-space: nowrap;
	transition: 1s ease-in-out;
	}
.Top_Menu ul:first-of-type {left:-15rem; width:15rem;}
.Top_Menu > ul:first-of-type > li:first-child, #Shopping_Cart header{
	display: flex;
    align-items: center;
    justify-content: space-between;
	height: 5rem;
	}
.Top_Menu > ul:first-of-type > li:first-child button, #Shopping_Cart header > button{
	font-size: 1.5rem;
    aspect-ratio: 1;
    height: 100%;
	}
.Top_Menu > ul:first-of-type > li:first-child button:hover, #Shopping_Cart header > button:hover {background: #967440;}
.Top_Menu > ul:first-of-type > li:first-child h2, #Shopping_Cart header > h2{
	margin: 0 0 0 2rem;
	text-align: right;
	}
.Top_Menu ul:first-of-type a{
	display:block;
	line-height: 3rem;
	padding: 0 1.5rem;
	white-space: nowrap;
	height: 100%;
	text-align: left;
	}
header ul ul{display:none;}
.Top_Menu ul:first-of-type.MobileVisibility{left:0;}
.Shopping_Cart{
	right:-33rem;
	left:unset;
	display:flex;
	flex-direction: column;
	width: 33rem;
	z-index:5;
	padding-top: 0;
	}
.Shopping_Cart_Visibility{
	right: 0% !important;
}
.Shopping_Cart ul{
	flex-grow: 1;
    padding: 0;
    margin: 0 1rem 0.3rem 0.3rem;
    box-shadow: 0 0 5px inset #000;
    background: #e0c295;
    overflow-y: auto;
}
.Shopping_Cart footer{
	background: #e3dcd1;
    padding-bottom: 2rem;
}
.Shopping_Cart footer div:first-of-type{font-size:1.6rem;}
.Shopping_Cart footer div{
	font-weight: bold;
	font-size: 1.1rem;
	text-align: left;
	padding:0.5rem 1rem;
}
.Shopping_Cart footer span{
	font-weight: normal;
    font-size: 1rem;
}
.Shopping_Cart footer a{
	display: block;
    background: green;
    color: white;
    padding: 1rem 0;
	margin-bottom: 2rem;
}
.Shopping_Cart ul li{
	display: flex;
	position: relative;
	height: 8rem;
	gap:1rem;
	border-bottom: solid 0.2rem #967440;
	white-space: normal;
}
.Shopping_Cart ul a{
	display:contents;
}
.Shopping_Cart ul a img{
	height:100%;
}
.Shopping_Cart ul li a > div{
	text-align:left;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}
.Shopping_Cart ul li a > div h4{
	margin:0;
}
.ProductPrice span{text-decoration: line-through; color:#808080;}
.Shopping_Cart ul form{
	width: 3rem;
    display: inline-flex;
    flex-direction: column;
	text-align: center;
}
.Shopping_Cart ul form button{
	aspect-ratio:1;
	font-size:2rem;
}
.Shopping_Cart ul form input{
	flex-grow:1;
	text-align: center;
	font-size:1.1rem;
	border: unset;
	background: unset;
}
.RemoveFromCart {
	position:absolute;
	top:0;
	left:0;
	padding:0.5rem;
	font-weight: bold;
	color: #c29757;
    background: #080808ec;
}
/*MAIN*/
.InformationPages > header h1, .InformationPages > header p{
	width: unset;
	margin: 1.5rem 5rem;
	}

main{
	background-image: repeating-radial-gradient(circle at 0 0, #00000005 0, #fffcf5 14px);
	/*background-image: repeating-radial-gradient(circle at 0 0, #00000000 0, #fffcf5 9px), repeating-linear-gradient(#e0c29561, #e0c2953d);*/
	flex-grow:1;
	/*background: #d7d6d1;*/
	background-color: #fffcf5;
	overflow: hidden;
	}
main > header{
	padding: 12rem 0 10rem 0;
    background-color: #305050;
	background:	linear-gradient(to top,#000000, #000000b0), 
				url("/Images/firewood1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
    color: white;
	}
/*h1,*/
main > header p, main > header > h1{
	width: 50%;
	margin: 1.5rem 0 1.5rem 5rem;}
main > article h1 {margin: 1.5rem 0 1.5rem 0;}
h1{font-size: 2.5rem;}
main > header p{font-size:1.5rem;}
main > aside:nth-of-type(2){
	text-align: center;
	font-size: 1.5rem;
	color: white;
	padding:0.5rem;
	/*background-image: linear-gradient(to top, #333 0%,  transparent 0.2rem), linear-gradient(to bottom, #000 0%, #c29757 0.3rem);*/
	background-color: #ed784d;
	box-shadow: 0 0 3px #000;
	position: relative;
	z-index: 2;
	}
main > aside:first-of-type{
	display: flex;
	justify-content: center;
	background-color: #fffcf5;
	font-size: 1.5rem;
	}
.IndexOffer{
	opacity: 0;
	background: #e3dcd1;
    font-size: 1.2rem;
    padding: 4rem 14%;
	box-shadow: 0 0 5px #000;	
}
.IndexOffer.show{animation: FadingIn 2s ease-in-out forwards;}
.IndexOffer h2{font-size: 2rem; margin-top: 0;}

@keyframes FadingIn {
	from {opacity:0; transform: translateY(3rem) scale(0.8);}
	70% {transform: scale(1.05);}
	to {opacity: 1; transform: translateY(0) scale(1);}
}

main > aside:first-of-type div{padding: 1.5rem 1.5rem 1.5rem 0.5rem;}
main > aside:first-of-type svg{width:1em;}
main > section, main > article{
	color: black;
    margin: 2rem 16%;
	background: #fcf9f3;
	}
main > article > p {font-size: 1.3rem;}
main > section h2, main > article h2{
	text-align: center;
	margin:0;
	padding:2rem;
	font-size: 2.5rem;
	}
.InformationHeader {
	text-align: left;
	padding-left: 0;
}
main > article h2 {text-align:left; padding: 2rem 2rem 0 0;}
.PersonalInfo, .ContactInfo {
	display: inline-block;
	width: 30%;
	margin: 5rem 0;
}
.ContactInfo {width: 49%; padding: 0 1rem; display: inline-grid; grid-template-columns: auto 20%; background: #e3dcd1;}
/*.ContactInfo img, .ContactInfo svg {
	width:100%;
	aspect-ratio: 1;
	background: #808080;
}*/
.ContactInfo svg{width:100%;}
.ContactInfo a {font-size:1.5rem; grid-column: 1/3;}
.ContactInfo h3 {font-size: 2rem; margin: 0; height:100%; align-content: center;}
.ContactInfo p {grid-column: 1/3;}
.InformationPages th {font-size: 1.5rem; white-space: nowrap; padding-bottom: 1rem;}
.InformationPages tbody {white-space: nowrap;}
.PersonalInfo:last-of-type, .ContactInfo:last-of-type {float:inline-end;}
.PersonalInfo img {
	width: 100%;
	aspect-ratio: 1;
}

.PersonalInfo div:first-of-type {
	font-size: 1.5rem;
	margin: 1rem 0 0.5rem 0;
}
.PersonalInfo div:last-of-type {font-size: 1.1rem;}
.PersonalInfo a {color:#967440;}
.DriedSpruce{
	display:grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows: auto;
	column-gap:3%;
	}
.DriedSpruce > header{
	grid-column: 1 / -1;
	font-size:2rem;
	}
.ProductMainTitle {margin-top: 0;}
.DriedSpruce a{display:flex; position:relative;}
.DriedSpruce article header div{
	position: absolute;
	z-index:1;
	top: 1rem;
	right: 2rem;
	color:white;
	text-decoration: underline;
	font-size: 1.5rem;
	}
.DriedSpruce img{width:100%;}
.DriedSpruce article{
	color: black;
	background: black;
	box-shadow: 0 0 3px #000;
	position:relative;
	display: flex;
	flex-direction: column;
	margin-bottom: 3rem;
	transform: rotateY(90deg);
	opacity: 0;
	transition: opacity 2s, transform 1s ease-in-out;
	}

	.DriedSpruce article.show {
		opacity: 1;
		transform: rotateY(0);
	}
	
	/* Reverse animation when leaving view */
	.DriedSpruce article.hide {
		opacity: 0;
		transform: rotateY(90deg);
	}
/*
.DriedSpruce article.show{
	animation: IndexRotate 1s ease-in-out forwards;
}

@keyframes IndexRotate {
	from {transform: rotateY(90deg);}
	to {transform: rotateY(0); opacity: 1;}
}*/
.DriedSpruce article header{flex:1;}
.DriedSpruce article img:hover, .DriedSpruce article header div:hover + img{opacity: 0.5; transition: 0.3s ease;}
.DriedSpruce article header div:hover{cursor: pointer; color:#b0b0b0}
.DriedSpruce h4{
	text-align: center;
	font-size: 1.5rem;
	margin:0;
	/*padding:0 1rem;*/
	padding: 1rem 0;
	position: absolute;
	bottom: 0;
	width: 100%;
	backdrop-filter: blur(5px);
	background: #00000082;
	color:white;
	}
.DriedSpruce form, .ProductContent form{display:flex;}
.ProductContent form{border-left: solid 0.1rem black; border-bottom: solid 0.1rem black;}
.DriedSpruce input[type="number"], .ProductContent input[type="number"]{
	width:21%;
	font-size:1.2rem;
	text-align: center;
	border:unset;
	background: #fffaef;
	border-radius:0;
	}
input:focus{
	outline: none;
	border: none;
	}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button{
	appearance: none;
}
input[type="number"] {
	appearance: textfield;
  }
.DriedSpruce button, .ProductContent button{
	text-align: center;
	width:15%;
	font-size: 1.5rem;
	padding:1rem 0;
	background: #fffaef;
	}
.DriedSpruce input[type="submit"], .ProductContent input[type="submit"]{
	width:50%;
	border: unset;
	background: #c29757;
	color:white;
	font-size:1.2rem;
	padding: 0;
	cursor:pointer;
	border-left: 0.1rem solid black;
	border-radius:0;
	}
.DriedSpruce input[type="submit"]:hover, .ProductContent input[type="submit"]:hover{background: #704e1b;}
.DriedSpruce input[type="submit"]:disabled, .DriedSpruce input[type="number"]:disabled, 
.DriedSpruce .Disabled, .DriedSpruce button:disabled, .ProductContent input[type="submit"]:disabled, .ProductContent input[type="number"]:disabled,
.ProductContent .Disabled, .ProductContent button:disabled{
	color: #808080;
	background:#606060;
	cursor: default;
}
.ProductInventoryCard, .ProductContent > div:last-of-type{
	background: #080808ec;
	color: white;
	text-align: right;
	padding:0.5rem 1rem;
	font-size: 0.9rem;
	}
.ProductInventoryCard span:first-of-type, .ProductInventoryCard span:nth-of-type(2) {float: left;}
.ProductInventoryCard span:nth-of-type(2) {margin-left: 0.5rem;}
.ProductInventoryCard span:first-of-type, .ProductInventoryCard svg {height: 100%;}
.GreenDot, .YellowDot, .RedDot{
	height: 62%;
	aspect-ratio: 1;
	display: inline-block;
	border-radius: 1rem;
	margin-left: 1rem;
}
.GreenDot{background: green;}
.YellowDot{background: yellow;}
.RedDot{background: red;}
.ProductDiscountCard{
	background: black;
	color: white;
	width: 100%;
	padding: 0.5rem 0;
	text-align: center;
	}
.ProductDiscountCard th{padding: 0 0 0.5rem 0;}
.ProductDiscountCard caption {
	background: black;
	font-weight: bold;
    font-size: 1rem;
	padding: 0.5rem 0 0 0;
}
.ProductPriceCard, .ProductContent > div:first-of-type{
	position:absolute;
	top:0;
	left:0;
	min-width:40%;
	background: #080808ec;
	color: white;
	padding:1rem;
	font-size:1.5rem;
	border-bottom-right-radius: 1rem;
	text-align: center;
	font-weight: bold;
}
.ProductPriceCard span, .ProductContent > div:first-of-type span{
	text-decoration:line-through;
	font-weight: 500;
	}

.SpecPro {
	display: grid;
    grid-template-columns: 40% auto;
    grid-template-rows: auto auto auto;
    margin: 2rem 18%;
}
.ProductContent {
	grid-row: 2/4;
	display: flex;
	flex-direction: column;
}
.ProductContent > div:first-of-type {
	position: initial;
	border-bottom-right-radius: 0;
	align-content: center;
}
.SpecPro > header {grid-column: 1/3; grid-row: 1; background: #fcf9f3;}
.SpecPro h1 {margin: 1rem; font-size: 2rem; text-align: right;}
.ProductContent img {
	width: 100%;
}
.SpecPro section:first-of-type {
	padding: 0 1rem 1rem 1rem;
	flex-direction: column;
	justify-content: space-between;
    align-items: flex-start;
	background: #fcf9f3;
}
.SpecPro p {line-height: 2rem;}
.ProductSpecific {
	margin-top: 1rem;
	padding: 1rem;
	background: #fcf9f3;
}
.SpecPro section h2 {
	padding: 1rem 0;
	font-weight: bold;
	font-size: 1.4rem;
	}
.SpecPro section:first-of-type h2 {padding-top: 0;}
.ProductSpecific table {border-spacing: 0; width:100%;}
.ProductSpecific tr:nth-child(odd) td {border-top: 0.1rem solid #aaa; border-bottom: 0.1rem solid #aaa;}
.ProductSpecific tr td:last-child {text-align: right;}
.ProductSpecific td {vertical-align: top; padding: 0.5rem 0.5rem;}
.SpecPro section p {
	margin-top:0;
	flex-grow:2;
	}
.SpecPro li {margin: 0.4rem 0;}
.FAQ {margin: 5rem 18%;}
.FAQ details {padding: 2rem; font-size: 1.3rem;}
.FAQ details:nth-child(odd) {background: #e3dcd1;}
.FAQ details:nth-child(even) {background: #fcf9f3;}
.FAQ li {padding:0.5rem 0;}
.FAQ summary {
	font-size: 1.75rem;
	font-weight: 600;
	display:flex;
	align-items: baseline;
	list-style: none;
	cursor: pointer;
	}
.FAQ summary::before {
	content: "▶";
	font-size: 2rem;
	padding-right: 1rem;
	}
.FAQ details[open] summary::before{content: "▼";}
summary::-webkit-details-marker {display: none;}
summary::marker {display: none;}
.CheckoutPage {
	display:grid;
	grid-template-columns: auto auto;
	padding: 0 20% 4rem 20%;
	}
#CheckoutDeilvery{
	grid-column: 1 / 3;
    margin: 0;
    text-align: center;
    font-size: 1.5rem;
	padding: 0 0 2rem 0;
	}
#CheckoutDeilvery h2{padding-bottom: 0;}
.CheckoutPage h1 {
	grid-column: 1/3;
	margin: 0;
	padding: 2rem 0;
	background: #fcf9f3;	
	}  
.CheckoutPage > form{
	background: #c29757;
	box-shadow: 0 0.1rem 0.25rem #000;
}
.CheckoutPage > form button {
    background: linear-gradient(to bottom, green, #296b11);
	color: white;
    padding: 1rem 0;
	text-align: center;
	height: 3rem;
}
.CheckoutPage > form button:nth-of-type(even){
	border-left: solid #31631e 2px;
	border-right: solid #31631e 2px;
}
.CheckoutPage > form button em {
	display: block;
	padding: 0.5rem;
}
.CheckoutPage > form button:hover {background: linear-gradient(to top, green, #296b11);}
.CheckoutPage > form input {
	font-size: 1.5rem;
    padding: 0.5rem;
	border: groove;
}
.CheckoutPage fieldset {
	display: grid;
	background: #e0c295;
	grid-template-columns: auto auto;
	gap: 2%;
	padding: 0 1rem 2rem 1rem;
	border: unset;
}
.CheckoutPage fieldset:last-of-type{
	grid-template-columns: 1fr 1fr 1fr;
	gap: 0;
	padding: 0;
}
.CheckoutPage fieldset:last-of-type legend {margin-left: 1rem;}
.CheckoutPage legend {
	background: #967440;
	font-size: 1.5rem;
    margin-bottom: 1rem;
    padding: 1rem;
    color: white;
	box-shadow: 0px 1px 2px #333;
	}
label[for="efternamn"], label[for="mobil"] {
	grid-column: 2;
    grid-row: 1;
	}
label[for="meddelande"] {
	grid-column: 2;
	grid-row: 1;
}
#meddelande{
	resize: none;
	padding:1rem;
	font-size: 1rem;
	grid-column: 2;
    grid-row: 2 / 7;
	border: groove;
	}

.CheckoutPage .Shopping_Cart {
	right:unset;
	position: unset;
	width: unset;
	height: 100%;
	margin-bottom: 1rem;
}
#PostnumberInvalid {
	border: red solid 2px;
    padding: 0.5rem 0;
    text-align: center;
    background: #ffa5a6;
    font-weight: bold;
	display: none;
	}
#PostnumberInvalid.show {display: block;}
.CheckoutPage .Shopping_Cart ul {margin:unset;}
.CheckoutPage .Shopping_Cart > h2 {
	text-align: left;
	padding: 1rem;
	font-size: 1.5rem;
}
.CheckoutPage dialog {
	padding: 0;
	box-shadow: 0 0 3px #000;
    border: 0.2rem solid #c29757;
    background: #fffaef;
	}
.CheckoutPage dialog > button, .CheckoutPage dialog form button {
	font-weight: bold;
	padding: 1rem;
	}
.CheckoutPage dialog button:hover {background: #967440;}
.CheckoutPage dialog form p {margin: 5rem 1rem;}
.CheckoutPage dialog form button{
	width: calc(50% - 0.1rem);
	padding: 1rem 0;
	text-align: center;
	background: #e0c295;
	}
.CheckoutPage dialog form button:last-of-type {
	float:right;
	border-left: 0.2rem solid #c29757;
	}


.TermsAndCon {margin-top:5rem; margin-bottom: 5rem;}
.TermsAndCon h1 {margin-bottom:0; font-size: 2rem;}
.TermsAndCon header p {font-size:1.5rem; margin-top:0;}
.TermsAndCon h2 {font-size: 1.5rem;}
.TermsAndCon li {font-size: 1.3rem; margin: 0.5rem 0;}
.TermsAndCon p > a {color: dodgerblue;}


#acceptedpayment{
	display: grid;
    grid-template-columns: 22rem 34rem;
    grid-template-rows: auto auto auto;
	column-gap: 1rem;
	justify-content: center;
	margin: 2rem 0;
}
#acceptedpayment header{
	grid-column: 1 / 3;
}
#acceptedpayment > p{margin: 0;}
#acceptedpayment > ul{
	grid-column: 2;
    grid-row: 2 / 6;
	padding: 0;
    margin: 0;
}
#acceptedpayment > ul li {
	height: 8rem;
    border-bottom: 0.2rem solid #c29757;
}
#acceptedpayment > ul li:first-child{
	border-top: 0.2rem solid #c29757;
}
#acceptedpayment > ul li:nth-child(odd){
	background: #e0c295;
}
#acceptedpayment > ul li:nth-child(even){
	background: #e3dcd1;
}
#acceptedpayment > ul a{
	display:flex;
	gap:1rem;
	height: 100%;
}
.PaymentImage {
	height: 100%;
	aspect-ratio: 1;
}

.PaymentTitle {
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
	font-size: 1rem;
	padding: 0;
}
.PaymentPrice {margin: 0.2rem 0;}

#acceptedpayment > ol{padding: 0;}
#acceptedpayment > ol li{margin:0.5rem 0;}
#acceptedpayment > ol h2, #paymentsuccesstable caption
{margin: 0; padding: 0; font-size:1rem;}
#paymentsuccesstable caption {text-align: left; font-weight: 600;}
.VedFakta{
	display:grid;
	grid-template-columns: auto auto;
	column-gap: 2rem;
	margin:2rem 12%;
	background: #fcf9f3;
}
.Rotate_180 {transform: rotate(180deg);}
.VedFakta nav {
	grid-column: 2;
	grid-row: 1/3;
}
.VedFakta h2{font-size:1.8rem;}
.VedFakta p{
	font-size:1.2rem;
	line-height: 1.8;
}
.VedFakta h3 {font-size:1.3rem;}
.VedFakta h3:not(:first-of-type){
	margin-top:0rem;
}
.VedFakta .EffSaker h3 {margin:0; font-size:1.2rem;}
.VedFakta .EffSaker p {
	margin-top: 0;
	font-size:1.1rem;
}
#ContentMenu h2 {
	padding: 2rem 0 0 0;
    text-align: left;
	}
#ContentMenu h2 span {display: none;}
#ContentMenu ul {
	border-left: thin solid black;
	line-height: 2rem;
}
#ContentMenu li {margin:0.5rem 0; font-weight: 600;}
#ContentMenu li a{display: block;}

		/*FOOTER*/
#Main_Footer{
	background-color: #151412;
	padding: 2rem 7rem 4rem 7rem;
	width: 100%;
	color: white;
	display:grid;
	grid-template-columns: 23% auto 23%;
	grid-column-gap:2%;
	font-size: 1.2rem;
	}
#Main_Footer ul{padding:0;}
#Main_Footer li{padding:0.2rem 0;}
#Main_Footer h2{font-size: 2rem;}
#Main_Footer section:first-of-type {
	grid-column: 2;
	grid-row: 1/3;
	}
#Main_Footer section:first-of-type p{padding:1rem 3rem 0rem 0;}
#Main_Footer section:nth-of-type(2){
	text-align: right;
	grid-column: 3;
    grid-row: 1 / 3;
	}
#Main_Footer strong{font-size:1.5rem;}
#Paymentlogo img {width:50%;}
#Main_Footer a{
	display:inline-block;
	color: white;
	}
#Main_Footer > div{
	grid-column: 1 / -1;
	line-height: 3rem;
	font-size: 0.9rem;
	}
#Main_Footer div a{
	float:right;
	padding: 0 1rem;
	}
#Main_Footer a:hover{background: #707070;}

		/* NO PAGE 404 */
#NoPage404 > header, .NoPosition {position: unset;}
#NoPage404 main{display: flex; padding:4rem 0;}
#NoPage404 main a{
	text-align: center;
	font-size: 2rem;
	background-color: white;
	border-radius: 5% 47%;
	padding: 5rem 4rem;
	margin: auto;
	box-shadow: 6px 8px 5px #333;
	color: black;
    display: inline-block;
	}
#NoPage404 h1{
	margin:0;
	font-size:10rem;
	width:unset;
	}
	
@media screen and (max-width: 2200px){
	.CheckoutPage {padding: 0 16% 4rem 16%;}
}
@media screen and (max-width: 2000px){
	html{font-size:80%;}
	.DriedSpruce div:last-of-type, .DriedSpruce h4{font-size:1.2rem;}
	.DriedSpruce input[type="submit"]{font-size:1.1rem;}
	.CheckoutPage {padding: 0 12% 4rem 12%;}
}
@media screen and (max-width: 1700px){
	.CheckoutPage {padding: 0 8% 4rem 8%;}
}
@media screen and (max-width: 1600px){
	html{font-size:75%;}
	main > section, main > article{ margin: 2rem 14%;}
}
@media screen and (max-width: 1500px){
	/*kolla upp */
	/*main > header p, h1 {width: 70%;}*/
	main > header > h1 {width:unset;}
	.DriedSpruce input[type="submit"]{font-size:1rem;}
	.DriedSpruce button{font-size: 1.3rem}
	.DriedSpruce input[type="number"]{font-size:1rem;}
	.ProductPriceCard {padding: 1rem 0.5rem;}
	#Main_Footer section:first-of-type p{padding:1rem 0 0 0;}
	#Paymentlogo img {width: 80%;}
	.VedFakta {margin: 2% 2rem 4% 2rem;}
}
@media screen and (max-width: 1200px){
	main > section, main > article {margin: 2rem 8%;}
	#NoPage404 h1{font-size:6rem;}
	#NoPage404 > a{
		font-size:1.5rem;	
		padding: 10%;
		margin:20% 0;
	}
	.FAQ {margin:5rem 5rem;}
	.CheckoutPage {padding: 0 1rem 4rem 1rem;}
}
@media screen and (max-width: 1000px){
	main > section, main > article{margin: 2rem;}
	.DriedSpruce{grid-template-columns: repeat(3, 1fr);}
	#Main_Footer{padding: 2rem 2rem 4rem 2rem}
	.CheckoutPage {
		display: flex;
		flex-direction: column;
	}
	.CheckoutPage > form {order:3;}
	.CheckoutPage h1 {order:2; text-align: center;}
	#acceptedpayment header h1 {font-size:2rem;}
}
@media screen and (max-width: 768px){
	main > header {padding: 12rem 2rem 10rem 2rem;}
	main > header > h1, main > header p{
		width:unset;
		margin:2rem 0;
		}
	main > aside:first-of-type, main > aside:nth-of-type(2){font-size: 1.2rem;}
	.Top_Menu ul:first-child > li > a{display:none;}
	.SpecPro {margin: 2rem 3%;}
	#Main_Footer{grid-template-columns: auto auto auto;}
	#Main_Footer section:first-of-type{
		grid-column: 1 / -1;
		grid-row: 1;
		}
	#Main_Footer section:last-of-type {
		grid-column: 2;
		grid-row: 2;
		}
	#Paymentlogo img {width: 100%;}
	#Main_Footer nav{
		grid-column: 1;
	}
	.FAQ {margin: 5rem 2rem;}
	.FAQ ul {padding-left:1rem;}
	.PersonalInfo {width: 48%;}
	#Main_Footer section:nth-of-type(2) {grid-row: unset;}
	#Main_Footer div{grid-column: 1 / -1;}
	#acceptedpayment{
		grid-template-columns: 22rem auto;
		justify-content: unset;
		margin: 2rem;
	}
	.RemoveFromCart{padding: 1rem;}
}
@media screen and (max-width: 730px){
	.Top_Menu ul:last-of-type{display:none;}
	.VedFakta {display: flex; flex-direction: column;}
	#ContentMenu {border: 0.2rem solid black; margin: 2rem 0; order: -1;}
	#ContentMenu ul {border-left: unset; display: none;}
	#ContentMenu h2 {
		text-decoration: underline;
        margin: 0;
        padding: 2rem;
	}
	#ContentMenu h2 span {
        float: right;
        display: block;
        transition: transform 0.6s ease;
    }
	#CheckoutDeilvery h2{
		font-size: 2rem;
	}
	#CheckoutDeilvery{
		font-size: 1.2rem;
	}
}
@media screen and (max-width: 680px){
	main > section, main > article {margin: 1rem;}
	.DriedSpruce{grid-template-columns: repeat(2, 1fr);}
	.MobileMenuButton, #Shopping_Cart_Box{top: 2rem; right:2rem}
	.MobileMenuButton {left:2rem;}
	body > header {padding: 8rem 0 1rem 0;}
	.SpecPro h1 {font-size: 1.5rem;}
	#acceptedpayment{
		display:flex;
		flex-direction: column;
		margin: 2rem 1rem;
	}
	#acceptedpayment ol{order: 3;}
	#acceptedpayment ul{order: 4;}
	#paymentsuccesstable{margin-top: 1rem;}
}
@media screen and (max-width: 600px){
	#Main_Footer{grid-template-columns: auto auto;}
	#Main_Footer section:nth-of-type(2) {grid-column: 2;grid-row: 2/4;}
	#Main_Footer section:last-of-type {
		grid-column: 1;
		grid-row: 3;
		}
	.CheckoutPage fieldset {
		display: flex;
		flex-direction: column;
	}
	.CheckoutPage fieldset label {padding-top: 1rem;}
	.CheckoutPage > form button:nth-of-type(even){
		border-left: unset;
		border-right: unset;
		border-bottom: solid #31631e 2px;
		border-top: solid #31631e 2px;
	}
	.CheckoutPage fieldset:last-of-type{padding-bottom: 1rem;}
}
@media screen and (max-width: 500px){
	main > aside:first-of-type{
		display: grid;
    	grid-template-columns: 5% 47% 5% 43%;
		align-items: center;
		justify-items: center;
		padding: 0 2%;
	}
	.IndexOffer {padding: 2rem 1rem;}
	#Main_Footer div{
		display: grid;
		grid-template-columns: 50% 50%;
	}
	#Main_Footer div span{
		text-align: center;
		grid-column: 1 / -1;
		grid-row: 2;
	}
	#Main_Footer div a{
		text-align:center;
		padding:0;
	}
	.ContactInfo:last-of-type{
		float: left;
	}
	.ContactInfo {
		display: grid;
		width: 100%;
		margin: 2rem 0;
	}
	.SpecPro {display: flex; flex-direction: column; margin: 2rem 0%;}
	.SpecPro h1 {margin: 1rem 0; text-align: center;}
	.SpecPro section:first-of-type {order: 3; margin-top: 1rem; display: flex;}
	.SpecPro section:first-of-type h2 {padding: 2rem 0 1rem 0;}
	.ProductSpecific{order: 4; padding: 1rem; margin-top: 0;}
	.ProductContent {order: 2; display: grid;}
	.FAQ {margin: 5rem 0.5rem;}
	.FAQ details{font-size: 1rem;}
	.FAQ summary::before{font-size:1.3rem;}
}
@media screen and (max-width: 430px){
	header nav {text-align: center;}
	#Main_Footer{font-size:1rem;}
	#Main_Footer h2{font-size: 1.5rem;}
	#Main_Footer strong{font-size: 1.2rem;}
	#Main_Footer section h3 {font-size: 0.7rem;}
	.Shopping_Cart {width:100%; right:-100%;}
	h1 {font-size: 2rem;}
	.CheckoutPage {padding: 0 0;}
	.ProductInventoryCard {
		padding: 0.5rem 0.4rem;
		font-size: 0.7rem;
		}
	.ProductDiscountCard, .ProductDiscountCard caption{font-size: 0.8rem;}
	.ProductDiscountCard{padding-bottom:1rem;}
	}
@media screen and (max-width: 375px){
	.PersonalInfo {
		width:100%;
		display:block;
	}
	.PersonalInfo:last-of-type{float:unset;}

	}

@media screen and (max-width: 320px){
	.DriedSpruce{grid-template-columns: repeat(1, 1fr);}
	}