.svatebcane_info{
  width: 100%;
  display: grid;
  grid-template-columns: 2fr 5fr 2fr;
}

.svatebcane_info .item{
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  height: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color);
}

.timeline-holder {
  -webkit-box-shadow: 0 1px 10px 0 rgba(211, 222, 227, .7);
  -moz-box-shadow: 0 1px 10px 0 rgba(211, 222, 227, .7);
  box-shadow: 0 1px 10px 0 rgba(211, 222, 227, .7);
  box-sizing: border-box;
  padding: 30px 10% 30px;
  text-align: center;
  position: relative;
  background-color: #fff;
  margin-top:-50px; 
  margin-bottom: -50px
}

.timeline-holder .st-text-holder {
  position: relative;
  margin-bottom: 60px;
}

.timeline-holder .st-title {
  font-family: LearningCurveRegular;
  color: #121f38;
  font-size: var(--font-size-big);
}

.timeline-holder .st-bottom-title {
  font-family: LearningCurveBold;
  color: #121f38;
  font-size: var(--font-size-xxl);
}

.timeline-holder .st-date, .timeline-holder .st-title {
  display: block;
  width: 100%;
}

.timeline-holder .st-date {
  color: #c78665;
  font-style: italic;
  font-size: var(--font-size-small);
  margin-top: 10px;
  margin-bottom: 10px;
}

.timeline-holder .st-text{
  color: #393a41;
  text-align: justify;
  letter-spacing: .02em;
}

.timeline-holder .st-text-holder:after {
  content: '';
  position: absolute;
  height: 30px;
  width: 1px;
  background-color: #121f38;
  left: 50%;
  bottom: -50px;
}
figure.decorate{
  text-align: -webkit-center;

}

figure.decorate div{
  position: relative;
  width: fit-content;
  height: fit-content;
}

figure.decorate img{
  width: 80%;
  /* -webkit-filter:  brightness(116%)  grayscale(72%) hue-rotate(0deg) invert(0%) opacity(100%) saturate(203%) sepia(14%);
          filter:  brightness(116%)  grayscale(72%) hue-rotate(0deg) invert(0%) opacity(100%) saturate(203%) sepia(14%); */

}

figure.decorate div::after {
  content: '';
  position: absolute;
  top: 2%;
  left: 10%;
  width: 80%;
  height: 96%;
  border-radius: 50%; /* Keep the overlay circular */
  border: 4px double #c786658F; /* Semi-transparent overlay */
  z-index: 1; /* Ensure it sits on top of the image */
}

@media only screen and (max-width: 768px) {

  .svatebcane_info{
      grid-template-columns: 1fr;
  }

  figure.decorate img{
    width: 60%;
  
  }

  figure.decorate div::after {
    left: 20%;
    width: 60%;
  }

  .svatebcane_info .item{
      width: 100%;
      height: auto;
      display: inline-block;
  }
}