.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;
                
              }
        .center
        {
            text-align: center;
            text-anchor: middle;
        }
        .footer {

            padding: 20px;
            text-align: center;
            background: #ddd;
            margin-top: 20px;
          }

    
    }