.calender {
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  margin-top: 50px;
}
.calender .calender-body {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: #fff;
}

.calender .block1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  background: transparent;
  color: black;
  padding: 30px 20px;
}
.calender .block2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  background: rgb(244, 16, 16);
  padding: 30px 20px;
  border-radius: 10px;
}
.calender .extension {
  background: antiquewhite;
  color: #000;
  /* padding: 10px; */
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 40px;
  margin: 10px;
  border-radius: 50%;
  font-weight: 700;
  cursor: pointer;
  transition: 0.25s;
}
.calender .extension:hover {
  font-size: 40px;
}
.calender .extension:active {
  color: white;
  background: red;
}
.extension-close {
  display: none;
  background: antiquewhite;
  color: #000;
  padding: 14px;
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  font-weight: 700;
  cursor: pointer;
  transition: 0.25s;
  right: 210px;
  top: 800px;
  z-index: 2;
  transition: 0.25s;
}
.extension-close:active {
  color: white;
  background: red;
}