* {box-sizing: border-box;}
body {font-family: Verdana, sans-serif;}


.nav-item{
  padding-left:185px;
}

#zeros{
  padding: 20px;
  border:1px, black;
  width: 150px;
  height: 250px;
  margin-right:25px;
  margin-top:20px;
  align-self:left;
  display:inline-block;

}

.flex-container {
  display: flex;
  background-color: rgb(187, 247, 255);
}

.date-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  padding-left:130px;
  padding-right:130px;
  grid-gap: 20px; 
}


#monthText{
  font:arial;
  font-size: larger;
  text-align: center;

}

#backgroundDiv{
  widows: 70%;
  height:50%;
}

#imageDiv{
  max-width:100%;
  max-height:100%;

}
#title{
  text-align: center;
  font: helvetica;
}

#daysWrapper{
  background:rgb(118, 189, 255);
  width: 9000px;
  margin: auto;

}

.dayInfoDiv{
  padding: 20px;
  background:rgb(175, 243, 255);
  border: 1px, black;
  width: 150px;
  height: 250px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  padding-top:30px;


}

#newEventDiv{
  padding: 40px 25px;
  width: 100%;
  background: rgb(255, 255, 255);
  text-align: center;
}

#editEventDiv{
  padding: 40px;
  width: 100%;
  vertical-align: top;

}

.monthDaysDiv{
  width:120px;
  padding: 20px;
  margin-top: 20px;
  height:150px;
  display:inline-block;

}

#calendarDay{
  padding: 20px;
  border: 1px, black;
  width: 150px;
  height: 250px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}