@charset "utf-8";
/***** RESET *****/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
a img { border:0; }
ol, ul {
	list-style: none none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/***** LAYOUT *****/

body {background:url(../images/bg-syn-floral.gif); background-color:black; }
.backlight { height:100%; width: 100%; margin: 0 auto; background:url(../images/backlight.png) center top no-repeat; }
.main-container {width: 960px; height:100%; margin: 0 auto;}

.header-container {width:960px; height: 150px; background:url(../images/bg-syn-header.gif) repeat-x; margin:0 auto; position: relative;}
.logo { margin: 32px 0 0 50px; float:left; }

.top-nav {
	width: 250px;
	height: 30px;
	background: url(../images/top-nav-bg.jpg) top center no-repeat;
	overflow: hidden;
	float: right;
	position:absolute;
	top:0;
	right: 36px;
	text-align:center;
}

.nav { width:620px; height: 45px; float: right; margin:95px 15px 0 0; overflow: hidden; text-align:left; }
.nav ul.nav-level1 { padding-left: 15px; height:20px; border-bottom: 1px #666 dotted; }
.nav ul.nav-level1 li {display: inline; padding: 0 30px 0; border-right: 1px #666 dotted; }
.nav ul.nav-level2 { padding-left: 15px; height:15px; text-align:left; padding:5px 15px; text-transform:uppercase; }
.nav ul.nav-level2 li {height:10px; display: inline; padding: 0 10px 0;  }
.nav li#first {padding-left:0px;}
.nav li#last {border:none; padding-right:0px; }

.nav ul li a#on {color: #ed252f;}

.content {width: 100%; background-color:#0f0f0f; padding-top:15px; margin-top:1px; clear:both;}
.section {width: 945px; height:100%; margin: 0px 15px 15px 0; background-color:black; clear:both; }
.sub-section {clear:right;}
.section-tab, .sub-section-tab {width: 50px; height:190px; float:left;}

#whats-on .section-tab {background:url(../images/section-tab-whats-on.gif) no-repeat top left;}
#specials .section-tab {background:url(../images/section-tab-specials.gif) no-repeat top left;}
#news .section-tab {background:url(../images/section-tab-news.gif) no-repeat top left;}

#tuesdays .section-tab {background:url(../images/section-tab-tuesdays.gif) no-repeat top left;}
#wednesdays .section-tab {background:url(../images/section-tab-wednesdays.gif) no-repeat top left;}
#thursdays .section-tab {background:url(../images/section-tab-thursdays.gif) no-repeat top left;}
#weds-thurs .section-tab {background:url(../images/section-tab-weds-thurs.gif) no-repeat top left;}
#fridays .section-tab {background:url(../images/section-tab-fridays.gif) no-repeat top left;}
#saturdays .section-tab {background:url(../images/section-tab-saturdays.gif) no-repeat top left;}

#about .section-tab {background:url(../images/section-tab-about.gif) no-repeat top left;}
#cocktails .section-tab {background:url(../images/section-tab-cocktails.gif) no-repeat top left;}
#venue .section-tab {background:url(../images/section-tab-venue.gif) no-repeat top left;}

#contact-details .section-tab {background:url(../images/section-tab-contact-details.gif) no-repeat top left;}
#enquiry-form .section-tab {background:url(../images/section-tab-enquiry-form.gif) no-repeat top left;}
#enquiry-form .section-copy {width: 845px; overflow: hidden; float:left; margin: 20px 25px;}
#enquiry-form .col-1, #enquiry-form .col-2 {width: 400px; float:left; padding:10px; }
#enquiry-form .col-2 { border-left: 1px dashed #333; padding-left: 35px;width: 375px; }

input, textarea, select {background-color:#CCC; }
input:focus, textarea:focus, select:focus {background-color:#FFF; }
input#button {background-color: #333; color:#FFF; padding: 3px; border: none;}
input#button:hover {background-color:#ed252f; }

#wide-form label { display: inline-block; width: 85px; margin-bottom: 1em; padding-left: 15px; }
#wide-form input {width: 230px; clear: right; font-size: 1em;}
#wide-form textarea { width: 260px; height: 130px;margin-bottom: 1em; }
#wide-form input#button {width: 90px; margin-left:103px;}

#narrow-form label { display: inline-block; width: 85px; float: left; }
#narrow-form input, #narrow-form select {clear: right; font-size: 1em; margin-bottom: 1em; width: 130px; }
#narrow-form textarea { width: 100%; height: 130px;margin-bottom: 1em; }
#narrow-form input#button {width: 90px; float:right;}

#wide-form label.error {
	color: red;
	width: 300px !important;
	margin-left: 85px;
	margin-top: -8px;
	margin-bottom: 10px;
	clear: right;
}
#narrow-form label.error {
	color: red;
	width: 150px !important;
	margin-left: 85px;
	margin-top:-8px ;
	margin-bottom:10px;
	clear: right;
}

#trading-hours .section-tab  {background:url(../images/section-tab-trading-hours.gif) no-repeat top left !important;}
#trading-hours .section-copy {width: 225px; overflow: hidden; float:left; margin: 20px 25px;}
#terms .section-tab {background:url(../images/section-tab-terms.gif) no-repeat top left;}

#venue-photos .section-tab {background:url(../images/section-tab-venue-photos.gif) no-repeat top left;}
#event-photos .section-tab {background:url(../images/section-tab-event-photos.gif) no-repeat top left;}

#venue-photos .section-banner, #event-photos .section-banner { margin: 15px 0 0 15px; width: 880px; }
.section-banner#thumbs ul { clear: both; }
.section-banner#thumbs ul li{ 
width:95px; height:95px; overflow:hidden; display:inline; float:left; margin:0 15px 15px 0;
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
}
.section-banner#thumbs ul li:hover { 
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}

#function-overview .section-tab {background:url(../images/section-tab-function-overview.gif) no-repeat top left;}
#function-enquiry .section-tab {background:url(../images/section-tab-function-enquiry.gif) no-repeat top left;}
#thank-you .section-tab {background:url(../images/section-tab-thank-you.gif) no-repeat top left;}
#sorry .section-tab {background:url(../images/section-tab-sorry.gif) no-repeat top left;}
#guestlists .section-tab {background:url(../images/section-tab-guestlists.gif) no-repeat top left;}

#links .section-tab {background:url(../images/section-tab-links.gif) no-repeat top left;}
#terms .section-tab {background:url(../images/section-tab-terms.gif) no-repeat top left;}
#policy .section-tab {background:url(../images/section-tab-policy.gif) no-repeat top left;}


.section-banner {width:620px; float:left; }
.section-banner .image_reel {height:357px; width:895px; overflow:hidden; }

.section-copy {width: 225px; overflow: hidden; float:left; margin: 20px 25px;}

.section-divider {height: 15px; width:100%; background:url(../images/bg-syn-footer.jpg) repeat-y top right; }

/*.button { border: 1px solid #333; margin:5px 2px 0 0;}
.button:hover {}
.button#last {margin-right:0;}*/

/* FOOTER */
.footer {width:960px; height: 100px; background: url(../images/bg-syn-footer.jpg) repeat-y top right; margin-top:-15px; position: relative; }
.footer-left {width:41px; height:100%; background-color:black; float:left; }
.footer-copy { width: 555px; text-align:left; float:left; position:absolute; bottom:10px; left:50px; margin:0;}
.footer-icon { position:absolute; bottom:10px; right:0; float:right; margin:15px;}

.clear{clear:both;visibility:hidden;}

.facebook { position: fixed; top:150px; right:0; width:36px; height: 199px; z-index: 1000;
	filter:alpha(opacity=85);
	-moz-opacity:0.85;
	-khtml-opacity: 0.85;
	opacity: 0.85;
}
.facebook:hover {
		filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}

/* TYPOGRAPHY */

/* RED: #ed252f
*/
@font-face {
	font-family: 'DroidSansRegular';
	src: url('fonts/DroidSans-webfont.eot');
	src: local('☺'), url('fonts/DroidSans-webfont.woff') format('woff'), url('fonts/DroidSans-webfont.ttf') format('truetype'), url('fonts/DroidSans-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'DroidSansBold';
	src: url('fonts/DroidSans-Bold-webfont.eot');
	src: local('☺'), url('fonts/DroidSans-Bold-webfont.woff') format('woff'), url('fonts/DroidSans-Bold-webfont.ttf') format('truetype'), url('fonts/DroidSans-Bold-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {font-family:'DroidSansRegular', Geneva, Arial, sans-serif; font-size:11px; line-height:1.5em; color:#eee;}
h3 {font-size:1.4em; margin-bottom: 1px; font-weight:normal; color:#eee; text-transform:uppercase; }
h5 {font-size:1em; font-style:italic; font-weight:normal; margin-bottom:1em; color:white; }
h6 {font-size:1em; color:white; border-top: 1px dotted #999; border-bottom: 1px dotted #999; display:block; padding:3px; margin: 0 0 .8em;}
p {margin:0 0 1.5em;}

a { text-decoration: none; color:#666; }
a:hover { color:#ed252f;}

.top-nav, .top-nav a {color: #fff; line-height: 28px; font-size: 1em; }
.top-nav a:hover {color: #000; }

.nav ul.nav-level1 li a { font-size: 1.2em; }
.nav ul.nav-level1 a:hover { text-decoration:none; color:#ed252f; }
.nav ul.nav-level2 li a { font-size: 1em; }
.nav ul.nav-level2 a:hover { color:#ed252f;}

table { font-size:1em; color:white; font-weight: bold;}
label em {color: red; font-size: .9em; }
input#button {width: 85px; margin:10px 0 0 100px; }

.footer-copy {font-size:.9em; color:#666; line-height:1.2em;}