/* -------------------------------------------------------------- 
  	GENERAL CROSS-BROWSER RESET 
-------------------------------------------------------------- */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td
	{
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

body {
	line-height: 1.5;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table {
	border-collapse: separate;
	border-spacing: 0;
}

caption,th,td {
	text-align: left;
	font-weight: normal;
}

table,td,th {
	vertical-align: middle;
}

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before,blockquote:after,q:before,q:after {
	content: "";
}

blockquote,q {
	quotes: "" "";
}

/* Remove annoying border on linked images. */
a img {
	border: none;
}

/* PC FF3 adds an outline to Flash objects? */
a,object {
	outline: none;
}

/* -------------------------------------------------------------- 
  	TYPOGRAPHIC DEFAULTS 
-------------------------------------------------------------- */
	/* Headings
-------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 {
	font-weight: bold;
	margin: 0;
	margin-bottom: 0.75em;
}

h1 {
	color: #4BABDE;
	font-size: 1.833em;
}

h2 {
	color: #4BABDE;
	font-size: 1.667em;
	text-transform: uppercase;
}

body.home-page h2 {
	color: #000080;
	font-size: 1.25em;
}

h3 {
	color: #DA9951;
	font-size: 1.333em;
}

h4 {
	font-size: 1.3em;
}

h5 {
	font-size: 1.2em;
}

h6 {
	font-size: 1em;
}

/* Text Elements
-------------------------------------------------------------- */
p {
	margin: 0 0 1.5em;
	line-height: 1.5;
}

.summary p {
	font-style: italic;
}

a {
	text-decoration: underline;
}

a,a:link,a:visited {
	color: #00A4E4;
}

a:hover,a:active,a:focus {
	color: #5A5A5A;
}

blockquote {
	margin: 1.5em;
	color: #666;
	font-style: italic;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

address {
	font-style: normal;
}

cite {
	font-style: italic;
}

small {
	font-size: 0.833em;
}

/* Following six styles generally do not need to be edited */
sup,sub {
	line-height: 0;
}

dfn {
	font-style: italic;
}

del {
	color: #666;
}

pre {
	white-space: pre;
}

pre,code,tt {
	font: 1em 'andale mono', 'lucida console', monospace;
	line-height: 1.5;
}

/* HRs with background images
-------------------------------------------------------------- */
div.hr {
	height: 3px;
	margin: 10px 0;
	background: #fff url() 0 0 repeat-x;
}

div.hr hr {
	display: none;
}

/* Lists
-------------------------------------------------------------- */
li ul,li ol {
	margin: 0 1.5em;
}

ul,ol {
	margin: 0 1.5em 1.5em 1.5em;
}

ul ol li {
	background: none;
	padding-left: 0;
}

li {
	margin-bottom: 0.5em;
}

li span {
	font-weight: bold;
}

ul {
	list-style-type: disc;
	margin-left: 0;
	padding-left: 1.5em;
}

ol {
	list-style-type: decimal;
}

dl {
	margin: 0 0 1.5em 0;
}

dl dt {
	font-weight: bold;
}

dd {
	margin-left: 1.5em;
}

/* Tables
-------------------------------------------------------------- */
table {
	margin-bottom: 1.4em;
	width: 100%;
	border: 1px solid #D9D9D9;
	border-bottom: none;
	border-right: none;
}

th {
	background: #e5e5e5 url(../images/design/th-bg.gif) 0 0 repeat-x;
	font-weight: bold;
	border-right: 1px solid #D9D9D9;
}

th,td,caption {
	padding: 4px 10px 4px 5px;
}

td {
	border-bottom: 1px solid #D9D9D9;
	border-right: 1px solid #D9D9D9;
}

tr.odd td {
	background: #FBFBFB;
}

tfoot {
	font-style: italic;
}

caption {
	background: #eee;
	text-align: center;
}

/* -------------------------------------------------------------- 
	PAGE STRUCTURE
	Elements that make up the skeleton of the layout and holds things together
----------------------------------------------------------- */
body {
	margin: 0;
	height: 100%;
	color: #4B4B4B;
	font: 62.5% arial, helvetica, sans-serif;
	text-align: center;
	background: #F3AC5C;
}

#page {
	background: url(../images/design/blue-repeat-bg.jpg) 0 159px repeat-x;
	position: relative;
	min-height: 100%;
	text-align: left;
	padding: 0;
	font-size: 1.2em;
	/* this, along with body font size of 62.5% renders type approximately 12px in size across all browsers */
}

#header {
	height: 221px;
	margin: 0 auto;
	position: relative;
	z-index: 20; /* ie6 */
	width: 960px;
}

#pageInner {
	background: url(../images/design/cupcake_home.jpg) 0 0 no-repeat;
}

#wrapper {
	background: url(../images/design/wrapper-bg.jpg) 345px 0 no-repeat;
	margin: 0 auto;
	margin-bottom: 1em;
	padding-top: 47px;
	position: relative;
	width: 960px;
}

#footer {
	background: #4babde;
	min-height: 61px;
	margin-bottom: 20px;
}

#footerInner {
	margin: 0 auto;
	width: 902px;
	padding: 0.5em 0 0.5em 228px;
	text-align: center;
}

#footerInner p,#footerInner p a {
	color: #FFFFFF;
	margin-bottom: 0.5em;
}

/* -------------------------------------------------------------- 
	PAGE STRUCTURE ELEMENTS
	Elements  such as logos, search bars, and any other design element repeated throughout the site, but doesn't effect the structural layout
----------------------------------------------------------- */
#logo {
	width: 698px;
	height: 145px;
	display: block;
	background: url(../images/design/logo.jpg) 0 0 no-repeat;
	position: absolute;
	top: 0;
	left: 247px;
	margin: 0;
	padding: 0;
	font-size: 1em;
}

#logo a {
	width: 698px;
	height: 145px;
	display: block;
	text-indent: -9999px;
}

/* -------------------------------------------------------------- 
	PAGE ELEMENT STYLES
----------------------------------------------------------- */
#todaysFlavors {
	float: left;
	width: 213px;
	padding-right: 15px;
	text-align: right;
}

#todaysFlavors h2 {
	background: url(../images/headers/todays-flavors.jpg) 0 0 no-repeat;
	float: right;
	height: 41px;
	text-indent: -9999px;
	text-align: left;
	display: block;
	width: 173px;
}

#todaysFlavors h3 {
	clear: both;
	color: #FFFFFF;
	font-size: 1.167em;
	font-weight: bold;
	margin-bottom: 0.5em;
}

#todaysFlavors ul {
	list-style: none;
	margin-right: 0;
	margin-bottom: 1.25em;
}

#todaysFlavors li {
	padding-left: 0;
}

#todaysFlavors {
	color: #FFFFFF;
}

#mainContent {
	background: url(../images/design/main-content-bg.jpg) 0 0 repeat-y;
	float: left;
	display: inline;
	width: 732px;
	margin-left: 228px;
}

body.home-page #mainContent {
	margin-left: 0;
}

#mainContentInner {
	background: url(../images/design/main-content-bottom-bg.jpg) 0 100%
		no-repeat;
	min-height: 500px; /* Alt style in ie6.css */
	padding: 20px 40px;
}

#mainContentTop {
	background: url(../images/design/main-content-top-bg.jpg) 0 0 no-repeat;
	min-height: 30px; /* Alt style in ie6.css */
	margin-bottom: 0;
}

#gallery {
	height: 265px;
	width: 732px;
	overflow: hidden;
}

body.weddings-page #gallery {
	width: 200px;
}

#gallery div {
	padding-left: 1px;
}

.orderMessage {
	background-color: #DAECF3;
	padding: 25px 25px 15px 25px;
	border: 1px solid #000000;
	margin-bottom: 2em;
}

.orderOnline {
	background-color: #DAECF3;
	padding: 25px 25px 15px 25px;
	border: 1px solid #000000;
	margin-bottom: 2em;
	text-align: center;
}

.orderOnline a {
	color: #000000;
	text-decoration: none;
	border-bottom: solid 2px #00A4E4;
}

.orderOnline h3 a:hover {
	color: #5A5A5A;
}

#bread {
	margin-bottom: 1.5em;
	padding-bottom: 1.5em;
	padding-right: 125px;
}

#bread img {
	float: right;
	margin-right: -125px;
}

.video {
	text-align: center;
	margin-bottom: 2em;
}

.event {
	margin-bottom: 2em;
}

.event h3 {
	margin-bottom: 0.25em;
}

.event h3 a {
	color: #DA9951;
}

.event p {
	margin-bottom: 0.5em;
}

/* -------------------------------------------------------------- 
	NAVIGATION
----------------------------------------------------------- */
#mainMenu {
	bottom: 0px; /* Alt Style in ie6.css */
	right: 0px;
	list-style: none;
	margin: 0;
	position: absolute;
}

#mainMenu li {
	display: block;
	float: left;
	margin-bottom: 0;
	padding: 0;
}

#mainMenu a {
	background: url(../images/design/navigation.jpg) 0 0 no-repeat;
	display: block;
	height: 76px;
	text-indent: -9999px;
	width: 92px;
}

/* CSS Sprite for Navigation */
#mainMenu li#home a {
	background-position: 0 -4px;
	height: 90px;
	width: 137px;
}

#mainMenu li#home a:hover {
	background-position: -1px -96px;
}

#mainMenu li#cupcakes a {
	width: 92px;
	background-position: -138px -4px;
}

#mainMenu li#cafe-menu a {
	width: 124px;
	background-position: -230px -4px;
}

#mainMenu li#catering a {
	width: 105px;
	background-position: -354px -4px;
}

#mainMenu li#weddings a {
	width: 105px;
	background-position: -459px -4px;
}

#mainMenu li#bread a {
	width: 85px;
	background-position: -564px -4px;
}

#mainMenu li#community a {
	width: 118px;
	background-position: -649px -4px;
}

#mainMenu li#directions a {
	width: 102px;
	background-position: -767px -4px;
}

#mainMenu li#cupcakes a:hover,#mainMenu li#cupcakes a.active {
	width: 92px;
	background-position: -138px -80px;
}

#mainMenu li#cafe-menu a:hover,#mainMenu li#cafe-menu a.active {
	width: 124px;
	background-position: -230px -80px;
}

#mainMenu li#catering a:hover,#mainMenu li#catering a.active {
	width: 105px;
	background-position: -354px -80px;
}

#mainMenu li#weddings a:hover,#mainMenu li#weddings a.active {
	width: 105px;
	background-position: -459px -80px;
}

#mainMenu li#bread a:hover,#mainMenu li#bread a.active {
	width: 85px;
	background-position: -564px -80px;
}

#mainMenu li#community a:hover,#mainMenu li#community a.active {
	width: 118px;
	background-position: -649px -80px;
}

#mainMenu li#directions a:hover,#mainMenu li#directions a.active {
	width: 102px;
	background-position: -767px -80px;
}

/* -------------------------------------------------------------- 
	TYPOGRAPHY
	Set any special typography here that isn't set in the typographic defaults section
----------------------------------------------------------- */
h1.header {
	display: block;
	text-indent: -9999px;
	height: 47px;
	width: 318px;
}

h1.welcome {
	background: url(../images/headers/welcome.jpg) 0 0 no-repeat;
	height: 49px;
	width: 319px;
}

h1.menu {
	background: url(../images/headers/cafemenu.gif) 0 0 no-repeat;
}

h1.catering {
	background: url(../images/headers/catering.gif) 0 0 no-repeat;
}

h1.weddings {
	background: url(../images/headers/weddings.gif) 0 0 no-repeat;
}

h1.bread {
	background: url(../images/headers/bread.gif) 0 0 no-repeat;
}

h1.community {
	background: url(../images/headers/community.gif) 0 0 no-repeat;
}

h1.tv {
	background: url(../images/headers/valentines-tv.gif) 0 0 no-repeat;
	width: 370px;
}

h1.directions {
	background: url(../images/headers/directions.gif) 0 0 no-repeat;
}

h1.street {
	background: url(../images/headers/cupcake_street_view.gif) 0 0 no-repeat
		;
	width: 340px;
	margin-top: 1em;
}

h1.map {
	background: url(../images/headers/cupcake_map.gif) 0 0 no-repeat;
	margin-top: 1em;
}
h1.bridalParty {
	background: url(../images/headers/bridal-party.gif) 0 0 no-repeat;
	margin-top: 1em;
	width: 560px;
}
h1.bridalFair {
	background: url(../images/headers/bridal-fair.gif) 0 0 no-repeat;
	margin-top: 1em;
	width: 372px;
}

p.price {
	color: #000080;
}

p.priceBread {
	color: #00A4E4;
}

/* -------------------------------------------------------------- 
	IMAGE ELEMENTS
----------------------------------------------------------- */
img.cupCake {
	position: absolute;
	top: 0;
	left: 0;
}

img.community {
	margin: 1em 2em;
}

	img.communityMoon {
		margin: 1em 2em 2em 14em;
	}
	
/* -------------------------------------------------------------- 
	LIGHTBOX ELEMENTS
----------------------------------------------------------- */
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}

#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}

#jquery-lightbox a img {
	border: none;
}

#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}

#lightbox-container-image {
	padding: 10px;
}

#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}

#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}

#lightbox-container-image-box>#lightbox-nav {
	left: 0;
}

#lightbox-nav a {
	outline: none;
}

#lightbox-nav-btnPrev,#lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}

#lightbox-nav-btnPrev {
	left: 0;
	float: left;
}

#lightbox-nav-btnNext {
	right: 0;
	float: right;
}

#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}

#lightbox-container-image-data {
	padding: 0 10px;
	color: #666;
}

#lightbox-container-image-data #lightbox-image-details {
	width: 70%;
	float: left;
	text-align: left;
}

#lightbox-image-details-caption {
	font-weight: bold;
}

#lightbox-image-details-currentNumber {
	display: block;
	clear: left;
	padding-bottom: 1.0em;
}

#lightbox-secNav-btnClose {
	width: 66px;
	float: right;
	padding-bottom: 0.7em;
}

/* -------------------------------------------------------------- 
	FORM ELEMENTS
----------------------------------------------------------- */
form table {
	border: 0;
	border-spacing: inherit;
}

form table td {
	border: 0;
	border-bottom: 5px solid #FFFFFF;
	padding: 3px;
}

table.menu td {
	text-align: center;
}

table.menu td label {
	text-align: left;
}

table.menu td .multipleSelection {
	font-weight: bold;
}

table.cupcake td {
	text-align: center;
}

table.cupcake td label {
	text-align: left;
}
table.cupcake .optionsColumn label {
	float: none;
	width: auto;
}

table.cupcake td .multipleSelection {
	font-weight: bold;
}

table.cupcake td .inputText {
	text-align: left;
}

table.cupcake td .comments {
	width: 300px;
	height: 100px;
	text-align: left;
	margin-right: 20px;
}

form table th {
	background: #f3ac5c;
	border: 0;
	border-bottom: 5px solid #FFFFFF;
	text-align: center;
}

legend {
	font-weight: bold;
}

/*
label {
	display: block;
	margin-bottom: 0.5em;
	font-weight: bold;
}

label em {
	color: #FF0000;
}

label span {
	font-weight: normal;
	font-style: italic;
}

.inputText {
	border: 1px solid #4BABDE;
	width: 175px;
}

.inputTextarea {
	border: 1px solid #4BABDE;
	width: 500px;
}
*/

.cupcake .inputText {
	border: 1px solid #4BABDE;
	width: 120px;
}

.fieldRequiredMark	{ color: #FF0000; margin-left: .5em; }

fieldset 			{ margin-bottom: 1.5em; padding: 1em 0; border-bottom: 1px dashed #617179; }
fieldset.last 		{ border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
legend 				{ font-weight: bold; }
label 				{ font: bold 0.917em arial, sans-serif; float: left; margin-right: 10px; width: 150px; }

.fieldArea 			{ margin-bottom: 0.833em; }
.fieldArea input,
.fieldArea textarea { width: 200px; border: 1px solid #4BABDE; }
.fieldArea textarea { height: 65px; border: 1px solid #4BABDE; }

input.protect		{ display: none; }

span.message { display: block; font-size: 0.833em; }
span.error { color: #DD0000; display: block; }
div.errors {
	background: #FEFAD9 url(../images/forms/bg_error.gif) 0 0 repeat-x;
	border: 1px solid #E0D75F;
	display: block;
	margin: 0 0 2em 0;
}
div.errorsInner {
	background: url(../images/forms/big_error.gif) 15px 1em no-repeat;
	padding: 1em 0 1em 80px;
}

.fieldArea input.firstName		{ width: 120px; }
.fieldArea input.lastName		{ width: 120px; margin-left: .5em; }
.firstNameLabel					{ margin-left: 200px; float: left; }
.lastNameLabel					{ margin-left: 100px; float: left; }

/* -------------------------------------------------------------- 
	MISC
----------------------------------------------------------- */
.floatLeft {
	float: left;
	margin: 0 1.5em 1.5em 0;
}

.floatRight {
	float: right;
	margin: 0 0 1.5em 1.5em;
}

.clearLeft {
	clear: left;
}

.clearRight {
	clear: right;
}

.clear {
	clear: both;
}

.first {
	margin-left: 0;
	padding-left: 0;
}

.last {
	margin-right: 0;
	padding-right: 0;
}

.top {
	margin-top: 0;
	padding-top: 0;
}

.bottom {
	margin-bottom: 0;
	padding-bottom: 0;
}

img.floatLeft {
	margin: 0 1.5em 1.5em 0;
}

img.floatRight {
	margin: 0 0 1.5em 1.5em;
}

/* ----------------
	CLEAR FLOATS WITHOUT EXTRA HTML MARKUP
	add this class to the element that needs to be cleared - This works in modern browser that support the after pseudo element
    ------------- */
.group:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* -------------------------------------------------------------- 
	Twitter Bird	
----------------------------------------------------------- */
a.twitter { height: 40px; width: 205px; display: block; position: absolute; bottom: -53px; /* ie6.css */ left: 246px; z-index: 25; }


/* -------------------------------------------------------------- 
	Ordering
----------------------------------------------------------- */
.orderSummary tr.odd td {
}
.orderSummary td {
	border-top: 1px dashed #CCC;
	border-bottom: 0;
}
.orderSummary tr.row_0 td,
.orderSummary tr.orderSummaryChoice td {
	border-top: 0;
}
.orderSummaryChoiceName {
	padding-left: 2em;
}
.priceCell {
	font-weight: bold;
	text-align: right;
}
.orderTotal {
	clear: both;
	float: right;
}
.orderTotalLabel {
	font-weight: bold;
}
.orderTotalValue {
	display: block;
	float: right;
	text-align: right;
	width: 70px;
}
.total {
	font-size: 1.2em;
	font-weight: bold;
}

/* -------------------------------------------------------------- 
	Weddings
----------------------------------------------------------- */
.wedding {float: left; margin-right: .85em;}
.weddingLast {float: left; margin-right: 0;}

.tcBridal { float: left; display: inline-block; padding: 20px 0;   }
.magazine { float: right;  display: inline-block; padding: 20px 0;   }


/* -------------------------------------------------------------- 
	Community
----------------------------------------------------------- */

.bridalPartyPics img {margin: 0 1.9em 1.9em 0;}



/* -------------------------------------------------------------- 
	Cafe Menu
----------------------------------------------------------- */
table.cafeMenu {border: none; width: 500px; }
	.cafeMenu th, .cafeMenu tr, .cafeMenu td {border: none; background-color: #FFFFFF; }
	.cafeMenu th, .cafeMenu td {padding-right: 15px; padding-left: 0;}