/* CSS Document */

/************************
	Global Variables 
**************************/

body {
	background-color:#FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	margin: 0px;
	padding: 0px;
	text-align:center;
	}
html>body {
	text-align:left;
	}
	
form {
	margin:0px;
	padding:0px;
	}

.friend {
width: 150px;
height:20px;
position:absolute;
margin-left:420px;
margin-top:275px;
z-index:3;
}

.sweetP{
	color:#7F5619;
	}
.biscuit{
	color:#F26F90;
	}

.jam{
	color:#919295;
	}

.and {
	color:#FDBB30;
	}
.link {
color:#7F5619;
}

a:link {
color:#7F5619;
}

a:visited{
color:#999999;
}

a:active, a:hover  {
color:#F26F90;
text-decoration: underline;
}

div#clear {
	clear:both;
	}
	
	
div#footer {
	width: 771px;
	height:35px;
	margin-left:4px;
	font-size:10px;
	border-bottom:1px solid #000000;
	text-align:center;
	padding-bottom:5px;
	}
.footer a: {
text-decoration: none;
}	

.footer a:hover{
color:#F26F90;
}

img, #logo { behavior: url(http://www.sweetpeabiscuitandjam.com/css/iepngfix.htc); }

div#quote{
background-color:#FCE0A5;
width:129px;
height: auto;
margin-left:14px;
margin-top:9px;
margin-bottom:0px;

}
html>body div#quote{
margin-left:14px;
margin-top:10px;
}

div#FFF{
background-color:#CCCCCC;
width:129px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-decoration:none;
height: auto;
margin-left:14px;
margin-top:9px;
margin-bottom:0px;

}
html>body div#FFF{
margin-left:14px;
margin-top:10px;
}


div#FFF-internal{
background-color:#CCCCCC;
width:129px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-decoration:none;
height: auto;
margin-left:14px;
margin-top:10px;
margin-bottom:0px;
}



div#quote-internal {
	width: 129px;
	height: auto;
	margin-top:10px;
	margin-bottom: 0px;
	margin-left:14px;
	background-color:#FCE0A5;
	}
	
div#quoteText{
padding-left: 4px;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
}

.crumbs {
font-size:12px;
}

div#pad {
width:575;
height:15px;
}
/************************************
INTERNAL RETAIL PAGE TEMPLATE CONTENT
************************************/

/*adds shadow background to whole page*/
div#container {
	background-image:url(../images/graphics/sbj_gi_bg_shadow.jpg);
	margin: 0px auto;
	width:779px;
	height:auto;
	background-repeat:repeat-y;
	text-align:left;
	}
	
/**************************************
             MASTHEAD
***************************************/
div#header-logo {
	width:129px;
	height:130px;
	margin-left: 14px;
	margin-top:10px;
	float:left;
	display:inline;
	}
	
div#header {
	margin-top:10px;
	width:628px;
	height:130px;
	float:left;
	}

div#nav {
	width:628px;
	height:61px;
	background-color:#FCE0A5;
	float:left;
	}

	
div#header-tagline {
	margin-top:21px;
	width:526px;
	height:48px;
	float:left;
	}


/*Sign that floats right*/
div#ui-sign {
	width: 102px;
	height:69px;
	float:left;
	}


/*home, my account, Shopping cart/Bag */
div#nav-internal {
	width:628px;
	height: 33px;
	}


div#nav-internal-left {
	width: 294px;
	height:33px;
	float:left;
	}

div#search-internal {/*IE 6 hack for INTERNAL pages displaying the search box Template pages*/	
	padding-left:22px;
	background-image:url(../images/graphics/sbj_uiSearchArea.gif);
	width: 232px;
	height:33px;
	float:left;
	}
	
html>body div#search-internal {	
	padding-left:22px;
	width: 210px;
	}
	
div#search {/*IE 6 hack for EXTERNAL pages displaying the search box Template pages*/	
	padding-left:22px;
	background-image:url(../images/graphics/sbj_uiSearchArea.gif);
	width: 210px;
	height:33px;
	float:left;
	}
	
html>body div#search {	
	padding-left:22px;
	width: 210px;
	}

	
div#form-container{
	width:141px;
	margin-top:7px;
	float:left;
	}


/*bottom of sign*/
div#nav-internal-right {
	width:102px;
	height:33px;
	float: left;
	}

div#nav-external {
	width:628px;
	height:28px;
	}
	
/*end of Masthead*/


/***************************
	SIDE NAVBAR INTERNAL
****************************/
div#nav-sidebar-internal {
	width: 129px;
	height: auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin-top:0px;
	margin-bottom:0px;
	margin-left:14px;
	background-color:#F9BECD;
	}


.nav-sidebar-text a {
	text-decoration:none;
	color:#000000;
	}
	
/**********************************
BEGIN COLAPSABLE NAVIGATION MENU
*********************************/

/* .mC is the Menu Container*/
.mC {
	width:129px;
	}

/* .mH is the perminantly displayed header*/
.mH {
	margin-left:4px;
	font-family:Arial, Helvetica, sans-serif;
	cursor:pointer;
	text-decoration:none;
	font-size:12px;
	color:#000000;
	}
.mH a:link{
color:#000000;
}	

.mH a:visited {
color:#000000;
}

/* .mL is the list of menu items, and display: none means they will be hidden when first displayed*/
.mL {
	display:none;
	margin-bottom:10px;
	color:#919295;
}

/* .mO defines each of the options within each menu. display:block is needed here since links
normally display inline and we want each link on a separate line. The left margin indents the e
ntries slightly from the headings.*/
.mO {
	margin-left:15px;
	display:block;
	font-size:12px;
	cursor:pointer;
	color:#919295;
	text-decoration:none;
	}

/*Rollovers for menu list items*/


a.mO:link{
	color:#919295;	
	}
	
a.mO:hover {
	color:#F26F90; 
	text-decoration:underline; 
	}

/* end of Collapsable Side Navigation Menu*/



/*****************************
SBJ.com Template pages only!!
*****************************/


/* this div is for sbj.com side navigation only*/
div#nav-sidebar-external {
	width: 129px;
	padding:0px;
	height: auto;
	margin-left:7px;
	margin-top:10px;
	background-color:#F9BECD;
	float: left;
	}

html>body div#nav-sidebar-external {
	margin-left:14px;
	margin-top:11px;
	}
	
div#content-main {
	width:550px;
	margin-top: 15px;
	margin-left:20px;
	float:left;
	}
/*end template page*/


/***************************
	SIZING CHART
*****************************/

.content-sizingchart {
	width:555px;
	height:325px;
	background-color:#FDBB30;
	padding:5px;
	margin-top:10px;
	}
	
.jewelry {
background-color:#F26F90;
height:116px;
}	
	
.header-sizing {
	width:555px;
	height:30px;
	background-color:#FCE0A5;
	font-size:18px;
	font-weight:bold;
	color:#7F5619;
	padding-top:5px;
	text-align:center;
	}
.jewelry-header {
background-color:#F9BECD;
color:#000000;
}	

.subheader-jewelry {
	width:555px;
	height:20px;
	background-color:#D7D7D7;
	font-size:12px;
	text-align:center;
	padding-top:5px;
	color:#000000;
	margin-top:2px;
	}
		
.subheader-dog {
	width:305px;
	height:25px;
	background-color:#FCE0A5;
	font-size:12px;
	font-weight:bold;
	text-align:center;
	padding-top:5px;
	color:#7F5619;
	margin-top:5px;
	float:left;
	}

.subheader-sizing {
	width:247px;
	height:25px;
	background-color:#FCE0A5;
	font-size:12px;
	font-weight:bold;
	color:#7F5619;
	text-align:center;
	padding-top:5px;
	margin-top:5px;
	margin-left:3px;
	float:left;
	}			
	
.sub-subheader-sizing {
	width:80px;
	height:20px;
	font-size:12px;
	font-weight:bold;
	color:#7F5619;
	text-align:center;
	padding-top:5px;
	border-bottom:3px solid #FDBB30;
	}
		
.content-sizing {
	width: 80px;
	height:29px;
	font-size: 12px;
	text-align:center;
	color:#7F5619;
	padding-top:15px;
	border-bottom:2px solid #FDBB30;
	}
	
.content-sizing2 {
	width: 80px;
	height:31px;
	font-size: 12px;
	text-align:center;
	color:#7F5619;
	padding-top:12px;
	}	
	
.photo-sizing {
	margin-top: 5px;
	float:left;
	}

.content-apparel-text{
	width:80px;
	height:247px;
	margin-top:5px;
	margin-left:3px;
	background-color:#FCE0A5;
	float:left;
	}

/*End sizing Chart*?


/*****************************
	INDEX PAGE
*******************************/
div#indexC {
	margin: 50px auto;
	width:779px;
	height: 556px;
	}


div#indexLogo {
	margin:0 auto;
	width:481px;
	}
/*End landing page content*/

/****************************
		WHOLESALE PAGES 
*****************************/
.whbg{
	background-color:#988675;
	font-size:12px;
	padding: 0px;
	margin:0px;
	}

div#whHomeC {
	margin:0px auto;
	width:779px;
	background-image:url(../images/graphics/sbj_whBackS.gif);
	}

div#whAboutC {
	margin:0px auto;
	width:779px;
	height:887px;
	background-image:url(../images/graphics/sbj_whBackS.gif);
	}


div#whPageC {
	margin-left: -50px;
	width: 615px;
	padding-top: 50px;
	}
	
html>body div#whPageC {
	width: 605px;
	margin-left:41px;
	padding-top: 50px;
	}
	
div#whTextC {
	width: 605px;
	margin-top: 5px;
	text-align:left;
	}

div#whTextC2{
	width: 570px;
	margin-top:15px;
	margin-left: 10px;
	}
	

html>body>div#whTextC2{
	width: 570px;
	margin-top:15px;
	margin-left: 0px;
	}	

div#whPhotoC{
	width: 500px;
	margin-left: 50px;
	margin-bottom: 39px;
	}

div#whLogoC{
	width: 405px;
	height: 294px;
	margin-left: 50px;
	margin-bottom: 39px;
	}
	
html>body div#whLogoC{
	margin-left: 200px;
	}	
	
div#retailLink {
width:214px;
height:200px;
position:absolute;
margin-left: -100px;
}

html>body div#retailLink {
margin-left:15px;
margin-right:0px;
}	

.whNavC{
	width: 605px;
	height: 13px;
	padding-bottom:15px;
	margin: 0px auto;
	font-size: 12px;
	}

div#whMeetC{
	width: 363px;
	background-color:#F0E4D6;
	border:18px solid #FFFFFF;
	margin-left:50px;
	margin-bottom:39px;
	}

div#meetC-external {
	width: 363px;
	background-color:#F0E4D6;
	margin-left:100px;
	padding-bottom:15px;
	border:18px solid #7F5619;
	}	

div#whMeetH{
	width: 363px;
	height:67px;
	background-color:#EFE4D6;
	}

.whMascotC{
	width: 360px;
	height: 169px;
	border:2px solid #FDBB30;
	margin-bottom:10px;
	}

.mascotC-external{
	width: 350px;
	height: 173px;
	border:2px solid #FDBB30;
	margin-bottom:10px;
	margin-left:7px;
	}
	
.whMascotT{
	width: 225px;
	height:159px;
	float: left;
	margin-left:10px;
	margin-top:10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:100;
	}
	
	.mascotT-external{
	width: 215px;
	height:159px;
	float: right;
	margin-left:10px;
	margin-top:10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:100;
	}

.Fleft{
	float:left;
	}

div#whFormC{
	width:555px;
	text-align:left;
	border: 2px solid #988675;
	padding-left: 25px;
	padding-top:1px;
	}
	
html>body>div#whFormC{
	width:580px;
	text-align:left;
	border: 2px solid #988675;
	padding-left: 25px;
	padding-top:1px;
	}	

	
/********************************
	RETAIL HOMEPAGE CONTENT
*********************************/
div#homeC {
	width: 532px;
	height: 581px;
	margin: 0 auto;
	text-align:left;
	}

div#mainC {
	background-image: url("../images/graphics/sbj_colorBlocks.gif");
	background-repeat:no-repeat;
	width: 532px;
	height: 519px;
	}

div#navC {
	background-color:#FCE0A5;
	width: 532px;
	height: 61px;
	}
	

div#searchBox {
	width:147px;
	height:33px;
	padding-top:8px;
	background-image:url(/images/graphics/sbj_uiSearchArea.gif);
	float:left;
	}
	
html>body div#searchBox {
	padding-top:5px;
	height:28px;
}	
	
.searchBox input{
	font-size:11px;
	}


#logo {
	width:200px;
	height:206px;
	position:absolute;
	background-image:url(/images/graphics/sbj_homeLogoT.png);
	}


div#catchPhr {
	width:411px;
	height: 61px;
	position: absolute;
	top: 40px;
	margin-left:123px;
	}


div#subNav{
	width:150px;
	height:150px;
	position:absolute;
	margin-top:360px;
	margin-left:5px;
	}
	
	
.subnav a{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	cursor:pointer;
	text-decoration:none;
	}
	
.subnav a:hover {
text-decoration:underline;
}

div#sign {
	width:114px;
	height:134px;
	position:absolute;
	margin-left:420px;
	margin-top:72px;
	}


div#product1{
	width: 115px;
	height:124px;
	position:absolute;
	margin-left:200px;
	margin-top:109px;
	}


div#product2 {
	width:147px;
	height:168px;
	position:absolute;
	margin-top:207px;
	margin-left:30px;
	top: 21px;
	}


div#product3 {
	width:89px;
	height:168px;
	position:absolute;
	margin-top:205px;
	margin-left:350px;
	z-index:2;
	}

div#product4 {
	width:232px;
	height: 183px;
	position:absolute;
	margin-top:325px;
	margin-left:200px;
	z-index:1;
	top: 49px;
	}
	
div#home-footer{
	width: 532px;
	height: 23px;
	font-size:12px;
	text-align:center;
	}
	
/*End retail home page content*/


/*****************************
	DEPARTMENTAL HEADERS
********************************/

div#deptC{
	width: 565px;
	height:302px;
	border: 1px solid #DADADA;
	}

div#deptPhoto{
	width: 365px;
	height:300px;
	float: left;
	}

div#deptDesc{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:18px;
	padding-top:150px;
	width:167px;
	height: 150px;
	float: left;
	text-align:center;
	}
	
div#deptBorders img{
border: 1px solid #000000;
width:100px;
height:100px;
}	
/*End departmental headers*/


/***************************
DETAIL ITEM PAGE LAYOUT
*****************************/
div#Box {
	width: 550px;
	height:auto;
	}

div#breadcrumbs {
	font-size: 11px;
	width: 550px;
	height: 15px;
	margin-top: 10px;
	margin-bottom:30px;
	}

div#photoBox {
	width:138px;
	height:160px;
	float: left;
	}

div#infoBox {
	width: 405px;
	height: 160px; 
	float: right;
	}

div#title{
	width: 550px;
	height:25px;
	margin-bottom:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	font-weight: bold;
	}

div#photo {
	width:138px;
	height:138px;
	border:1px solid #000000;
	}

div#enlarge {
	width: 140px;
	height: 19px;
	margin-top:3px;
	padding-left: 40px;
	font-size:12px;
	}

html>body div#enlarge {
	width: 100px;
	margin-top:3px;
	padding-left: 40px;
	}	

div#lgDescript {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	width: 405px;
	height: 110px;
	}

div#attributes {
	width: 112px;
	height: 40px;
	float:left;
	padding-left: 2px;
	padding-top: 10px;
	}

div#price {
	width: 180px;
	height: 40px;
	padding-top: 10px;
	padding-left: 10px;
	font-weight: bold;
	float: right;
	}

div#notes {
	width:550px;
	height: 50px;
	margin-top: 15px;
	font-style: italic;
	text-align: center;
	}

/**********************************************
Begin Accessories section in Detail Item Layout
***********************************************/
div#accessories {
	margin-top: 30px;
	width:550px;
	height:450px;
	}

div#accesPhotos img{
	background-image: url("../images/graphics/sbj_dropShadow.png");
	background-position: right 3px bottom 3px;
	width: 80px;
	height:80px;
	border: 1px solid #000000;
	}

.accesTitle {
	width:80px;
	height: 15px;
	text-align: center;
	}
	
html>body .accesTitle {
	margin-bottom:75px;
	}
/*End accesories section*/
/*End detail item page layout*/
/**************************************************
			COMING SOON
*************************************************/

div#container-cs {
	width:500px;
	margin-left:100px;
	}	
			
.h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: bold;
}