.mls_slider{

    position: relative;

    overflow: hidden;

}

.mls_slides_front

{

    width: 100%;

    height: 100%;

    float: left;

    perspective: 50em;

    -webkit-perspective: 50em;

}

.mls_slides_front > li {

  float: left;

  height: 100%;

  left: 0;

  opacity: 0;

  pointer-events: none;

  position: absolute !important;

  top: 0;

  transition: opacity 1s ease 0s;

  -webkit-transition: opacity 1s ease 0s;

  visibility: hidden;

  width: 100%;

  background-position: center center;

    background-size: 100% auto;

}

.mls_nav > div.mls_prev:before {

  content: "\f104";

  display: block;

  float: left;

  font-family: FontAwesome;

  font-size: 30px;

  width: 100%;

  text-align: center;

}

.mls_nav > div.mls_next:before {

  content: "\f105";

  display: block;

  float: left;

  font-family: FontAwesome;

  font-size: 30px;

  width: 100%;

  text-align: center;

}

.ets_multilayerslider {

  border: 1px solid #D4D4D4;

  border-radius: 8px 8px 8px 8px;

  display: block;

  margin-bottom: 25px;

  overflow: hidden;

  position: relative;

  width: 100%;

}

.mls_slides {

  float: left;

  position: relative;

  transform-origin: 0 0 0;

  width: 100%;

}

.msl_layer_front.active{

    display: block;

    opacity: 1;

    visibility: visible;

}

.msl_layer_front {

  display: none;

  opacity: 0;

  visibility: hidden;

}

.mls_loading_icon{

    display:  none;

}

.loading .mls_loading_icon {

  background: none repeat scroll 0 0 #fff;

  bottom: 0;

  left: 0;

  padding: 10px;

  display: block;

  position: absolute;

  right: 0;

  text-align: center;

  top: 0;

  vertical-align: middle;

  z-index: 11;

}

.loading .mls_loading_icon img {

  border: 10px solid #FFFFFF;

  border-radius: 10px 10px 10px 10px;

  float: left;

  left: 50%;

  position: relative;

  top: 50%;

  background-color: #fff;

  transform: translate3d(-50%, -50%, 0px);

  -webkit-transform: translate3d(-50%, -50%, 0px);

}



.loading .mls_slider_running{

    width: 0%;

}

.mls_moving_in .mls_slider_running {

  animation-fill-mode: both;

  animation-name: running;

  animation-timing-function: linear;

}

.mls_slider_running {

  height: 4px;

  left: 0;

  position: absolute;

  top: 0;

  transition: opacity 1s ease 0s;

  -webkit-transition: opacity 1s ease 0s;

  width: 100%;

  z-index: 1000;

}

.mls_slider:not(.mls_moving_in) .mls_slider_running {

  opacity: 0;

}

.mls_slides .mls_slides_front span {

  display: block;

  line-height: 100%;

}



@keyframes running{

    0% {

        width: 0%;

    }

    100% {

        width: 100%;

    }

}

@-webkit-keyframes running{

    0% {

        width: 0%;

    }

    100% {

        width: 100%;

    }

}









.mls_pagination {

  bottom: 10px;

  float: left;

  left: 50%;

  z-index: 10;

  position: absolute;

  transform: translateX(-50%);

  -webkit-transform: translateX(-50%);

  transform-origin: 0 100% 0;

  -webkit-transform-origin: 0 100% 0;

}

.mls_pag_button {

  backface-visibility: hidden;

  background: none repeat scroll 0 0 #FFFFFF;

  border-radius: 50% 50% 50% 50%;

  cursor: pointer;

  float: left;

  font-size: 0;

  height: 18px;

  margin: 5px 6px;

  padding: 0;

  perspective: 50em;

  width: 18px;

}

.mls_pag_button:not(.active) {

  background: #fff!important;

  border: 1px solid #D4D4D4;

}

.mls_slide_front.active {

  opacity: 1;

  pointer-events: auto;

  visibility: visible;

}

.mls_pag_button.active{

    background: #000;

    color: #fff;

}

.mls_nav > div:hover{

    color: #fff;

}

.mls_nav > div {

  background-color: rgba(255, 252, 255, 0.4);

  color: #666;

  cursor: pointer;

  font-size: 0;

  opacity: 0;

  padding: 0;

  border: 1px solid #D5D5D5;

  border-radius: 50% 50% 50% 50%;

  position: relative;

  transition: all 0.5s ease 0s;

  -webkit-transition: all 0.5s ease 0s;

  visibility: hidden;

  backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

  perspective: 50em;

  -webkit-perspective: 50em;

  margin-top: -20px;

  width: 40px;

  line-height: 36px;

  height: 40px;

}

.ets_multilayerslider:hover .mls_nav > div{

    opacity: 1;

    visibility: visible;

    transform: translateX(0%) translatey(-50%);

    -webkit-transform: translateX(0%) translatey(-50%);

    margin-left: 15px;

    margin-right: 15px;

    border-radius: 50%;

}

.mls_nav {

  height: 0;

  left: 0;

  position: absolute;

  top: 50%;

  width: 100%;

}

.mls_prev {

  float: left;

  transform-origin: 0 0 0;

  -webkit-transform-origin: 0 0 0;

  margin-left: -100px;

}

.mls_next {

  float: right;

  transform-origin: 100% 0 0;

  -webkit-transform-origin: 100% 0 0;

  margin-right: -100px;

}