/* border box fix */
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
/* end border box fix */ ::selection {
  color: white;
  background: #5A5A5A;
}
body {
    margin: auto;
}
html {
  font-family: 'Open Sans', 'Source Sans Pro', sans-serif;
}
.darkredbold {
  color: darkred;
  font-weight: bold;
}
.redfont {
  color: red;
}
.redfontbold {
  color: red;
  font-weight: bold;
}
ol {
  /* text-align: left */
}
a {
  color: darkblue;
  text-decoration: underline;
}
a:hover {
  color: #FB083D;
}
/* Styles for top navigation bar */
.topnav {
  width: 100%;
  float: left;
  overflow: hidden;
  background-color: #4F4FFF;
  color: white;
  padding-bottom: 0.3em;
  padding-top: 0.3em;
  font-size: 1.3em;
  /* margin-left: 2em;
	margin-right: 2em;
	max-width: 900px; */
}
.topnav a {
  /* widows: 1; */
  color: white;
  text-align: center;
  padding: .5em;
  text-decoration: none;
  font-size: 1em;
}
.topnav a:hover {
  background-color: #87ADF1;
  color: black;
  border-radius: .5em;
}
.bottomnav {
  width: 100%;
  float: left;
  overflow: hidden;
  background-color: lightblue;
}
.bottomnav a {
  float: left;
  color: black;
  text-align: center;
  padding: .5em;
  text-decoration: none;
  font-size: 1em;
}
.bottomnav a:hover {
  background-color: darkblue;
  color: white;
  border-radius: .5em;
}
.week {
  background-color: rgba(0, 0, 255, .5);
}
code {
  font-size: 1rem;
}
strong {
  font-weight: bold;
}
body {
  font-size: .9rem;
  /* line-height: 1.5; */
  max-width: 900px;
  text-align: justify;
  padding-top: 1em;
  padding-right: 1em;
  padding-bottom: 1em;
  padding-left: 1em;
}
h1, h2, h3, h4, h5, h6 {
  color: darkblue;
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-weight: 600;
}

.quote {font-family: 'Courgette', cursive; text-align: center}

h1 {
  font-size: 2em;
}
h2 {
  font-size: 1.5em;
}
h3 {
  font-size: 1.25em;
}
h4 {
  font-size: 1.1em;
}
.maincontent {
  padding-left: 0;
  padding-right: 0; /* margin: 1em 2em; */ /* max-width: 900px; */
}
.container {
  /*padding-top: 1em;
	padding-right: 2em;
	padding-bottom: 1em;
	padding-left: 2em; */
  max-width: 900px;
}
nav a {
  border-bottom: 3px;
}
nav a:hover {
  background-color: skyblue;
}
#masthead {
  /*max-width: 900px;*/
  padding-top: 10px;
  padding-bottom: 10px;
  display: inline;
  margin-left: 2em;
  margin-right: 2em;
}
/* Masthead Styles */
#masthead h1 {
  font-family: 'PT Serif', serif;
  font-weight: 600;
  font-size: 2.5rem;
  color: darkblue;
  margin-top: 5px;
  margin-bottom: 0px;
  /*padding-left: 2em;
	padding-right: 2em;*/
  /*display: inline;*/
  text-indent: 0;
  text-align: left;
}
#masthead h2 {
  font-variant: small-caps;
  font-family: 'PT Serif', serif;
  font-weight: 600;
  font-size: 1.5rem;
  color: darkblue;
  margin-top: 0px;
  margin-bottom: 5px;
  /*padding-left: 2em;
	padding-right: 2em;*/
  /*display: inline;*/
  text-indent: 0;
  text-align: left; /*text-transform: uppercase;*/
}

.math-class {
  font-variant: small-caps;
  font-family: 'PT Serif', serif;
  font-weight: 600;
  font-size: 1.5rem;
  color: darkblue;
  margin-top: 0px;
  margin-bottom: 5px;
  /*padding-left: 2em;
	padding-right: 2em;*/
  /*display: inline;*/
  text-indent: 0;
  text-align: left; /*text-transform: uppercase;*/
}

/* Styles for index.html page */
#grading {
  border: 1px;
  border-color: #ddd;
  border-style: solid;
  width: 100%;
  table-layout: auto;
  margin: 0;
  padding: 0px 0px 0px 0px;
}
#gradingcontainer {
  width: 400px;
}
#grading tr:nth-child(even) {
  background-color: #fff;
}
#grading tr:nth-child(odd) {
  background-color: rgba(154, 154, 154, 0.10);
}
#grading tr:hover {
  background-color: rgba(128, 128, 128, 0.50);
}
#officehours tr:nth-child(even) {
  background-color: #fff;
}
#officehours tr:nth-child(odd) {
  background-color: rgba(154, 154, 154, 0.10);
}
#officehours tr:hover {
  background-color: rgba(128, 128, 128, 0.50);
}
#officehours th {
  background-color: #e3f2fd;
}

/* #schedulecontainer .table-striped tbody tr:nth-child(even) {
	background-color: #fff;
	padding: 2px;
	font-size: 1rem;
} */
/*
#schedulecontainer .table-striped tbody tr:nth-child(odd) {
	background-color: rgba(154, 154, 154, 0.10);
} */
/* Alter default stripe color in tables using two consecutive 
rows for spring or summer term classes */
/* #schedulecontainer .table-striped tbody tr:nth-of-type(6n+1) {
  background-color: rgba(0,0,0,0.15);
}
#schedulecontainer .table-striped tbody tr:nth-of-type(6n+2) {
  background-color: #fff;
}
#schedulecontainer .table-striped tbody tr:nth-of-type(6n+3) {
  background-color: rgba(0, 0, 0, 0.15);
}
#schedulecontainer .table-striped tbody tr:nth-of-type(6n+4) {
  background-color: #fff;
}
#schedulecontainer .table-striped tbody tr:nth-of-type(6n+5) {
  background-color: rgba(0, 0, 0, 0.15);
}
#schedulecontainer .table-striped tbody tr:nth-of-type(6n+6) {
  background-color: #fff;
}
*/
#schedulecontainer tr:hover {
  background-color: rgba(128, 128, 128, 0.50);
}
#schedulecontainer td {
  vertical-align: top;
}
#schedule th {
  background-color: #e3f2fd;
}
tr.rowbottomborder td {
  border-bottom: 4px solid navy;
}
tr.rowtopborder td {
  border-top: 4px solid navy;
}
.hangingindent p {
  padding-left: 1.5em;
  margin-left: 2em;
  text-indent: -2em;
}
/*************************************************************/
/*  Code below is to make table responsive for small screens */
/*************************************************************/
@media screen and (max-width: 600px) {
  body {
    line-height: 1.25;
    display: inline;
  }
  /* Force table to not be like tables anymore */
  table, thead, tbody, th, td, tr {
    display: block;
  }
  /* Hide table headers (but not display: none;, for accessibility) */
  /*thead tr { 
	position: absolute;
	top: -9999px;
	left: -9999px;
}*/
  table {
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 100%;
    table-layout: fixed;
  }
  table caption {
    font-size: 1.5em;
    margin: .5em 0 .75em;
  }
  table tr {
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    padding: .35em;
  }
  table th, table td {
    padding: .625em;
    text-align: center;
  }
  table th {
    font-size: .85em;
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  table {
    border: 0;
  }
  table caption {
    font-size: 1.3em;
  }
  table thead {
    border: none;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  table td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  #schedule p {
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
    line-height: 1
  }
  /*
	Label the data in table with id="schedule"
	*/
  #schedule td:nth-of-type(1):before {
    content: "Completed";
  }
  #schedule td:nth-of-type(2):before {
    content: "Lecture";
  }
  #schedule td:nth-of-type(3):before {
    content: "Date";
  }
  #schedule td:nth-of-type(4):before {
    content: "Topic";
  }
  #schedule td:nth-of-type(5):before {
    content: "HW #";
  }
  #schedule td:nth-of-type(6):before {
    content: "Assignment";
  }
  #schedule td:nth-of-type(7):before {
    content: "Due";
  }
  #officehours td:nth-of-type(1):before {
    content: "Time";
  }
  #officehours td:nth-of-type(2):before {
    content: "Mon";
  }
  #officehours td:nth-of-type(3):before {
    content: "Tue";
  }
  #officehours td:nth-of-type(4):before {
    content: "Wed";
  }
  #officehours td:nth-of-type(5):before {
    content: "Thu";
  }
  #officehours td:nth-of-type(6):before {
    content: "Fri";
  }
  table td::before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: none;
  }
  table td:last-child {
    border-bottom: 0;
  }
  .column-flush-left {
    text-align: left;
  }
}