/* -----------------------------------------------
Style Sheet [screen]

Site: 		METRO BUFFET & GRILL
Author:   	Gary Jones    www.powerpointcreative.com
Version:  	1
Date: 		2 February, 2008
----------------------------------------------- */

/* Undo some of the default styling of common (X)HTML browsers */

/* Normalizes margin, padding */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, address, caption, cite, input, p, html, blockquote, th, td
{ margin:0; padding:0; }

/* Normalizes font-size for headers, pre/code too*/
h1,h2,h3,h4,h5,h6,pre,code
{ font-size:100%; }

/* Removes list-style from lists*/
ul,ol
{ list-style:none; }

/* Normalizes font-style and font-weight to normal */
address, caption, cite, code, dfn, em, strong, th, var
{ font-style:normal; font-weight:normal; }

/* Removes borders from tables */
table
{border-collapse:collapse; border-spacing:0;}

/* Removes Blue borders*/
a img,:link img,:visited img, fieldset, img
{ border:0;}

/* Removes link underlines */
:link,:visited
{ text-decoration:none; }

/* Left-aligns text in caption and th */
caption, th
{text-align:left;}

/* Removes quotation marks from q */
q:before, q:after
{content:' ';}

/*---------------------------------------------------------------------
            GLOBAL STYLES - UNIVERSAL SELECTORS & FIXES
---------------------------------------------------------------------*/

/*These are default styles that every page needs to inherit */


/* This sets all browser padding and margin defaults to zero */
* { margin: 0; padding: 0; } 

/* This is a fix for IE 6 & 7 spacing issues. I think. */
* html img { display: block; } 

/* This keeps images wrapped in an anchor tag from displaying a border. Maybe. */
a img { border: none; display: inline; margin: 0; padding: 0; }

/* Things I want to appear with styles off, but disappear when styles
are on, are often wrapped in a div or span with this "hidden" class to 
hide them. */
.hidden { display: none; }

/* End browser nomalization */

/*---------------------------------------------------------------------
            GLOBAL TYPE STYLES
---------------------------------------------------------------------*/

body {
	text-align: center;
	font-family: Verdana, Helvetica, Arial, 'Lucida Grande', Geneva, sans-serif;
	background-image: url(../images/backlines.gif);
	background-repeat: no-repeat;
	background-position: center top;
}

p {
	font-size: 10px;
	font-style: normal;
	line-height: 24px;
	font-family: Verdana, Helvetica, Arial, 'Lucida Grande', Geneva, sans-serif;
	margin-bottom: 8pt;
}
strong {
	font-weight: bold;
}


td {
	font-family: Verdana, Helvetica, Arial, 'Lucida Grande', Geneva, sans-serif;
}

th {
	font-family: Verdana, Helvetica, Arial, 'Lucida Grande', Geneva, sans-serif;
}





/* -----------------------------------------------------------------
              MAIN WRAPPER BRANDING HEADER AND NAVIGATION
-------------------------------------------------------------------*/

#wrapper {
	width:925px;
	text-align:left;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	position: relative;
	height: 625px;
	background-repeat: no-repeat;
	background-position: left top;
	background-color: #FFFFFF;
	background-image: url(../images/wrapper_back_new.gif);
}
#comingSoon {
	height: 11px;
	width: 79px;
	position: absolute;
	background-image: url(../images/comingsoon.gif);
	background-repeat: no-repeat;
	background-position: left top;
	right: -18px;
	z-index: 20;
	visibility: hidden;
	top: -15px;
}
#comingSoon2 {
	height: 11px;
	width: 79px;
	position: absolute;
	background-image: url(../images/comingsoon.gif);
	background-repeat: no-repeat;
	background-position: left top;
	right: 130px;
	z-index: 20;
	visibility: hidden;
	top: -15px;
}


#branding {
	height: 80px;
	width: 925px;
}
#branding h1 {
	background-image: url(../images/METRO_logo.gif);
	background-repeat: no-repeat;
	position: absolute;
	height: 111px;
	width: 296px;
	text-indent: -9999px;
	background-position: left bottom;
}


#branding ul#navigation {
	position: absolute;
	list-style: none;
	top: 90px;
	left: 296px;
	height: 21px;
	width: 589px;
	background-image: url(../images/nav_back.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#branding ul#navigation li {
	text-indent: -9999px; /* this removes the nav item text from appearing over the nav list items */
	text-decoration: none; /* this removes the nav item text from appearing over the nav list items */
	float: left;
}
#branding ul#navigation a {
	display: block;
}
#branding ul#navigation a:hover  {
	background-position: 0 -21px; /* this makes the nav items display their rollovers */
}


#homemenu a { /* this replaces the list item's anchor with an image, gives it a width and height, and floats it left. */
	width: 51px;
	height: 21px;
	background-color: transparent;
	background-image: url(../images/home_btn.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
}

#menumenu a {
	background: transparent url(../images/menu_btn.gif) no-repeat 0 0;
	width: 54px;
	height: 21px;
}

#chefmenu a {
	background: transparent url(../images/chef_btn.gif) no-repeat 0 0;
	width: 49px;
	height: 21px;
}

#interiormenu a {
	background: transparent url(../images/interior_btn.gif) no-repeat 0 0;
	width: 72px;
	height: 21px;
}

#gallerymenu a {
	background: transparent url(../images/gallery_btn.gif) no-repeat 0 0;
	width: 71px;
	height: 21px;
}

#pressmenu a {
	background: transparent url(../images/press_btn.gif) no-repeat 0 0;
	width: 61px;
	height: 21px;
}

#reservationsmenu a {
	background: transparent url(../images/reservations_btn.gif) no-repeat 0 0;
	width: 102px;
	height: 21px;
}

#contactmenu a {
	background: transparent url(../images/contact_btn.gif) no-repeat 0 0;
	width: 88px;
	height: 21px;
}
#languagemenu  a {
	background: transparent url(../images/chinese_btn.gif) no-repeat 0 0;
	width: 41px;
	height: 21px;
}


/* These styles control the indication of what section the user is currently in. */


body#home #homemenu a, body#menu #menumenu a, body#chef #chefmenu a,
body#interior #interiormenu a, body#gallery #gallerymenu a,
body#press #pressmenu a, body#reservations #reservationsmenu a
{
	background-position: 0 -21px;
}

/* -----------------------------------------------------------------
         FORM LAYOUT
-------------------------------------------------------------------*/
#formWrapper {
	height: 355px;
	width: 772px;
	position: absolute;
	top: 130px;
	left: 58px;
	color: #666666;
}
#formWrapper .moreOffers {
	position: absolute;
	left: 0px;
	top: 375px;
	right: 0px;
	bottom: 0px;
	height: 25px;
	width: 700px;
}
#formWrapper .moreOffers p {
	color: #858689;
	font-size: 10px;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
}
#formWrapper .moreOffers a {
	color: #980027;
	text-decoration: none;
}

#formWrapper .moreOffers a:hover, #formWrapper .moreOffers a:active {
	color: #980027;
	text-decoration: underline;
}

#formWrapper .moreOffers a.active:link, #formWrapper .moreOffers a.active:visited
{
	text-decoration: none;
}


#formWrapper p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 160%;
}
#formWrapper .red {
	color: #980027;
}

#formWrapper h2 {
	font-size: 16px;
	line-height: 120%;
	font-weight: normal;
	color: #980027;
	text-transform: uppercase;
	margin-bottom: 10px;
}


#formLeft {
	width:382px;
	float:left;
	height: 100%;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCCCCC;
}
#formLeft p {
	margin-right: 10px;
}

#formRight {
	width:378px;
	float:right;
	height: 100%;
}

/* -----------------------------------------------------------------*/


#galleryflashHolder {
	height: 370px;
	width: 806px;
	position: absolute;
	top: 130px;
	left: 58px;
}



#flashHolder {
	height: 349px;
	width: 468px;
	position: absolute;
	top: 130px;
	left: 58px;
}
#flashHolder h2 {
	position: absolute;
	text-indent: -9999px;
}

#pageHeadline {
	position: absolute;
	width: 295px;
	top: 130px;
	left: 540px;
	height: 70px;
	font-size: 16px;
	line-height: 120%;
	font-weight: normal;
}
#pageHeadline   h2  {
	font-weight: normal;
	color: #980027;
}
#pageHeadline h2+h2 {
	color: #98999D;
	padding-top: 5px;
}
#pageHeadline h3 {
	color: #980027;
	font-style: italic;
	font-weight: normal;
}

#textBlock {
	position: absolute;
	width: 320px;
	height: 285px;
	top: 200px;
	left: 540px;
	color: #666666;
}
#textBlock .buttons a {
	float: left;
	padding-right: 30px;
	display: block;
	text-decoration: none;
	color: #666666;
	margin-bottom: 12px;
	margin-top: 0px;
	margin-right: 12px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 6px;
	margin-left: 0px;
	border: 1px solid #CCCCCC;
}


#textBlock .buttons a:hover, #textBlock .buttons a:active {
	color: #980027;
	border: 1px solid #980027;
}

#textBlock .buttons a.active:link, #textBlock .buttons a.active:visited
{
	text-decoration: none;
}


#textBlock table {
	margin-right: 2px;
	margin-left: 2px;
	margin-bottom: 12px;
	padding: 0px;
	margin-top: 0px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #999999;
	border-right-color: #999999;
}
#textBlock td {
	padding: 3px;
	text-align: left;
	vertical-align: top;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #999999;
}
#textBlock tr {
	margin: 0px;
	padding: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999999;
}
#textBlock .topTableRowBorder {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #999999;
}
#textBlock .tenpercent {
	font-size: 9px;
	font-style: italic;
}
#textBlock p {
	font-size: 10px;
	line-height: 170%;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 0px;
}
#textBlock h3 {
	font-size: 13px;
	padding-bottom: 8px;
	text-transform: uppercase;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #858689;
	font-weight: normal;
	padding-top: 5px;
}


/* -----------------------------------------------------------------
                   FOOTER STYLES
-------------------------------------------------------------------*/

#footer {
	width: 925px;
	position: absolute;
	top: 520px;
	height: 80px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
#footer p {
	color: #858689;
	font-size: 9px;
	font-style: normal;
	margin: 0px;
	padding: 0px;
}
#footer div {
	position: absolute;
	width: 100%;
	left: 45px;
	top: 60px;
	right: 0px;
	bottom: 0px;
}

#footer .copyright {
	text-transform: uppercase;
	float: left;
	text-align: left;
	height: 20px;
	vertical-align: top;
	margin-right: 20px;
	color: #98999d;
}

#footer .ppcCredit {
	text-transform: uppercase;
	float: left;
	height: 20px;
	text-align: left;
	color: #98999d;
}

#footer .ppcCredit a {
	text-decoration: none;
	color: #98999d;
}

#footer .ppcCredit a:hover, #footer .ppcCredit a:active {
	text-decoration: underline;
}

#footer .ppcCredit a.active:link, #footer .ppcCredit a.active:visited
{
	text-decoration: none;
}




.eaton {
	position: absolute;
	top: 40px;
	text-transform: uppercase;
	left: 727px;
	width: 155px;
	height: 16px;
	right: 0px;
	bottom: 0px;
}

.eaton a {
	text-decoration: none;
	color: #980027;
	font-weight: normal;
	text-transform: none;
	text-align: left;
	display: block;
}

.eaton a:hover, .eaton a:active {
	text-decoration: none;
	color: #666666;
}

.eaton a.active:link, .eaton a.active:visited
{
	text-decoration: none;
}


/**/


.privacy {
	position: absolute;
	top: 40px;
	text-transform: uppercase;
	left: 565px;
	text-align: right;
	right: 0px;
	bottom: 0px;
	width: 150px;
	height: 16px;
}

.privacy a {
	text-decoration: none;
	color: #858689;
	font-weight: normal;
	text-transform: none;
	display: block;
}

.privacy a:hover, .privacy a:active {
	text-decoration: none;
	color: #980027;
}

.privacy a.active:link, .privacy a.active:visited
{
	text-decoration: none;
}




/* -----------------------------------------------------------------
         CLEARING CLASS
-------------------------------------------------------------------*/

.clearBoth {
	clear: both;
}


/* -----------------------------------------------------------------
         SCROLL DOT BUTTONS
-------------------------------------------------------------------*/	
	
#upButton {
	height: 12px;
	width: 30px;
	display: block;
	text-align: right;
	color: #FFFFFF;
	padding-bottom: 3px;
	}

#upButton a
{
	background-image: url(../images/red_arr_up.gif);
	background-repeat: no-repeat;
	background-position: center center;
	text-decoration: none;
	display: block;
	color: #FFFFFF;
	font-size: 3px;
}


#upButton a:hover, .upButton a:active {
	background-image: url(../images/grey_arr_up.gif);
	background-repeat: no-repeat;
	background-position: center center;
}

#upButton a.active:link, .upButton a.active:visited
{
	background-image: url(../images/red_arr_up.gif);
	background-repeat: no-repeat;
	background-position: center center;
}


#dwnButton {
	height: 12px;
	width: 30px;
	display: block;
	text-align: right;
	color: #FFFFFF;
	padding-bottom: 3px;
	}

#dwnButton a
{
	background-image: url(../images/grey_arr_dwn.gif);
	background-repeat: no-repeat;
	background-position: center center;
	text-decoration: none;
	display: block;
	color: #FFFFFF;
}


#dwnButton a:hover, .dwnButton a:active {
	background-image: url(../images/red_arr_dwn.gif);
	background-repeat: no-repeat;
	background-position: center center;
}

#dwnButton a.active:link, .dwnButton a.active:visited
{
	background-image: url(../images/grey_arr_dwn.gif);
	background-repeat: no-repeat;
	background-position: center center;
}
#legalPop {
	width:524px;
	height:400px;
	color: #666666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 150%;
	visibility: hidden;
	z-index: 8;
	left: 55px;
	top: 120px;
	position: absolute;
	background-color: #FFFFFF;
	border: 1px solid #999999;
	right: 0px;
	bottom: 0px;
}

#legalPoppageHeadline {
	font-size: 16px;
	line-height: 120%;
	font-weight: normal;
	position: relative;
	padding: 0px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 10px;
}
#legalPoppageHeadline   h2  {
	font-weight: normal;
	color: #980027;
}
#legalPoppageHeadline h2+h2 {
	color: #98999D;
	padding-top: 5px;
}

#legalPop p {
	font-size: 10px;
	line-height: 170%;
}
#legalPop h3 {
	margin-bottom: 5px;
	margin-top: 10px;
}
#legalPopTextWrapper {
	position: relative;
	margin-top: 18px;
	margin-left: 10px;
	background-image: url(../images/rule.gif);
	background-repeat: repeat-y;
	background-position: 487px top;
}

#contactPop {
	width:518px;
	height:310px;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 150%;
	visibility: hidden;
	z-index: 9;
	left: 55px;
	top: 120px;
	position: absolute;
	background-color: #980027;
	background-image: url(../images/MetroMap.gif);
	background-repeat: no-repeat;
	background-position: left top;
	border: 4px solid #98999D;
	right: 0px;
	bottom: 0px;
}


#location {
	margin-top: 20px;
	margin-left: 15px;
	width: 200px;
	font-family: Arial, Helvetica, sans-serif;
}

#location h4 {
	text-transform: uppercase;
	background-image: url(../images/location_03.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
	height: 28px;
	width: 121px;
	padding-bottom: 5px;
}
#location h5 {
	font-weight: bold;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	color: #98999d;
	font-size: 120%;
}

#location a
{
	text-decoration: none;
	color: #FFFFFF;
}

#location a:hover, #location a:active {
	text-decoration: underline;
}

#location a.active:link, #location a.active:visited
{
	color: #f0a027;
}


#opening {
	margin-top: 45px;
	margin-left: 15px;
	width: 200px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 130%;
	font-weight: bold;
	color: #98999d;
}

#opening h4 {
	text-transform: uppercase;
	background-image: url(../images/opening_hrs_07.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
	height: 50px;
	width: 123px;
	padding-bottom: 5px;
}


#closeButton {
	width: 86px;
	background-image: url(../images/close_butt_red.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 18px;
	position: absolute;
	top: 12px;
	right: 10px;
}

#closeButton a {
	height: 18px;
	width: 86px;
	background-image: url(../images/close_butt_red.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
}

#closeButton a:link a:visited {
	text-decoration: none;
}
#closeButton a:hover {
	background-position: left -18px;
}


/*---------------------------------------------------------------*/

#closeButton2 {
	width: 86px;
	background-image: url(../images/close_butt_white.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 18px;
	position: absolute;
	top: 12px;
	right: 10px;
}

#closeButton2 a {
	height: 18px;
	width: 86px;
	background-image: url(../images/close_butt_white.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
}

#closeButton2 a:link a:visited {
	text-decoration: none;
}
#closeButton2 a:hover {
	background-position: left -18px;
}



/* -----------------------------------------------------------------
         PRESS PAGE RULES
-------------------------------------------------------------------*/


#news {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #000000;
	margin-bottom: 15px;
	}
#news p {
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
}
#news .download {
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 12px;
	margin-left: 0px;
}
	
.read {
	}

	.read a
{
	text-decoration: none;
	color: #666666;
	float: left;
	border: 1px solid #CCCCCC;
	display: block;
	padding-right: 5px;
	padding-left: 5px;
}


.read a:hover, .read a:active {
	border: 1px solid #980027;
	color: #980027;
}

.read a.active:link, .read a.active:visited
{
}

.readChi {
	margin-bottom: 10px;
}

.readChi a
{
	text-decoration: none;
	color: #666666;
	padding-right: 5px;
	padding-left: 5px;
	float: left;
	display: block;
	border: 1px solid #CCCCCC;
	margin-left: 10px;
}


.readChi a:hover, .readChi a:active {
	color: #980027;
	border: 1px solid #980027;
}

.readChi a.active:link, .readChi a.active:visited
{
}


	
#news h3 {
	font-size: 14px;
	line-height: 22px;
	color: #666666;
	padding-bottom: 3px;
	text-transform: none;
	}
	
	
#news h2 {
	font-size: 12px;
	font-style: normal;
	line-height: 20px;
	font-weight: bold;
	text-transform: uppercase;
	color: #000000;
	padding-top: 20px;
	}
	
#news h2 .smlC {
	text-transform: lowercase;
	}