/* Global Resetting */
html{	
	width: 100%;
	height: 100%;
	background:#000;
}
body {
	width: 100%;
	height: 100%;
	font-size: 62.5%;
	/* reset font-sizes to 1em == 10px */
}
* {
	font-size: 1em;
	/* reset font-sizes to 1em == 10px */
	padding: 0;
	margin: 0;
	font-family:Verdana,Helvetica,sans-serif;
	list-style:none;
}
a img{
	border:0;
}
.clear{
	clear:both;
}

/* Layout CSS */
#Main {
	margin:20px auto;
	width:750px;
	
}
#Header {
	background:#000;
	clear:left;
}
	#Header h1 {
		color:#fff;
		font-size:1.5em;
		line-height:4.5em;
	}
	
#navigation{height:30px;width:640px; margin-left:120px;}	
		#Menu1 {
			padding:10px 0;
			margin-left:90px;
		}
			#Menu1 li {
				float:left;
				margin-left:2px;
			}
				#Menu1 li.current,
				#Menu1 li.section {
				}
				#Menu1 li a {
					float:left;
					color:#fff;
					font-weight:bold;
					font-size:11px;
					text-decoration:none;
					padding:5px;
					text-transform:uppercase;
					width:100%;
					text-align:center;
				}
					#Menu1 li a:hover {
						color:#d2ebff;
					}
					#Menu1 li.current a,
					#Menu1 li.section a {
						color:#d2ebff;
					}


ul#nav{width:665px; height:30px; float:right; position:relative; left:20px;}
ul#nav li{float:left; list-style:none;}

ul#nav li a{display:block; text-indent:-9999px; height:30px;}

ul#nav li a#club{background:url(../images/nav-sprite.gif) 0 0 no-repeat; width:60px;}
ul#nav li a#club:hover{background:url(../images/nav-sprite.gif) 0 -30px no-repeat;}

ul#nav li a#whats{background:url(../images/nav-sprite.gif) no-repeat; width:80px; background-position:-60px 0;}
ul#nav li a#whats:hover{ background-position:-60px -30px;}

ul#nav li a#guests{background:url(../images/nav-sprite.gif) no-repeat; width:110px; background-position:-140px 0;}
ul#nav li a#guests:hover{ background-position:-140px -30px;}

ul#nav li a#menus{background:url(../images/nav-sprite.gif) no-repeat; width:60px; background-position:-250px 0;}
ul#nav li a#menus:hover{ background-position:-250px -30px;}

ul#nav li a#events{background:url(../images/nav-sprite.gif) no-repeat; width:55px; background-position:-310px 0;}
ul#nav li a#events:hover{ background-position:-310px -30px;}

ul#nav li a#gallery{background:url(../images/nav-sprite.gif) no-repeat; width:65px; background-position:-365px 0;}
ul#nav li a#gallery:hover{ background-position:-365px -30px;}

ul#nav li a#employment{background:url(../images/nav-sprite.gif) no-repeat; width:100px; background-position:-430px 0;}
ul#nav li a#employment:hover{ background-position:-430px -30px;}

ul#nav li a#map{background:url(../images/nav-sprite.gif) no-repeat; width:40px; background-position:-530px 0;}
ul#nav li a#map:hover{ background-position:-530px -30px;}

ul#nav li a#contact{background:url(../images/nav-sprite.gif) no-repeat; width:70px; background-position:-570px 0;}
ul#nav li a#contact:hover{ background-position:-570px -30px;}


#ContentContainer {
	background:#6a6a6a;
	height:315px; width:740px;
	border:5px solid #dcdcdc;
	position:relative;
}

#Banner {
	text-align: center;
}

#Menu2 {
	margin-left: 20px;
	width: 17em;
	float:left;
	background:#f0f0f0;
	border:1px solid #ddd;
	padding:10px 10px 10px 10px;
}
	#Menu2 li {
		padding-left:15px;
		background:url(../images/menu2_arrow.gif) no-repeat left center;
	}
	#Menu2 a {
		color:#333;
		font-weight:bold;
		font-size:1.1em;
		line-height:1.6em;
		text-decoration:none;
	}
	#Menu2 a:hover {
		text-decoration:underline;
	}
	#Menu2 li.current a,
	#Menu2 li.section a {
		color:#0083C8;
	}

#Content {
	float: left;
	margin:0; padding:0;
	width:100%;
	height:315px;
	background:#ccc;
	position:relative;
}


#home{background:url(../images/content-bgs/content-bg-home.jpg) no-repeat; width:100%; height:315px; position:relative;}
#whats-on{background:url(../images/content-bgs/content-bg-whats.jpg) no-repeat; width:100%; height:315px; position:relative;}
#guestlists{background:url(../images/content-bgs/content-bg-guestlists.jpg) no-repeat; width:100%; height:315px; position:relative;}
#menus{background:url(../images/content-bgs/content-bg-menus.jpg) no-repeat; width:100%; height:315px; position:relative;}
#events{background:url(../images/content-bgs/content-bg-events.jpg) no-repeat; width:100%; height:315px; position:relative;}
#gallery{background:url(../images/content-bgs/content-bg-gallery.jpg) no-repeat; width:100%; height:315px; position:relative;}
#employment{background:url(../images/content-bgs/content-bg-employment.jpg) no-repeat; width:100%; height:315px; position:relative;}
#map{background:url(../images/content-bgs/content-bg-map.jpg) no-repeat; width:100%; height:315px; position:relative;}
#contact{background:url(../images/content-bgs/content-bg-contact.jpg) no-repeat; width:100%; height:315px; position:relative;}




#left{width:400px; float:left; margin-left:20px;}
#right{width:415px;  float:right; margin-right:20px; margin-top:20px; position:relative;}

#right .content {
width: 395px;
padding: 10px;
position: relative;
  height:240px; overflow:hidden; overflow-x:hidden;

}


#gallery-container{width:94%; margin:0 auto; position:relative; top:20px;}
#gallery-container .content{
	
width: 100%;
padding: 10px;
position: relative;
 height:250px; overflow:auto; overflow-x:hidden;
}

#right p, #gallery-container p{color:#FFF;}

#gallery-container  .overlay{
  position: absolute;
  top: 0; /* These positions makes sure that the overlay */
  bottom: 0;  /* will cover the entire parent */
  left: 0;
  width: 100%;
  background: #000;
  opacity: 0.65;
  -moz-opacity: 0.65; /* older Gecko-based browsers */
  filter:alpha(opacity=65); /* For IE6&7 */
}


.overlay{
  position: absolute;
  top: 0; /* These positions makes sure that the overlay */
  bottom: 0;  /* will cover the entire parent */
  left: 0;
  width: 100%;

  background: #000;
  border:1px solid #f9f9f9;
  opacity: 0.65;
  -moz-opacity: 0.65; /* older Gecko-based browsers */
  filter:alpha(opacity=65); /* For IE6&7 */
}

div.club-pic{height:100%; width:100%; padding:0; margin:0;}
div#small-pics{width:300px; height:159px; background:url(../images/small-pics.png) no-repeat; position:absolute; top:200px; left:-10px; z-index:10;}
div#the-club, div#whats-on{}

div.breadcrumbs {
	margin-bottom:10px;
	font-size:1em;
	color:#666;
}
div.breadcrumbs a {
	text-decoration:none;
}

#Footer {
	clear:both;
	border-top:0;
	width:200px;
	float:right;
}
	#Footer span {
		color:#FFF;
		font-size:1.1em;
		line-height:2em;
		float:right;
		margin-right:280px;
		font-weight:normal;
		width:150px;
	}
	#Footer a {
		color:#fff;
	}
		#Footer a:hover {
			text-decoration:none;
		}


/* The rest of this file is for the second tutorial */
#NewsList,
#StaffList {
	background:#f0f0f0;
	border:1px dotted #ccc;
	padding:10px;
}

#NewsList li,
#StaffList li {
	margin: 0;
	list-style-type: none;
}
	#NewsList li.newsDateTitle span {
		color:#666;
		line-height:2em;
	}
	#NewsList li.newsDateTitle a {
		font-size:1.3em;
		font-weight:bold;
		color:#0083C8;
		text-decoration:none;
		padding-left:20px;
		background:url(../images/treeicons/news-file.gif) no-repeat left center;
	}
		#NewsList li.newsDateTitle a:hover {
			border-bottom:1px dotted #0083C8;
		}
		
	#NewsList li.newsSummary {
		margin-bottom:20px;
	}
		#NewsList li.newsSummary span {
			font-size:1.1em;
			line-height:1.5em;
			color:#333;
		}
		#NewsList li.newsSummary a.readMoreLink {
			color:#0083C8;
			text-decoration:none;
		}
			#NewsList li.newsSummary a.readMoreLink:hover {
				border-bottom:1px dotted #0083C8;
			}

div.newsDetails {
	margin-bottom:10px;
}

div.newsDetails p {
	color:#666;
	margin:0;
	font-size:1em;
}

div.pageComments {
	background:#f0f0f0;
	border:1px dotted #ccc;
	padding:10px;
}

#StaffList .staffname { 
	clear: both;
	padding-left: 60px;
	height: 1.2em;
}

#StaffList .staffphoto {
	float: left;
	margin-left: 3px;
	margin-top: -1.2em;
}     
#StaffList .staffphoto img {
	border:1px solid #AAA;
}

#StaffList .staffdescription {
	margin-left: 60px;
	margin-bottom:30px;
}

#StaffPhoto {
	float: left;
	margin-right: 10px;
}

#StaffPhoto img {
	border:1px solid #AAA;
}

#PageComments {
	list-style:none;
	background:#e9e9e9;
	border:1px solid #ccc;
	border-bottom:0;
	padding:0;
	margin:0;
}
	#PageComments li {
		list-style:none;
		padding:5px;
		margin:0;
		font-size:1em;
		border-bottom:1px dotted #bbb;
	}
		#PageComments li p span {
			font-style:italic;
		}
		#PageComments a.deletelink {
			font-weight:bold;
		}

			
#PageNumbers {
	font-weight:bold;
	color:#333;
	font-size:1.1em;
	text-align:center;
	padding:5px;
	border:1px solid #ddd;
	background:#e9e9e9;
}
#PageNumbers * {
	padding:0 5px;
	line-height:1.5em;
}
#PageNumbers a {
	color:#0083C8;
	text-decoration:none;
}
	#PageNumbers a:hover {
		text-decoration:underline;
	}

		
.clear{clear:both;}

#right a{text-decoration:underline; font-weight:700;}

#imap {display:block; width:740px; height:315px; background:url(http://www.boutiqueclub.co.uk/assets/Uploads/club-map.jpg) no-repeat; position:relative; margin:0;}

#imap a#painting {display:block; width:300px; height:0; padding-top:210px; overflow:hidden; position:absolute; left:0; top:0; background:transparent url(masters/small.jpg) no-repeat 300px 210px; cursor:default;}
* html #imap a#painting {height:210px; he\ight:0;}

#imap a#painting:hover {background-position: 0 0; z-index:10;}

#imap dd {position:absolute; padding:0; margin:0;}

#imap #vip1 {left:230px; top:10px; z-index:20;}
#imap #three-lights{left:380px; top:85px; z-index:20;}
#imap #couch {left:290px; top:100px; z-index:20;}
#imap #vip2 {left:230px; top:210px; z-index:20;}
#imap #main {left:335px; top:240px; z-index:20;}
#imap #middle {left:330px; top:120px; z-index:20;}
#imap #corner-seats {left:630px; top:140px; z-index:20;}
#imap #dance {left:337px; top:10px; z-index:20;}
#imap #cham {left:647px; top:15px; z-index:20;}


#imap a#link_vip1 {display:block; width:68px; height:78px; text-decoration:none; z-index:20;}
#imap a#link_3lights {display:block; width:130px; height:25px; text-decoration:none; z-index:20;}
#imap a#link_couch {display:block; width:20px; height:95px; text-decoration:none; z-index:20;}
#imap a#link_vip2 {display:block; width:68px; height:92px; text-decoration:none; z-index:20;}
#imap a#link_main {display:block; width:250px; height:75px; text-decoration:none; z-index:20;}
#imap a#link_middle {display:block; width:230px; height:65px; text-decoration:none; z-index:20;}
#imap a#link_corner-seats{display:block; width:55px; height:155px; text-decoration:none; z-index:20;}
#imap a#link_dance{display:block; width:223px; height:45px; text-decoration:none; z-index:20;}
#imap a#link_cham {display:block; width:26px; height:103px; text-decoration:none; z-index:20;}



#imap a em {display:none;}

#imap a span, #imap a:visited span {display:none;}

#imap a#link_vip1:hover, a#link_3lights:hover, a#link_couch:hover, #imap a#link_vip2:hover, #imap a#link_main:hover, #imap a#link_middle:hover, #imap a#link_corner-seats:hover, #imap a#link_dance:hover, #imap a#link_cham:hover{border:1px solid #fc0;}

#imap a:hover span {position:absolute; display:block; color:#FFF; width:200px; height:470px; line-height:1.8em; font-size:0.9em; text-align:justify;}

#imap a#link_vip1:hover span {left:440px; top:-10px;}
#imap a#link_vip1:hover em {position:absolute; display:block; left:60px; top:30px; width:250px; height:1px; overflow:hidden; font-size:1px; background:#f00;}

#imap a#link_dance:hover span {left:330px; top:-10px;}
#imap a#link_dance:hover em {position:absolute; display:block; left:60px; top:30px; width:250px; height:1px; overflow:hidden; font-size:1px; background:#f00;}

#imap a#link_cham:hover span {left:70px; top:-10px;}
#imap a#link_cham:hover em {position:absolute; display:block; left:60px; top:30px; width:250px; height:1px; overflow:hidden; font-size:1px; background:#f00;}

#imap a#link_main:hover span {left:340px; top:-180px;}
#imap a#link_main:hover em {position:absolute; display:block; left:60px; top:30px; width:250px; height:1px; overflow:hidden; font-size:1px; background:#f00;}

#imap a#link_dj:hover span {left:150px; top:-10px;}
#imap a#link_dj:hover em {position:absolute; display:block; left:60px; top:35px; width:140px; height:1px; overflow:hidden; font-size:1px; background:#f00;}

#imap a#link_vip2:hover span {left:440px; top:-180px;}
#imap a#link_vip2:hover em {position:absolute; display:block; left:50px; top:45px; width:80px; height:1px; overflow:hidden; font-size:1px; background:#f00;}

#imap a:hover span img {float:left; margin-right:1em; margin-bottom:0.5em; border:1px solid #000;}

#imap a span:first-line {font-weight:bold; font-style:italic;}
#info h3 {margin:0 0 0 75px; font-size:1.2em; font-weight:normal; font-family:georgia, "times new roman", serif; letter-spacing:0.1em; padding-bottom:5px; border-bottom:1px solid #aaa; width:650px;}
#info .para {width:300px; margin:0 0 0 75px;}

a{outline:none; border:none;}

form#Form_Form{margin-top:0;}
#Content form div.Actions{margin-top:-40px; width:30px;}

/*** admin form**/

#ContentContainer #MemberLoginForm_LoginForm{background:#FFF; padding:10px; width:700px; margin:10px auto; border:2px solid #000;}
#ContentContainer #MemberLoginForm_LoginForm label{color:#000;}
#ContentContainer #MemberLoginForm_LoginForm .Actions{width:200px;}
/*pagination*/
.jPaginate{
    height:34px;
    position:relative;
    color:#a5a5a5;
    font-size:small;   
	width:100%;
}
.jPaginate a{
    line-height:15px;
    height:18px;
    cursor:pointer;
    padding:2px 5px;
    margin:2px;
    float:left;
}
.jPag-control-back{
	position:absolute;
	left:0px;
}
.jPag-control-front{
	position:absolute;
	top:0px;
}
.jPaginate span{
    cursor:pointer;
}
ul.jPag-pages{
    float:left;
    list-style-type:none;
    margin:0px 0px 0px 0px;
    padding:0px;
}
ul.jPag-pages li{
    display:inline;
    float:left;
    padding:0px;
    margin:0px;
}
ul.jPag-pages li a{
    float:left;
    padding:2px 5px;
}
span.jPag-current{
    cursor:default;
    font-weight:normal;
    line-height:15px;
    height:18px;
    padding:2px 5px;
    margin:2px;
    float:left;
}
ul.jPag-pages li span.jPag-previous,
ul.jPag-pages li span.jPag-next,
span.jPag-sprevious,
span.jPag-snext,
ul.jPag-pages li span.jPag-previous-img,
ul.jPag-pages li span.jPag-next-img,
span.jPag-sprevious-img,
span.jPag-snext-img{
    height:22px;
    margin:2px;
    float:left;
    line-height:18px;
}

ul.jPag-pages li span.jPag-previous,
ul.jPag-pages li span.jPag-previous-img{
    margin:2px 0px 2px 2px;
    font-size:12px;
    font-weight:bold;
        width:10px;

}
ul.jPag-pages li span.jPag-next,
ul.jPag-pages li span.jPag-next-img{
    margin:2px 2px 2px 0px;
    font-size:12px;
    font-weight:bold;
    width:10px;
}
span.jPag-sprevious,
span.jPag-sprevious-img{
    margin:2px 0px 2px 2px;
    font-size:18px;
    width:15px;
    text-align:right;
}
span.jPag-snext,
span.jPag-snext-img{
    margin:2px 2px 2px 0px;
    font-size:18px;
    width:15px;
     text-align:right;
}
ul.jPag-pages li span.jPag-previous-img{
    background:transparent url(../images/previous.png) no-repeat center right;
            }
ul.jPag-pages li span.jPag-next-img{
    background:transparent url(../images/next.png) no-repeat center left;
            }
span.jPag-sprevious-img{
    background:transparent url(../images/sprevious.png) no-repeat center right;
            }
span.jPag-snext-img{
    background:transparent url(../images/snext.png) no-repeat center left;
}
	#album-list{height:300px; overflow:auto;}
	
	.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}