/************* OPACITY TEST ARTICKE ************************/

/* http://www.itnewb.com/v/Cross-Browser-CSS-Opacity-and-the-JavaScript-Fade-Fading-Effect
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; */ 


.test-opacity {
	line-height:normal;
	position:relative;
	background: url('http://www.shibashake.com/wordpress-theme/images/css-opacity/css-opacity1.jpg') top left no-repeat;  
	width:520px; height:661px; 
	}

.css-opacity {
	position:relative;
	left: 50px;
	width: 300px;
	color:#000000;
	font-family: Arial, Helvetica, sans-serif;
}

.css-opacity a {
	color:#000000;
	}

.css-opacity0 {
	margin-bottom:20px;
	padding:20px;
	
	}
	
.css-opacity1 {
	background-color:#ffffff;
	
	zoom:1; /* hasLayout for IE6 and IE7 */
	
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;	
	opacity:0.5; 
    filter:alpha(opacity=50);
}

.css-opacity2 {
	background-color:#ffffff;

	background: rgba(255, 255, 255, 0.5); 
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; /* IE 8 */
    zoom:1; /* so the element "hasLayout"
	/* or, to trigger "hasLayout" set a width or height */
}

.css-opacity3 {
	background-color:#ffffff;
	zoom:1; /* hasLayout for IE6 and IE7 */	
}

.css-opacity4 {
	height:80px;
	background-color:#ffffff;
	
	opacity:0.5; 
    filter:alpha(opacity=50);
}

.css-opacity4b {
	position:relative;
	top:-100px;
	left:20px;
	width: 440px;

}

.css-opacity5 {	
	position:relative;
	top: -40px;
	background: url("https://shibashake.com/wordpress-theme/wp-content/uploads/2009/10/overlay-sm.png") top left repeat;  
	border: none; 
}



.opacity50 {
    opacity:0.5; 
    filter:alpha(opacity=50); 
}

.opacity100 {
    opacity:1.0; 
    filter:alpha(opacity=100); 
}



.css-opacity1:hover {
    opacity:1;
    filter:alpha(opacity=100)
}

.css-opacity2:hover {
	background: rgba(255, 255, 255, 1.0); 
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
	zoom:1;
}

.css-opacity4:hover {
    opacity:1;
    filter:alpha(opacity=100)
}



.css-opacity5:hover {
	background-color:#ffffff;
	backgroung-image:none;
}
