@charset "UTF-8";
/* CSS Document */

body {
font-family: "IBM Plex Mono", monospace;
  font-weight: 400;
  font-style: normal;
	font-size: 14px;
	margin-left: 30px;
	margin-top: 30px;
}

.mainHead {font-size:24px;
	font-family: "Droid sans", system-ui;
	font-weight: 100;
}

.ibm-plex-mono-thin {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 100;
  font-style: normal;
}

.ibm-plex-mono-extralight {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 200;
  font-style: normal;
}

.ibm-plex-mono-light {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 300;
  font-style: normal;
}

.ibm-plex-mono-regular {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 400;
  font-style: normal;
}

.ibm-plex-mono-medium {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 500;
  font-style: normal;
}

.ibm-plex-mono-semibold {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 600;
  font-style: normal;
}

.ibm-plex-mono-bold {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 700;
  font-style: normal;
}

.ibm-plex-mono-thin-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 100;
  font-style: italic;
}

.ibm-plex-mono-extralight-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 200;
  font-style: italic;
}

.ibm-plex-mono-light-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 300;
  font-style: italic;
}

.ibm-plex-mono-regular-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 400;
  font-style: italic;
}

.ibm-plex-mono-medium-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 500;
  font-style: italic;
}

.ibm-plex-mono-semibold-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 600;
  font-style: italic;
}

.ibm-plex-mono-bold-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 700;
  font-style: italic;
}

#nav {
	display: inline-block;
	float: right;
	width: 600px;
	margin: 30px;
	
}

a {
	color: #DDDDDD;
	text-decoration: underline;
}

a:hover {
	color: #F3F3F3;
	text-decoration: underline;
	font-weight: 500;
}

.container {
	position: relative;
	display: grid;
margin-top: 20px;
	max-width: 770px;

  grid-template-areas: "inner-div";
	float: left;
	clear: both;
}

.container2 {
	position: relative;
	display: inline-flex;
margin-top: 20px;
	max-width: 1600px;

	clear: both;
}

.containerDesc {
		
		float: left;
	max-width: 300px;
	min-width: 220px;
	height: 100%;
		
}
.containerDescWide {
		
		float: left;
	max-width: 430px;
	min-width: 220px;
	height: 100%;
		
}

.content {
	grid-area: inner-div;
}

#navContainer {
	width:95%;display: block; margin-bottom: 20px; 
}

.mediaContainer {
	
	max-width: 1600px;
	margin-left: 40px;
	
}

img {
	padding-bottom: 20px;
	padding-right: 20px;
}