/* CSS Document for Grand Central Coffee Station */

/* basic elements */


* {
	margin: 0;
	padding: 0;
	}

html {
	height: 100%;
	}
	
* html #container {
	height: 100%;
	}

body {
	margin: 0;
	padding: 0;
	height: 100%;
	background-image: url(images/woodgrain_dk.jpg);
	background-repeat: repeat;
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: .85em;
	}

ul {
	color: #663300;
	font-weight: bold;
	margin: 15px 0 0 40px;
	}

li {
	margin: 2px;
	padding: 0;
	list-style: disc;
	}

h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #993300;
	margin: 0 0 .3em 0;
	padding: 0;
	font-size: 1.5em;
	font-weight: lighter;
	text-align: center;
	}
	
h4 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #660000;
	font-size: 1.4em;
	height: 20px;
	width: 260px;
	background: url(images/h4_coffeeheads.gif) no-repeat;
	font-weight: 200;
	padding: 5px 0 5px 35px;
	margin: 10px 0 5px 0;
	}

a {
	text-decoration: none;
	}
		
a:link, a:visited {
	text-decoration: none;
	color: #CC0000;
	}
		
a.active:link, a.active:visited, a:hover {
	color: #663300;
	}
	
a.owen:link, a.owen:visited, a.owen:hover {
	color: #FFF;
}

#topBar {
	width: 100%;
	height: 15px;
	background-color: #666666;
	border-bottom: 3px white solid;
	}

/* Main container */

#container {
	width: 700px;
	margin: 0 auto;
	position: relative;
	padding-bottom: 10px;
	}

	/* Elements in container */
	
	.headerImage {
		border-bottom: 3px white solid;
		padding-left: 100px;
		}
	
	#logo {
		background-image: url(images/gc-logo.gif);
		position: absolute;
		top: -5px;
		left: -5px;
		width: 198px;
		height: 198px;
		z-index: 100;
		}

	/* Top navigation */
	#navigation {
		width: 595px;
		height: 25px;
		float: right;
		background-color: #333333;
		margin: 0;
		padding-right: 5px;
		}
	
	
		/* navigation */

		#navtabs {
			margin: 0;
			padding: 0;
			}

		#navtabs li {
			margin: 0; 
			padding: 0;
			display: inline;
			list-style-type: none;
			}
			
		#navtabs a:link, #navtabs a:visited {
			float: right;
			font-size: 12px;
			line-height: 14px;
			font-weight: lighter;
			text-transform: uppercase;
			text-decoration: none;
			padding-left: 10px;
			border-left: 1px solid #FFFFFF;
			border-bottom: none;
			color: #FFFFFF;
			margin: 5px 5px 5px 5px;
			}
		
		#navtabs a.active:link, #navtabs a.active:visited, #navtabs a:hover {
			color: #CC0000; /* this red is a close match to the logo */
			}

#contentWrap {
	width: auto;
	margin-left: 25px;
	background-color: #FFFFFF;
	clear: both;
	background: url(images/back_leftred.jpg) repeat-y;
	border-left: 2px #FFFFFF solid;
	}
	
	#leftSide {
		float: left;
		width: 120px;
		margin: 0;
		padding-bottom: 25px;
		padding-top: 75px;
		}
		
		#leftSide p {
			color: #FFFFFF;
			text-align: center;
			}
	

	#centerbox { /* white box that holds a lot of the info */
			float: right;
			width: 550px;
			padding: 0px 0 25px 0;
			}
			
		#centerLeft {
			float: left;
			width: 295px;
			padding: 10px 5px 10px 15px;
			margin-bottom: 10px;
			}
			
			#centerLeft p {
				margin-bottom: .5em;
				margin-left: 1em;
				color: #660000;
				font-size: 1em;
				}
			
			.coffeefood ul {
				color: #663300;
				font-weight: normal;
				margin: 0 0 20px 30px;
				padding: 0;
				}
			
			.coffeefood li {
				margin: 4px 0;
				padding: 0;
				font-weight: normal;
				list-style: outside circle;
				}
			
			.coffeefood strong {
				font-weight: bold;
				}
				
			.coffeefood p {
				margin-bottom: .5em;
				margin-left: 1em;
				color: #660000;
				font-size: 1em;
				}
			
			
		#centerMiddle {
			width: 500px;
			margin: 20px 10px 10px 25px;
			}
			
			#centerMiddle h4 {
				font-family: Georgia, "Times New Roman", Times, serif;
				color: #660000;
				font-size: 1.4em;
				height: 20px;
				width: 500px;
				background: url(images/h4_coffeeheads_long.gif) no-repeat;
				font-weight: 200;
				padding: 5px 0 5px 35px;
				margin: 10px 0 5px 0;
				}
						
			

		
		#centerRight {
			float: right;
			width: 220px;
			margin-bottom: 10px;
			padding: 20px 5px 0 5px;
			}
			
			#gelato {
				background: url(images/gelato.jpg) no-repeat;
				padding: 240px 2px 10px 2px;
				margin: 0;
				border: #663300 dashed 1px;
				width: 211px;
				}
			
			#centerRight p {
				margin-bottom: .5em;
				margin-left: .5em;
				color: #660000;
				font-size: 1em;
				}
			
			.flavors ul {
				margin: 20px;
				padding: 5px;
				background-color: #DDB98B;
				color: CC0000;
				text-align: center;
				}
				
			.flavors li {
				font-weight: normal;
				list-style: none;
				font-size: .85em;
				}
			
			#decoblock {
				clear: both;
				padding: 3px 3px 8px 3px;
				margin: 0 4px 0 0;
				border: #663300 dashed 1px;
				background-color: #CCCCCC;
				width: 215px;
				text-align: center;
				}
				
				#decoblock p {
					color: #333333;
					font-size: 1.1em;
					}
					
				#decoblock h3 {
					color: #660000;
					font-size: 1.3em;
					margin-top: 4px;
					}
				
	#merchlist {
		clear: both;
		width: 550px;
		margin: 10px 0 0 0;
		}
		
		#merchlist ul {
			margin: 2px;
			}
		
		#merchlist li {
			float: left;
			width: 165px;
			height: 275px;
			margin: 0 3px 10px 3px;
			padding: 3px;
			color: #660000;
			border: #000000 1px solid;
			list-style: none;
			text-align: center;
			}
			
		#merchlist img {
			border: 1px solid #000000;
			margin: 3px;
			}
		
		#merchlist p {
			text-align: left;
			margin: 5px;
			font-size: 1em;
			font-weight: normal;
			}
			
		#merchlist h3 {
			font-size: 1.3em;
			}
				
			

	#todaySS {
		float: right;
		width: 190px;
		border: #333333 1px solid;
		background: url(images/today_soupsalad.jpg) no-repeat top;
		padding: 140px 5px 5px 5px;
		margin: 10px;
		color: #000000;
		text-transform: uppercase;
		text-align: center;
		background-color: #FFFFFF;
		}
		
		#todaySS p {
			font-size: 1em;
			padding-bottom: .5em;
		}
		
		.hungry {
			background-color: #003399;
			color: #FFFFFF;
			margin: 10px 5px 5px 5px;
			padding: 3px;
			}
		
		#todaySS h4 {
			color: #B7282C;
			font-size: 1.1em;
			padding: 0 0 .7em 0;
			margin: 0;
			background-image: none;
			font-family: Geneva, Arial, Helvetica, sans-serif;
			height: auto;
			width: auto;
			font-weight: normal;
			}

	#joinUs {
		clear: both;
		width: 250px;
		background-color: #CCCCCC;
		padding: 5px 15px 10px 215px;
		margin: 20px auto 10px;
		text-transform: uppercase;
		background: url(images/building.jpg) no-repeat #CCCCCC left;
		border: solid 2px #666666;
		}
		
		#joinUs h1 {
			font-size: 24px;
			font-weight: bold;
			color: #B7282C;
			margin: 5px;
			}
		
		#joinUs p {
			color: #663300;
			margin-bottom: 10px;
			}
		
		#joinUs a {
			color: #B7282C;
			text-decoration: underline;
			}
		
		#joinUs a:hover {
			color: #333333;
			}
	
	


#footer {
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #FFFFFF;
	background-color: #999999;
	text-align: center;
	padding: 8px 0;
	border-bottom: 2px #FFFFFF solid;
	border-right: 2px #FFFFFF solid;
	border-top: 1px dotted #FFFFFF;
	}
	
	#footer ul {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1em;
		text-transform: uppercase;
		color: #000000;
		list-style: none;
		margin: 10px 0 10px 0;
		}
	

	#footer li {
		margin: 5px 0;
		display: inline;
		padding: 2px;
		}
		
	#footer a {
		text-decoration: none;
		border-bottom: thin dotted #FFFFFF;
		}
		
	#footer a:link, #footer a:visited {
		text-decoration: none;
		color: #FFFFFF;
		}
		
	#footer a.active:link, #footer a.active:visited, #footer a:hover {
		color: #CC0000; /* this red is a close match to the logo */
		border-bottom: thin dotted #CC0000;
		}