/* MAIN */
.slider{
  position:relative;
  width:95%;
  height:85vh;
  margin:auto;
  border-radius:24px;
  overflow:hidden;
}

/* SLIDES CONTAINER */
.slides{
  position:relative;
  width:100%;
  height:100%;
}

/* SLIDE (fade system) */
.slide{
  position:absolute;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  padding:60px;
  box-sizing:border-box;

  opacity:0;
  transform:scale(1.05);     /* small zoom out */
  filter:blur(6px);          /* soft blur */
  visibility:hidden;

  transition:
    opacity 1.2s ease,
    transform 1.2s ease,
    filter 1.2s ease;
}

/* active slide */
.slide.active{
  opacity:1;
  transform:scale(1);        /* zoom in */
  filter:blur(0);
  visibility:visible;
  z-index:2;
}
.slide-right
li {
    font-size: 18px;
    line-height: 40px;
    color: #333333;
}

/* LEFT IMAGE */
.slide-left{
  width:50%;
}

.slide-left img{
  width:80%;
}

/* RIGHT TEXT */
.slide-right{
  width:50%;
  animation:textFade 1.1s ease;
}
.slide-right h3 {
    font-size: 21px!important;
}

@keyframes textFade{
  from{
    opacity:0;
    transform:translateY(40px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.slide-right h2{
  font-size:42px;
}

.slide-right p{
  font-size:18px;
  color:#666;
  margin:20px 0;
}

.slide-right button{
  padding:12px 28px;
  border-radius:30px;
  background:#111;
  color:#fff;
  border:none;
  cursor:pointer;
  transition:.3s;
}

.slide-right button:hover{
  transform:scale(1.05);
}

/* DOTS */
.dots{
  position:absolute;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:10px;
}

.dot{
  width:10px;
  height:10px;
  background:#000;
  opacity:0.25;
  border-radius:50%;
  cursor:pointer;
  transition:.3s;
}

.dot.active{
  opacity:1;
  transform:scale(1.3);
}

img.topleftimdo {
    width: 6%;
    margin-bottom: 5px;
}
.linediv {
    background: #00ffff;
    height: 2px;
    width: 23%;
    margin-bottom: 15px;
}
.rightquto{
	    width: 6%;
    margin-left: 8px;
}

/* text animation */
@keyframes fadeUp{
  from{
    opacity:0;
    transform:translateY(30px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* responsive */
@media(max-width:768px){
  .slide{
    flex-direction:column;
    text-align:center;
  }
  .slide-left,.slide-right{
    width:100%;
    padding:0;
  }
}