.events {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
}

#gs-1, #gs-2, #gs-3, #gs-4 {
  position: absolute;
  width: clamp(40px, 8vw, 50px);
  height: auto;
}

#gs-1 {
  top: -1rem;
  left: -1rem;
}
#gs-2 {
  top: -1rem;
  right: -1rem;
}
#gs-3 {
  bottom: -1rem;
  right: -1rem;
}
#gs-4 {
  bottom: -1rem;
  left: -1rem;
}

.events-con {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3rem;
  border: 2px dotted darkred;
  padding: 2rem;
}

.events-img-con {
  position: relative;
  flex: 0 0 35%;
}

.events-img {
  display: block;
  height: 100%;
  width: 100%;
  margin-top: 1rem;
}

#glitter-star {
  position: absolute;
  top: -5%;
  right: 90%;
  width: 20%;
  height: auto;
}

.events-desc{
  text-align: center;
  color: #a2a2a2;
  .events-title{
    text-decoration: underline dotted;
    font-weight: bold;
    color: lightgrey;
  }
}

@media screen and (max-width: 768px) {
  .events-con {
    flex-direction: column;
    gap: 2rem;
  }

  .events-img-con {
    flex: 0 0 auto;
    width: 80%;
    max-width: 400px;
  }

  .events-desc {
    width: 100%;
  }
}
