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

@import "reset.css";
@import "progEnhancement.css";
@import "font.css";

/*****************************************************************************************************

WWW.DEX-LONDON.COM

******************************************************************************************************

HELLO THERE. 
THIS WEBSITE HAS BEEN LOVINGLY DESIGNED AND BUILT BY RICHARD KELLY. -> RICH.K82@GMAIL.COM
JUNE / JULY 2010. 

LOOKS BEST IN LATEST VERSION OF MOZILLA FIREFOX OR GOOGLE CHROME.
DITCH IE! SUPPORT SECURE, OPEN SOURCE AND STANDARDS COMPLIANT WEB BROWSERS -> http://www.mozilla-europe.org/en/ 

MODx POWERED -> http://www.modxcms.com

*****************************************************************************************************/

/* COLORS

BLUE: #00C6FE
PINK: #F01B73

*/

/* UTILITY */

.floatLeft			{ float: left; }

.floatRight			{ float: right;	}

.clear				{ clear: both; }


/* STRUCTURE */

#mainWrap			{ width: 100%; min-height: 100%; height: auto !important; margin: 0 auto; }

#push				{ width: 940px; height: 35px; margin: 0 auto; position: relative; }


/* TOP PANEL */

#topPanel			{ width: 100%; height: 100%; position: relative; z-index: 998; }

	#topPanelContainer	{ width: 940px; height: 22px; margin: 0 auto; position: relative; overflow: hidden; }

		#mailingListContainer	{ width: 410px; height: 100px; position: absolute; left: 53px; background: url(../img/mailingBg.png) no-repeat top left; }

			.mailingList		{ width: 340px; height: 35px; position: absolute; left: 65px; top: 29px; }		

			.mailingListTitle	{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 35px; color: #FFFFFF; margin: 0 10px 0 0; position: absolute; top: 1px; left: 0px; }

			.mailingListField	{ width: 172px; height: 20px; position: absolute; top: -2px; left: 123px; background: #FFFFFF; border: 0px; outline: 0 none; padding: 4px; font-family: Trebuchet MS, Helvetica, sans-serif; font-size: 14px; }

			.mailingListSubmit	{ width: 30px; height: 30px; position: absolute; top: -3px; left: 312px; background: url(../img/pinkButton.png); border: 0px; outline: 0 none; cursor: pointer; }

			.mailingListBlurb	{ width: 220px; position: absolute; top: 59px; left: 65px; font-size: 14px; line-height: 18px; }

		#socialLinks		{ width: 347px; height: 20px; position: absolute; bottom: 2px; right: 74px; font-size: 12px; line-height: 18px; }

			#social				{ font-weight: bold; }

			#social, #twitterLink a, #facebookLink a, #rssLink a
								{ color: #FFFFFF; float: right; margin: 1px 0 0 17px; }

			#twitterLink a:hover, #facebookLink a:hover, #rssLink a:hover
								{ color: #00C6FE; }

			#socialLinks, #social, #twitterLink, #facebookLink, #rssLink
								{ display: inline; }

			.socialIcons		{ margin: 1px 7px 0 0; }

	#panelBorder		{ width: 100%; height: 5px; background: url(../img/panelBlueBorder2.png) repeat; position: absolute; bottom: -3px; }


/* HEADER SECTION & PRIMARY NAVIGATION */

#header				{ width: 940px; height: 148px; margin: 0 auto; position: relative; overflow: visible; margin-bottom: 25px; }

	#mailingArrow	{ width: 30px; height: 30px; position: absolute; top: -14px; right: 21px; z-index: 999; }

	#logoNeon		{ width: 51px; height: 97px; position: absolute; left: 263px; top: 26px; z-index: 11; }

	.headLogo		{ width: 317px; height: 123px; position: absolute; top: 26px; left: -4px; z-index: 10; }

	.headLogo:hover	{ background-color: none; }

	#headNav		{ width: 550px; height: 75px; background: url(../img/primaryNav3.png) no-repeat; position: absolute; top: 37px; right: 0px; z-index: 10; }

		#primaryNav li	{ margin: 0; padding: 0; list-style: none; position: absolute; top: 0; }

		#primaryNav li, #primaryNav a	{ height: 76px; display: block; }

			.listings		{ left: 0px; width: 106px; }

			.photogallery	{ left: 117px; width: 87px; }

			.contact		{ left: 215px; width: 94px; }

			.corporate		{ left: 322px; width: 126px; }

			#mail			{ left: 459px; width: 91px; }

			.listings a:hover
							{ left: 0px; width: 106px; background: url(../img/primaryNav3.png) -0px -76px no-repeat; }

			.photogallery a:hover
							{ left: 117px; width: 87px; background: url(../img/primaryNav3.png) -117px -76px no-repeat; }

			.contact a:hover{ left: 215px; width: 94px; background: url(../img/primaryNav3.png) -215px -76px no-repeat; }

			.corporate a:hover, corporate #currentPage a
							{ left: 322px; width: 126px; background: url(../img/primaryNav3.png) -322px -76px no-repeat; }

			#mail a:hover	{ left: 459px; width: 91; background: url(../img/primaryNav3.png) -459px -76px no-repeat; }

			#parties-tickets li.listings a
							{ left: 0px; width: 106px; background: url(../img/primaryNav3.png) -0px -76px no-repeat; }

			#photo-gallery li.photogallery a
							{ left: 117px; width: 87px; background: url(../img/primaryNav3.png) -117px -76px no-repeat; }

			#contact-info li.contact a
							{ left: 215px; width: 94px; background: url(../img/primaryNav3.png) -215px -76px no-repeat; }

			#private-hire-party-rooms li.corporate a
							{ left: 322px; width: 91px; background: url(../img/primaryNav3.png) -322px -76px no-repeat; }

	#headStripes	{ width: 940px; height: 50px; background: url(../img/headStripes.png) no-repeat; position: absolute; top: 48px; left: 0px; z-index: 5; }

	#headGradient	{ width: 620px; height: 384px; background: url(../img/headGradient2.png) no-repeat; position: absolute; top: 0px; left: -180px; z-index: 4; }


/* MAIN CONTENT AREA */

#contentArea		{ width: 940px; margin: 0 auto; position: relative; z-index: 20; }

/* HOME PAGE */
	
	#headEventContainer	{ width: 940px; position: relative; margin-bottom: 30px; }

		#leftHeadEvent			{ width: 440px; float: left; position: relative; }

			.headDate			{ width: 48px; height: 55px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 20px; line-height: 20px; text-align: center; color: #FFFFFF; position: absolute; top: 5px; left: 25px; z-index: 20; }

			.headEventDate		{ width: 80px; height: 80px; background: url(../img/dateCircleBg2.png) no-repeat; position: absolute; top: -5px; left: 10px; z-index: 15; }

			.headEventImage		{ width: 424px; height: 217px; border: 1px solid #364066; padding: 7px; margin: 20px 0 10px 0; }

			.headEventImage:hover		{ background: rgba(125, 146, 234, 0.125); }

			.headEventTitle		{ width: 400px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 45px; line-height: 45px; color: #FFFFFF; margin: 0 0 0 20px; }

				.headEventTitle a		{ color: #FFFFFF; }

				.headEventTitle a:hover	{ color: #ACB9F2; }

		#rightHeadEvent			{ width: 440px; float: right; position: relative; }

	#comingSoon			{ width: 940px; /*height: 180px;*/ position: relative; padding: 20px 0 20px 0; }

		#comingSoonArrow	{ width: 144px; height: 125px; background: url(../img/comingSoon.png) no-repeat; float: left; position: relative; margin: 0 25px 0 0; z-index: 10; }		

		/*.comingSoonContainer	{ width: 205px; float: left; position: relative; margin: 8px 50px 0 0; z-index: 10; }*/

		.comingSoonContainer	{ width: 210px; float: left; position: relative; margin: 4px 35px 0 0; border: 1px solid #364066; padding: 5px; z-index: 10; }

		.comingSoonContainer:hover, .latestPhotos:hover		{ background: rgba(125, 146, 234, 0.125); }

			.comingSoonDate		{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 21px; line-height: 22px; color: #FFFFFF; }

			.comingSoonName		{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 30px; line-height: 32px; color: #FFFFFF; margin: 3px 0 0 0; }

			.comingSoonLink		{ width: 78px; font-size: 16px; line-height: 20px; color: #7D92EA; float: left; margin: 6px 0 0 0; }

				.comingSoonLink:hover	{ color: #ACB9F2; }

			.comingSoonButton	{ width: 30px; height: 30px; float: left; margin: 13px 0 0 0; }

			.comingSoonLink, .comingSoonButton		{ display: inline; }

		#comingSoonStripes	{ width: 820px; height: 80px; background: url(../img/comingSoonStripes.png) no-repeat; position: absolute; top: 40px; left: 60px; z-index: 4; }

		.latestPhotos		{ width: 210px; float: right; position: relative; margin: 4px 0 0 0; border: 1px solid #364066; padding: 5px; z-index: 10; }

			.latestPhotosHead		{ width: 90px; height: 56px; position: absolute; z-index: 20; top: -15px; left: -42px; }

			.latestPhotosIMG		{ width: 210px; height: 140px; position: relative; }

			.latestPhotosTitle		{ width: 210px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 20px; line-height: 21px; color: #FFFFFF; }

			.latestPhotosTitle a:hover
									{ color: #ACB9F2; }

/* PARTIES & TICKETS LISTINGS PAGE */

	#monthSelector		{ width: 700px; height: 35px; postion: relative; margin: 0 auto; display: NONE; }

		#thisMonth		{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 40px; line-height: 40px; color: #FFFFFF; display: NONE; }

		#nextMonth		{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 20px; line-height: 20px; color: #FFFFFF; position: absolute; right: 0px; top: 0px; display: NONE; }

		#lastMonth		{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 20px; line-height: 20px; color: #FFFFFF; position: absolute; left: 0px; top: 0px; display: NONE; }

	#listingsContainer	{ width: 940px; position: relative; margin: 55px 0 0 0; }

		.listing			{ width: 940px; position: relative; margin: 0 0 50px 0; padding: 0 0 50px 0; z-index: 30; }

			.listingIMG			{ width: 340px; position: relative; float: left; margin: 0 30px 0 0; z-index: 30; }

				.listingDate			{ width: 48px; height: 55px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 20px; line-height: 20px; text-align: center; color: #FFFFFF; position: absolute; top: 20px; left: 15px; z-index: 20; }

				.listingDateBg			{ width: 80px; height: 80px; background: url(../img/dateCircleBg2.png) no-repeat; position: absolute; top: 10px; left: 0px; }

				.listingImage			{ width: 291px; height: 149px; border: 1px solid #364066; padding: 5px; float: right; }

				.listingImage:hover		{ background: rgba(125, 146, 234, 0.125); }

				.listingSocial			{ position: absolute; left: 62px; top: 178px; }

					.listingTweet			{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 18px; line-height: 18px; color: #FFFFFF; margin: 0 28px 0 0; }

					.listingFace			{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 18px; line-height: 18px; color: #FFFFFF; }

						.listingTweet, .listingFace
											{ display: inline; }

						.listingSocialIcons	{ margin: 0 9px 0 0; }

			.listingDetails		{ width: 460px; position: relative; float: left; margin: 0 20px 0 0; z-index: 30; }

				.listingTitle		{ width: 460px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 40px; line-height: 40px; color: #FFFFFF; margin: 0 0 15px 0; }

				.listingTime		{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 25px; line-height: 25px; color: #FFFFFF; margin: 0 45px 0 0; }

				.listingPrice		{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 25px; line-height: 25px; color: #FFFFFF; }

					.listingTime, .listingPrice		{ display: inline; }

				.listingBody		{ font-family: Trebuchet MS, Helvetica, sans-serif; color: #FFFFFF; font-size: 14px; line-height: 20px; letter-spacing: 0px; margin: 15px 0 0 0; }

			.listingTickets		{ width: 87px; height: 70px; position: relative; float: right; z-index: 30; margin: 4px 0 0 0; }

			.listingStripes		{ width: 590px; height: 50px; background: url(../img/listingStripes.png) no-repeat; position: absolute; left: 300px; top: 13px; z-index: 20; }

			.listingDivider		{ width: 700px; height: 2px; background: url(../img/listingDivider.png) repeat; margin: 0 auto; position: absolute; left: 120px; bottom: 0px; }


/* PHOTO GALLERY */

	#photoArea			{ width: 940px; position: relative; margin: 60px 0 70px 0; }

		.archiveRow			{ width: 960px; position: relative; }

		.directoryContainer		{ width: 300px; height: 284px; position: relative; float: left; margin: 0 20px 20px 0; }
		
			.directory				{ width: 284px; padding: 7px; position: relative; border: 1px solid #364066; background: rgba(125, 146, 234, 0.15); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 0 0 4px #101010; -webkit-box-shadow: 0 0 4px #101010; box-shadow: 0 0 4px #101010; } 		
		
			.directory:hover		{ background: rgba(125, 146, 234, 0.125); }
		
				.directoryIMG			{ width: 284px; height: 190px; margin: 0 0 10px 0; }
		
				.directoryTitle a		{ width: 284px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 25px; line-height: 26px; color: #FFFFFF; }
		
				.directoryTitle a:hover	{ color: #ACB9F2; }
		
				.directoryDesc			{ width: 284px; font-family: Trebuchet MS, Helvetica, sans-serif; color: #CCCCCC; font-size: 12px; line-height: 18px; letter-spacing: 0px; margin: 6px 0 0 0; }
		
				.directoryArrow			{ color: #00C6FE; }


/* CONTACT INFO PAGE */

	#contactArea			{ width: 940px; position: relative; margin: 60px 0 0 0; }

		#contactAreaTitle		{ width: 194px; height: 93px; margin: 0 0 20px 0; float: left; }

		#contactAreaFatLine		{ width: 440px; height: 10px; margin: 0 0 32px 38px; float: left;  }

		#contactAreaBody		{ width: 440px; float: left; }

		#contactFormContainer	{ width: 420px; height: 429px; position: relative; border: 1px solid #364066; float: right; margin: 0 40px 0 0; }
	
			.contactForm			{ width: 380px; height: 38px; margin: 0 0 20px 0; position: relative; left: 20px; top: 20px; }
	
			.contactRequired		{ font-family: Trebuchet MS, Helvetica, sans-serif; color: #FFFFFF; font-size: 10px; letter-spacing: 0px; position: absolute; top: 21px; }
	
			.contactLabel			{ width: 60px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 24px; line-height: 24px; color: #FFFFFF; }
	
			.contactMessage			{ width: 381px; height: 158px; position: relative; left: 20px; top: 20px; }
	
			.contactField			{ width: 286px; height: 24px; background: #FFFFFF; border: none; padding: 6px; font-family: Trebuchet MS, Helvetica, sans-serif; color: #000000; font-size: 16px; line-height: 20px; outline: 0 none; letter-spacing: 0px; position: absolute; right: 0px; }
	
			.contactMessageField	{ width: 286px; height: 146px; background: #FFFFFF; border: 1px solid #26334d; padding: 6px; font-family: Trebuchet MS, Helvetica, sans-serif; color: #000000; font-size: 16px; line-height: 22px; outline: 0 none; letter-spacing: 0px; position: absolute; right: 0px; }
	
			.contactSubmit			{ width: 60px; height: 80px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 24px; color: #FFFFFF; background: #00c6fe; border: 1px solid #26334d; overflow: hidden; cursor: pointer; position: absolute; left: 20px; bottom: 17px; }
	
			.contactSubmitHover		{ width: 60px; height: 80px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 24px; color: #00c6fe; background: #FFFFFF; border: 1px solid #26334d; overflow: hidden; cursor: pointer; position: absolute; left: 20px; bottom: 17px; }

			.contactMessageSent		{ width: 360px; font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 35px; color: #FFFFFF; text-align: center; margin: 20px 0 0 20px; }

			.contactThankYou		{ width: 380px; margin: 20px 0 0 20px; }

	#venueLocation			{ width: 940px; position: relative; margin: 75px 0 75px 0; }

		#venueLocationTitle		{ width: 147px; height: 93px; margin: 0 0 24px 33px; float: right; }

		#venueLocationAddress	{ width: 203px; float: right; text-align: right; font-size: 20px; line-height: 20px; margin: 8px 0 0 0; }

		#venueLocationFatLine	{ width: 380px; height: 10px; margin: 0 40px 38px 0; float: right; }

		#venueLocationMap		{ width: 518px; height: 360px; border: 1px solid #364066; float: left; }

		#venueLocationBody		{ width: 380px; float: right; }

			.venueBodyItem			{ width: 380px; margin: 0 0 20px 0; }

				.venueBodyIcon			{ width: 29px; float: left; }

				.venueBody				{ width: 330px; float: right; }


	/* PRIVATE HIRE AND PARTY ROOMS */

	#hireContainer			{ width: 940px; position: relative; margin: 60px 0 70px 0; }

		#hireIntro, #hireOutro
							{ width: 640px; margin: 0 0 55px 0; position: relative; }

		#rooms, #terrace, #private
							{ width: 940px; position: relative; margin: 0 0 75px 0; }

			.roomsTitle				{ width: 165px; height: 92px; margin: 0 0 30px 40px; float: left; }

			.roomsImage				{ width: 446px; height: 306px; padding: 7px; border: 1px solid #364066; float: right; }

			.roomsImage:hover		{ background: rgba(125, 146, 234, 0.125); }

			#roomsBody				{ width: 460px; position: relative; float: left; }

			.terraceTitle			{ width: 104px; height: 85px; margin: 0 40px 30px 0; position: relative; float: right; }

			.terraceImage			{ width: 526px; height: 206px; padding: 7px; border: 1px solid #364066; float: left; }

			.terraceImage:hover		{ background: rgba(125, 146, 234, 0.125); }

			#terraceBody			{ width: 360px; position: relative; float: right; }

			.privateTitle			{ width: 95px; height: 83px; margin: 0 0 30px 40px; float: left; }

			.privateImage			{ width: 446px; height: 306px; padding: 7px; border: 1px solid #364066; float: right; }

			.privateImage:hover		{ background: rgba(125, 146, 234, 0.125); }

			#privateBody			{ width: 460px; position: relative; float: left; }


/* Four Oh Four Page */

	#fourohfourContainer		{ width: 940px; height: 350px; position: relative; margin: 100px 0 0 0; }

		#fourohfourImage				{ width: 365px; height: 284px; position: relative; float: left; margin: 0 45px 0 0; }

		#fourohfourMessage				{ width: 500px; height: 111px; background: url(../img/socialBg.png) no-repeat top left; position: relative; float: left; margin: 67px 0 0 0; }

			#fourohfourTitle				{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 40px; color: #FFFFFF; position: absolute; top: 20px; left: 15px; }

			.fourohfourBody					{ font-size: 18px; line-height: 24px; position: absolute; top: 60px; left: 15px; }

		#fourohfourGradient			{ width: 479px; height: 464px; background: url(../img/404Gradient.png) no-repeat; position: absolute; top: -100px; left: -91px; z-index: 4; }


/* FOOTER SECTION */

#footer				{ width: 100%; height: 300px; /*margin-top: 50px;*/ position: relative; border-top: 1px solid #000000; border-bottom: 1px solid #000000; }

	#footerContainer		{ width: 940px; height: 300px; margin: 0 auto; position: relative; }

		#footerLine			{ width: 620px; height: 6px; position: absolute; top: 10px; left: 160px; background: #C9C9C9; }
	
		#twitter		{ width: 240px; height: 120px; position: absolute; top: 43px; left: 0px; background: url(../img/socialBg.png) no-repeat top left; }
	
			.twitterTitle	{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 35px; color: #FFFFFF; position: absolute; top: 17px; left: 21px; }
	
			.tweet			{ width: 230px; font-size: 14px; line-height: 18px; font-style: italic; position: absolute; top: 49px; left: 21px; }
	
		#facebook		{ width: 240px; height: 120px; position: absolute; top: 43px; left: 280px; background: url(../img/socialBg.png) no-repeat top left; }
	
			.facebookTitle	{ font-family: 'LeagueGothicRegular', Trebuchet MS, Helvetica, sans-serif; font-size: 35px; color: #FFFFFF; position: absolute; top: 17px; left: 21px; }
	
			.facebookBody	{ width: 230px; font-size: 14px; line-height: 18px; position: absolute; top: 49px; left: 21px; }
	
		#credits		{ width: 300px; height: 70px; position: absolute; top: 60px; right: 0px; }
	
			.footerLogo		{ width: 109px; height: 33px; position: absolute; top: 0px; right: -3px; }
	
			.creditsBody	{ width: 300px; font-size: 12px; line-height: 18px; text-align: right; position: absolute; top: 37px; right: 0px; }