:root {
	--LightBrown: #8f664f;
	--DarkBlue:   #020718;
	--SoftBlue:   #3b525e; 
	--BlueGrey:   #97a29e;
	--SoftGrey:   #e7eded; 
	--SoftGreen:  #4d5c33;
	--Black:      #000000;
	--White:      #FFFFFF;
	--WindowHeight: calc(document.body.clientHeight);
}


html {
  background-color: var(--SoftBlue);
  font-family: Roboto, sans-serif;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: border-box;
}

body {
	font-size: 3.5vw;
	display: flex;
	flex-wrap: wrap;
	overscroll-behavior-y: none;
}

#Sidebar {
	margin-top: -10px;
	flex-basis: 0;
    height: 100%;
	width: 25%;
	background-color: var(--SoftBlue);
	position: -webkit-sticky;
	position: sticky;
	top: 0px;
	padding: 10px;
}

#SidebarMessage {
	display:none;
}

#Canvas {
	background-color: #8f664f;
	margin-top: 0px;
	align-self: center;

}

.MainContent {
	margin: -10px -10px -10px 2%;
	flex: auto;
	height: auto;
	width: 70%;
	font-size: 30vw;
	color: var(--BlueGrey);
	display: grid;
	grid-gap: 5px;
	grid-column-gap: 5px;
	grid-template-columns: 1fr;
	grid-template-areas:
		"Floor9"
		"Floor8"
		"Floor7"
		"Floor6"
		"Floor5"
		"Floor4"
		"Floor3"
		"Floor2"
		"Floor1";
	grid-template-rows: auto;
}

.MainContent >* {
	height: 1000px;
	background-color: var(--SoftGreen);
}

.Floor1 {
	grid-area: Floor1;
}

.Floor2 {
	grid-area: Floor2;
}

.Floor3 {
	grid-area: Floor3;
	background-color: var(--SoftGreen);
}

.Floor4 {
	grid-area: Floor4;
	background-color: var(--SoftGreen);
}

.Floor5 {
	grid-area: Floor5;
	background-color: var(--SoftGreen);
}

.Floor6 {
	grid-area: Floor6;
	background-color: var(--SoftGreen);
}

.Floor7 {
	grid-area: Floor7;
	background-color: var(--SoftGreen);
}

.Floor8 {
	grid-area: Floor8;
	background-color: var(--SoftGreen);
}

.Floor9 {
	grid-area: Floor9;
	background-color: var(--SoftGreen);
}

.Floor10 {
	grid-area: Floor10;
	background-color: var(--SoftGreen);
}


/*@media only screen and (max-width: 1170px) {
	.wrapper {
		display: grid;
		grid-gap: 5px;
		grid-column-gap: 5px;
		grid-template-areas: 
			"header"
			"hotelContent"
			"linkContent"
			"periodicContent"
			"forestArt"
			"formSubmit"
			"footer";
		grid-template-rows: auto;
	}
}*/

