*{margin:0;padding:0}iframe,a img,fieldset,form,table{border:0}h6,h5,h4,h3,h2,h1,caption,th,td{font-size:100%;font-weight:normal}dd,dt,li,dl,ol,ul{list-style:none}legend{color:#000}button,select,textarea,input{font:100% sans-serif}table{border-collapse:collapse}caption,th,td{text-align:left}

.clearfix:after {
   content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#films, #onlinestore, #records, #streetangels, #synchronisation {
	text-indent:-9999px;
	display:block;
	float:left;
	display:inline;
	border-top:4px solid #fff;
	border-bottom:4px solid #fff;
}

#films {
	width:154px; height:192px;
	background:url(films.gif) no-repeat 0 0;
}
#onlinestore {
	width:226px; height:192px;
	background:url(onlinestore.gif) no-repeat 0 0;
}
#records {
	width:163px; height:192px;
	background:url(records.gif) no-repeat 0 0;
}
#streetangels {
	width:231px; height:192px;
	background:url(streetangels.gif) no-repeat 0 0;
}
#synchronisation {
	background:url(synchronisation.gif) no-repeat 0 0;
	width:163px; height:192px;
}

body { background:url(hash.gif);}

html,body{
	height:100%;
	margin:0;
	padding:0;
}
body{
	background:url(hash.gif);
	text-align:center;
	min-width:626px;
	min-height:400px;
}
#vertical{
	position:absolute;
	top:50%;
	margin-top:-100px;/* half main elements height*/
	left:0;
	width:100%;
}
#hoz {
	width:937px;
	margin-left:auto;
	margin-right:auto;
	height:200px;
	background:#666;
	/*overflow:auto;/* allow content to scroll inside element */
	text-align:left;
}
h1 {color:#fff;margin:0;padding:0}

#synchronisation:hover, #films:hover, #records:hover, #onlinestore:hover, #streetangels:hover {
	background-position:0 -192px;
	border-color:red;
}