@font-face {
    font-family: myFirstFont;
    src: url(../fonts/LibreFranklin-Thin.ttf) format('ttg');
  }
  .imagehome{
    padding: 10px;
  }
  .cardheader{
    color: black;
    background-color: transparent;
  }
  html, body {
    height: 100%;
    margin: 0;
    /* background: linear-gradient(to bottom, #f0f0f0, #ffffff); Light gray to white */
    background-color: lightgray;
  }
  .full-height {
      height: 100%;
  }
  .parallax {
      /* The image used */
      
    
      /* Set a specific height */
    height: 100%;
    
      /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Full viewport height */
  }

    /* Push this div to the bottom */
  .bottom-div {
    margin-top: auto; /* Pushes the div to the bottom */
    background-color: lightgray;
    padding: 10px;
  }

  .sideopenmenu {
    width: 25% !important;
    display: block;
  }

  .sideclosemenu{
    display: none;
  }

  @media screen and (max-width: 600px) {
    .sideopenmenu {
      width: 100% !important;
      display: block;
    }
  }