/*MAIN STYLES*/

.home {
	background-color: #383838;
}

.wrapping {
  max-width: 1200px;
  width: 85%;
  margin: auto; 
}

.textbox {
 margin: 5px; 
}

.block {
 /*TODO content block for sidebar elements*/ 
}

/*GRID AND GRID SUBSTYLES*/

.content-grid {
  display: grid;
  grid-template-areas:
    "content sidebar";
  grid-template-columns: 5fr 1fr;
}

.container > div {
  background-color: rgba(255, 255, 255, 0.8);
  padding: 10px;
}

.content-grid > .sidebar {
  grid-area: sidebar;
}

.content-grid > .content {
  border: 10px solid #456bff;
  border-radius: 5px 15px;
  background-color: rgba(69, 107, 255, 0.5);
  grid-area: content;
}

/*MAIN SUBSTYLES*/

.submain {
	text-align: center;
	border-style: solid;
	/*background-color: #0088e8;*/
	background-color: #456bff;
}

.footer {
  margin-top: 10px;
	text-align: center;
	/*background-color: #0088e8;*/
	background-color: #ffda47;
}

.style2 {
	text-align: center;
	border-style: solid;
	background-color: #8DDCE9;
}

.fortress2 {
	text-align: center;
	color: white;
	border: 0px solid white;
	border-radius: 5px;
	background-color: #363636;
}

.list {
	background-color: #ff6b57;
	border-style: solid;
}

.headerMain {
		text-align: center;
}

.library {
	background-color: #7CC489;
	text-align: center;
	margin: 0px 5% 0px 5%
}

/*SCRAPHEAP*/

.fortress {
	background-color: #b05d21;
	margin: 0px 5% 0px 5%;
}

.content-grid > .lower-content {
  border-bottom-style: solid;
  border-right-style: solid;
  grid-area: lower-content;
}

.content-grid > .panel {
  border-top-style: solid;
  border-left-style: solid;
  border: solid black;
  grid-area: panel;
}