* {
    scroll-margin-top: 40px;
  }
  html {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
  }
  
  body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    background: #F2F2F2;
  }
  
  /*--------------------------------------Black Navigation Bar-----------------------------------*/
  
  .navbar{
    max-width: 750px;
    border-radius: 0px 0px 8px 8px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -20px;
    padding: 8px 3px 8px 3px;
    }
  
  .card{
    width: 100%;
      max-width: 730px;
      margin-left: auto;
      margin-right: auto;
    margin-top: 30px;
  }
  
  .card p{
    margin:0;
  }
  
  #footer{
    bottom: 0;
    position: fixed;
    padding: 10px;
    box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
  }
  
  /* Responsive layout - when the screen is less than 800px wides*/
  @media screen and (max-width: 800px) {
    .card{
        max-width: 98%;
    }
  }
  
  /* Responsive layout - when the screen is less than 400px wide */
  @media screen and (max-width: 400px) {
    .card{
        max-width: 98%;
    }
  }