/* CSS Document */

*
{
	padding: 0px;
	margin: 0px;
}

/*
 * Web Font bookmark:
 * http://www.google.com/webfonts#ReviewPlace:refine/Collection:IM+Fell+DW+Pica+SC|Julee|Sorts+Mill+Goudy|Montez|Walter+Turncoat|Amatic+SC|Comfortaa|IM+Fell+Double+Pica+SC|Rock+Salt
 */

/* Backgroud Page Styling---------------------------------------*/

html
{
	overflow-x: hidden;
}

body
{
	background-color: rgba(255,204,102,1);
	margin-top: 10px;
	width: 800px;
	margin-left: auto;
	margin-right: auto;
}

#main
{
	margin-top: 30px;
	border: solid thick rgba(66,33,11,1);
	color:white;
	position: relative;
	z-index:2;
	min-height: 600px;
	/*background-color: rgba(255,204,102,1);*/
}


#backline
{
	position: absolute;
	background-image: url(images/thai-02.png);
	background-repeat: repeat-x;
	top: 100px;
	left: -200px;
	height: 144px;
	width: 2400px;
	overflow: hidden;
	z-index: 2;
}

#thai
{
	position: relative;
	top: 240px;
	background-image: url(images/thai-01.png);
	height: 265px;
	z-index: 6;
}

#thai div
{
	position:relative;
	top: 150px;
	left: -15px;
	width: 810px;
	height: 20px;
	border: solid thick rgba(66,33,11,1);
	font-size: .7em;
	vertical-align: middle;
	text-align: center;
	color: rgba(255,204,102, 1);
}

.hidden
{
	display:none;
}

.color
{
	background-color: rgba(255,204,102, 1);
	height: 200px;
	width: 790px;
	position:absolute;
	top: 70px;
	z-index: 3
}

.brown
{
	max-height: 75px;
	background-color: rgba(66,33,11,1);
	z-index: 10;
	opacity: 1;
}

.faded
{
	opacity: .2;
	margin-top: 100px;
}

.faded div
{
	display:none;
}

/* General Text Formating --------------------------------------*/

h1
{
	position:relative;
	top: 155px;
	left: 260px;
	font-size: 6em;
	color: rgba(66,33,11,1);
	font-family: 'Amatic SC', sans-serif;
}

/* Navigation Styling ------------------------------------------*/
header
{
	position: absolute;
	top: 5px;
	left: 5px;
	z-index: 6;
	font-size: 2em;
}

nav
{
	position: absolute;
	top: 10px;
	left: -25px;
	width:820px;
	height: 40px;
	background-color: red;
	border: solid 2px rgba(66,33,11,1);
	color: rgba(255,204,102,1);
	font-family: 'Amatic SC', sans-serif;
}

li
{ 
	display: block;
	float:left;
	margin-left: 55px;
	vertical-align:middle;
}

nav a
{
	text-decoration: none;
	color: rgba(255,204,102, 1);
	height: 50px;
}

nav a:hover
{
	color: white;
}

nav a.current
{
	color: white;
}

/* Special Styling -----------------------------------------------------*/

/*I debated whether or not the "special" needed to have the same font as everything
else or not. I figured the ad should have it's own two fonts in order to bring attention
to it and to avoid too much of the same. So as Robyn Williams says from Visual Media's 
Non-Designer Design book: only break the rule if you know what rule you are breaking, right? */

#special
{
	position: absolute;
	z-index: 5;
	height: 500px;
	width: 790px;
}

/* Footer Styling -----------------------------------------------*/

footer
{
	width: 800px;
	margin-top: -55px;
	margin-left: 20px;
}



footer p
{
	font-style: italic;
	color: rgba(66,33,11,1);
	width: 600px;
}

#facebook
{
	position: relative;
	z-index: 10;
	left: 600px;
	top: -45px;
}

/* Menu Styling ------------------------------------------------*/
#menu
{
	position: absolute;
	top: 89px;
	width: 790px;
	height: 441px;
	padding-bottom:70px;
	overflow: scroll;
	overflow-x: hidden;
	color: rgba(66,33,11,1);
	z-index: 10;
}

#menu .course h2
{
	font-family: 'Amatic SC', sans-serif;
	color:rgba(66,33,11,1);
	font-size: 4em;
	text-align:center;
	border-bottom: solid thick rgba(140,198,63,1);
	margin-bottom: 30px;
	
}
#menu .course h5
{
	position: relative;
	left: 650px;
	width: 100%;
	border-bottom: solid thin black;
}

#menu .course .item
{
	margin: 0 0 20px 50px;
	
}

#menu .course .item h3
{
	font-family: 'Amatic SC', sans-serif;
}

#menu .course .item p
{
	font-style:italic;
	width: 500px;
}
#menu .course .item h6
{
	position:relative;
	left: 300px;
	top: -18px;
	color: rgba(66,33,11,.7);
}

h5 a
{
	text-decoration:none;
	color: rgba(66,33,11,1);
}

h5 a:visited
{
	text-decoration:none;
	color: rgba(66,33,11,1);
}

h5 a:hover
{
	color: rgba(140,198,63,1);
}

#menu .course .item table
{
	width: 500px;
}

#menu .course .item td
{
	border-bottom: solid thin rgba(66,33,11,1);
	margin-right: 5px;
	text-align: center;
}



#menu .course .item table:after
{
	content: "Available with Coconut Milk";
	font-style:italic;
}

#menu .course .item .thai:after
{
	content:" Served with Rice, Original Thai Salad and Crab Ragoon.";
}

/* Menu Navigation --------------------------------------*/

.sub
{
	background-color:rgba(140,198,63,1);
	font-size: .7em;
	position: absolute;
	top: 50px;
	left: -7px;
	height: 30px;
	width: 790px;
	z-index:5;
	
}

.sub li
{ 
	display: block;
	height: 30px;
	float:left;
	margin-left: 16px;
	vertical-align:middle;
	padding-right: 16px;
	border-right: solid thin rgba(66,33,11,1);
}

.sub li:first-child
{
	margin-left:20px;
}

.sub li:last-child
{
	border-right:none;
}

.sub li a
{
	color:rgba(66,33,11,1);
}

.sub li a:hover
{
	color:white;
}