:root{
	--header_upper_height: 75px;
	--navbar_height: 50px;


	--color_60: #1E1E1E;
	--color_30: #49438c;
	--color_10: #8c6943;
	--color_5: #fefefe;

	--body_background: var(--color_60);
	--color_text: var(--color_5);
	--color_navbar_text: var(--color_60);
	--color_navbar: var(--color_5);
	--color_h2: var(--color_5);
	--color_p: var(--color_5);
	--panel-panel-background: #666666;
	--panel-background: #555556;

	--color_background_gradient: var(--color_60);

	--header_upper_background: var(--color_30);

	--sitecontent-margin-top: 25px;
	--sitecontent-margin-bottom: 25px;
}


body{
	margin: 0px;
	padding: 0px;
	background: var(--body_background);
	z-index: 0;
}

.header{
	position: relative;
	display: grid;
	grid-template-rows:
		var(--header_upper_height)
		var(--navbar_height);
	grid-template-columns: 65% 25%;
	grid-gap: 0px;

	margin: 0px;
	padding: 0px;
	width: 100%;
}

.header_upper{
	position: relative;
	display: grid;
	grid-column: 1/4;
	grid-row: 1/2;

	grid-template-columns: 
		50%
		50%;
	grid-template-rows: 
		var(--header_upper_height);
 	grid-gap: 0px;

	width: auto;
	height: var(--header_upper_height);
	/*#bccbde, #e05915*/
	background: var(--header_upper_background);
	/*filter: drop-shadow(0px 0px 10px #000000);*/
	margin: 0px;
	padding: 0px;

	z-index: 2;
}

.header h1{
	display: grid;
	font-size: 35pt;
	text-align: center;
	vertical-align: middle;
	color: var(--color_5);

	margin: 0px;
	padding: 0px;

	font-family: Courier;

	margin: 0;
}

.climate_display_wrapper{
	display: grid;
	grid-column: 2/3;
	grid-row: 1/2;
	margin: 0;
}

.climate_display{
	position: relative;
	font-size: 12pt;
	color: var(--color_5);
	font-family: Consolas;
	vertical-align: middle;
	text-align: center;
	width: 100%;
	height: 1em;

	top: calc(var(--header_height)/4);
	margin: 0;
}

.climate_display p{
	font-family: Consolas;
	display: relative;
	margin: 0px;
	text-align: center;
}

.navbar{
	display: grid;
	grid-column: 1/2;
	grid-row: 2/3;
	width: 100%;
	height: var(--navbar_height);
	background-color: var(--color_navbar);
	/*filter: drop-shadow(0px 0px 10px #000000);*/
	z-index: 1;
	border-radius: 0px 0px 100px/75px 0px;
}

.navbar a{
	display: inline;
	position: relative;
	font-size: 15pt;
	color: var(--color_navbar_text);
	font-family: Consolas;
	text-decoration: none;
	text-align: center;

	padding-top: 0;

	width: 300px;
	margin-left: 10px;
	margin-right: 10px;
	padding-left: 20px;
	padding-right: 20px;
	border-radius: 5px;

	top: calc(50% - 15pt/2);
}

.navbar a:hover{
	color: var(--color_5);
	background: var(--color_60);
}

.navbar ul{
	position: relative;
	list-style-type: none;
	text-align: center;
	width: 100%;
	height: 100%;
	margin: 0;
}

.navbar li{
	display: inline;
}

.navbar li:hover{
	display: inline;
}

.site_content{
	position: relative;
	margin-top: var(--sitecontent-margin-top);
	margin-bottom: var(--sitecontent-margin-bottom);
	width: 90%;
	left: calc(50% - 90%/2);
	height: auto;
}

h2{
	position: relative;
	font-family: Helvetica;
	color: var(--color_h2);
	font-size: 25pt;
}

p{
	font-family: Bahnschrift;
	color: var(--color_p);
	font-size: 12pt;
}

.ideapool_content{
	background-color: var(--panel-panel-background);
	margin-left: 1%;
	padding: 1%;
}

.ideapool_content h2{
	font-family: Helvetica;
	font-size: 3rem;
	margin-left: 5%;
}

.idea_container{
	background-color: var(--panel-background);
	font-size: 1rem;
	margin: 1rem;
	margin-left: 5%;
	padding: 1rem;
}

.idea_container h3{
	font-family: Helvetica;
	color: var(--color_5);
	background-color: var(--color_10);
	padding:0.5rem;
}
