body{
    background: #FFFDFA;
    padding: 0px;
}
#home-container-wrapper{
    width: 100%;
}
.main-content{
    width: 100%;
    background: #F6F2ED;
}
sup {
  font-size: 75%;
}
h1{
  font: 1em;
}

p {
    padding: 0 16px;
    text-align: left;
}

.page-content {
    margin: 0 16px;
}

.page-content h2{
    margin: auto;
    text-align: left;
    padding: 8px 0;
}

.sub-section h3{
  padding: 0px;
}

.measurements {
    margin: 16px 0;
}

.measurements h3 {
    text-align: left;
    padding: 0 32px;
}

.measurements p {
    padding: 0 0 0 64px;
    text-align: left;
}

.drop-content {
    margin: 16px 0;
}

p.dropdown, p.information{
  text-align: center;
  width: 90%;
  margin: auto;
  margin-top: 12px;
  margin-bottom: 12px;
}
p.dropdown{
  color: white;
  background-color: #003768;
}
.dropdown::after{
  content: "▲";
  position: absolute;
  right: 8px;
}
.hide-content::after{
  content: "▼";
  position: absolute;
  right: 8px;
}
p.information{
  color: black;
  background-color: white;
}

.freq {
    margin: 16px 0;
}

.freq ul {
    text-align: left;
    padding: 0 16px;
}

.download-button {
    margin: 16px 0 0 0;
}

.download-button:active{
  text-decoration: none;
}

a:focus{
  background-color: #766F65;
}

.sub-section{
  float: none;
}

.sub-section .dropdown {
    position: relative;
    text-align: center;
    background-color: #1E374F;
    color: white;
    border: 1px solid black;
    width: 80%;
    font-size: 1.6em;
    padding: 12px 6px;
    margin: auto;
    margin-top: 8px;
    margin-bottom: 8px;
    float: none;
}

.sub-section .information{
    position: relative; 
    text-align: center;
    background-color: white;
    color: black;
    border: 1px solid black;
    margin: auto;
    margin-top: 8px;
    margin-bottom: 8px;
    float: none;
} 
.page-content .dropdown:hover{ 
  cursor: pointer;
  color: white;
  background-color: #324B64;
}
.dropdown.information:hover{
  color: black;
  background-color: #d9e1e8;
}
.left, .right{
  width: 50%;
}
.left p, .right p{
  text-align: left;
  font-size: 1.3em;
  padding: 0px 24px;
  margin: 0px;
}
.col{
  padding: 0px 24px;
}
.col .thunder-button{
  margin: auto;
  background-color: #003768;
  color: white;
  display: table;
}
.col .thunder-button:hover{
  margin: auto;
  background-color: white;
  color: black;
  display: table;
}

#unordered-list {
  list-style-type:disc;
}

.graphSize {
  font-size: 15px;
}

.myContainer {
  background-color: #ffffff;
  width: 970px;
}

.clearfix:before, .clearfix:after{
  content: '';
  display: table;
}

.clearfix:after{
  clear: both;
}

.clearfix{
  width: 100%;
}

#spacing {
  display:inline-block;
  position:relative;
  margin-left: 15px;
  margin-top: 30px;
  width: 50%;
  min-width: 10rem;
}
.var-table {
  font-family: sans-serif;
  border-collapse: collapse;
  width: auto;
  margin: auto;
  font-size: 16px;
}
.var-table .var-table-description-column{
  text-align: center;
  border-right: 1px solid white;
  border-left: 1px solid white;
}
.var-table-row {
  border: 1px solid #ddd;
  text-align: left;
  padding-left: 20em;
}
.var-table-row:nth-child(odd) {
  background-color: #ddd;
}
.var-table-column {
  padding: 0.2em 0.2em 0.2em;
}
.var-table-description-row {
  background-color: #ccc;
}
.var-table-description-column {
  padding: 0.7em 0.5em 0.7em;
  font-weight: bold;
}

.var-table-ctn {
  width: 100%;
  overflow-x: scroll;
}
.dropdown{
  float: none;
}
@media only screen and (max-width: 1025px) {
  #title .thunder-button{
    float: none;
    margin-top: 0px;
    background-color: #003768;
  }
}

@media only screen and (max-width: 750px) {
  h1 {
    font-size: 0.8em;
  }
  .var-table {
    width: 100%;
    font-size: 12px;
  }
  #title {
    padding-bottom: 0px;
  }
  .left, .right{
    width: 100%;
    float:none;
  }
  .col {
    padding: 0px;
  }
}