{% for card in module.mechanics_group %},{% endfor %}{
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
}
@media only screen and (max-width: 600px) {
  .desktopbr{
    display:none;
  }
}

.new-content{
  display:none;
}




.steps-section .splide__track{
  overflow:visible;
}
#steps_splide .splide__slide:last-child {
  margin-right: 0!important; /* or any value you want */
}
.slide-card-container{
  position: relative;
  border-radius: 30px;
  background: #1F5522;
  padding: 20px;
  min-height: 620px;
  height:100%;
  max-width: 320px;
  border: 2px solid;
  border-image-slice: 30;
  border-image-width: 30px;
  border-image-source: url(https://www.maya.ph/hubfs/Maya%20Freelancing/few-taps-border.png);
}
.card-descriptiont sup{
  background: #75EEA5;
  border-radius: 50%;
  color: #404040;
  display: inline-block;
  font-size: 15px;
  height: 26px;
  letter-spacing: -.2px;
  line-height: 26px;
  max-width: 26px;
  text-align: center;
  top: 0;
  width: 100%;
}
.card-text-container em{
  font-size:13px;
  line-height:24px;
}
.card-text-container p{
  margin-bottom:0;
}

/*  */
.slider-footer-container{
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 500px;
  margin: auto;
  margin-top:30px;
  gap: 30px;
}

.slider-footer-container .slider_grid_progress {
  background: rgba(80, 177, 107, 0.3)!important;
  max-width: 420px!important;
  width: 100%!important;
  margin-top: unset!important;
  margin-left: unset!important;
  transform: unset!important;
}
.slider_grid_progress_bar {
  background: #50B16B;
  height: 2px;
  transition: width 600ms ease;
  width: 0;
}

.button-container .prev svg {
  transform: scaleX(-1); 
}
.button-container button{
  width: 40px;
  height: 40px;
  background: #75eea5;
  padding: 0;
  border: none;
  border-radius: 22px 22px 22px 22px;
}
.button-container svg {
  height: 14px;
  fill: #090909;
}