@charset "utf-8";
/* CSS Document */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'lato', sans-serif;}
	
	section, article, nav, aside, main, main, footer, header, figure {display:block}


/* mobil version */

@media screen and (min-width:320px) and (max-width:480px) {
	div#wrapper {
		width: 100%;
		background: #1B2021;
	}
	
	.fixed-bg {
		background-size: 750px 1000px;      
		background-repeat: no-repeat; 
		background-attachment: fixed;
	}
	
	.bg-1 {
	background-image: url("Background/Baggrund_Ny_scroll2.jpg");
	}
	
	header {
		height: 80px;
		background: url("Background/Baggrund_Ny.png");
		background-repeat: no-repeat;
		background-size: 100%;
		padding-top: 15px;
		padding-bottom: 15px;
	}
	
	header a {
		display: block;
		background: url("../logo/SVG/LogoNyt2.svg") no-repeat center;
		height: 180px;
		width: 100%;
		background-size: 67%;
	}
	
	nav {
		height: 40px;
		color: rgba(193,133,151,0.9);
		background: #323639;
		text-align: center;
		line-height: 40px;
		text-decoration: none;
	}
	
	Nav a:hover {
	color: #A32B50;
	transition: all 0.3s ease; /* Add transition for hover effects */
	}
	
	h2 {
		font-size: 24px;
		font-weight: 900px;
		text-align: center;
		color: rgba(255,255,255,0.7);
		margin: 20px 0 10px;
	}
	
	/* About me */
	
		
	.about_me article {
		width: 100%;
		padding: 0 20px;
		margin-top: 10px;
	}
	
	.webbanner img {
		display: block;
		width: 100%;
		margin: 0;
		padding: 0 20px;
	}
		
	.about_me article div {
		background: #323639;
	}
	
	.about_me article h3 {
		font-size: 22px; 
		text-align: center;
		color: rgba(193,133,151,0.9);
		padding-top: 10px;	
	}
	
	.about_me article p {
		font-size: 14px;
		text-align: left;
		color: rgba(255,255,255,.6);
		padding: 5px 15px 15px 10px;
	}
	
/* knap */
	
	.beskrivelse article {
		width: 100%;
		padding: 0 20px;
		padding-top: 30px;
		margin-bottom: 10px;
		height: 300px;
		text-align: center;
	}
	
	.beskrivelse a { /* klik boks */
	background: #A32B50;
	color: white;
	width: 110px;
	height: calc(26px + 1em);
	padding: 10px;
	border: 2px;
	border-radius: 10px;
	font-size: 24px;
	font-weight: 900;
	text-decoration: none;
	}
	
	
	/* footer */
	
	
	footer {
		background: #1B2021; 
		padding-top: 5px;
		padding-bottom: 210px;
	}
	
	adreess {
		font-size: 14px;
		color: rgba(255,255,255,.6);
		text-align: center;
		font-style: normal;
	}
	
	.row {
		width: 100%;
		display: flex;
		flex-direction: column;
		padding-top: 20px;
		padding-bottom: 20px;
		justify-content: center;
		text-align: center;
		grid-gap: 40px;
	}
	
	
	/* burger menu */
	
	header + div {    
		top:200px;    
		transition: 500ms ease-in-out;    
		position: relative;
		-webkit-transform:translate(0, 0);
		-moz-transform:translate(0, 0);
		transform:translate(0,0);
	}
	
	header {
		height:200px;
		position:absolute;
		width:100%;
		z-index:10;
	}
	
	header a#burger_menu { 
		display:block; width:48px;      
		height:32px;      
		background:url("billeder-abcd/burger_menu.svg")rgba(255,255,255,.0) no-repeat; 
		position:absolute;
		right:16px;
		top:160px;
		z-index: 12;
	}
	
	nav {    
		display:block;    
		height:500px;    
		width:100%;    
		position:absolute;    
		left: -100%;    
		top:0;
		background: #323639;
	}
	
	nav a {
		font-size: 22px;
		font-weight: 900px;
		text-align: center;
		color: rgba(193,133,151,0.9);
		margin: 20px 0 10px;
		text-decoration: none;
	}
	
	li {
		border-bottom-style: solid;
		border-bottom-color: rgba(255,255,255,0.7);
	}
	
	#wrapper { 
		overflow:hidden;
		width:100%;
	}
	
	.menu_aaben {   
	-webkit-transform:translate(100%, 0);
	-moz-transform:translate(100%, 0);
	transform:translate(100%, 0);
}
}
/* tablet version */

@media screen and (min-width:481px) and (max-width: 768px) {
	div#wrapper {
		width: 100%;
		background: #272C2E
	}
		
	.fixed-bg {
		background-size: cover;   
		background-attachment: fixed;   
		background-repeat: no-repeat;   
		background-position: center center;			
	}
	
	.bg-1 {
	background-image: url("Background/Baggrund_Ny_scroll2.jpg");
	}
	
	
	header {
		height: 280px;
		background: url("Background/Baggrund_Ny.png");
		background-repeat: no-repeat;
		background-size: 100%;
		padding-top: 30px;
	}
	
	header a {
		display: block;
		background: url("../logo/SVG/LogoNyt2.svg") no-repeat center 10px;
		height: 350px;
		width: 100%;
		background-size: 67%;
	}
	
	nav {
		height: 40px;
		color: rgba(193,133,151,0.9);
		background: #323639;
		text-align: center;
		line-height: 40px;	
		text-decoration: none;
	}
	
	Nav a:hover {
	color: #A32B50;
	transition: all 0.3s ease; /* Add transition for hover effects */
	}
	
	h2 {
		font-size: 24px;
		font-weight: 900px;
		text-align: center;
		color: rgba(255,255,255,0.7);
		margin: 20px 0 10px;
	}
	
	
	/* About me */
	
	.about_me article {
		width: 54%;
		padding: 0 20px;
		
		margin-bottom: 10px;
	}
	
	.webbanner img {
		display: block;
		float: right;
		padding: 0 20px;
		padding-top: 20px;
		width: 49%;
	}
	
	.about_me article div {
		background: #323639;
		height: 280px;
	}
	
	.about_me article h3 {
		font-size: calc(22px + 1em); 
		text-align: center;
		color: rgba(193,133,151,0.9);
		padding-top: 10px;
	}
	
	.about_me article p {
		font-size: 18px;
		text-align: left;
		color: rgba(255,255,255,.6);
		padding: 5px 15px 15px 10px;
	}
	
/* knap */
	
	.beskrivelse article {
		width: 100%;
		padding: 0 20px;
		padding-top: 20px;
		margin-bottom: 20px;
		height: 500px;
	}
	
	.beskrivelse a { /* klik boks */
	background: #A32B50;
	color: white;
	width: 110px;
	height: calc(26px + 1em);
	padding: 10px;
	border: 2px;
	border-radius: 10px;
	font-size: 32px;
	font-weight: 900;
	text-decoration: none;
	}
	
	
	/* footer */
	
	footer {
		background: #1B2021; 
		padding: 2px;
		clear:left;
	}
	
	adreess {
		font-size: 14px;
		color: rgba(255,255,255,.6);
		text-align: center;
		font-style: normal;
	}
	
	.row {
	width: 100%;
	display: flex;
	flex-direction: row;
	padding-top: 20px;
	padding-bottom: 20px;
	justify-content: center;
	text-align: center;
	grid-gap: 40px;
	}
	
	header a#burger_menu {
	display: none;
}
	
	nav {
		height: 40px;
	}
	
	nav li {
		display: inline-block;
		margin-right: 1.5rem;
		line-height: 40px;
		height: 40px;
	}
	
	nav li:last-child {
		margin-right: 0;
	}
	
	nav a {
		font-size: 22px;
		font-weight: 900px;
		text-align: center;
		color: rgba(193,133,151,0.9);
		margin: 20px 0 10px;
		text-decoration: none;
	}
	
	}

/* pc version */

@media screen and (min-width:769px) {
	div#wrapper {
		width: 100%;
		background: #272C2E;
		margin: 0 auto;
		max-width: 1200px;
	}
	
	.fixed-bg {
		background-size: cover;   
		background-attachment: fixed;   
		background-repeat: no-repeat;   
		background-position: center center;			
	}
	
	.bg-1 {
	background-image: url("Background/Baggrund_Ny_scroll2.jpg");
	}
	
	header {
		height: 300px;
		background: url("Background/Baggrund_Ny.png");
		background-repeat: no-repeat;
		background-size: 100%;
		padding-top: 30px;
	}
	
	header a {
		display: block;
		background: url("../logo/SVG/LogoNyt2.svg") no-repeat center 20px;
		height: 350px;
		width: 100%;
		background-size: 43%;
	}
	
	nav {
		height: 40px;
		color: rgba(193,133,151,0.9);
		background: #323639;
		text-align: center;
		line-height: 40px;
		text-decoration: none;
	}
	
	Nav a:hover {
	color: #A32B50;
	transition: all 0.3s ease; /* Add transition for hover effects */
	}
	
	h2 {
		font-size: 24px;
		font-weight: 900px;
		text-align: center;
		color: rgba(255,255,255,0.7);
		margin: 20px 0 10px;
		padding-top: 10px;
	}
	
	
	/* About me */
	
	.about_me article {
		width: 54%;
		padding: 0 20px;
		margin-bottom: 20px;
	}
	
	.webbanner img {
		width: 48%;
		display: block;
		float: right;
		padding: 0 20px;
		padding-top: 20px;
	}
	
	.about_me article div {
		background: #323639;
		height: 455px;
	}
	
	.about_me article h3 {
		font-size: calc(22px + 1em); 
		text-align: center;
		color: rgba(193,133,151,0.9);
		padding-top: 10px;
	}
	
	.about_me article p {
		font-size: 22px;
		text-align: left;
		color: rgba(255,255,255,.6);
		padding: 5px 15px 15px 10px;
	}
	
/* knap */
	
	.beskrivelse article {
		width: 100%;
		padding: 0 20px;
		padding-top: 20px;
		margin-bottom: 20px;
		height: 550px;
	}
	
	.beskrivelse a { /* klik boks */
	background: #A32B50;
	color: white;
	width: 110px;
	height: calc(30px + 1em);
	padding: 12px;
	border: 2px;
	border-radius: 10px;
	font-size: 36px;
	font-weight: 900;
	text-decoration: none;
	}
	
/* footer */
	
	
	footer {
		background: #1B2021; 
		padding: 2px;
		clear: left;
	}
	
	adreess {
		font-size: 14px;
		color: rgba(255,255,255,.6);
		text-align: center;
		font-style: normal;
	}
	
	.row {
	width: 100%;
	display: flex;
	flex-direction: row;
	padding-top: 20px;
	padding-bottom: 20px;
	justify-content: center;
	text-align: center;
	grid-gap: 40px;
	}
	
	header a#burger_menu {
	display: none;
}
	
	nav {
		height: 40px;
	}
	
	nav li {
		display: inline-block;
		margin-right: 1.5rem;
		line-height: 40px;
		height: 40px;
	}
	
	nav li:last-child {
		margin-right: 0;
	}
	
	nav a {
		font-size: 22px;
		font-weight: 900px;
		text-align: center;
		color: rgba(193,133,151,0.9);
		margin: 20px 0 10px;
		text-decoration: none;
	}
}