@import url('https://fonts.googleapis.com/css2?family=ABeeZee&family=Montserrat:ital,wght@1,800&display=swap');
.container{
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
  font-family: "ABeeZee";
}

#backgroundImage{
  position: fixed;
  flex: wrap;
  width: 100%;
  height: 100%;
  z-index: -10;
}
#titleText{
  text-align: center;
  /* font-size: 200px; */
  margin-top: 200px;
  color: white;
}
.main{
  justify-content: center;
}
.links{
  align-content: center;
  text-align: center;
  justify-content: center;
  max-width: 900px;
  font-size: 20px;
  line-height: 20px;
  border-radius: 40px;
  font-size: 30px;
  display: block;
  margin-top: 40px;
  margin-bottom: 20px;
  padding: 20px;
  /* color: #1c3c24; */
  color:black;
  width: 400px;
  z-index: 0;
  font-family: "palatino";
}

a {
  text-decoration: none;
  z-index: 1;
}

#registerFood {
  background-color: #cf9690;
}

#haveFood {
  background-color: #9aaf96;
}

#needFood {
  background-color: #cfb990
}

/* NAVBAR CSS */
#navBar{
  display:inline-block;
  margin-top: 40px;
  white-space: nowrap;
  justify-content: center;
  position: absolute;
}
#homeDiv{
  display: inline-block;
  margin-left: 800px;
}
#homeLink{
  text-decoration: none;
  font-family: "palatino";
  color: #FFFFFF;
  font-size: 30px;
  margin-right: 50px;
}
#homeLink:hover{
  color: #AE6275;
}
#loginDiv{
  display: inline-block;
}
#loginLink{
  text-decoration: none;
  font-family: "palatino";
  color: #FFFFFF;
  font-size: 30px;
  margin-right: 50px;
}
#loginLink:hover{
  color: #CF9690;
}
#giveDiv{
  display: inline-block;
}
#giveLink{
  text-decoration: none;
  font-family: "palatino";
  color: #FFFFFF;
  font-size: 30px;
  margin-right: 50px;
}
#giveLink:hover{
  color: #9AAF96;
}
#findDiv{
  display: inline-block;
}
#findLink{
  text-decoration: none;
  font-family: "palatino";
  color: #FFFFFF;
  font-size: 30px;
  margin-right: 50px;
}
#findLink:hover{
  color: #CFB990;
}
#aboutDiv{
  display: inline-block;
}
#aboutLink{
  text-decoration: none;
  font-family: "palatino";
  color: #FFFFFF;
  font-size: 30px;
  margin-right: 50px;
  white-space: nowrap;
}
#aboutLink:hover{
  color: #AF90AF;
}

/* Media query */

@media screen and (max-width: 1000px){
  img#titleText{
    padding-top: 80px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    max-width: 80%;
    margin-top: 0px;

  }

  .title{
    margin-top: 0px;
  }
  #backgroundImage{
    object-fit: cover;
    position: fixed;

  }

  #navBar {
    display: none;
  }
}