/**************************************************************

	Image Menu
	v 2.2

**************************************************************/


.example {

float:left;


}


.line-up {
	padding: 0 0 0 0;
	float:left;
	width: 920px;
}





#imageMenu {
padding: 0 0 0 0;
float:left;
	position: relative;
	/* Eric 2/3 - Opening Width reversed, the more, the less it opens */
	/* Eric Also acts as a padding-right */	width: 230px;
	height: 171px;
	overflow: hidden;
}



#imageMenu ul {
padding: 0 0 0 0;
	list-style: none;
	margin: 0px;
	display: block;
	height: 171px;
	width: 1000px;
	
	}

#imageMenu ul li {
	float: left;
}

#imageMenu ul li a {
	text-indent: -1000px;
	background:#FFFFFF none repeat scroll 0%;
	border-right: 2px solid #fff;
	cursor:pointer;
	display:block;
	overflow:hidden;
	/* Eric 3/3 - size of Columns , to adjust with last container, the opened one, in the html file as open width parameter */	
	width:70px;
	height: 171px;
}

#imageMenu ul li.landscapes a {
	background: url(../images/s1_2.jpg) repeat scroll 0%;
}

#imageMenu ul li.people a {
	background: url(../images/s1_1.jpg) repeat scroll 0%;
}

#imageMenu ul li.nature a {
	background: url(../images/s1_0.jpg) repeat scroll 0%;
	width: 310px;
}



.clear {
	clear: both;
}

/*************************************************************/


#imageMenu2 {
padding: 0 0 0 0;

float:left;

	position: relative;	width: 230px;
	height: 171px;
	overflow: hidden;
}



#imageMenu2 ul {
padding: 0 0 0 0;
	list-style: none;
	margin: 0px;
	display: block;
	height: 171px;
	width: 1000px;
	
	}

#imageMenu2 ul li {
	float: left;
}

#imageMenu2 ul li a {
	text-indent: -1000px;
	background:#FFFFFF none repeat scroll 0%;
	border-right: 2px solid #fff;
	cursor:pointer;
	display:block;
	overflow:hidden;	width:70px;
	height: 171px;
}

#imageMenu2 ul li.landscapes a {
	background: url(../images/s2_2.jpg) repeat scroll 0%;
}

#imageMenu2 ul li.people a {
	background: url(../images/s2_1.jpg) repeat scroll 0%;
}

#imageMenu2 ul li.nature a {
	background: url(../images/s2_0.jpg) repeat scroll 0%;
	width: 310px;
}

#imageMenu2 ul li.urban a {
	background: url(../images/urban.jpg) repeat scroll 0%;
}

#imageMenu2 ul li.abstract a {
	background: url(../images/abstract.jpg) repeat scroll 0%;
	
}

.clear {
	clear: both;
}




/*************************************************************/


#imageMenu3 {
padding: 0 0 0 0;


float:left;
	position: relative;	width: 230px;
	height: 171px;
	overflow: hidden;
}



#imageMenu3 ul {
padding: 0 0 0 0;

	list-style: none;
	margin: 0px;
	display: block;
	height: 171px;
	width: 1000px;
	
	}

#imageMenu3 ul li {
	float: left;
	
}

#imageMenu3 ul li a {
	text-indent: -1000px;
	background:#FFFFFF none repeat scroll 0%;
	border-right: 2px solid #fff;
	cursor:pointer;
	display:block;
	overflow:hidden;	width:70px;
	height: 171px;
}

#imageMenu3 ul li.landscapes a {
	background: url(../images/s3_2.jpg) repeat scroll 0%;
}

#imageMenu3 ul li.people a {
	background: url(../images/s3_1.jpg) repeat scroll 0%;
}

#imageMenu3 ul li.nature a {
	background: url(../images/s3_0.jpg) repeat scroll 0%;
	width: 310px;
}



.clear {
	clear: both;
}


/*************************************************************/


#imageMenu4 {
	padding: 0 0 0 0;
	position: relative;
	width: 230px;
	height: 171px;
	overflow: hidden;
	float: left;
}



#imageMenu4 ul {
padding: 0 0 0 0 ;
	list-style: none;
	margin: 0px;
	display: block;
	height: 171px;
	width: 1000px;
	
	}

#imageMenu4 ul li {

	float: left;
}

#imageMenu4 ul li a {
	text-indent: -1000px;
	background:#FFFFFF none repeat scroll 0%;
	border-right: 2px solid #fff;
	cursor:pointer;
	display:block;
	overflow:hidden;	width:70px;
	height: 171px;
}

#imageMenu4 ul li.landscapes a {
	background: url(../images/s4_2.jpg) repeat scroll 0%;
}

#imageMenu4 ul li.people a {
	background: url(../images/s4_1.jpg) repeat scroll 0%;
}

#imageMenu4 ul li.nature a {
	background: url(../images/s4_0.jpg) repeat scroll 0%;
	width: 310px;
}


.clear {
	clear: both;
}