* {
	padding: 0;
	margin: 0;
}
 

#container {
	width: 300px;
	height: 45px;
	 
}

.hoverDot {
	float: left;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	height: 32px; width: 32px;
	background-color: #eee;
	margin: 0 8px 16px 0;
}


 




/* @group BreakApart Rounded 1 */
#break1 {
	background-image: url('circle.png'), url('circle.png'), url('circle.png'), url('circle.png'), url('top_home.png');
	background-repeat: no-repeat;
	background-position: -8px -8px, 8px 8px, -8px 8px, 8px -8px, 0px 0px; /*right down*/
	
	/*Transition*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
		
}
#break1:hover {
	background-position: -32px -32px, 32px 32px, -32px 32px, 32px -32px,  0px 0px;	
}
/* @end */

/* @group BreakApart Rounded 2 */
#break2 {
	background-image: url('circle.png'), url('circle.png'), url('circle.png'), url('circle.png'), url('top_1.png');
	background-repeat: no-repeat;
	background-position: -8px -8px, 8px 8px, -8px 8px, 8px -8px, 0px 0px; /*right down*/
	
	/*Transition*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
		
}
#break2:hover {
	background-position: -32px -32px, 32px 32px, -32px 32px, 32px -32px,  0px 0px;	
}
/* @end */

/* @group BreakApart Rounded 3 */
#break3 {
	background-image: url('circle.png'), url('circle.png'), url('circle.png'), url('circle.png'), url('top_2.png');
	background-repeat: no-repeat;
	background-position: -8px -8px, 8px 8px, -8px 8px, 8px -8px, 0px 0px; /*right down*/
	
	/*Transition*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
		
}
#break3:hover {
	background-position: -32px -32px, 32px 32px, -32px 32px, 32px -32px,  0px 0px;	
}
/* @end */

/* @group BreakApart Rounded 4 */
#break4 {
	background-image: url('circle.png'), url('circle.png'), url('circle.png'), url('circle.png'), url('top_3.png');
	background-repeat: no-repeat;
	background-position: -8px -8px, 8px 8px, -8px 8px, 8px -8px, 0px 0px; /*right down*/
	
	/*Transition*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
		
}
#break4:hover {
	background-position: -32px -32px, 32px 32px, -32px 32px, 32px -32px,  0px 0px;	
}
/* @end */

/* @group BreakApart Rounded 5 */
#break5 {
	background-image: url('circle.png'), url('circle.png'), url('circle.png'), url('circle.png'), url('top_4.png');
	background-repeat: no-repeat;
	background-position: -8px -8px, 8px 8px, -8px 8px, 8px -8px, 0px 0px; /*right down*/
	
	/*Transition*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
		
}
#break5:hover {
	background-position: -32px -32px, 32px 32px, -32px 32px, 32px -32px,  0px 0px;	
}
/* @end */

/* @group BreakApart Rounded 6 */
#break6 {
	background-image: url('circle.png'), url('circle.png'), url('circle.png'), url('circle.png'), url('top_5.png');
	background-repeat: no-repeat;
	background-position: -8px -8px, 8px 8px, -8px 8px, 8px -8px, 0px 0px; /*right down*/
	
	/*Transition*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
		
}
#break6:hover {
	background-position: -32px -32px, 32px 32px, -32px 32px, 32px -32px,  0px 0px;	
}
/* @end */

/* @group BreakApart Rounded 7 */
#break7 {
	background-image: url('circle.png'), url('circle.png'), url('circle.png'), url('circle.png'), url('top_6.png');
	background-repeat: no-repeat;
	background-position: -8px -8px, 8px 8px, -8px 8px, 8px -8px, 0px 0px; /*right down*/
	
	/*Transition*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
		
}
#break7:hover {
	background-position: -32px -32px, 32px 32px, -32px 32px, 32px -32px,  0px 0px;	
}
/* @end */