.swiper-container {
  height: 100vh;
}
.swiper-container.fullscreen {
  height: 100vh;
}
.swiper-container .swiper-slide {
  background: lightgray;
  text-align: center;
  /* Center slide text vertically */
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;

  background-position: center;
  background-size: cover;  
}
.swiper-container .swiper-slide img {
  position: absolute;
  max-width: 100%;
  object-fit: cover;
  z-index: 2;
  cursor: pointer;
}
.swiper-container .swiper-slide figcaption {
  position: absolute;
  bottom: 15%;
  z-index: 3;
}
.swiper-container .swiper-slide a {
  background: #000;
  color: #fff;
}

.swiper-container .swiper-horizontal>.swiper-pagination-bullets, 
.swiper-container .swiper-pagination-bullets.swiper-pagination-horizontal, 
.swiper-container .swiper-pagination-custom, 
.swiper-container .swiper-pagination-fraction {
  bottom: 80px;
}
.swiper-container .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background-color: transparent;
  border: 2px solid #fff;
  opacity: 1;
}
.swiper-container .swiper-pagination-bullet-active {
  background-color: #fff;
}


.slides-navigation {position: absolute;top: 50%;margin: 0 auto;width: 100%;z-index: 3;}
.slides-navigation a {position: absolute;display: block;}
.slides-navigation a.prev {left: 0;}
.slides-navigation a.next {right: 0;}
.slides-pagination {position: absolute;bottom: 10px;width: 100%;text-align: center;z-index: 3;}
.slides-pagination a {  
  margin: 2px;width: 10px;height: 10px;
  text-indent: -100%;
  display: -moz-inline-stack;display: inline-block;
  vertical-align: middle;*vertical-align: auto;  
  *display: inline;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR4nGP6zwAAAgcBApocMXEAAAAASUVORK5CYII=");  
  overflow: hidden;zoom: 1;
  border: 1px solid #fff;  border-radius: 15px;
}
.slides-pagination a.current {background: #fff;}

.nav-fillpath a{
  width:70px;height:100px;
  -webkit-transition:opacity .3s;
  transition:opacity .3s;opacity:0;
}
.nav-fillpath a{
  opacity:1;
}
.nav-fillpath .icon-wrap{
  position:relative;
  display:block;
  width:100%;
  height:100%;
}
.nav-fillpath .icon-wrap::after,
.nav-fillpath .icon-wrap::before,
.nav-fillpath a::after,
.nav-fillpath a::before{
  content:'';
  position:absolute;left:30%;
  width:3px;height:30%;
  background:#fff;
  -webkit-transition:-webkit-transform .3s;
  transition:transform .3s;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
.nav-fillpath .icon-wrap::after,
.nav-fillpath .icon-wrap::before{
  height:0;background:#fff;
  -webkit-transition:height .3s,-webkit-transform .3s;transition:height .3s,transform .3s;z-index:100;
}
.nav-fillpath .icon-wrap::before,.nav-fillpath a::before{
  top:50%;
  -webkit-transform:translateX(-50%) rotate(-135deg);
  transform:translateX(-50%) rotate(-135deg);
  -webkit-transform-origin:50% 0;
  transform-origin:50% 0;
}
.nav-fillpath a.next .icon-wrap::before,
.nav-fillpath a.next::before{
  right:30%;left:auto;
  -webkit-transform:translateX(-50%) rotate(135deg);
  transform:translateX(-50%) rotate(135deg);
  -webkit-transform-origin:50% 0;transform-origin:50% 0;
}
.nav-fillpath .icon-wrap::after,
.nav-fillpath a::after{top:50%;
  -webkit-transform:translateX(-50%) rotate(-45deg);
  transform:translateX(-50%) rotate(-45deg);
  -webkit-transform-origin:0 0;
  transform-origin:0 0;
}
.nav-fillpath a.next .icon-wrap::after,
.nav-fillpath a.next::after{
  right:30%;left:auto;
  -webkit-transform:translateX(-50%) rotate(45deg);transform:translateX(-50%) rotate(45deg);
  -webkit-transform-origin:100% 0;
  transform-origin:100% 0;
}
.nav-fillpath h3{
  position:absolute;top:50%;
  color:#fff;
  font-weight:300;font-size:.85em;
  opacity:0;
  -webkit-transition:-webkit-transform .3s,opacity .3s;
  transition:transform .3s,opacity .3s;
}
.nav-fillpath a.prev h3{
  left:100%;-webkit-transform:translateY(-50%) translateX(-50%);transform:translateY(-50%) translateX(-50%);
}
.nav-fillpath a.next h3{right:100%;text-align:right;-webkit-transform:translateY(-50%) translateX(50%);
  transform:translateY(-50%) translateX(50%);
}
.nav-fillpath a:hover .icon-wrap::after,
.nav-fillpath a:hover .icon-wrap::before{height:50%;}
.nav-fillpath a:hover .icon-wrap::before,
.nav-fillpath a:hover::before{
  -webkit-transform:translateX(-50%) rotate(-125deg);
  transform:translateX(-50%) rotate(-125deg);
}
.nav-fillpath a.next:hover .icon-wrap::before,
.nav-fillpath a.next:hover::before{
  -webkit-transform:translateX(-50%) rotate(125deg);
  transform:translateX(-50%) rotate(125deg);
}
.nav-fillpath a:hover .icon-wrap::after,
.nav-fillpath a:hover::after{
  webkit-transform:translateX(-50%) rotate(-55deg);
  transform:translateX(-50%) rotate(-55deg);
}
.nav-fillpath a.next:hover .icon-wrap::after,
.nav-fillpath a.next:hover::after{
  -webkit-transform:translateX(-50%) rotate(55deg);
  transform:translateX(-50%) rotate(55deg);
}
.nav-fillpath a:hover h3{
  opacity:1;
  -webkit-transform:translateY(-50%) translateX(0);transform:translateY(-50%) translateX(0);
}


@media (max-width: 575px) { 
    .nav-fillpath a {
      width: 40px;
      height: 60px;
    }
}