/* CSS Document */
/*###################################*/
/*############# GLOBAL ##############*/

body {
	color: #333;
	font-family: Arial, Helvetica, san-serif;
	margin: 0;
	padding: 0;
	background: url(../img/all/noodlebox_BG.gif) fixed;}
	
h1.header {
	margin: 15px 0 0 0;
	padding: 0;}

h1 {
	color: #f00;
	font-size: 170%;}
h2 {
	margin: 20px 0 10px 0;
	color: #f00;
	font-size: 150%;
	line-height: 120%;}
h3 {
	color: #000;
	font-size: 120%;
	background: #eee;
	margin: 20px 0 4px 0;
	padding: 0px 4px;}	
h4 {
	color: #333;
	font-size: 100%;
	margin: 20px 0 0 0;
	padding: 0;
	text-transform: uppercase;}

p {padding: 0;
	margin-top: 2px;}
	
a {
	color: #f00;}
	
a:hover {
	text-decoration: none;}

input, select, option {
	font-size: 10px;
	line-height: 10px;
	color: #666;}
img {
	display: block;}

ul.list {
	padding-left: 20px;
	margin: 8px 2px;}
ul.list li {
	margin-bottom: 2px;}
	
ul.listHor, ul.listVer {
	padding: 5px;
	margin: 8px 0;
	font-weight: bold;
	line-height: 180%;
	background: #fff3d2;}
ul.listHor li {
	margin: 2px;
	background: #fff;
	padding: 0 6px;
	display: inline;
	border-left: 2px solid #fc0;}
ul.listVer li {
	list-style-type: none;
	margin: 2px;
	background: #fff;
	padding: 0 6px;
	border-left: 2px solid #fc0;}

/*#######################################*/
/*############## POSITION ###############*/
#layout {
	position: relative;
	left: 50%;
	width: 750px;
	margin: 20px 0 0 -390px;
	padding: 0 15px;
	text-align: left;
	background: #fff url(../img/all/header_BG.gif) no-repeat 0 0;}
	
#layout td {
	font-size: 11px;
	line-height: 150%;}
	
#headerHome, #header {
	width: 740px;
	padding: 0 5px;}
* html #header {
	width: 750px;}
	
#headerHome img, #header img {
	padding-top: 20px;
	display: block;}
* html #headerHome img, * html #header img {
	padding-top: 0px;
	margin-top: 20px;}


/*#######################################*/
/*############# NAVIGATION ##############*/

#navigationHome {
	position: absolute;
	top: 20px;
	left: 50%;
	width: 240px;
	height: 230px;
	margin: 0 0 0 130px;
	background: url(../img/main/noodleboxHome_navBG.gif) no-repeat;}

#navigation {
	position: absolute;
	top: 20px;
	left: 50%;
	width: 240px;
	height: 115px;
	margin: 0 0 0 130px;
	background: url(../img/all/noodlebox_navBG.gif) no-repeat;}

#navigationHome ul, #navigation ul {
	list-style-type: none;
	margin: 20px 0 0 0;
	padding: 0;
}
#navigationHome li, #navigation li {
	margin: 0 0 2px 0;
	padding: 0;
}

#navigationHome a, #navigation a {
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	color: #000;
	text-decoration: none;
	background: #fc0;
	padding: 1px 6px;}
	
#navigationHome a:hover, #navigation a:hover {
	color: #fff!important;
	background: #f00;}

#navigation a.active {
	color: #f00;}


#subNavigation {
	width: 490px;
	padding: 0 5px;}

* html #subNavigation {
	width: 500px;}

#subNavigation ul {
	list-style-type: none;
	margin: 0;
	padding: 1px 5px;
	background: #f00;}
	
* html #subNavigation ul {
	padding: 0 5px 2px 5px;}
	
#subNavigation li {
	display: inline;
	margin: 0 5px 0 0;
	padding: 0;}

#subNavigation a {
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	padding-left: 10px;
	text-decoration: none;
	background: url(../img/all/plusSub.gif) 0 4px no-repeat;}
	
#subNavigation a:hover {
	color: #fc0;}
	
#subNavigation a.active {
	color: #fc0;}


/*####################################*/
/*############# CONTENT ##############*/

#content table {
	margin: 30px 0 30px 0;
	border-collapse: collapse;}

#content tr, table.dataTable tr {
	vertical-align: top;}	

#content td {
	}
	
#content img {
	border: 1px solid #eee;}

#content td.col3 {
	width: 240px;
	padding: 0 5px;}

#content td.col2big {
	width: 490px;
	padding: 0 5px;}

#content td.col2small {
	width: 240px;
	padding: 0 5px;}


table.dataTable {
	margin: 0 0 10px 0!important;
	width: 100%;
	border-collapse: collapse;
	border-bottom: 2px solid #ccc;}
	
table.dataTable td, table.dataTable th {
	margin: 0;
	padding: 2px 4px;}
* html table.dataTable td, * html table.dataTable th {
	font-size: 70%;
	text-align: left;}
table.dataTable th {
	border-bottom: 1px solid #ccc;}
	
table.imgTable {
	width: 100%;}
table.imgTable td.leftPadding {
	padding-left: 5px;}
table.imgTable td.img {
	width: 100px;}

.price {
	width: 20%;}

/*###################################*/
/*############# FOOTER ##############*/

#footer {
	position: relative;
	left: 50%;
	width: 780px;
	margin: 2px 0 0 -390px;
	background: #fc0;}

#footer table {
	width: 100%;
	font-size: 10px;
	color: #000;
	height: 20px;
	border-collapse: collapse;
	margin: 0;}
	
#footer td.left {
	padding-left: 20px;
	background: url(../img/all/footerLeft.gif) left bottom no-repeat;}
	
#footer td.right {
	padding-right: 20px;
	text-align: right;
	background: url(../img/all/footerRight.gif) right bottom no-repeat;}
	
#footer ul {
	list-style-type: none;
	margin: 0;
	padding: 0;}
#footer li {
	display: inline;
	margin-right: 5px;
	padding: 0;}
#footer a {
	color: #000;
	padding-left: 8px;
	text-decoration: none;
	background: url(../img/all/plus.gif) 0 4px no-repeat;}
#footer a:hover {
	color: #f00;}
#footer a.active {
	background: url(../img/all/plus_active.gif) 0 4px no-repeat;}

/*############################################*/
/*############# ALLTIME classes ##############*/

.clear {clear: both;}

.first, .first a {background-image: none!important;}

.top {margin-top: 2px;}

.noMargin {margin: 0; padding: 0}

.odd {background: #eee;}

a img {border: none;}

.topMargin {margin-top: 20px;}

.imgText {font-weight: bold; line-height: 100%; margin-top: 5px;}

.back {background: url(../img/all/back.gif) 0 4px no-repeat!important; padding-left: 9px!important}

.floatRight {float: right; margin: 0 0 5px 10px;}

.floatLeft {float: left; margin: 0 10px 5px 0;}

.noBorder {border: none!important;}

.center {text-align: center;}

p.attention {background: #f00; padding: 0 4px; color: #fff; font-weight: bold;}
p.attention a {color: #fff; font-weight: bold;}