﻿/* CSS Document */

/*------------------------------------------------------------*/
/* JELLYBELLY.COM COLOR GUIDE                                 */ 
/*                                                            */
/* All color styles shall follow swatches listed below        */
/*                                                            */
/* DkBlue (FONT Main Color)                                   */
/* #005687                                                    */
/*                                                            */
/* Black (FONT Use very sparingly if at all)                  */
/* #000                                                       */
/*                                                            */
/* White (FONT)                                               */
/* #FFF                                                       */
/*                                                            */
/* Red (FONT)                                                 */
/* #890300                                                    */
/*                                                            */
/* Gray (FONT)                                                */
/* #7B7B7B                                                    */
/*                                                            */
/* LtBlue                                                     */
/* #90B6CD                                                    */
/*                                                            */
/* Dark Blue DIV Background                                   */
/* #D8E9F1                                                    */
/*                                                            */
/* Light Blue DIV Background                                  */
/* #CFE0EB                                                    */
/*                                                            */
/* Light Blue DIV Border                                      */
/* #E1E1E1                                                    */
/*                                                            */
/* Logo Red (Non-font)                                        */
/* #EB0011                                                    */
/*                                                            */
/*------------------------------------------------------------*/     
/*                                                            */
/* All font styles shall follow the format as listed below    */
/* and shall follow shorthand rule                            */
/*                                                            */
/* FontName/Size/Weight-Italic/Color/Variant/LineHeight/Deco  */
/* e.g. .verdana12BoldDkBlue                                  */
/* or   .verdana14Gray                                        */
/* or   .verdana10Italic                                      */
/*                                                            */
/* The following font colors are acceptable:                  */
/* DkBlue (default), Gray, Red, Black                         */
/*------------------------------------------------------------*/

h1{
font:bold 18px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

h2{
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana9Red{
font:9px Verdana, Arial, Helvetica, sans-serif;
color:#890300;
} 

.verdana9RedUnderline{
font:9px Verdana, Arial, Helvetica, sans-serif;
text-decoration:underline;
color:#890300;
} 

.verdana9DkBlue{
font:9px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana9DkBlueNoUl{
font:9px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
text-decoration:none;
}

.verdana10DkBlue{
font:10px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana10DkBlueUnderline{
font:10px Verdana, Arial, Helvetica, sans-serif;
text-decoration:underline;
color:#005687;
}


.verdana10BoldDkBlue{
font:bold 10px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana10Red{
font:10px Verdana, Arial, Helvetica, sans-serif;
color:#890300;
}

.verdana12Red{
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#890300;
}

.verdana12BoldRed{
font:bold 12px Verdana, Arial, Helvetica, sans-serif;
color:#890300;
}

.verdana11DkBlue{
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana11Red{
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#890300;
}

.verdana11BoldDkBlue{
font:bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana11BoldDkBlueNoUL{
font:bold 11px Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
color:#005687;
}

.verdana11DkBlueFooter{
font:11px Verdana, Arial, Helvetica, sans-serif;
line-height:18px;
color:#005687;
}

.verdana11GrayFooter{
font:11px Verdana, Arial, Helvetica, sans-serif;
line-height:18px;
color:#7B7B7B;
}

.verdana12DkBlue{
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana12DkBlue_ProdDesc{
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
text-align:justify;
}

.verdana12DkBlueNoUL{
font:12px Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
color:#005687;
}

.verdana12BoldDkBlue{
font:bold 12px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana13DkBlue{
font:13px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana13BoldDkBlue{
font:bold 13px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana14DkBlue{
font:14px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana14BoldDkBlue{
font:bold 14px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.verdana17BoldDkBlue{
font:bold 17px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.highlight{
padding:4px;
background:#FFFFCC;
}

/*------------------------------------------------------------*/
/* DIV CLASSES                                                */
/*------------------------------------------------------------*/
body {
margin: 0px 0px 0px 0px;
background:#FFF url(../Images/bg.jpg) fixed top repeat-x;
}

.mainContainer{
width:980px;
background:#FFF url('../Images/headerImages/header_Divider_Background.png') no-repeat right top;
border:#707070 solid 1px;
border-top:0px;
}

.mainContentContainer{
width:900px; 
padding:40px; 
text-align:left;
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}


.content{
position:relative;
width:980px;
height:100%;
background:url(../Images/pageBG.png) top repeat-x;
}
.clearFix{clear:both;}
.trigger{position:absolute; left:99999px;}

.contentBody{
position:relative;
float:right;
width:830px;
height:580px;
}

.productBoxContent{
width:665px;
background:#FFF;
border:1px solid #E1E1E1;
border-top:0;
border-bottom:0;
}

.headerDiv{
position:relative;
width:980px;
height:160px;
}
   
.headerTable1{
position:absolute;
width: 674px;
right:5px;
text-align:left;
padding-top:5px;
margin-left: 23px;
}

.headerTable2{
position:absolute;
top:55px;
right:37px;
width: 674px;
text-align:left;
padding-top:5px;
}
.logoDiv{
position:relative;
float:left;
width:269px;
height:170px;
}

.candyNav{
width:980px;
height:10px;
text-align:left;
}

.navMenu{
float:left; 
width:225px; 
margin-top:0px; 
margin-bottom:40px;
}

.navMenuContent{
position:relative;
background:url(../Images/navMenuImages/menuBG.gif) repeat-y;
float:right; 
width:225px; 
color:#005687;
font: 12px Trebuchet, Verdana, Arial, Helvetica, sans-serif;
text-align:left;
line-height:14px;
}

.masterBanner{
width:100%; padding:7px 0px 6px 0px; 
background:#FFFFCC url(../Images/bannerSpecialBG.png) top left no-repeat; 
border-bottom:#425f80 solid 1px; 
text-align:center; 
font-family:Verdana; 
font-size:12px;
line-height:18px; 
color:#005687;
}

.div1pxKnockoutCaps{/* Make sure to include <img src="1px.gif" /> in DIV */
height:1px; 
background:url(../Images/divs/topNbottom.gif) left no-repeat;
text-align:right;
}

.div1pxKnockoutBody{
border:#035688 solid 1px;
border-top:0px;
border-bottom:0px;
padding:10px;
}

.div1pxKnockoutCapsLtBlue{/* Make sure to include <img src="1px.gif" /> in DIV */
height:1px; 
background:url(../Images/divs/topNbottom_LightBlue.gif) left no-repeat;
text-align:right;
}

.div1pxKnockoutBodyLtBlue{
border-left: 1px solid #EAF2F5;
border-right: 1px solid #EAF2F5;
border-top: 0px;
border-bottom: 0px;
background: #f4f9fd;
padding: 10px;
margin-top: 0px;
}

.divEmphasis{
border:#f6f6f6 solid 2px;
background:#fcfdff;
}

.footer1{
width:980px;
height:150px;
background:url(../Images/footerImages/footer_UpperBG.png) top no-repeat;
border-top:#E2E3E5 solid 1px;
text-align:left;
}

.footer2{
width:980px;
height:160px;
background:url(../Images/footerImages/footer_LowerBG.png) top no-repeat;
border-top:#E9EBEA solid 1px;
font:11px Verdana, Arial, Helvetica, sans-serif;
line-height:15px;
color:#7B7B7B;
text-align:left;
}

.footer3
{
display:none;
width:980px;
height:80px;
border-top:#E9EBEA solid 1px;
font:11px Verdana, Arial, Helvetica, sans-serif;
line-height:15px;
color:#7B7B7B;
text-align:left;
background:url(../Images/footerImages/newsletter_signup.png) top no-repeat;
}


.shadow{
position:absolute;
z-index:0;
width:1020px;    
height:100%;
background:url(../bodyBGShad.png) repeat-y; 
}
 

.ourCandyDropDown{
position:absolute; 
z-index:6; 
float:left; 
width:672px; 
height:250px; 
background:url(../Images/headerImages/dropDownImages/dropDownBG.jpg) repeat-x; 
top:58px; 
left:0px; 
border:#E1E1E1 solid 1px; 
border-top:0px;
}

.ourShopDropDown{
position:absolute; 
z-index:6; 
float:left; 
width:672px; 
height:250px; 
background:url(../Images/headerImages/dropDownImages/dropDownBG.jpg) repeat-x; 
top:58px; 
left:3px; 
border:#E1E1E1 solid 1px; 
border-top:0px;
}

.ourShopDropDownAdvert{
width:652px;
margin:10px;
}

.ourShopDropDownLinks{
text-align:left;
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.ourCandySiteDropDown{
position:absolute;
z-index:6;
width:201px;
background:#c7dde9 url(../Images/headerImages/dropDownImages/ourCandyNav_Bg.jpg) left top no-repeat;
top:24px;
left:40px;
border-bottom:#D6D6D6 solid 1px; 
font:bold 10px Verdana, Arial, Helvetica, sans-serif;
line-height:15px;
color:#005687;
text-align:left;
}

.searchResultProductsImg{
position:relative;
width:180px;
height:180px;
border:#EEE solid 1px;
}

.searchResultProductDesc{
position:relative;
width:180px;
font:10px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
}

.shortDescMain{
    position:relative;
    width:90%;
    text-align:left;
    top: 0px;
    left: 0px;
}

.shortDescInner{
    position:relative;
    margin-top:5px;
    height:100px;
    padding:10px;
    border:#EAF2F5 1px solid;
    background:#fcfdff;
}
.shortDescDesc{
    position:relative;
    float:left;
    width:65%;
    font:12px Verdana, Arial, Helvetica, sans-serif;
    color:#005687;
 }
 
.shortDescPic{
    position:relative;
    float:right;
}

.shortDescLink{
    position:absolute;
    height:100%;
    width:100%;
    z-index:1;
    background:url(.../Images/clickForMore.gif) 99999px 0 no-repeat;
    top: 0px;
    left: 0px;
}

.shortDescLink a:hover
{
    position:absolute; 
    height:100%;
    width:100%; 
    z-index:1;
    background:url(../Images/clickForMore.gif) right 3px no-repeat;
}


.recipeBody
{
 position:relative;
 width:980px;   
 text-align:left;
 
}
.recipeCard
{
    position:relative;
    left:0px;
    width:600px;
    padding:20px 0px 40px 30px;
}
.recipeContainer{
    position:relative;
    width:600px;
    font:12px Verdana, Arial, Helvetica, sans-serif;
    color:#005687;
    line-height:19px;
}
.recipeContainerTab{
    position:relative;
    width:600px;
    height:30px;
    font:bold 12px Verdana, Arial, Helvetica, sans-serif;
    color:#005687;
    text-align:left;
    background:url(../Images/recipes/tab.png) no-repeat;
}
.recipeContainerContent{
    position:relative;
    width:558px;
    border:#E3E3E3 solid 1px;
    border-top:0px;
    padding:10px 20px 10px 20px;
    text-align:left;
    background:#FFF;
}
.recipeTitle
{
    position:relative;
    width:370px;
    top:8px;
    left:10px;
}

.navbarFAQ
{
  background: #fcfdff;

}   


.pagerButton
{
font:bold 12px Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
color:#005687;
border-style:none;
background-color:Transparent;
cursor: pointer;
}

.requiredField
{
	font:bold 12px Verdana, Arial, Helvetica, sans-serif;
	color:#890300;
}

input[disabled='disabled']
{
font:bold 12px Verdana, Arial, Helvetica, sans-serif;
color:GrayText;
border-style:none;
background-color:Transparent;
cursor:default;
}

.cvvDiv{
position:absolute;
z-index:1;
width:350px;
top:255px;
left:470px;
font:bold 10px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
text-align:left;
padding:10px;
border:#e3e3e3 solid 1px;
background:#FFFDDD;
}

/*prevents the flashing of the panel when initially loading on the page*/
.collapsiblePanelNonFlashing
{
	overflow: hidden;
	height: 0;
}

.handCursor
{
    cursor:hand;
}

.phoneNum{
padding-left:18px;
background:url(../Images/phone_icon.gif) left no-repeat;
}

.promoMenuTopCat{
padding:10px 20px 20px 12px; 
font:bold 12px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
text-decoration:none;
}

.promoMenuTopCat a:link{
color:#005687;
text-decoration:none;
}

.promoMenuTopCat a:visited{
color:#005687;
text-decoration:none;
}

.promoMenuTopCat a:active{
color:#005687;
text-decoration:none;
}

.promoMenuTopCat a:hover{
color:#005687;
text-decoration:underline;
}

.promoMenuTop10{
padding:20px;
font:bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#005687;
text-decoration:none;
}

.promoMenuTop10 a:link{
color:#005687;
text-decoration:none;
}

.promoMenuTop10 a:visited{
color:#005687;
text-decoration:none;
}

.promoMenuTop10 a:active{
color:#005687;
text-decoration:none;
}

.promoMenuTop10 a:hover{
color:#005687;
text-decoration:underline;
}
#GiftSelect {
	height:382px;
	display:block;
	width:392px;
	background:url("http://jellybelly.cachefly.net/MyJellyBelly/forJB/MyJellyBelly_com.jpg") no-repeat;
	text-decoration: none;
}

#GagSelect {
	height:382px;
	display:block;
	width:392px;
	background:url("http://jellybelly.cachefly.net/MyJellyBelly/forJB/MyBeanBoozled_com.jpg") no-repeat;
	text-decoration: none;
}


#GiftMeter {
	float:left;
	width:431px;
	height:110px;
	display:block;
	background:url("http://jellybelly.cachefly.net/MyJellyBelly/forJB/Gift_Meter.png") no-repeat;
	background-position: 0px;
	text-decoration: none;
}


#goog-wm { }
#goog-wm h3.closest-match { }
#goog-wm h3.closest-match a { }
#goog-wm h3.other-things { }
#goog-wm ul li { }
#goog-wm li.search-goog { display: block; }
                            
                            
.toggler {
text-align:left;
position:relative;
background-color:#fff;
font:bold italic 14px Verdana, Arial, Sans-Serif;
color:#FFF;
cursor:pointer;
}

#toggler a:hover{
background-color:#fff;
text-decoration:underline;
}

.togglerInsert{
text-align:left;
padding:3px 0px 3px 10px;
position:relative;
background:#222;
font:bold italic 19px Verdana, Arial, Sans-Serif;
color:#FFF;
border-bottom:#111 solid 1px;
}

.element{
position:relative;
text-align:justify;
padding:15px;
font:10px Verdana, Arial, Sans-Serif;
color:#005687;
background:#fff;
border:#64a0b6 solid 1px;
border-width:0px 1px 0px 1px;
height:150px;
overflow:hidden;
display:none;
}

.element a{
color:#005687;
}

/* ######  FIND YOUR CANDY PAGE ######*/
.fyc_menu_container{position:relative; width:980px; height:300px; margin-top:20px; background:url(http://jellybelly.cachefly.net/promotions/cupcakeChallenge/findYourCandy.png);}
.fyc_menu{position:absolute; width:600px; left:0px; bottom:30px; font:13px 'Trebuchet MS', Arial, Helvetica, sans-serif;}
.fyc_menu ul li{
float:left;
list-style:none; 
padding:10px 25px 0 0; 
}
.fyc_menu ul li a{
color:#005687;
}
.fyc_anchorBlock{    
background:url(http://jellybelly.cachefly.net/promotions/cupcakeChallenge/fyc_anchorblock_bg.gif)repeat-x top;width:850px;text-align:center; border:#888 solid 1px; font:12px 'Trebuchet MS', Arial, Helvetica, sans-serif; padding:10px; display:block; margin:30px 0px 30px 0px;
}
.fyc_anchorBlock a{    
color:#005687;
text-decoration:none;
}

/* TOOLTIPS */
a.info{
    position:relative; /*this is the key*/
    position:absolute; right:50px; color:#F00; font:bold 11px Trebuchet MS, Helvetica, Verdana, Arial, Sans-Serif;}

a.info:hover{z-index:25; background-color:#ff0; cursor:pointer;}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    padding:10px;
    bottom:2em; width:15em;
    border:1px solid #F00;
    background-color:#fff; color:#000;
    text-align:justify;}
    
    /* SEARCHSIDE */
div.siteMapContainer {
	float: left;
	padding: 10px;
	width: 290px;
}
div.siteMapContainer h2 {
	margin: 2px 0;
}
div#IndexFooterContainer {
	height: 75px;
	margin: 0 auto 20px;
	text-align: center;
	padding: 10px;
	width: 960px;
}
div#IndexFooter {
	cursor: pointer;
}
div#IndexFooterList {
	display: none;
}
div#IndexFooterList ul {
	list-style: none;
	list-style-type: none;
	margin: 0;
}
div#IndexFooterList li {
	display: inline;
	float: left;
	line-height: 18px;
}
ul.siteMapList, ul.siteMapList li ul {
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0 0 0 14px;
}
ul.siteMapList li {
	line-height: 22px;
}
ul.siteMapList a, div#IndexFooter span.indexLink, div#IndexFooterList a {
	color: #005687;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 11px;
	padding: 4px;
	text-decoration: none;
}
div#IndexFooterList a {
	padding: 2px 4px;
}
ul.siteMapList a:hover, div#IndexFooter span.indexLink:hover, div#IndexFooterList a:hover {
	background-color: #d6effd;
}



/* PAYPAL */
#ctl00_jBCCMainMasterContentPlaceHolder_payPalImageButton{width:200px;height:33px;background:#fff url(../Images/checkoutImages/button_PayPal.png) no-repeat top;}
#ctl00_jBCCMainMasterContentPlaceHolder_payPalImageButton:hover{background-position:bottom;}

#ctl00_jBCCMainMasterContentPlaceHolder_ctl00_paymentControl_payPalImageButton{width:200px;height:33px;background:#fff url(../Images/checkoutImages/button_PayPal.png) no-repeat top;}
#ctl00_jBCCMainMasterContentPlaceHolder_ctl00_paymentControl_payPalImageButton:hover{background-position:bottom;}

/* paypal in header */
.paypalHeader{position:absolute;width:155px;height:17px;top:145px;right:65px;background:url(http://jellybelly.cachefly.net/Jelly-Belly/OtherImages/paypal.png)no-repeat;}

/* CREDIT CARD */
#ccTrigger{width:200px;height:33px; display:block; background:#FFF url(../Images/checkoutImages/button_CreditCard.png) no-repeat top;}
#ccTrigger{cursor:pointer;background-position:bottom;}


