 .ia-container {
	width: 920px;
	overflow: hidden;
	-moz-box-shadow: 0px 6px 20px #000;
		-webkit-box-shadow: 0px 6px 20px #000;
		box-shadow: 0px 6px 20px #000;
		/* For IE 8 */
		-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000')";
		margin-top:10px;
		margin: 0 auto;
	}

.ia-container figure {
    position: absolute;
	top: 0;
	left: 120px; /* width of visible piece */
	width: 560px;
    box-shadow: 2 2 2 6px rgba(255,255,255,0.6);
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.ia-container > figure {
    position: relative;
	left: 0 !important;
}

.ia-container img {
	display: block;
	width: 100%;
}

.ia-container input {
	position: absolute;
	top: 0;
	left: 0;
	width: 120px; /* just cover visible part */
	height: 100%;
	cursor: pointer;
	border: 0;
	padding: 0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
	z-index: 100;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.ia-container input:checked{
	width: 5px;
	left: auto;
	right: 0px;
}
.ia-container input:checked ~ figure {
	-webkit-transition: all 0.7s ease-in-out;
    -moz-transition: all 0.7s ease-in-out;
    -o-transition: all 0.7s ease-in-out;
    -ms-transition: all 0.7s ease-in-out;
    transition: all 0.7s ease-in-out;
	left: 550px;
}

.ia-container figcaption {
	width: 100%;
	height: 100%;
	background: rgba(15, 67, 172, 0.07);
	position: absolute;
	top: 0px;
	-webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
	-moz-box-shadow: -2px 0px 10px #000;
		-webkit-box-shadow: -2px 0px 10px #000;
		box-shadow: -2px 0px 10px #000;
		/* For IE 8 */
		-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000')";
		/* For IE 5.5 - 7 */
		filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000');
}

.ia-container figcaption span {
	position: absolute;
	top: 70%;
	margin-top: 20px;
	width:480px;
	overflow: auto;
	text-align: left;
	background: rgba(255,255,255);
	line-height: 14px;
	font-size: 11px;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	text-transform: none;
	padding-left: 30px;
	padding-right:700px;
	padding-top:30px;
	padding-bottom:100px;
	color: #000;
	background-color: #FFF;
	background: url(images/linear_bg_2.png);
	background-repeat: repeat-x;
	-webkit-text-size-adjust: 100%;
	/* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, 0% 50%, 70% 100%, from rgba(255, 255, 255, 0), to rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1));
	/* Safari 5.1, Chrome 10+ */
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1));
	/* Firefox 3.6+ */
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1));
	/* IE 10 */
  background: -ms-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1));
	/* Opera 11.10+ */
  background: -o-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1));
		}


.ia-container input:checked + figcaption,
.ia-container input:checked:hover + figcaption{
	background: rgba(8, 195, 242, 0);
}

.ia-container input:checked + figcaption span {
	-webkit-transition: all 0.4s ease-in-out 0.5s;
    -moz-transition: all 0.4s ease-in-out 0.5s;
    -o-transition: all 0.4s ease-in-out 0.5s;
    -ms-transition: all 0.4s ease-in-out 0.5s;
    transition: all 0.4s ease-in-out 0.5s;
	
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=99)";
    filter: alpha(opacity=99);
	opacity: 1;
	
	top: 50%;
}

.ia-container #ia-selector-last:checked + figcaption span {
	-webkit-transition-delay: 0.3s;
	-moz-transition-delay: 0.3s;
	-o-transition-delay: 0.3s;
	-ms-transition-delay: 0.3s;
	transition-delay: 0.3s;
}

.ia-container input:hover + figcaption {
	background: rgba(8, 195, 242, 0.01);
}

.ia-container input:checked ~ figure input{
    z-index: 1;
}
}
  
  @media screen and (max-width: 768px) {
    .ia-container { 
		width: auto;
		height:600px; 
		margin:0 auto;
		position:relative;
		top:110px;
		border:none;
	}
	
	.ia-container figure { 
		top: 100px; 
		width: 100%;
		display:compact;
left:0;
	}
	
	.ia-container input { 
		width: 100%; /* just cover visible part */
	height: 50px; 
	
	}
	.ia-container img { 
		height: 350px;
		width:auto; 
		top:0px;
	
	}
	
	.ia-container input:checked ~ figure { 
		top: 300px; 
		left:0;
	}
	
	

	
	.ia-container input { 
	width: 100%;	
	height: 50px; /* just cover visible part */
	
	}
	.ia-container img { 
		
		
	border-top: 1px;
border-color:#666
	}
	
	.ia-container input:checked ~ figure { 
		top: 100%; 
		left:0;
	}
	
	.ia-container figcaption { 
		overflow:hidden;
		width:500px;
	} 
.ia-container figcaption span{ 
		overflow:hidden;
		left: 100px;
		width:50%;
		font-size:1em;
	} 
.ia-container figcaption p{
	display:none;
}
.ia-container figcaption li{ 
		font-size:1.1em;
	} 
}
