html,body {
  font-family:Verdana,sans-serif;
  font-size:15px;
  line-height:1.5;
}
h1 {
  font-size:36px;
}
h2 {
  font-size:30px;
}
h3 {
  font-size:24px;
}
h4 {
  font-size:20px;
}
h5 {
  font-size:18px;
}
h6 {
  font-size:16px;
}
h1, h2, h3, h4, h5, h6 {
  font-family:"Segoe UI",Arial,sans-serif;
  font-weight:400;
  margin:10px 0;
}
hr { 
  border:0;
  border-top:1px solid #eee;
  margin:20px 0;
}

/* --------------------------------- Class definitions --------------------------------------------*/
.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.assignment-class {
  margin-top: 20%;
}
.week-assignment{
  background-color:#727272;
  float:inherit;
  width:250px;
  position:relative;          /* To define the position for some browsers */
  margin:0 auto 0 auto;   /* margin-right/left is set to auto meaning the content will always be centered inside the browser. */
  padding: 16px;
}
.week-assignment:hover {
  background-color: #e2e2e2;
}
.sidebar {
  height:100%;
  width:120px;
  background-color:#424242;
  position:fixed!important;
  z-index:1;
  overflow:hidden;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.sidebar-menu-item {
  background-color: transparent;
  color: #e2e2e2;
  text-decoration: none;
  width: 100%;
  display: block;
  margin-left:auto;
  margin-right: auto;
  margin-top: 0;
  padding: 8px 16px;
}
.sidebar-menu-item:hover {
  background-color: #000;
  color: aliceblue;
  text-decoration: none;
}
/* --------------------------------- ID definitions --------------------------------------------*/
#wrapper{
  /*background-color:#727272;*/
  float:inherit;
  width:100%;
  position:relative;          /* To define the position for some browsers */
  margin:0 auto 0 auto;   /* margin-right/left is set to auto meaning the content will always be centered inside the browser. */
  padding-bottom: 50px;
}

/* --------------------------------- General elements definitions --------------------------------------------*/
body {
  background-color: #424242;
}
h1 {    
  color: #e2e2e2;
  text-align: center;
  font-size: xx-large;
}
ul {
  text-align: center; 
  list-style-position: inside;
}
a li {
  color: #bb86fc;
  font-size: large;
  text-decoration: none;
  margin: 20px;
}
li {
  list-style-type: none;
  padding: 5px;
}
a:hover {
  color:#727272;
  text-decoration:underline;
}
/* ---------------------  Assignment Styles -----------------------------*/
.padding-64 {
  padding-top: 64px;
  padding-bottom: 64px;
}
.padding-16 {
  padding-top: 16px;
  padding-bottom: 16px;
}
.section {
  margin-top:16px!important;
  margin-bottom:16px!important;
}
.content {
  margin-left: auto;
  margin-right: auto;
  max-width: 980px;
}
.form-input { 
  padding:8px;
  display:block;
  border:none;
  border-bottom:1px solid #ccc;
  width:100%;
}
.form-button {
  border:none;
  display:inline-block;
  padding:8px 16px;
  vertical-align:middle;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  background-color:lightslategray;
  text-align:center;
  cursor:pointer;
  white-space:nowrap;
}
.form-button:hover {
  box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}
.form-button {
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}
.form-button:disabled {
  cursor:not-allowed;
  opacity:0.3;
}