/* * {
  margin: 0;
} */

.slider {
  position: relative;
  height: 100vh;
  width: 100%;
}

/* .slider-item { */
  /*position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: 50% 50%;
  z-index: 0;*/
/* } */
/*  */
.slider-item-show {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: 50% 50%;
  z-index: 0;
  /*transition: background 1s linear;*/
  /*-webkit-transition: all 1s;*/
  -webkit-transition: background-image 1s linear; /* Safari & Chrome */
  -moz-transition: background-image 1s linear; /* Firefox */
  -o-transition: background-image 1s linear;  /* Opera */
  /*transition: background-image 1s linear;*/
}

.slider-panel {
  position: absolute;
  bottom: 0;
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: row; /*column;*/
          flex-direction: row; /*column;*/
  width: 100%;
  
  color: rgba(255, 255, 255, 0.7);
  z-index: 99;
}

/*edited
.slider-panel-2 {
  position: absolute;
  bottom: 0;
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 50%;
  color: rgba(255, 255, 255, 0.7);
  z-index: 20;
}*/

.slider-panel__navigation {
  margin: 0 1px; /*0 auto;*/
  padding: 24px;
  width: 50%; /*70%;*/
  /*text-align: center;*/
  
  /*edit*/
  color: white;
  text-shadow: 1px 1px 15px black;
  text-align: end;
  /* z-index: 20; */
}

.slider-panel__navigation i {
  margin: 0 auto; /*0 3%;*/
  font-size: 15px;
}

.slider-panel__navigation i:hover, .slider-panel__navigation i:active {
  color: white;
  cursor: pointer;
}

.slider-panel__controls {
  margin: 0 7px;
  padding: 10px;
  width: 50%; /*70%*/
  /*text-align: center;*/
  
  /*edit*/
  color: antiquewhite;
  text-shadow: 1px 1px 11px black;
  /*text-align: end;*/
  /*z-index:30;*/
}

.slider-panel__controls i {
  margin: 0 auto; /*0 4%;*/
  font-size: 40px;
}

.slider-panel__controls i:hover, .slider-panel__controls i:active {
  color: white;
  cursor: pointer;
}
/*0.2s blur ease-in*/

.active {
  z-index: 10;
  
  -webkit-animation: 3s fadeOut ease-in  ; 
          animation: 3s fadeOut ease-in  ; 
}


@-webkit-keyframes circle {
  0% {
    -webkit-clip-path: circle(75%);
            clip-path: circle(75%);
  }
  100% {
    -webkit-clip-path: circle(0%);
            clip-path: circle(0%);
  }
}

@keyframes circle {
  0% {
    -webkit-clip-path: circle(75%);
            clip-path: circle(75%);
  }
  100% {
    -webkit-clip-path: circle(0%);
            clip-path: circle(0%);
  }
}

@-webkit-keyframes blur {
  0% {
    -webkit-filter: blur(10px);
            filter: blur(10px);
  }
  100% {
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}

@keyframes blur {
  0% {
    -webkit-filter: blur(10px);
            filter: blur(10px);
  }
  100% {
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 0;
    }        
    100% {
        opacity: 1;        
    }
}

@keyframes fadeOut {
    0% {
        opacity: 0;
    }    
    100% {
        opacity: 1;        
    }
}