div.slide-container.left {
	right: 0px;
	display: block;
	width: 50%;
}

.product-feature-container-wide.slide div.slide-container.left .slide-contents {
	padding: 20px;
	position: relative;
	right: 100%;
	animation-duration: 1.5s;
	animation-name: slide-in-from-left;
	animation-fill-mode: forwards;
}

@keyframes slide-in-from-left {
  to {
       right: 0px; 
  }
}

div.slide-container.right {
	width: 50%;
	position: absolute;
	right: 0px;
	display: block;
}

.product-feature-container-wide.slide div.slide-container.right .slide-contents {
	padding: 20px;
	position: relative;
	left: 100%;
	animation-duration: 1.5s;
	animation-name: slide-in-from-right;
	animation-fill-mode: forwards;
}

.slide-contents img {
	width: 100%;
}

@keyframes slide-in-from-right {
  to {
  	left: 20px;
  }
}

.product-feature-container-wide .slide-container {
	opacity: 0.0;
}

.product-feature-container-wide.is-visible .slide-container {
	opacity: 1;
 	transition: opacity 1000ms;
}


.faded-scroller {
	cursor: ns-resize;
	padding-top: 100px;
	padding-bottom: 180px;
    overflow: auto;
    position: relative;
    height: 500px;
    z-index: 5;
}

.faded-scroller-fade-top {
    content:'';
    margin-bottom: -100px;
    height: 100px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    position: relative;
    z-index: 10;
}

.faded-scroller-fade-bottom {
    content:'';
    margin-top: -200px;
    height: 200px;
    background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    position: relative;
    z-index: 10;
}

.no-scroll-y {
	overflow-y: hidden;
}