
.spacer{margin-top:100px;}
.alignleft {
    text-align:left;
}
.alignright {
    text-align:right;
}
#ext-1 {
    position:absolute;
    height:100%;
    z-index:5;
    top:100px;
}
#ext-2 {
    position:absolute;
    height:100%;
    transform:scale(0.7) translateX(-35vw);
    z-index:4;}
#ext-2 .image-w{
    opacity:0.7
}
#ext-3 {
    position:absolute;
    height:100%;
    transform:scale(0.7) translateX(-10vw);
    z-index:3;
    top:-100px;
}
#ext-3 .image-w{
    opacity:0.7
}
#ext-4 {
    position:absolute;
    height:100%;
    transform:scale(0.7) translateX(25vw);
    z-index:2;}
#ext-4 .image-w{
    opacity:0.2
}
#ext-5
{
    position:absolute;
    height:100%;
    transform:scale(0.2);
    z-index:1;}
#ext-5 .image-w{
    opacity:0;
}
#ext-6 {
    position:absolute;
    height:100%;
    transform:scale(0.4) translateX(20vw);
    z-index:2;}
#ext-6 .image-w{
    opacity:0.2
}
#ext-7 {
    position:absolute;
    height:100%;
    transform:scale(0.6) translateX(30vw);
    z-index:3;}
#ext-7 .image-w{
    opacity:0.6
    
}
#ext-8
{
    position:absolute;
    height:100%;
    transform:scale(0.7) translateX(20vw);
    z-index:4;}
#ext-8 .image-w{
    opacity:0.7
}

.slider-cont {
    width:80%;
    position:relative;
    display:inline-block;
}

.image-slider {
    height:100%;
    position:absolute;
}

.cont-slider {
    display:inline-block;
    vertical-align:middle;
    transform-origin: top;
    transition:all 500ms cubic-bezier(0.71, 0.57, 0.01, 0.98);
}

.slider-layer {
    position:absolute;
    z-index:6;
    width:100%;
    height:100%;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+26,0+50,0+77,1+100 */
background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 26%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 77%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 26%,rgba(255,255,255,0) 50%,rgba(255,255,255,0) 77%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 26%,rgba(255,255,255,0) 50%,rgba(255,255,255,0) 77%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */


}

.test-slider {
    position:relative;
    width:30%;
    height:0;
    padding-bottom:30%;
    margin-left:35%;
}

.image-w {
    height:100%;
    position:absolute;
}

.arrow {
    display:inline-block;
    width:10%;
    opacity:0.3;
    vertical-align: top;
}
.arrow:hover{cursor:pointer}

.arimage {
    width:100%;
}

.arrowleft {
    width: auto;
}

.arrowright {
    width: auto;
}

.flat-w-image {
    -webkit-filter:contrast(0) brightness(10);
    filter:contrast(0) brightness(10);
}


#ext-8 {
    transform: scale(0.7) translateX(30vw);
}
#ext-2 {
    transform: scale(0.7) translateX(-45vw);
}
.test-slider {
    position: relative;
    width: 40%;
    height: 0;
    padding-bottom: 35%;
    margin-left: 40%;
}

.Products-slide-btn .arrow {
    opacity: 1;
    width: auto;
}
#ext-1 {
    transform: scale(1) scale(1) translateX(-12vw);
}
