/* 
Theme Name: Global Studies and the Humanities
Description: A custom WordPress theme for Zachary's on Robson
Version: 1.0
Author: A. Mignolo 

*/

/* =Global
------------------------------------------------------------------*/

html, body, form, fieldset, h1, h2, h3, h4, h5, h6, pre, blockquote, ul, ol, dl, address, .more-link  {
	margin:0;
	padding:0;
	}

a, a:link, a:visited {
	outline: none;
	text-decoration: none;
	}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}

ul, ol {
	list-style-type: none;
}

#wrapper {
	width: 960px;
	margin: 0 auto;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
}

body {
	font-family: Georgia, Times New Roman, Times, serif;
	font-size: 14px;
	background: #0F0F0F;
}


/* =Masthead
------------------------------------------------------------------*/

#masthead {
	height: 154px;
	background: #7dbe7d;
	background: url(images/bg.jpg) center top no-repeat;
}

h1 a {
	background: url(images/logo.jpg) left top no-repeat;
	height: 154px;
	width: 240px;
	overflow: hidden;
	text-decoration: none;
	text-indent: -9000px;
	float: left;
	display: block;
}

#masthead p {
	margin: 0 0 25px 0;
	padding: 15px 25px 0 280px;
	font-size: 12px;
	line-height: 18px;
	height: 72px;
}

#masthead ul {
	overflow: hidden;
	float: right;
	margin-right: 90px;
}

#masthead li {
	float: left;
}

#masthead li a {
	display: block;
	padding: 18px 30px 9px 30px;
	font-size: 14px;
	text-transform: uppercase;
	color: #FFF;
	margin-right: 2px;
}

#masthead li a:hover, #masthead li a.current {
	background: url(./images/trans.png) repeat;
}

#content {
	clear: both;
	width: 960px;
	overflow: hidden;
	background: #222;
}

/* =Freshsheet
------------------------------------------------------------------*/

#freshsheet {
	width: 240px;
	float: right;
	overflow: hidden;
	background: #222;
}

#freshsheet h3 {
	background: #000;
	color: #74A2CF;
	font-size: 12px;
	text-align: center;
	text-transform: uppercase;
	padding: 10px 0;
}

#freshsheet h3 span {
	display: block;
	color: #999;
	font-size: 11px;
	margin: 5px 10px 0 10px;
}

#freshsheet li {
	border-bottom: 1px dotted #222;
	padding: 10px;
	text-align: center;
	color: #999;
	background: #333;
}

#freshsheet h4 {
	font-weight: bold;
	font-style: italic;
	color: #eee;
}

#freshsheet span {
	display: block;
	color: #ff9900;
}

#freshsheet ul {
	overflow: hidden;
	height: 675px;
}

/* =Stage
------------------------------------------------------------------*/

#content #stage {
	width: 720px;
	height: 480px;
	background: #FFFBEF;;

}

/* =Specials
------------------------------------------------------------------*/

#specials {
	background: url(./images/specials.jpg) center no-repeat;
	height: 200px;
	clear: left;
}


/* =Menu
------------------------------------------------------------------*/

#menu_nav {
	width: 240px;
	float: right;
	overflow: hidden;
	background: #222;
	height: 100%;
}

#menu h2 {
	padding-top: 25px;
	color: #FF9900;
}

#menu_nav h3 {
	background: #000;
	color: #74A2CF;
	font-size: 12px;
	text-align: center;
	text-transform: uppercase;
	padding: 10px 0;
}

#menu_nav li a {
	color: #FF9900;
	padding: 10px 0;
	text-align: center;
	display: block;
	font-style: italic;
	background: #333;
	border-bottom: 1px dotted #222;
}

#menu {
	width: 720px;
	background: #FFFBEF;
	text-align: center;
}

#menu h3 {
	color: #63AF62;
	text-transform: uppercase;
	padding: 20px 0 10px 0;
	font-size: 18px;
}

#menu h4 {
	text-transform: uppercase;
	font-weight: bold;
}

#menu span {
	color: #FF9900;
	font-style: italic;
	font-weight: normal;
}

#menu p {
	margin: 0;
}

#menu table {
	width: 500px;
	text-align: left;
	margin: 0 auto;
	margin: 10px auto 10px 130px;
	
}

#menu .type {
	width: 400px;
}

#menu td.glass, #menu td.bottle {
	color: #FF9900;
}

#menu ul li {
	font-style: italic;
	padding: 5px 0;
}

#menu ul.beer {
	margin-bottom: 15px;
	
}

#menu ul.beer li {
	display: inline;
	text-align: center;
	padding: 10px;
}


#menu ul.cocktails h4 {
	display: inline;
}



#menu p.top a {
	color: #ccc;
	font-size: 11px;
}

/* =Location
------------------------------------------------------------------*/

#location {
	width: 720px;
	background: #FFFBEF;
}

#address {
	width: 240px;
	float: right;
	overflow: hidden;
	background: #222;
	height: 100%;
}

#address h3 {
	background: #000;
	color: #74A2CF;
	font-size: 12px;
	text-align: center;
	text-transform: uppercase;
	padding: 10px 0;
}

#address p {
	text-align: center;
	color: #EEE;
}


/* =Typography
------------------------------------------------------------------*/

#masthead, #freshsheet h3, #menu_nav h3 {
	font-family: Helvetica, Helvetica Neue, Arial, sans-serif;
}


/* =Image Slider
------------------------------------------------------------------*/


#s3slider {
   width: 720px; /* important to be same as image width */
   height: 480px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 720px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 10px/15px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   width: 374px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   top: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.clear {
   clear: both;
}