/* -------- Fonts / Skrifttyper fra Adobe -------- */
@import url("https://use.typekit.net/uqz8agc.css");
@import url("https://use.typekit.net/uqz8agc.css");
@import url("https://use.typekit.net/uqz8agc.css");
@import url("https://use.typekit.net/uqz8agc.css");

@import url("https://use.typekit.net/cog7pbo.css");
@import url("https://use.typekit.net/cog7pbo.css");
@import url("https://use.typekit.net/cog7pbo.css");

:root {
	/*Colors*/
	/* CSS HEX */
	--main: #F6FFFF;
	--raahvid: #e8e8e8ff;
	--lysegraa: #dcdcdcff;
	--tyrkis: #3CA4A4;
	--morketyrkis: #2A8282;
	--mellemtyrkis: #097373;
	--headfarve: #B5D5D4;
	--blysort: #313333;
	--mellemsort: #111111ff;
	--black: #000000ff;

	/* fonte */

	--over: input-serif, serif;
	--brod1: "oswald", sans-serif;

	--overny: cheap-pine, sans-serif;
	--overny2: cheap-pine-shadow, sans-serif;
	/*cheap-pine-sans, sans-serif;*/
}

/* -------- reset css -------- */
*,
:after,
:before {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
}


/* -------- style css -------- */

body {
	margin: 0;
	background-color: var(--main);
	min-height: 140vh;
    display: flex;
    flex-direction: column;
}

h2 {
	font-size: 3.7vw;
	font-weight: 700;
	color: var(--blysort);
}

h4 {
	font-family: var(--brod1);
	font-size: 2.2vw;
	font-weight: 600;
}

p {
	font-family: var(--brod1);
	font-size: 1vw;
	font-weight: 300;
}

.menutext {
	margin-bottom: 0.2vw;
	border: 0px solid #2A8282;
	border-radius: 4px;
 }
 .menutext{
   display: inline-block;
   position: relative;
   color: #313333;
   
 }
 
 .menutext:after {
   content: '';
   position: absolute;
   width: 100%;
   transform: scaleX(0);
   height: 0.1vw;
   bottom: 0.02vw;
   left: 0;
   background-color: #2A8282;
   transform-origin: bottom right;
   transition: transform 0.25s ease-out;
 }
 
 .menutext:hover:after {
   transform: scaleX(1);
   transform-origin: bottom left;
 }
 
 .menutext:hover {
	 text-decoration: none;
	 color: #097373;
 }

.topnav {
	overflow: hidden;
	background-color: var(--headfarve);

	height: 10vw;
	font-family: var(--brod1);

	
	/*box-shadow: 5px 10px 18px #8888889a;*/
}

.topnav a {
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;

	font-family: "oswald", sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.5vw;
	letter-spacing: 0.2vw;
	
	padding-bottom: 0.3vw;
	margin-top: 3.6vw;
	margin-left: 2.9vw;
	float: left;
	display: block;
	color: var(--blysort);
}

.topnav .icon {
	display: none;
}

.topnav {
	display: flex;
	justify-content: flex-end;
	text-align: right;
	padding-right: 8vw;
}

.toplogo img {
	width: auto;
	height: 6vw;
	position: absolute;
	left: 6vw;
	margin-bottom: 1vw;
	bottom: 1vw;
	top: 1.8vw;
}

#navheadline {
	position: absolute;
	text-align: left;
	left: 16vw;
	top: 2.6vw;
	color: var(--blysort);
	

	font-family: "oswald", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 2.7vw;
}




/*________ Sektion 1 ____Start_________*/

.topinfo {
	position: relative;
}

#blueshapetop {
	text-align: right;
	margin-left: 45vw;
	margin-top: 10vw;
	width: 48vw;
	height: auto;
	position: absolute;
	
}

.toptext {
	position: absolute;
	text-align: left;
	margin-top: 26vw;
	margin-left: 10vw;
	word-spacing: -0.5vw;
}

.topinfo h2 {
	text-transform: uppercase;
	font-family: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace;
	font-weight: 600;
	font-size: 2.4vw;
	text-shadow: #f6ffffc9 1px 2px 3px;
	/*color: var(--white2);*/
}

.toptext h3 {
	/*color: var(--morketyrkis);
	text-shadow: #F6FFFF 1px 2px 4px;
	*/
	color: transparent;
	background: #3CA4A4;
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
	text-shadow: 0px 4px 4px rgba(255, 255, 255, 0.53);

	letter-spacing: 0.4vw;
	font-size: 2.4vw;
	font-weight: 500;
	font-family: var(--brod1);
	text-transform: uppercase;
	margin-left: 0.1vw;
	margin-top: 0.8vw;
}

.ptext{
	width: 37vw;
}

.toptext p {
	margin-top: 1.9vw;
	font-size: 1.75vw;
	color: var(--blysort);

	font-family: "futura-pt", sans-serif;
	font-weight: 400;
	font-style: normal;
	letter-spacing: normal;
	word-spacing: normal;
}

/*________ Sektion 1 ____Slut_________*/

/*________ Futter ____Start_________*/

footer {
	width: 100%;
	height: auto;
	bottom: 0;
	
	padding-left: 6vw;
	
}


.futter {
	position: relative;
	margin-top: 70vw; 
}

.futter img {
	position: absolute;
}

#bacggroundimg {
	
	width: 40vw;
	height: auto;
	bottom: 0px;
	z-index: 3;
}

#rundpic {
	
	z-index: 6;
	width: 30vw;
	height: auto;
	bottom: 0px;
	margin-bottom: 9.2vw;
	margin-left: 3vw;

}

#bluecopy {
	bottom: 0;
	height: auto;
	width: 30vw;
	height: 5.5vw;
	margin-left: 54vw;
}

#letsconnect{
	font-family: "kanit", sans-serif;
	font-weight: 400;
	font-style: normal;
	padding-bottom: 1vw;

	margin-left: 38vw;
	margin-bottom: 1.2vw;;

	color: transparent;
	background: #3CA4A4;
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
	text-shadow: 0px 4px 4px rgba(255, 255, 255, 0.53);
}

.footertext {
	margin-left: 38vw;
	margin-bottom: 3vw;
	width: 44vw;

}

.footertext p {
	font-size: 1.6vw;
	color: var(--blysort);

	font-family: "futura-pt", sans-serif;
	font-weight: 400;
	font-style: normal;
	letter-spacing: normal;
	word-spacing: normal;
	padding-bottom: 2.4vw;
}

.sociallogo {
	margin-bottom: 14vw;
	display: flex;
	flex-direction: row;
	bottom: 0;
	margin-left: 40vw;
}

.sociallogo img {
	width: 4vw;
	z-index: 7;
}

#instalogo {
	margin-left: 8vw;
}

#emaillogo {
	margin-left: 17vw;
}

#copytext {
	color: var(--main);
	bottom: 0;
	margin-left: 60vw;
	margin-bottom: 0.35vw;
	z-index: 10;
	position: absolute;

	font-family: "futura-pt", sans-serif;
	font-weight: 200;
	font-style: normal;
}

/*________ Futter ____Slut_________*/


/*________ media quarys_________*/

@media screen and (max-width: 600px) {
	

}

@media screen and (max-width: 600px) {
	
}
