@font-face 							{	font-family: 'climatenet_regular'; src: url('../fonts/climatenet_regular.woff2') format('woff2'), 
										url('../fonts/climatenet_regular.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face 							{	font-family: 'climatenet_bold'; src: url('../fonts/climatenet_bold.woff2') format('woff2'), 			
										url('../fonts/climatenet_bold.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }


*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after {display: table;  content: ''; }
.clearfix:after { clear: both; }

body 								{	background: #fff; font-family: 'climatenet_regular', monospace; }
html, 
body, 
.container, 
.content	 						{	width: 100%; height: 100%; }

.header								{	width: 100%; height: 100%; }



.header .mobile_background			{	position: absolute; width: 100vw; height: 100vh; top: 0%; background: #2b4b9b; z-index: 1;
										background-size: cover; background-position: 50% 50%; background-repeat: none; 
										background-image: url(../../content/img/mobile_background.jpg); }


.main_logo							{	position: absolute; z-index: 1000; width: 45vw; height: 20vh; right: 5vw; top: 5vh; }
.main_logo img						{	width: 100%; height: auto; }
.typewriter							{	position: absolute; z-index: 1001; top: 16vh; right: 0.5vw; }
.type-wrap							{	margin:10px auto; padding:20px; background:##2a4b9b; border: none; font-family: 'climatenet_regular', monospace; 
										font-weight: 400; font-size: 1em; color: #2a4b9b; }
.typed-cursor						{	opacity: 1; font-weight: 100; -webkit-animation: blink 0.7s infinite; -moz-animation: blink 0.7s infinite;
            							-ms-animation: blink 0.7s infinite; -o-animation: blink 0.7s infinite; animation: blink 0.7s infinite; }
@-keyframes blink					{	0% 		{ opacity:1; }
            							50% 	{ opacity:0; }
            							100% 	{ opacity:1; } }
@-webkit-keyframes blink			{	0% 		{ opacity:1; }
            							50% 	{ opacity:0; }
            							100% 	{ opacity:1; } }
@-moz-keyframes blink				{	0% 		{ opacity:1; }
            							50% 	{ opacity:0; }
            							100% 	{ opacity:1; } }
@-ms-keyframes blink				{	0% 		{ opacity:1; }
            							50% 	{ opacity:0; }
            							100% 	{ opacity:1; } }
@-o-keyframes blink					{	0% 		{ opacity:1; }
            							50% 	{ opacity:0; }
            							100% 	{ opacity:1; } }
            							
.microsite							{	position: absolute; width: 80vw; top: 100vh; left: 10vw; } 
.microsite h1						{	text-align: justify; font-family: 'climatenet_regular', monospace; font-size: 1.6em; 
										line-height: 1.7em; font-weight: 400; color: #2b4b9b; }
.microsite p						{	text-align: justify; font-family: 'climatenet_regular', monospace; font-size: 1em; 
										line-height: 1.3em; font-weight: 400; color: #53555b; } 
.microsite ul						{	width: 100%; padding-left: 1em; }
.microsite li						{	text-align: left; font-family: 'climatenet_regular', monospace; font-size: 1em; 
										line-height: 1.3em; font-weight: 400; color: #53555b; padding-top: 0em; }      
.microsite a						{	text-decoration: none; color: #2b4b9b;}


.footer								{	position: relative; width: 100vw; left: 0; background: #2b4b9b; }     							
            							
            							
            							
            							

.language							{	position: fixed; z-index: 1000; width: 3.5vw; height: 5vh; bottom: 0; left: 1.5vw;  
										vertical-align: bottom; }
.language a							{	opacity: 0.8; }
.language a:hover					{	opacity: 1.0; }
.language a img						{	width: 1.8vw; left: 2vw; }


button 								{	padding-left: 1.5vw; outline: none; font-weight: 600; border: none; background: transparent; }
button img							{	width: 1.7vw; height: auto; padding-top: 2vh;  }

									
/* Design-Content-Layer */
.content_header						{	position: fixed; width: 100vw; height: 40vh; top: 0%; left: 0%; }

.content_header_visual				{	position: absolute; width: 100vw; height: 30vh; top: 0%; background: #2b4b9b; 
										background-size: cover; background-position: 50% 50%; background-repeat: none; 
										background-image: url(../../content/img/header.jpg); }

.content_header_headline			{	position: relative; height: 10vh; min-height: 60px; top: 30vh; width: 100%; left: 0%; background: #2b4b9b; }
.content_header_headline img		{	float: left; padding-left: 10%; padding-top: 1vh; width: auto; max-width: 80%; height: auto; min-height: 25%; }

.headline_content					{	position: absolute; z-index: 2; width: 80%; left: 10%; top: 15%; background: #2a4b9b; opacity: 0.9; }

.content_layer h2					{	font-family: 'climatenet_regular', monospace; font-size: 3em; font-weight: 400; color: #fff; }

.content_layer .content_text		{	position: absolute; width: 80%; top: 45%; left: 10%; z-index: 3; display: block; }

.content_layer .content_text p		{	text-align: justify; font-family: 'climatenet_regular', monospace; font-size: 1.3em; 
										line-height: 1.5em; font-weight: 400; color: #53555b; }
.content_text li					{	width: 90%; left: 5%; text-align: justify; font-family: 'climatenet_regular', monospace; font-size: 1.3em; 
										line-height: 1.3em; font-weight: 400; color: #53555b; padding-bottom: 0.1em;}
										
.content_layer a					{	font-family: 'climatenet_bold', monospace; font-weight: 700; color: #2a4b9b; text-decoration: none; }

.close								{	position: fixed; width: 10%; right: 0%; top: 0%; z-index: 5; }
.close img							{	width: 100%; height: auto; }

.publications						{	width: 100%; display: flex; float: left; }
.publications .pub					{	width: 20%; margin: 1em; }
.publications .pub img				{	width: 100%; height: auto; }
.publications .pub p				{	font-size: 0.8em; color: #2a4b9b; text-align: left; margin: 1em; }

.links								{	width: 100%; display: flex; float: left; }
.links .extern						{	width: 25%; }
.links .extern img					{	width: 100%; height: auto; padding-right: 4em; }
.content_text .links p				{	width: 70%; left: 30%; text-align: left; }

.content_text b						{	font-family: 'climatenet_bold', monospace; font-weight: 700; font-size: 1.5em; color: #2a4b9b; 
										text-decoration: none; text-align: left; } 
.content_text strong				{ 	font-family: 'climatenet_bold', monospace; font-weight: 700; color: #2a4b9b; text-decoration: none; }