@charset "UTF-8";
/* CSS Document */

/* ---------------------------------------------------------------------------------------------------------------------------------
	1) HOME PAGE SPECIFIC CSS
/* --------------------------------------------------------------------------------------------------------------------------------- */

#top_content {width: 998px; height: 428px; margin-top: 10px; background-image:url(images/coming_soon2.jpg); background-position: 10px 0px; background-repeat: no-repeat; margin-bottom: 9px;}
#top_content_text {width: 308px; height: 250px; margin-top: 164px; margin-left: 30px; float: left;}
#top_content_text p {color: #000;}

#mid_content {width: 998px; height: 296px; background-image: url(images/home_mc_bg.jpg); background-position: 10px 0; background-repeat: no-repeat; }
#mid_content a {color: #3399cc; text-decoration: none;}
#mid_content a:hover {text-decoration: underline;}

#info_box1 {background-image: url(images/info_box1.jpg); width: 326px; height: 277px; margin-top: 7px; margin-left: 16px; float: left;} 
#info_box2 {background-image: url(images/info_box2.jpg); width: 316px; height: 277px; margin-top: 7px; margin-left: 4px; float: left;} 
#info_box3 {background-image: url(images/info_box3.jpg); width: 316px; height: 277px; margin-top: 7px; margin-left: 4px; float: left;} 

#info_box1 h2 {background-image:url(images/club.jpg); width:88px; height:38px; margin-bottom: 10px; float: left;}
#info_box2 h2 {background-image:url(images/whats_on.jpg); width:98px; height:40px; margin-bottom: 10px; float: left;}
#info_box3 h2 {background-image:url(images/bookings.jpg); width:93px; height:42px; margin-bottom: 10px; float: left;}

#info_box1 span, #info_box2 span, #info_box3 span {visibility:hidden;}
#info_box1 .moreinfo {background-image:url(images/info_red.jpg); width: 58px; height: 37px; float: right;}
#info_box2 .moreinfo {background-image:url(images/info_purple.jpg); width: 58px; height: 37px; float: right;}
#info_box3 .moreinfo {background-image:url(images/info_blue.jpg); width: 58px; height: 37px; float: right;}
#info_box1 p, #info_box2 p, #info_box3 p {clear: left; font-size: 1.1em; line-height: 18px;}

.boxgrid {
width: 320px;
height: 271px;
overflow: hidden;
position: relative;
margin-top: 3px;
margin-left: 3px;
}

.boxgrid2 {
width: 310px;
height: 271px;
overflow: hidden;
position: relative;
margin-top: 3px;
margin-left: 3px;
}


.boxgrid img, .boxgrid2 img{  
position: absolute;  
top: 0;  
left: 0;  
border: 0;  
}  

.boxcaption {
cursor: pointer;
width: 300px;
position: absolute;  
background: #000;
color: #fff; 
padding: 10px 10px 20px 10px;
opacity: .9;  
margin: 0;
/* For IE 5-7 */  
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);  
/* For IE 8 */  
-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";  
}

.boxcaption2 {
cursor: pointer;
width: 290px;
position: absolute;  
background: #000;
color: #fff; 
padding: 10px;
opacity: .9;  
margin: 0;
/* For IE 5-7 */  
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);  
/* For IE 8 */  
-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";  
}



 .captionfull .boxcaption {
 	top: 213px;
 	left: 0;
	margin: 0;
 }
 
  .captionfull .boxcaption2 {
 	top: 213px;
 	left: 0;
	margin: 0;
 }
 
 #timeline { width: 998px; height: 366px; margin-top: 8px; background-image:url(images/timeline_bg.jpg); position: relative; }
 #timeline span {visibility: hidden}
 
 #link1 {position: absolute; width:245px; height: 340px; left: 39px;top: 7px;}
 #link2 {position: absolute; width:197px; height: 340px; left: 284px;top: 7px;}
 #link3 {position: absolute; width:263px; height: 340px; left: 481px;top: 7px;}
 #link4 {position: absolute; width:233px; height: 340px; left: 744px;top: 7px;}