/* --- body default values --- */

body {
	margin:0;
	padding:0;
	background:url(../images/bg.gif) repeat;
	font:62.5% Arial, Helvetica, sans-serif;
	color:#3e2e17;
}

.bold {
	font-weight:bold;
}

.underline {
	text-decoration:underline;
}

.italicize {
	font-style:italic;
}

.boldAndUnderline {
	font-weight:bold;
	text-decoration:underline;
}

.boldAndItalicize {
	font-weight:bold;
	font-style:italic;
}

.italicizeAndUnderline {
	font-style:italic;
	text-decoration:underline;
}

.centerAnItem {
	text-align:center;
}

a:link {
	color:#3b4dc7;
	text-decoration:underline;
}

a:visited {
	color:#3b4dc7;
	text-decoration:underline;
}

a:hover {
	color:#ad5c1a;
	text-decoration:none;
}

a:active {
	color:#ad5c1a;
	text-decoration:none;
}

.floatRight {
	float:right;
	margin-left:10px;
}

.floatLeft {
	float:left;
	margin-right:10px;
}

.rightAlign {
	margin:-35px 0 10px 0;
	text-align:right;
}

.clearFloat {
	clear:both;
	margin:0;
	padding:0;
	height:0;
}

/* this hides navigation / sitemap link so that it only displays in mobile devices */
#navHandheld {
	display:none;
}

/* this hides footer info that only displays when printing */
#contactInfoForPrint {
	display:none;
}

/* eliminates extra bottom margin pixels added to images by Firefox and Safari */
img.displayBlock {
	display:block;
}

/* eliminates default borders on images that are links */
img {
	border:none;
}

.handCursorIcon {
	cursor:pointer;
}

/* this class should be used on a div to put some vertical space such as after the last paragraph */
.verticalSpacer {
	margin:0;
	padding:0 0 20px 0;
}

/* acronyms, abbreviations -- changes cursor -- be sure to have a title attribute that provides the meaning of the acronym or abbreviation */
acronym {
	border-bottom:1px dotted #666;
	cursor:help;
}

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

/* REMINDER:the total width of a <div> will include the padding and border in addition to the width specified in the CSS so adjust the width attribute if adjusting the padding and border attributes -- i.e. reduce width if increasing padding and/or border width sizes and vice versa */

/* main container that contains all other elements below */
#wrapper {
	margin:0 auto; /* the auto margins (in conjunction with a width) center the page */
	padding:0 1px;
	width:980px;
	border-left:1px solid #bacca3;
	border-right:1px solid #bacca3;
}

#masthead {
	position:relative;
	width:980px;
	height:136px;
	background:url(../images/masthead.gif) no-repeat;
}

#masthead h1 {
	margin:0;
	padding:14px 93px 0 0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.8em;
	font-weight:normal;
	color:#FFFFFF;
	text-align:right;
}

#socialMediaIcons {
	position:absolute;
	width:300px;
	bottom:50px;
	right:85px;
	text-align:right;
}

#specialsTopBanner {
	position:absolute;
	width:300px;
	bottom:10px;
	right:89px;
	text-align:right;
}

#topNav {
	width:980px;
	height:26px;
	background:#0b1ea1;
}

/* --- homepage main section --- */

#bodyUpperContainerHomepage {
	padding:20px 20px 0 20px;
	background:#FFFFFF url(../images/homepage-topfern-bg.jpg) no-repeat top right;
}

#flashContainerHomepage {
	float:left;
	width:556px;
	height:370px;
	_display:inline; /* this is an IE6 hack to fix the floated double-margin problem */
}

#bodyTextHomepage {
	float:right;
	margin:0 0 0 20px;
	width:364px;
}

#bodyTextHomepage h1 {
	margin:0 0 15px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.8em;
	font-weight:normal;
}

#bodyTextHomepage .headingText {
	margin:0 0 15px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.8em;
}

#bodyTextHomepage p {
	margin:0 0 15px 0;
	padding:0;
	font-size:1.2em;
	line-height:160%;
}

#bodyLowerContainerHomepage {
	padding:0 20px 0 20px;
	background:#FFFFFF url(../images/homepage-bottomferns-bg.jpg) no-repeat bottom right;
}

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

/* --- five sections on homepage --- */

#fiveSectionsContainerHomepage {
	margin:0 0 0 13px;
}

#fiveSectionsContainerHomepage .oneSectionHomepage {
	float:left;
	margin:0 20px;
	width:142px;
	_display:inline; /* this is an IE6 hack to fix the floated double-margin problem */
}

#fiveSectionsContainerHomepage .oneSectionHomepage img {
	border:none;
}

#fiveSectionsContainerHomepage .oneSectionHomepage p {
	margin:0;
	font-size:1.2em;
	line-height:130%;
}

#fiveSectionsContainerHomepage .oneSectionHomepage .oneSectionBox {
	min-height:80px;
}

#fiveSectionsContainerHomepage .oneSectionHomepage p.bigTextLink {
	font-size:1.6em;
	text-align:right;
}

#fiveSectionsContainerHomepage .oneSectionHomepage p.bigTextLink a:link {
	color:#633979;
	text-decoration:none;
}

#fiveSectionsContainerHomepage .oneSectionHomepage p.bigTextLink a:visited {
	color:#633979;
	text-decoration:none;
}

#fiveSectionsContainerHomepage .oneSectionHomepage p.bigTextLink a:hover {
	color:#d4894c;
	text-decoration:none;
}

#fiveSectionsContainerHomepage .oneSectionHomepage p.bigTextLink a:active {
	color:#d4894c;
	text-decoration:none;
}

#fiveSectionsContainerHomepage .verticalDividerHomepage {
	float:left;
	width:1px;
	height:174px;
	background:url(../images/vertical-divider-homepage.gif);
}

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

/* --- internal page main section --- */

#bodyContainerInternalPage {
	background:#FFFFFF url(../images/internal-page-main-section-bg.gif) repeat-y;
}

#bodyContainerTopLeftSideBg {
	background:url(../images/left-section-top-bg.gif) no-repeat top left;
}

#bodyContainerBottomLeftSideBg {
	background:url(../images/left-section-bottom-bg.jpg) no-repeat bottom left;
}

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

/* --- internal page left section --- */

#bodyLeftSideContainer {
	padding:20px 25px 29px 29px;
	float:left;
	width:267px;
	_display:inline; /* this is an IE6 hack to fix the floated double-margin problem */
}

#bodyLeftSideContainer .subheadingTextLeftSide {
	margin:0 0 7px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.5em;
	line-height:120%;
}

#bodyLeftSideContainer .bigText {
	margin:0 0 7px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.2em;
	line-height:140%;
}

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

/* --- internal page left side boxes can be used for side nav links or other content --- */

#bodyLeftSideContainer .leftSideBoxTopBg {
	width:267px;
	height:10px;
	background:url(../images/left-side-box-top-bg.gif) no-repeat;
	_margin:0;
	_padding:0;
	_display:block;
}

#bodyLeftSideContainer .leftSideBox {
	padding:0 15px 0 15px;
	width:237px;
	background:url(../images/left-side-box-bg.gif) repeat-y;
}

#bodyLeftSideContainer .leftSideBox .subheadingTextLeftSideBox {
	margin:0 0 7px 0;
	padding:0 0 5px 0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.5em;
	line-height:120%;
	background:url(../images/left-side-box-subheading-divider.gif) no-repeat bottom;
}

#bodyLeftSideContainer .leftSideBox p {
	margin:0;
	padding:0;
	font-size:1.2em;
	line-height:140%;
}

#bodyLeftSideContainer .leftSideBoxBottomBg {
	margin:0 0 20px 0;
	width:267px;
	height:37px;
	background:url(../images/left-side-box-bottom-bg.gif) no-repeat;
}

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

/* --- internal page left side banners - rollovers without using javascript --- */

#shopOnlineBanner {
	width:267px;
	height:84px;
	background:url(../images/banner-shop-online.gif) no-repeat bottom left;
}

#shopOnlineBanner a:link, #shopOnlineBanner a:visited {
	display:block;
	width:267px;
	height:84px;
	background:url(../images/banner-shop-online.gif) no-repeat bottom left;
}

#shopOnlineBanner a:hover, #shopOnlineBanner a:active {
	background-position:bottom right;
}

#giftCertificatesBanner {
	margin:0 0 30px 0;
	width:267px;
	height:78px;
	background:url(../images/banner-gift-certificates.gif) no-repeat bottom left;
}

#giftCertificatesBanner a:link, #giftCertificatesBanner a:visited {
	display:block;
	width:267px;
	height:78px;
	background:url(../images/banner-gift-certificates.gif) no-repeat bottom left;
}

#giftCertificatesBanner a:hover, #giftCertificatesBanner a:active {
	background-position:bottom right;
}

#requestAppointmentBanner {
	margin:0 0 10px 0;
	width:203px;
	height:30px;
	background:url(../images/banner-request-appointment.gif) no-repeat bottom left;
}

#requestAppointmentBanner a:link, #requestAppointmentBanner a:visited {
	display:block;
	width:203px;
	height:30px;
	background:url(../images/banner-request-appointment.gif) no-repeat bottom left;
}

#requestAppointmentBanner a:hover, #requestAppointmentBanner a:active {
	background-position:bottom right;
}

#callPhoneNumber {
	margin:0;
	padding:6px 0 3px 38px;
	width:203px;
	height:30px;
	background:url(../images/banner-call-phone-number.gif) no-repeat left top;
	color:#7e658d;
	font-size:1.5em;
}

#VIPTextMessageSpecialsBanner {
	margin:0 0 10px 0;
	width:203px;
	height:30px;
	background:url(../images/banner-vip-text-message-specials.gif) no-repeat bottom left;
}

#VIPTextMessageSpecialsBanner a:link, #VIPTextMessageSpecialsBanner a:visited {
	display:block;
	width:203px;
	height:30px;
	background:url(../images/banner-vip-text-message-specials.gif) no-repeat bottom left;
}

#VIPTextMessageSpecialsBanner a:hover, #VIPTextMessageSpecialsBanner a:active {
	background-position:bottom right;
}

#eNewsletterSpecialsBanner {
	margin:0 0 30px 0;
	width:203px;
	height:30px;
	background:url(../images/banner-e-newsletter-specials.gif) no-repeat bottom left;
}

#eNewsletterSpecialsBanner a:link, #eNewsletterSpecialsBanner a:visited {
	display:block;
	width:203px;
	height:30px;
	background:url(../images/banner-e-newsletter-specials.gif) no-repeat bottom left;
}

#eNewsletterSpecialsBanner a:hover, #eNewsletterSpecialsBanner a:active {
	background-position:bottom right;
}

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

/* --- internal page right section --- */

#bodyRightSideContainer {
	padding:20px;
	float:right;
	width:619px;
}

#bodyRightSideContainer h1 {
	margin:10px 0 15px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.8em;
	font-weight:normal;
}

#bodyRightSideContainer h2 {
	margin:10px 0 15px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.6em;
	font-weight:normal;
}

#bodyRightSideContainer h3 {
	margin:10px 0 15px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.4em;
	font-weight:normal;
}

#bodyRightSideContainer .subheadingTextRightSide {
	margin:0 0 7px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.5em;
	line-height:120%;
}

#bodyRightSideContainer p {
	margin:0 0 15px 0;
	padding:0;
	font-size:1.2em;
	line-height:160%;
}

#bodyRightSideContainer p.footnote {
	margin:0 0 15px 0;
	padding:0;
	font-size:1.1em;
	line-height:130%;
}

#bodyRightSideContainer ul {
	margin:0 0 15px 30px;
	padding:0;
	list-style-type:square;
}

#bodyRightSideContainer ul li {
	margin:0 0 0 20px;
	padding:0;
	list-style-type:square;
	font-size:1.2em;
	line-height:160%;
}

#bodyRightSideContainer ul li ul {
	margin:0 0 0 30px;
	padding:0;
	list-style-type:square;
}

#bodyRightSideContainer ul li ul li {
	margin:0 0 0 20px;
	padding:0;
	list-style-type:square;
	font-size:1em;
	line-height:160%;
}

#bodyRightSideContainer ol {
	margin:0 0 15px 33px;
	padding:0;
}

#bodyRightSideContainer ol li {
	margin:0 0 0 20px;
	padding:0;
	font-size:1.2em;
	line-height:160%;
}

#bodyRightSideContainer ol li ol {
	margin:0 0 0 33px;
	padding:0;
}

#bodyRightSideContainer ol li ol li {
	margin:0 0 0 20px;
	padding:0;
	font-size:1em;
	line-height:160%;
}

#bodyRightSideColumn1 {
	float:left;
	margin:0 29px 0 0;
	width:390px;
	_display:inline; /* this is an IE6 hack to fix the floated double-margin problem */
}

#bodyRightSideColumn2 {
	float:right;
	width:200px;
}

#bodyRightSideContainer table.general {
	border-collapse:collapse;
	width:100%;
}

#bodyRightSideContainer table.general tr td {
	padding:0 10px 10px 0;
	vertical-align:top;
}

#bodyRightSideContainer table.general tr td p {
	margin:0 0 5px 0;
	line-height:120%;
}

#bodyRightSideContainer table.generalWithBorder {
	border-collapse:collapse;
	width:100%;
	border:1px solid #c3c3e5;
}

#bodyRightSideContainer table.generalWithBorder tr td {
	padding:10px 10px 5px 10px;
	vertical-align:top;
}

#bodyRightSideContainer table.generalWithBorder tr td p {
	margin:0 0 5px 0;
	line-height:120%;
}

#bodyRightSideContainer table.treatments {
	border-collapse:collapse;
	width:100%;
}

#bodyRightSideContainer table.treatments tr td {
	padding-bottom:30px;
	vertical-align:top;
}

#bodyRightSideContainer table.treatmentPrices {
	margin:0 0 0 20px;
	border-collapse:collapse;
}

#bodyRightSideContainer table.treatmentPrices tr td {
	padding:0 10px 5px 5px;
	vertical-align:top;
}

#bodyRightSideContainer table.treatmentPrices tr td p {
	margin:0 0 5px 0;
	line-height:120%;
}

#bodyRightSideContainer .extrasContainer {
	float:right;
	margin:0 0 0 20px;
	width:200px;
}

#bodyRightSideContainer .extrasContainerTopPart {
	padding:0 0 0 15px;
	background:url(../images/vertical-divider-top-part-internal-page.gif) no-repeat top left;
}

#bodyRightSideContainer .extrasContainerTopPart .subheadingExtrasContainerTopPart {
	margin:0 0 7px 0;
	padding:0;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.5em;
	line-height:120%;
}

#bodyRightSideContainer .extrasContainerTopPart p {
	margin:0;
	padding:0 0 8px 0;
	font-size:1.2em;
	line-height:140%;
}

#bodyRightSideContainer .extrasContainerBottomPart {
	padding:0 0 0 15px;
	width:200px;
	height:40px;
	background:url(../images/vertical-divider-bottom-part-internal-page.gif) no-repeat top left;
}

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

/* first footer section with contact info */
#footer {
	padding:10px 0 0 0;
	width:980px;
	height:30px;
	font-family:"Century Gothic", Futura, Arial, Helvetica, sans-serif;
	font-size:1.5em;
	color:#bacca3;
	text-align:center;
	background:#145b12 url(../images/footer-flower-icon.gif) no-repeat bottom left;
}

/* --- second footer section with bottom text and nav links --- */

#footer2 {
	padding:0 0 15px 0;
	color:#3e2e17;
	background:#FFFFFF url(../images/footer2-bg.gif) repeat-x;
}

#footer2 a:link {
	color:#3e2e17;
	text-decoration:none;
}

#footer2 a:visited {
	color:#3e2e17;
	text-decoration:none;
}

#footer2 a:hover {
	color:#3e2e17;
	text-decoration:underline;
}

#footer2 a:active {
	color:#3e2e17;
	text-decoration:underline;
}

#footer2 .footer2Text {
	padding:8px 0 0 0;
	text-align:center;
}

#footer2 .footer2Divider {
	padding:8px 0;
	width:980px;
	height:1px;
}

#footer2 .footer2Left {
	float:left;
	padding:10px 0 5px 20px;
	width:900px;
	_display:inline; /* this is an IE6 hack to fix the floated double-margin problem */
}

#footer2 .footer2Left ul {
	margin:0 0 2px 0;
	padding:0;
	list-style-type:none;
}

#footer2 .footer2Left ul li {
	display:inline;
	padding:0 10px;
	background:url(../images/bottom-nav-divider.gif) no-repeat 0 50%;
}

/* this class is assigned to the first bottom nav link "li" on each "ul" to get rid of the "|" divider for that link */
#footer2 .footer2Left ul li.firstLink {
	padding:0 10px 0 0;
	background:none;
}

#footer2 .footer2Right {
	float:right;
	padding:10px 20px 5px 0;
	text-align:right;
}

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

/* --- form field attributes --- */

#submissionForm {
	margin:10px 0 40px 0;
	padding:20px;
	border:1px solid #c3c3e5;
}

#submissionForm iframe {
	border:1px solid #c3c3e5;
	width:550px;
	height:150px;
}

#name, #firstname, #lastname, #address, #city, #phone, #email, #appt, #giftcertificate, #person, #dateofevent, #numberofguests, #budget {
	margin:3px 0;
	padding:3px;
	width:200px;
	font-size:1.1em;
	color:#3e2e17;
	border:1px solid #c3c3e5;
}

#state, #zip, #expdate, #amount, #ccdigits, #cvc {
	margin:3px 0;
	padding:3px;
	width:80px;
	font-size:1.1em;
	color:#3e2e17;
	border:1px solid #c3c3e5;
}

#cctype {
	margin:3px 0;
	padding:2px;
	width:200px;
	font-size:1.1em;
	color:#3e2e17;
	border:1px solid #c3c3e5;
}

#submissionForm table tr td #spamcode {
	margin:0;
	padding:0;
	border:1px solid #c3c3e5;
}

#security_code {
	margin:0;
	padding:3px;
	width:100px;
	font-size:1.1em;
	color:#3e2e17;
	border:1px solid #c3c3e5;
}

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