
#slidercontainer{
  position: relative;
}


 .swipe {
        overflow: hidden;
        visibility: hidden;
        position: relative;
    }



    .swipe-wrap {
        overflow: hidden;
        position: relative;
    }

    .swipe-wrap>div {
        float: left;
        width: 100%;
        position: relative;
        z-index: 1;
    }

    .swipe-wrap {
        color: #fff;
    }

    .swipe-content {

        width: 50%;
        min-height: 50%;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
        position: absolute;
        bottom:0;
        left:0;
        background: rgba(0,0,0,0.7);
        display:flex;
        align-items: center;
        justify-content: center;
        padding:30px;
        box-sizing: border-box;
        opacity:0;
    }


@media(max-width:768px){

    .swipe-content{
      width:100%;
    }
}

    .swipe-content-bg {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
        position: absolute;
        top: 0;
        left: 0;
    }

    .swipe-item {
        position: relative;
        width: 100%;
      
    }


    .swipeleft{
      position:absolute;
      top:45%;
      left:0;
      background: #000;
      z-index: 2;
      width:50px;
      height:50px;
      border:none;
    }

    .swiperight{
position:absolute;
  width:50px;
      height:50px;
      top:45%;
      right:0;
      z-index:2;
      background:#000;
      border:none;
    }

    .swiperight,.swipeleft{
      display:flex;
      align-items: center;
      justify-content: center;
    opacity:0;
          transition: all 250ms linear;

    }

#slidercontainer:hover .swiperight, #slidercontainer:hover .swipeleft{
  opacity:1;
}


    .swipeleft img,.swiperight img{
      width:40px;
      filter:invert(100%);
    }


@media(max-width:768px){

.swiperight,.swipeleft{
  display: none;
}

}



.swipe-btn{
  padding:8px 15px;
 display:inline-flex;
   border;solid 1px #fff;
  border-radius: 5px;
  transition: all 250ms linear;
}

.swipe-btn:hover{
  filter: brightness(80%);
}


    .fadeInMe{
       animation:fadeIn 300ms 400ms linear;
        animation-fill-mode: forwards;
    }

    @keyframes fadeIn{
from{opacity:0}
to{opacity:1}
    }