@media (min-width: 300px) {
  h2 {
    text-align: center;
  }

  .cs-slide-txt {
    font-size: 2em;   
  }
}

@media (min-width: 576px) {
  h2 {
  }
}

@media (max-width: 768px) {
  #carousel-1 {
    height: 70vh;
  }
}

@media (max-width: 8000px) {
  #carousel-1 {
    height: 70vh;
  }
}

h2 {
  font-size:8vh;
  color:#0D6EFD;
  font-weight:bold;
}


.cs-slide-txt {
  font-size: 3em;    
}

.transformBoard1 {
  animation: skewDiv 2s linear forwards;
}

@keyframes skewDiv {
  from {
    transform: skewY(-9deg) rotateY(-30deg);
    opacity: 0;
  }
  to {
    transform: skewY(0deg) rotateY(0) ;
    opacity: 1;
  }
}

.showDiv {
  animation: showDivOnScroll 2s linear;
  animation-timeline: view();
  animation-range: entry 0 cover 40%;
}


@keyframes showDivOnScroll {
  from {
    opacity: 0;
    scale:0.5;
  }
  to {
    opacity: 1;
    scale:1;
  }
}