body, html {
    margin: auto;
    padding: 0px;
    background-color: #000000;
    font-family: 'Trebuchet MS';
}

h1{
padding-top: 20px;
font-family: 'Trebuchet MS';
font-size: 40px;
color: white;
}


/*grid settings*/
.toppgrid 	{ grid-area: header; 	}
.navgrid 	{ grid-area: nav; 	}
.statsgrid 	{ grid-area: stats; 	}
.maingrid 	{ grid-area: main; 	}
.rightgrid	{ grid-area: right; 	}
.tabsgrid 	{ grid-area: tabs; 	}

.grid-container {
  height: 100%;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(7, 1fr);
  grid-template-areas:     	
	'header header header header header header'
	'header header header header header header'
    	'main main main main main main'
	'main main main main main main'
	'main main main main main main'
	'main main main main main main'
    	'tabs tabs tabs tabs tabs tabs';
  grid-gap: 0px;
  background-color: #FFFFFF;
  padding: 0px;
}

.grid-container > div {
  background-color: #000000;
  overflow: auto;
  text-align: center;
  padding: 0px 0;
  font-size: 10px;
  color:white;
}

/*------------------------------------containers styling---------------------------------*/

.desImage {
    width: 300px;
    height: 300px;
}

    .desImage img {
        /*width: 100%;*/
        /*height: 100%;*/
        margin-left: 50px;
        position:center;
    	float:left;
        /*border: 2px solid #000000;*/
    }

.des {
    	/*width: 70%;*/
    	/*height: 140px;*/
    	margin-right: 100px;
    	background-color: #000000;
		color: #FFFFFF;
		font-size:12px;
    	padding: 5px;
    	text-align: left;
    	position:center;
    	float:right;
}

.InformationContainer {
  /*border-radius: 5px;*/
  background-color: #000000;
  padding: 40px;
  font-size:16px;
}

.FormsContainer {
  /*border-radius: 5px;*/
  background-color: #000000;
  padding: 20px;
}

/*------------------------------------button settings------------------------------------*/

a.link {
	margin-left: 20px;
}

/* unvisited link */
a.link:link {
  color: white;
}

/* visited link */
a.link:visited {
  color: white;
}

/* mouse over link */
a.link:hover {
  color: green;
}

/* selected link */
a.link:active {
  color: white;
}

.NavButton{
  background-color: #000000;
  border: none;
  cursor:pointer;
  color: white;
  padding: 16px;
  width: 200px;
  text-align: left;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

.NavButton:hover {
	background-color:#5cbf2a;
}

.NavButton:active {
	position:relative;
	top:1px;
}

.NavBorder{
  border: 2px solid #FFFFFF;
}

/*table settings*/

#contentTable{
  		width: 90%;
		margin-top: 20px;
		border-collapse: collapse;
}

#contentTable td, #contentTable th {
  border: 0px solid #000000;
  padding: 4px;
}

#contentTable th {
  padding-top: 4px;
  padding-bottom: 4px;
  text-align: left;
  background-color: #000000;
  color: white;
}

table.center {
  margin-left: auto; 
  margin-right: auto;
}

/*tab settings*/

/* Style the tab */
.tab {
  overflow: auto;
  font-family: 'Trebuchet MS';
  border: 1px solid #FFFFFF;
  background-color: #3a3a3a;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float: left;
  border: 1px solid #FFFFFF;;
  outline: none;
  cursor: pointer;
  padding: 16px;
  width: 150px;
  transition: 0.3s;
  color: #FFFFFF;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #545151;
  color: #FFFFFF;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #545151;
  color: #FFFFFF;
}

/* Style the tab content */
.tabcontent {
  display: none;
  font-size: 16px;
  overflow: auto;
  text-align: left;
  color: #FFFFFF;
  border-top: none;
}