/* RESET CSS */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 font-weight: inherit;
 font-style: inherit;
 font-size: 100%;
 font-family: inherit;
 vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
 outline: 0;
}
body {
 line-height: 1;
}
ol, ul {
 list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
 border-collapse: separate;
 border-spacing: 0;
}
caption, th, td {
 text-align: left;
 font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
 content: "";
}
blockquote, q {
 quotes: "" "";
}

/* GLOBAL */

html, body {
	background-color: #fff;
	margin: 24px 0 0 0;
	padding: 0;
	text-align: center;
	font: .9em Arial, sans-serif;
	color: #4e2e2c;
}
a:link { 
	color: #666; 
	text-decoration: none; 
}
a:visited { 
	color: #666;
	text-decoration: none;  
}
a:hover { 
	color: #ff0000;
	text-decoration: none; 
}
a:active {
	color: #ff0000;
	text-decoration: none;  
}
img { border: 0; }

h1 { }
h2 {
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 4px;
	color: #000;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix { display:inline-block; }
* html .clearfix { height:1%; }
.clearfix { display:block; }
.clear { clear:both; }

a.mo:hover {
	opacity: .8;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
}

/* LAYOUT */

#wrapper {
	width: 780px;
	margin: 0 auto;
}
#header {
	background: url(graphics/headerBG.jpg) top center no-repeat;
	height: 149px;
	width: 780px;
	margin: 0 auto;
}
.logo {
	float: left;
	width: 320px;
	display: inline;
}
.logo h1 {
 	text-indent: -9999px;
	margin: 40px 0 0 34px;
}
.logo h1 a {
	background: url(graphics/sweetmarcel_logo.png) no-repeat left top;
	height: 72px;
	width: 305px;
	text-indent: -9999px;
	display: block;
 	overflow: hidden;
 	cursor: pointer;
}
.tagline {
	padding: 10px 0 0 60px;
}
.bug {
	float: left;
	width: 320px;
	display: inline;
	text-align: right;
	margin: -30px 0 0 95px;
}
#container {
	background: url(graphics/contentBG.jpg) top center no-repeat;
	height: 333px;
	margin: 0 auto;
	width: 780px;
	text-align: center;
}
#container p {
	margin-top: 14px;
}
.mainphoto {
	border-top: 1px solid #ae9a82;
	border-bottom: 1px solid #ae9a82;
}
#content {
	height: 250px;
	margin: 0 10px 0 36px;
	background: url(graphics/transBG.jpg) no-repeat;
}
.textbox {
	float: left;
	width: 410px;
	display: inline;
	padding: 20px 20px 0 20px;
	text-align: left;
	position: relative;
}
.textbox2 {
	width: 410px;
	padding: 20px 20px 0 20px;
	text-align: left;
	position: relative;
}
.textbox_frame {
	padding: 20px 20px 0 20px;
	text-align: left;
	position: relative;
}
a.button {
	background: #96004b;
	padding: 4px;
	color: #fff;
	font-size: 85%;
	text-transform: uppercase;
}
a.button:hover {
	background: #4e2e2c;
}
.prodphoto {
	float: right;
	width: 263px;
	display: inline;
	text-align: right;
}
.proddesc {
	width: 430px;
	height: 190px;
	overflow: auto;
	float: left;
}
.click {
	text-align: right;
	margin: 8px 50px 0 0;
}
.subnav {
	height: 18px;
	margin: 0 10px 0 36px;
	background: #3b2220;
}
.subnav ul {
	margin: 0;
	padding: 0;
	width: 430px;
}
.subnav ul li {
	display: inline;
	float: left;
	list-style: none;
	padding: 3px 14px 0 14px;
	margin: 0;
	font-weight: normal;
	color: #fff;
	font-size: 75%;
	text-transform: uppercase;
}
.subnav ul li a {
	display: block;
	float: left;
	height: 18px;
	position: relative;
	overflow: hidden;
	color: #fff;
}
.subnav ul li a:hover {
	color: #cc9c4a;
}
.subnav ul li.item1 {
	padding-left: 24px;
}
#footer {
	width: 670px;
	margin: 0 auto;
}
.foottext {
	font-size: 90%;
	margin-top: 24px;
}

/* SLIDER BAR */

.scroll-pane {
	width: 470px;
	height: 220px;
	overflow: auto;
	float: left;
}
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #ddd5bf;
}
.jScrollPaneDrag {
	position: absolute;
	background: #aba595;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}

/* LIGHTBOX */

#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;	
}

/*  NAVIGATION */

#navbar {
	width: 671px;
	height: 26px;
	background: url(graphics/navsprite.gif) 0 0 no-repeat; 
	position: relative;
}
#navbar li {
	position: absolute;
	top: 0;
	text-indent: -9000px;
}
#navbar li a {
	display: block;
	height: 26px;
}
#nav_line { left: 0; }
#nav_line a { width: 62px; }
#nav_line a:hover, body.line #nav_line a { background: url(graphics/navsprite.gif) 0 -26px no-repeat; }

#nav_designer { left: 82px; }
#nav_designer a { width: 96px; }
#nav_designer a:hover, body.designer #nav_designer a { background: url(graphics/navsprite.gif) -82px -26px no-repeat; }

#nav_store { left: 198px; }
#nav_store a { width: 70px; }
#nav_store a:hover, body.store #nav_store a { background: url(graphics/navsprite.gif) -198px -26px no-repeat; }

#nav_retailer { left: 289px; }
#nav_retailer a { width: 68px; }
#nav_retailer a:hover, body.retailer #nav_retailer a { background: url(graphics/navsprite.gif) -289px -26px no-repeat; }

#nav_contact { left: 378px; }
#nav_contact a { width: 52px; }
#nav_contact a:hover, body.contactr #nav_contact a { background: url(graphics/navsprite.gif) -378px -26px no-repeat; }

#nav_twitter { left: 498px; }
#nav_twitter a { width: 77px; }
#nav_twitter a:hover, body.twitter #nav_twitter a { background: url(graphics/navsprite.gif) -498px -26px no-repeat; }

#nav_facebook { left: 609px; }
#nav_facebook a { width: 62px; }
#nav_facebook a:hover, body.facebook #nav_facebook a { background: url(graphics/navsprite.gif) -609px -26px no-repeat; }

/* FORM STYLES */

#form {
	text-align: center;
	width: 300px;
	height: 190px;
	padding-top: 60px;
	margin: 0 auto;
}
#form label {
 float: left;
 width: 80px;
 margin-right: 12px;
 font-weight: bold;
}
#form input, #form textarea {
 margin-bottom: 5px;
 clear: right;
}
#form textarea {
 width: 250px;
 height: 100px;
}
#form select.formSelect {
 margin-bottom: 5px;
}
input.radio {
 display: inline;
 width: 12px;
 border: none;
 background: #fff;
}
#form .formfield {
 padding-bottom: 4px;
 clear: left;
}
#form .boxes{
 width: 1em;
}
#submitbutton {
 margin-left: 24px;
 margin-top: 12px;
 width: 90px;
 padding: 6px;
 color: #fff;
 background: #96004b;
 border: none;
}
#submitbutton:hover {
 color: #fff;
 cursor: pointer;
 background: #4e2e2c;
}


iframe#ifrm { 
 width:100%;
 height:200px;
}
