:root {
	--baggrundfarve: #f8ffee;
	--tekstfarve: black;
	--linkfarve: #0000a0;
	--menutekstfarve: #eee8aa;
	--topmenubaggrund: #507242;
	--topmenubaggrund: #49673c;
	--topmenubaggrund2: #724264;
	--topmenubaggrund3: #425172;
	--venstremenubaggrund: #bcefab;
	--gbaggrund: #e6ffcd;
	--gtbaggrund: #cdffb9;	
	--ftbaggrund: #c8b5a3;
	--ctbaggrund: #c8f0ff;	
	--gobaggrund: #006400;
	--fobaggrund: #552200;
	--cobaggrund: #220055;
	--fbhbaggrund: #bb1100;
	--fbtbaggrund: #eeaaaa;
	--hoverfarve: #ffd700;
	--hoverbaggrund: #8b4513;
	--hovervisited: #000070;
	--hoveractive: #006400;
	--hoverfocus: #006400; 
	--solopfarve: #8b4513;
	--boxfarve1: #8fbc8f;
	--boxfarve2: #77aa77;
	--boxfarve3: #9fcc9f;
	--transitiontid: 300ms;
	--linkboxfarve: #8fbc8f;
	--linkboxfarve1: #bbffbb;
	--deadlinkboxfarve: #aaaaaa;
}

body {
	background-color: var(--baggrundfarve);
	font-family: helvetica, sans-serif, arial;
	justify-content: center;
	align-items: center;
	position: relative;
	margin: 0 auto;
	max-width: 1900px;

	font-size: 0.9rem;
	line-height: 1.3;
	
	cursor: default;
	
	a:link		{color: var(--linkfarve);}
	a:visited	{color: var(--hovervisited);}
	a:active	{color: var(--hoveractive);}
	a:focus		{color: var(--hoverfocus);}
	a:hover 	{cursor: pointer; color: var(--hoverfarve); background-color: var(--hoverbaggrund);}
	
	a.novis {color: red;}
	}
	h1 {
		font-size: 1.8rem;
		font-weight: bold;
	}
	h2 {
		font-size: 1.6rem;
		font-weight: bold;
	}
	h3 {
		font-size: 1.45rem;
		font-weight: bold;
	}
	h4 {
		font-size: 1.35rem;
		font-weight: bold;
	}
	h5 {
		font-size: 1.25rem;
		font-weight: bold;
	}
	h4.solop {
		color: var(--solopfarve);
		padding-left: 5px;
	}
	ul.solop li:first-child {
		text-justify: left;
	}
	ul.solop li:last-child {
		text-justify: right;
	}
	p {
		margin: 5px;
	}
	p.linkkat {
		font-size: 0.7rem;
	}
	b {
		font-weight: bold;
	}
	i {
		font-style: italic;
	}

	input {
		border: black;
	}
	input[type=text] {
		border: 2px solid var(--topmenubaggrund);
		background-color: var(--gtbaggrund);
		border-radius: 3px;
		padding: 4px;
		cursor: pointer;
		}
	select {
		border: 2px solid var(--topmenubaggrund);
		background-color: var(--gtbaggrund);
		border-radius: 3px;
		padding: 4px;
		cursor: pointer;
	}
	input[type=submit]{
		border: 2px solid var(--topmenubaggrund);
		background-color: var(--ftbaggrund);
		border-radius: 5px;
		padding: 4px;
		cursor: pointer;
	}
	input[type=checkbox]{
		border: 2px solid var(--topmenubaggrund);
		background-color: var(--gtbaggrund);
		display: block;
		border-radius: 3px;
		height: 20px;
		width: 20px;
		cursor: pointer;
	}
	input:checked {
		border: 2px solid var(--topmenubaggrund);
		background-color: var(--gtbaggrund);
		background-color: green;
	  }
		
header {
	width: 100%;
}

.hoved {
	width: 100%;
	background-color: var(--topmenubaggrund);
	border-radius: 15px 15px 0 0;
}

.hoved img.topbillede {
	min-height: 70px;	
	object-fit: cover;
	object-position: left;
	border-radius: 15px 15px 0 0;
	margin-bottom: -3.5px;
}

/* topmenu start */

.topmenu {
	display: contents;
	width: 100%;
	height: 24px;
	background: var(--topmenubaggrund);
	margin-top: px;
}
.topmenu a:visited, .topmenu a:link {color: var(--menutekstfarve);}

.pil {
	background:url(/billeder/bg/pilg.gif) right no-repeat;
}
body.f .pil {
	background:url(/billeder/bg/pilf.gif) right no-repeat;
}

.tmenu {
	display: flex;
	flex-wrap: wrap;
}

.tmenu, .tmenu li, .tmenu ul {
	margin: 0px;
	padding-bottom: 1px;
	padding-left: 2px;
	padding-right: 4px;
	background: var(--topmenubaggrund);
	border: 1px solid var(--topmenubaggrund);
}

.tmenu li {
	position: relative;
	float: left;
	flex-grow: 0;
	flex-shrink: 0;
	behavior: url(/css/hover.htc); /* i.e. 6 */
}

.tmenu a {
	display: block;
	padding-left: 2px;
	padding-right: 2px;
	padding-top: 0px;
	padding-bottom: 2px;
	color: var(--menutekstfarve);
	text-decoration:none;
}

html * .tmenu a:hover {   /* opera */
	background: var(--hoverbaggrund);
	color: var(--hoverfarve);
}

.tmenu ul {
	display: none;
	width: 15em;
	z-index: 10;
}
body.f .tmenu ul {
	border: 1px solid var(--hoverbaggrund);
}

.tmenu li li {
	padding-left: 2px;
	padding-right: 2px;
	float: none;
}
.tmenu li li a {
	padding: 0px;
}

* html .tmenu li li {
	display: inline;
}

* html .tmenu li li a {
	width :100%;
}

.tmenu li:hover {
	background: var(--hoverbaggrund);
	color: var(--hoverfarve);
}
.tmenu li:hover > ul {
	display: block;
	position: absolute;
	top: 0;
	left: 100%;
}
.tmenu > li:hover > ul {
	top: auto;
	left: auto;
}

.tmenu li.over ul { /* i.e. 6 */
	display: block;
	position: absolute;
}
.tmenu li.over ul ul {
	display: none;
}
.tmenu li.over ul li.over ul {
	display: block;
	position: absolute;
	top: 0;
	left: 96%;
}
.tmenu li.over ul li.over ul ul {
	display: none;
}
.tmenu li.over ul li.over ul li.over ul {
	display: block;
}

.tmenu li.right {
	color: var(--hoverfarve);
	text-align: right;
    flex-grow: 1;
}

.tmenu li.right:hover {
	background: var(--topmenubaggrund);
	color: var(--hoverfarve);
}
/* topmenu slut */



.hoved div.topburgerknap {
	position: absolute;
	right: 10px;
	top: 10px;
	height: 50px;
	z-index: -11;
}

.krop {
	display: grid;
	height: 100%;
	grid-template-columns: 200px auto;
	grid-template-rows: auto 20px;
}

.krop div.slideinknap {
	position: absolute;
	display: none;
	left: 0px;
	top: 50vh;
	height: 50px;
	z-index: -12;
}

/* venstremenu start */

.venstremenu {
	grid-column: 1 / 2;
	background-color: var(--venstremenubaggrund);
	width: 210px;
	padding: 10px 5px 5px 5px;
}
.venstremenu h5 {
	padding-top: 15px;
}

.main {
	grid-column: 2 / 3;
	background-color: var(--gbaggrund);
}
	
.main2 {
	display: grid;
	grid-gap: 15px;
	grid-template-columns: repeat(auto-fill, minmax(300px,1fr));
	grid-auto-rows: minmax(100px,auto);
	grid-auto-flow: dense;
	padding: 15px;
}
.main2 img {
	object-fit: contain;
	justify-content: center;
	width: 100%;
}
.forsideafsnit{
	background-color: var(--gtbaggrund);
	border-radius: 7px;
	padding: 5px;
	margin: 15px 15px 0px 15px;

}
.forsideafsnit p {
	padding-top: 5px
}
.lille_g{
	background-color: var(--gtbaggrund);
	border-radius: 7px;
	justify-content: center;
}
.lille_f{
	background-color: var(--ftbaggrund);
	border-radius: 7px;
	justify-content: center;
}
.lille_c{
	background-color: var(--ctbaggrund);
	border-radius: 7px;
	justify-content: center;
}
.bred_g {
	grid-column: span 2;
	background-color: var(--gtbaggrund);
	border-radius: 7px;
}
.bred_f {
	grid-column: span 2;
	background-color: var(--ftbaggrund);
	border-radius: 7px;
}
.bred_c {
	grid-column: span 2;
	background-color: var(--ctbaggrund);
	border-radius: 7px;
}
.hoej_g {
	grid-row: span 2;
	background-color: var(--gtbaggrund);
	border-radius: 7px;
}
.hoej_f {
	grid-row: span 2;
	background-color: var(--ftbaggrund);
	border-radius: 7px;
}
.hoej_c {
	grid-row: span 2;
	background-color: var(--ctbaggrund);
	border-radius: 7px;
}
.stor_g {
	grid-column: span 2;
	grid-row: span 2;
	background-color: var(--gtbaggrund);
	border-radius: 7px;
}
.stor_f {
	grid-column: span 2;
	grid-row: span 2;
	background-color: var(--ftbaggrund);
	border-radius: 7px;
}
.stor_c {
	grid-column: span 2;
	grid-row: span 2;
	background-color: var(--ctbaggrund);
	border-radius: 7px;
}
.solur {
	grid-column: -2 / -1;
	background-color: var(--gtbaggrund);
	border-radius: 7px;
}
.forsidebesked {
	grid-column: 1 / 2;
	background-color: var(--fbtbaggrund);
	border-radius: 7px;
}
.forsidebesked h5 {
	padding: 5px;
	background-color: var(--fbhbaggrund);
	color: var(--menutekstfarve);
}
.forsidebesked h4 {
	padding: 5px;
}
.forsidebesked p {
	font-size: 0.95rem;
	padding-top: 5px;
}
div.jul {
	background-color: var(--gtbaggrund);
	border-radius: 7px;
	text-align: center;
}

div.jul h5 {
	color: var(--menutekstfarve);
	text-align: left;
}

div.jul img {
	width: min-content;
}

a:hover.jul {
	cursor: pointer; color: var(--hoverfarve); background-color: var(--gtbaggrund);
}
div.jul p {
	text-align: left;
}
.bund {
	grid-column: 1/3;
	background-color: var(--venstremenubaggrund);
	border-radius: 0 0 7px 7px;
	padding: 5px 10px 5px 5px;
	height: 2.2rem;
	text-align: right;
}
.bund2 {
	grid-column: 1/3;
	display: flex;
	flex-direction: row;
}
ul.bund2 li:first-child{
	text-align: left;
	font-size: 0.7rem;
	padding: 0.3rem;
    flex-grow: 1;
}
ul.bund2 li:last-child{
	background-color: var(--gbaggrund);
	width: fit-content;
	padding: 0.15rem;
	text-align: right;
	flex-grow: 0;
    flex-shrink: 0;
	width: fit-content;
	border-radius: 0.3rem;
}
.main2 h5 {
	font-weight: bold;
	width: 100%;
	padding: 5px;
	border-radius: 7px 7px 0 0;
}
.main2 h5.g {
	background-color: var(--gobaggrund);
}
.main2 h5.f {
	background-color: var(--fobaggrund);
}
.main2 h5.c {
	background-color: var(--cobaggrund);
}

.main2 h5 a:link {color: var(--menutekstfarve);}
.main2 h5 a:hover {color: var(--menutekstfarve);}
.main2 h5 a:visited {color: var(--menutekstfarve);}
.main2 h5 a:active {color: var(--menutekstfarve);}
.main2 h5 a:focus {color: var(--menutekstfarve);}

.main2 a:hover img {
	opacity: 90%;
	transition: var(--transitiontid);
	-webkit-transform: scale(1.01);
	-ms-transform: scale(1.01);
	transform: scale(1.01);
}
.main2 a.fb {
	background: none;
}

.main2 a:focus img {
	opacity: 90%;
	transition: var(--transitiontid);;
}
.main2 a:active img{
	opacity: 90%;
	transition: var(--transitiontid);;
}
.main2 a:link img, img {
	transition: var(--transitiontid);;
}
.main2 a:visited img {
	transition: var(--transitiontid);;
}

.topafsnit{
	padding: 15px;
}
.topafsnit img{
	width: 100%;
	border-radius: 15px 15px 0 0;
	margin-bottom: -5px;
}
.topafsnit img:last-child {
	border-radius: 15px;
}
.poseafsnit{
	padding: 15px;
}
.billedtekst {
	background-color: var(--gtbaggrund);
	padding: 5px;
	border-radius: 0 0 7px 7px;
}
.maina {
	padding: 10px;
	display: grid;
	grid-gap: 15px;
	grid-template-columns: repeat(auto-fill, minmax(300px,1fr));
	grid-auto-rows: minmax(100px,auto);
	grid-auto-flow: dense;
	padding: 10px;
}
.maina img {
	object-fit: contain;
	justify-content: center;
	width: 100%;
	margin-bottom: -5px;
	border-radius: 7px 7px 0 0;
}
.maina h1 {
	padding-bottom: 10px;
	padding-left: 5px;
}
.maina h2, .maina h3, .maina h4, .maina h5 {
	padding-top: 10px;
	padding-left: 5px;
}
.maina p {
	padding-top: 5px;
	padding-left: 0;
}

.venstre {
	padding: 10px;
	padding-top: 0;
	grid-column: span 2;
}
.hoejre {
	border-radius: 7px;
	justify-content: center;
	grid-column: span 3;
}
.hoejre2 {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style: none;
    gap: 5px;
}
.hoejre2 li {
    padding: 5px;
    max-width: 330px;
    min-width: 100px;
	width: 100%;
	border-radius: 8px;
	padding-top: 10px;
}

.hoejre2 {
	border-radius: 7px;
}
.hoejre2 li img:last-child {
	border-radius: 7px;
}
#box,.box{
	background-color: var(--boxfarve1);
	padding: 5px;
	border-radius: 7px;
}
#box td {
	padding: 5px;
}
.box select, .box input{
	margin: 10px;
}
table.box1 {
	padding: 5px;
	width: 100%;
}
table.box1 th {
	background-color: var(--boxfarve2);
	font-weight: bold;
	padding: 5px;
}
table.box1 td {
	padding: 3px 5px;
}
table.box1 th h5 {
	padding: 0px;
}
table.box1 tr {
	background-color: var(--boxfarve1);
}
table.box1 tr:nth-child(2n) {
	background-color: var(--boxfarve3);
	padding: 4px 5px;
}
table.box1 tr:first-child {
	border-radius: 7px;
}
table.box1 tr:last-child {
	border-radius: 7px;
}
table.box1 td.red {
	background-color: #953553;
}
table.box1 td.gul {
	background-color: goldenrod;
}
table.box1 td.orange {
	background-color: darkorange;
}
table.box1 td.purple {
	background-color: purple;
}
table.box1 td.hvid {
	background-color: linen;
}
ul.aliste {
	padding: 15px 15px 15px 40px;
}
ul.aliste li {
	list-style-type: disc;
}
ol.aliste {
	padding: 15px 15px 15px 40px;
}
ol.aliste li {
	list-style-type: decimal;
}


.linkbox {
    display: flex;
	flex-direction: row;
    flex-wrap: wrap;
	padding: 20px;
	gap: 15px;
}
.linkbox li {
	background-color: var(--linkboxfarve);
    flex-grow: 1;
    flex-shrink: 0;
    padding: 5px;
    max-width: 400px;
    min-width: 100px;
	border-radius: 7px;
}
.linkbox li.deadlink {
	background-color: var(--deadlinkboxfarve);
}
.linkbox li.linknav {
	background-color: var(--linkboxfarve1);
}
.linkbox li h5{
	font-size: 1.10rem;
}
.linkbox li h2, .linkbox li:first-child h5 {
	padding-left: 5px;
}
.linkbox li ul {
	padding-left: 20px;
}
.linkbox li ul li {
	list-style: disc;
}

.venstremenu input[type="radio"]:checked+label { font-weight: bold; font-size: 1.25rem;}

.venstremenu label {
	text-transform: capitalize;
    font-size: 1.25rem;
	color: var(--hovervisited);
}
.venstremenu label:hover {
	background-color: var(--hoverbaggrund);
	color: var(--hoverfarve);
}

.venstremenu #m1:checked ~ #m1,
#m2:checked ~ #m2,
#m3:checked ~ #m3,
#m4:checked ~ #m4,
#m5:checked ~ #m5,
#m6:checked ~ #m6,
#m7:checked ~ #m7,
#m8:checked ~ #m8,
#m9:checked ~ #m9,
#m10:checked ~ #m10,
#m11:checked ~ #m11,
#m12:checked ~ #m12
    {
        display: block;
    }

.venstremenu #m1, #m2, #m3, #m4, #m5, #m6, #m7, #m8, #m9, #m10, #m11, #m12
    {display: none}


@media screen and (max-width: 500px){
	body {
		font-size: 1.2rem;
	}
	.forsidebesked p {
		font-size: 1.2rem;
	}
		.krop div.slideinknap {
		display: contents;
		height: 50px;
		z-index: 12;
	}
	
	.venstremenu {
		display: none;
	}

	.bred_g,.bred_f,.bred_c,.stor_g,.stor_f,.stor_c {
		grid-column: span 1;
	}
	

	.krop {
		display: grid;
		height: 100%;
		display: grid;
		grid-template-columns: auto;
		grid-template-rows: auto 20px;
	}
	.main2 {
		grid-template-columns: repeat(auto-fill, minmax(250px,1fr));
	}
	
	
}

@media screen and (max-width: 750px){
	.bred_g,.bred_f,.bred_c,.stor_g,.stor_f,.stor_c {
		grid-column: span 1;
	}
	.topmenu {
		display: none;
		height: 100vh;
	}
	.hoved div.topburgerknap {
		z-index: 11;
	}
	.tmenu {
		overflow-y: scroll;
		overflow-x: hidden;
		flex-wrap: wrap;
		flex-direction: column;
		justify-content: flex-start;
		text-align: center;
	}

	.hoved {
		background-color: var(--baggrundfarve);
	}
	.hoved img.topbillede {
		margin-bottom: -5px;
	}
	.tmenu ul {
		width: 100%;
		height: 100%;
		flex-wrap: wrap;
		flex-direction: column;
		align-content: space-between;
	}
	.tmenu ul li {
		display: flex;
		flex-wrap: nowrap;
		flex-direction: column;
		background: darkslategray;
		justify-content: center;
		text-align: center;
		transition: all ease-in-out var(--transitiontid);;
	}
	.tmenu ul li a {
		width: 100%;
		height: fit-content;
		padding: 0;
		margin: 0;
		text-align: center;
	}
	.tmenu ul li ul {
		display: none;
		flex-wrap: nowrap;
		flex-direction: column;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 100;
	}
	.tmenu ul li ul li {
		height: fit-content;
		display: block;
		display: none;
	}
	.tmenu ul li ul li a {
		height: fit-content;
		display: block;
		display: none;
	}
	.tmenu > li:hover > ul {
		top: auto;
		left: auto;
		display: none;
	}
	
	.tmenu ul li:focus>ul, .tmenu ul li:hover>ul {
		display: flex;
		display: none;
		visibility: visible;
		opacity: 1;
	}
	
}