.slideshow{
    width:100%;
    height:520px;
}
.slideshow .slide{
    display:none;
    overflow:hidden;
    padding:16px;
    height:100%;
}
.slideshow .slide.active{
    display:block;
}
.slide-progress{
    height:8px;
    width:100%;
    background-color:#EEE;
}
.slide-progress > div{
    height: 100%;
    width:0%;
    background-color:#08a;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.slide-element{
    transform: translate(0, 0), rotate(0deg);
    transition: all 0.75s;
    transition-property: transform, opacity;
    opacity: 1.0;
}

.stack-imgs{
    position: relative;
    width:100%;
    height:100%;
    margin:0 auto;
    left:0;
    right:0;
    text-align: right;
}
.stack-imgs img{
    position: absolute;
    top:0;
    left:0;
    right:0;
    width:auto;
    margin:0 auto;
    height:420px;
}

.a-fade-fx {
    opacity:0.0 !important;
}
.a-slide-up-fx{
    transform: translateY(100%);
    transition: all 0.75s;
    transition-property: transform, opacity;
    opacity: 0.0;
}
.a-slide-down-fx{
    transform: translateY(-100%);
    transition: all 0.75s;
    transition-property: transform, opacity;
    opacity: 0.0;
}
.a-slide-in-left{
    transform: translateX(100%);
    transition: all 0.75s;
    transition-property: transform, opacity;
    opacity: 0.0;
}

.a-slide-in-right{
    transform: translateX(-100%);
    transition: all 0.75s;
    transition-property: transform, opacity;
    opacity: 0.0;
}

.a-rot-in-left{
    transform: rotate(360deg) scale(1.0);
    transition: all 0.75s;
    transition-property: transform, opacity;
    opacity: 0.0;
    transform-origin: center;
}
.a-rot-in-right{
    transform: rotate(360deg) scale(1.0);
    transition: all 0.75s;
    transition-property: transform, opacity;
    opacity: 0.0;
    transform-origin: center;
}
.slide-margin{
    margin-top:128px;
}

@media only screen and (max-width:768px){
   
    .stack-imgs img{
       width: 100%;
       height:auto;
    }
    .slideshow{
        height:720px;
    }
 }