.hang {
  padding-left:20%;
  text-indent: -3em;
  margin-left: 3em;
  width:60%;
  margin-right:10%;
  font-size: 50%;
  } 
  body{
      background-color: rgb(255, 255, 255);
      background-size:cover;
      background-position: center;
      font-family:'Calibri', 'Lucida Grande', sans-serif;}
      
  
  
    .container{
      margin-left: auto;
      margin-right: auto;
      width: 100%;
    }
   
      main{
      color: #70aec8;
      text-align: center;
      align-items: center;
  
  
      }
  
    /* Style the navigation menu */
    .topnav {
    width: 100%;
    overflow: hidden;
    background-color: rgb(255, 255, 255);;
    position: relative;
    }
      /* Hide the links inside the navigation menu (except for logo/home) */
      .topnav #myLinks {
      display: none;
      }
  
      /* Style navigation menu links */
      .topnav a {
    color: rgb(0, 0, 0);
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
    display: block;
      }
  
      /* Style the hamburger menu */
      .topnav a.icon {
    background: rgb(255, 145, 55);
    display: block;
    position: absolute;
    right: 0;
    top: 0;
      }
  
      /* Add a grey background color on mouse-over */
      .topnav a:hover {
    background-color: #b5b5b5;
    color: rgb(255, 255, 255);
      }
  
      /* Style the active link (or home/logo) */
      .active {
    background-color: #70aec8;
    color: rgb(253, 253, 253);
      }
  
  
      ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
      }
  
      li {
    float: left;
    border-right:1px solid #bbb;
      }
  
      li:last-child {
    border-right: none;
      }
  
      li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
      }
  
      li a:hover:not(.active) {
    background-color: #111;
      }
      .aboutImage{
          padding-top: 5%;
          align-items: center;
          height: 20rem;
          width: rem;
          }
          .active {
          background-color: #70aec8;
          color: white;
          }
      
      
              @media screen and (max-width: 880px) {
                .header2{
                  display:none;
                }
                 
              
                }
                @media screen and (min-width: 880px) {
                  header{
                    display:none;
                  }
                   
                
                  }
  body{
          background-color: rgb(255, 255, 255);
          background-position: center;
          font-family:'Calibri', 'Lucida Grande', sans-serif;
          background-image: url("../Images/blueGradient.jpg");
          background-size:cover;
          background-repeat: no-repeat;
  
      h1{
          text-align: center;
          padding-top:5%;
      }
      iframe{
          align-items: center;
          margin-left: 10%;
          width: 80%;
          height: 30em;
          }
      h3{
        width: 80%;
        margin-left: 10%;
        margin-right: 10%;
      }
      h2{
        text-align: center;
        padding-top:3%;
      }
      h4{
        text-align:center;
      }
  
      @media screen and (max-width: 1050px) {
      .floatImage{
        align-items: center;
        margin-left:25%;
        padding-top:5%;
        width:50%;
        height:50%;
        padding-bottom:5%;
      }}
      @media screen and (min-width: 1051px){
      .floatImage{
        float:right;
        margin-right:15%;
        height: 20rem;
        width: rem;
        padding-bottom: 3%;
        }
      }
  
      /* This is for the certainty graphs */
      @media screen and (max-width: 1150px) {
      .certainty{
        align-items: center;
        margin-left:15%;
        padding-top:5%;
        width:60%;
        height:60%;
        padding-bottom:5%;
      }}
      @media screen and (min-width: 1150px) and (max-width: 1650px){
      .certainty{
        float:right;
        margin-right:15%;
        height: 20rem;
        width: 40rem;
        padding-bottom: 3%;
        }
      }
      @media screen and (min-width: 1650px){
      .certainty{
        float:right;
        margin-right:15%;
        height: 20rem;
        width: 50rem;
        padding-bottom: 3%;
        }
      }
      
      .centerImage{
        align-items: center;
        margin-left:15%;
        padding-top:5%;
        width:70%;
        height:50%;
        padding-bottom:5%;
      }
  
      .headerImage{
        align-items: center;
        margin-left:25%;
        padding-top:5%;
        width:50%;
        height:20%;
      }
      .button
    {
      color: white;
      font-size: 25px;
      text-decoration: none;
      background-color: #476d7d;
      padding: 1px 32px;
      margin: 4px 2px;
      cursor: pointer;
      border-radius: 10px;
              
            }
  
  }