/* Media Queries below............................................ */


    /* hides images when page's are < 600px */
    @media (max-width: 650px) {
        img#lastImg {
          display: none;
        }
  
        img#firstImg {
          display: none;
        }
  
        img#meetTheTeamBlurbImg {
          display: none;
        }
  
        /* makes the corresponding text in the divs with images 100% width */
  
        div#div1 {
          display: block;
          width: 100%;
          text-align: justify;
        }
  
        #meetTheTeamPara {
          width: 100%;
          text-align: justify;
          padding: 4%;
        }
      }

      /* reveals hidden divs and moves pictures into them */

      @media (min-width: 650px) {
      img#meetTheTeamBlurbImgHidden {
        display: none;
      }
    }



      /* media queries for the ebb and flow logo, this has 2 break points */
      @media (max-width: 780px) {
        img#ebbAndFlowLogoImg {
          margin-top: 2%;
          margin-bottom: 2%;
          max-width: 50%;
          max-height: 50%;
  
        }
      }
  
      @media (max-width: 670px) {
        img#ebbAndFlowLogoImg {
            margin-top: 2%;
            margin-bottom: 2%;
          max-width: 60%;
          max-height: 60%;
        }

        /* .blockingDivForPageTop {
            height: 100px;
            
          } */
      }
  

      /* this pads the top of the document and prevents the nav bar covering */
.blockingDivForPageTop {
  height: 75px;
  display: block;
  width:100%;
}

@media screen and (max-width: 1530px) {
  .blockingDivForPageTop {
    /* display: block; */
    height: 110px;
    /* background-color: #1e6477; */
  }
}

@media screen and (max-width: 1080px) {
  .blockingDivForPageTop {
    /* display: block; */
    height: 150px;
    /* background-color: #1e6477; */
  }
}

@media screen and (max-width: 670px) {
  .blockingDivForPageTop {
    /* display: block; */
    height: 150px;
    /* background-color: #1e6477; */
  }
}

@media screen and (max-width: 560px) {
  .blockingDivForPageTop {
    /* display: block; */
    height: 180px;
    /* background-color: #1e6477; */
  }
}


      @media (max-width: 510px) {
        .blockingDivForPageTop {
            height: 180px;
            
          }
      }
  
      /* adds extra padding for phone screens */
      @media (max-width: 450px) {
        .blockingDivForPageTop {
            height: 220px;
            
          }
      }