.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

</style><!-- main stylesheet ends, CC with new stylesheet below... -->

<!--[if IE]>
<style type="text/css">
  .clearfix {
    zoom: 1;     /* triggers hasLayout */
    }  /* Only IE can see inside the conditional comment
    and read this CSS rule. Don't ever use a normal HTML
    comment inside the CC or it will close prematurely. */
</style>
<![endif]-->


	*{
	margin:0;
	padding:0;
	}
    body {
        text-align: justify;
        font-size: 13px;
        font-family: Arial, Helvetica, sans-serif;
		margin:0; padding:0;
    }
 
	   
	h2{ font-size:14px; text-transform:uppercase;  margin:0 0 5px 0; padding:0 10px; color:#fff; background:#9f009f;
	line-height:30px; color:#fff;}
	.alignLeft { float:left; margin:0 20px 15px 0 !important; }
	
	.head {
	display:block; height:36px; margin:10px 0 0 0; clear:both;
	background:url(http://www.clubhive.co.uk/thehive/centModule_hdr.png) 0% 0% no-repeat !important;
	color:#EDEDED;font-size:14px;font-weight:bold;padding:0 50px;text-transform:uppercase; line-height:36px;
	}
	

	 
	.stepcarousel{
	position: relative; /*leave this value alone*/
	display:block;
	margin:0; padding:10px 0 10px 0;
	background:#000;
	overflow: scroll; /*leave this value alone*/
	width: 490px;
	height: 850px; /*Height should enough to fit largest content's height*/
	}
	
	.stepcarousel .belt{
	position: relative; /*leave this value alone*/
	padding:30px 0 0 0;
	float:left;
	margin:0;
	}
	
	.stepcarousel .panel{
	display:block; /*leave this value alone*/
		 /*clip content that go outside dimensions of holding panel DIV*/
	margin:0; /*margin around each panel*/
	width: 475px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
	height: 760px;
	padding:5px !important;
	position:relative;
	float:left;
	}
	
	#mygallery-paginate {
		position:absolute;
		width:300px;
		top:0px;
		left:40px;
		z-index:100;
		margin:0 40px !important;
		text-align:center !impotant;
	}
	
	#mygallery-paginate span{
		display:block;
		position:relative;
		padding:10px !important;
		margin:0 auto;
		text-align:center !important;
	}

	
	.socialPrev, .socialNext{
		display:inline-block;
		height:32px;
		width:32px;
	}
	
	.socialPrev{
		 float:left;
		background:url(banner/socialPrev.png) no-repeat 0% 0%;
	}
	.socialNext{
		float:right;
		background:url(banner/socialNext.png) no-repeat 0% 0%;
	}
	

	.imageFlow{
		display:block;
		margin:0 0 5px 0;
		padding:5px;
		background:#333;
	}
	
	
	
	.sliderwrapper{
		position: relative; /*leave as is*/
		overflow: hidden; /*leave as is*/
		/*border: 10px solid navy; */
		width: 490px; /*width of featured content slider*/
		height: 670px;
	}
	
	
	
	.sliderwrapper .contentdiv{
		visibility: hidden; /*leave as is*/
		position: absolute; /*leave as is*/
		left: 0;  /*leave as is*/
		top: 0;  /*leave as is*/
		padding: 5px !important;
		background: #333;
		width: 480px; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
		height: 100%;
		filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}
	
	.pagination{
		display:block;
		text-align: center;
		/*background-color: navy;
		*/padding:5px 15px;
		margin:5px 0;
		position:relative;
		background:#333;
	}
	
	.pagination a{
		padding: 0; margin:3px 10px 0 0;
		height:32px; width:35px;
		text-decoration: none;
		text-align:center;
		line-height:32px;
		display:inline-block;
		outline:none;
	}
	
	.pagination a:hover, .pagination a.selected{
		background-position:50% -32px !important;
	}
	a.prev, a.next{
		display:inline-block;
		height:32px; width:32px;
		line-height:32px;
		margin-top:0;
	}
	a.prev:hover, a.next:hover{
		background-position: 50% 50% !important;
	}
	
	a.prev {
		float:left;
		background:url(banner/socialPrev.png) no-repeat 50% 50%;
	}
	a.next {
		float:right;
		background:url(banner/socialNext.png) no-repeat 50% 50%;
	}
	a.icon1{ background:url(banner/facebook.png) no-repeat 50% 0%;}
	a.icon2{ background:url(banner/twitter.png) no-repeat 50% 0%;}
	a.icon3{ background:url(banner/hive.png) no-repeat 50% 0%;}