.custom-slider
{
  position:relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
.custom-slide
{
  position:absolute;
  width: 100% ;
  height: 100% ;
  
  -webkit-background-size: cover !important;
  background-size: cover !important;
  opacity:0;
  transition: .6s all;
  z-index: 2

}
.active-slide
{
  opacity: 1;
  top: 0 !important;
  left: 0 !important;
  z-index: 10 !important;
}

.custom-caption
{
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  overflow: hidden;
  color:white;
  text-align: center;
}

.custom-caption h1
{
  -webkit-transform: translateY(-200%);
  -ms-transform: translateY(-200%);
  transform: translateY(-200%);
  -webkit-transition: .4s all;
  -o-transition: .4s all;
  transition: .4s all;
  opacity: 0;
}

.custom-caption h3
{
  -webkit-transform: translateY(200%);
  -ms-transform: translateY(200%);
  transform: translateY(200%);
  -webkit-transition: .4s all;
  -o-transition: .4s all;
  transition: .4s all;
  opacity: 0;
}

.active-caption
{
  -webkit-transform: translateY(0) !important;
  -ms-transform: translateY(0) !important;
  transform: translateY(0) !important;
  opacity: 1 !important;
}
.active-button
{
  opacity:1 !important;
}




.custom-overlay
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background:rgba(0, 91, 136, .2)
}
.custom-slide .button
{
  background: rgb(241,127,178);
  padding: 10px 15px;
  display: inline-block;
  font-size: 18px;
  -webkit-transition: 1s all;
  -o-transition: 1s all;
  transition: 1s all;
  opacity:0;
}
.custom-slide .button:after
{
content: ' >';
display: inline-block;
animation:more 2s infinite;
}
.custom-slide .button:hover
{
  -webkit-filter: saturate(200%);
  filter: saturate(200%);
}
@keyframes more {
  0%{
    -webkit-transform: translateX(0) ;
  -ms-transform: translateX(0) ;
  transform: translateX(0) ;
  opacity: 0;
    }
    25%{
      -webkit-transform: translateX(25%) ;
    -ms-transform: translateX(25%) ;
    transform: translateX(25%) ;
    opacity: .25;
      }
      50%{
        -webkit-transform: translateX(50%) ;
      -ms-transform: translateX(50%) ;
      transform: translateX(50%) ;
      opacity: .50;
      }
        75%{
          -webkit-transform: translateX(100%) ;
        -ms-transform: translateX(100%) ;
        transform: translateX(100%) ;
        opacity: 1;
        }
          100%{
            -webkit-transform: translateX(0) ;
          -ms-transform: translateX(0) ;
          transform: translateX(0) ;
          opacity: 0;
              }
}
