@font-face{
	font-family: "abordage";
	src: url(fonter/abordage-regular.otf) format(OpenType),
		url(fonter/abordage-regular.ttf) format(TrueType),
		url(fonter/abordage-regular.woff) format(Web Open Font Format),
		url(fonter/abordage-regular.woff2) format(Web Open Font Format 2);
	font-weight: normal;
}
@font-face{
	font-family: "le-patin-helvete";
	src: url(fonter/Le-patin-helvete.ttf) format(TrueType);
	font-weight: normal;
}
@font-face{
	font-family: normalskrift;
	src: url(fonter/normalschrift.ttf) format(TrueType);
	font-weight: normal;
}
@font-face{
	font-family: normalskrift;
	src: url(fonter/normalschrift_B.ttf) format(TrueType);
	font-weight: bold;
}


*{
	margin: 0;
	padding: 0;
}

body{
	background-color: gainsboro;
	/*background-image: linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet); */
	/*	font-family: abordage,sans-serif;*/
	font-family: normalskrift;
	font-size: 1rem;
	font-feature-settings: "ss01" on;
}


.konteiner{
	width: 80%;
	margin:auto;
	margin-top:2rem;
	margin-bottom: 4rem;

}

/*
-----------------------------------------------------------------------------
-----------------------------------------------------------------------------
elementer som divs
*/

nav{
	position: sticky;
	top:4rem;
	left: 15%;
	padding: 0.5rem;
	width: 8rem;
	line-height: 120%;

	/*background-color: gainsboro;*/
	outline: dashed yellow 0.5rem;
	box-shadow:0rem 0rem 2rem 1.7rem yellow inset;




	backdrop-filter: blur(0.5rem);

	z-index: 97;	
}

nav a{
	text-decoration: none;
	padding-top: 0.3rem;
	padding-bottom: 0.3rem;
	font-family: normalskrift;
	font-size: 2rem;
	font-feature-settings: "ss01" on;
	color: black;
	font-weight: normal;


}

a:hover{
	background-color: lavender;
	padding-top: 0.3rem;
	padding-bottom: 0.3rem;
}



.info{
	width: auto;
	height: auto;
	padding: 1rem;
	/*border: dashed;*/
}

.konteiner2{
	background-color:#5859a7;
	outline: double 10px #5859a7;
	outline-offset: -10px;
	border-top: dotted 10px #e22525;

}
/*
Ooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo
-----------------------------------------------------------------------------
Elementer
*/

img{
	width: 100%;
	height: auto;
	display: block;
}

details{
	font-size: 1.8rem;
}

a{
	font-family: serif;
	font-size: 1.2rem;
}

iframe{
	width: auto;
	height: 30rem;
	position: relative;
	border: lightgray ridge	10px;
}


h1{
	font-size: 2rem;
	font-family: normalskrift;
}

h5{
	font-family: normalskrift;
	font-size: 1rem;
	font-weight: normal;
	color:#e22525;
}
h6{
	font-family: serif;
	font-weight: normal;
	font-size: 1rem;
}

figure{
	font-family: serif;
}



/*
Ooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo
-----------------------------------------------------------------------------
flex og rader og bokser og sånt 
*/

.tomboks{
	height: 2rem;
}

.tomboks2{
	width: 30%;
}

.tomboks3{
	width: 100%;
}

.smal{
	width: 60%;
	align-self: start;
	position: relative;
	padding: 1rem;
}

.bok{
	width: 50%;
	align-self: end;
	position: relative;
	padding: 1rem;
}

.miniboks{
	position:relative;
	padding: 3rem;
	width: 7%;
	color:#5859a7;
	font-size: 0.25rem;
	transition: width 17s, color, font-size 17s;
	
	
}

.miniboks:hover{
	position:relative;
	padding: 3rem;
	width: 40%;
	color:gainsboro;
	font-size: 1.5rem;
	
}



.marquee {
    margin: 0 auto;
    white-space: nowrap;
    overflow: hidden;
    color: green;
}

.marquee span {
    display:inline-block;
    padding-left: 100%;
    animation: marquee 10s linear infinite;
}

/* Make it move */
@keyframes marquee {
    0% { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}


/*jhafjafjdfajka Under er selve boksene*/


.rad{
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: center;
}

.boks{
	position: relative;
	padding: 1rem;
}



@media(max-width: 46.24rem){
	.rad{
		flex-direction: column;
		align-items: center;

	.miniboks{
		width: 30%;
	

	
}