@import "/styles/style.css"; 

/*
TO CHANGE STORE COLORS:

CHOOSE FOUR COLORS, 
1. ONE DARK HUE 
2. ONE SLIGHTLY DARKER HUE (TO SERVE AS A BORDER)
3. ONE LIGHT HUE
4. ONE SLIGHTLY DARKER HUE THAN THE LIGHT HUE (TO SERVE AS A BORDER)

CURRENT:
1. #B4B8D1 -DARK HUE
2. #00245D -SLIGHTLY DARKER HUE THAN THE DARK
3. #FFEBA4 -LIGHT HUE
4. #FFE04F -SLIGHTLY DARKER HUE THAN THE DARK

FIND AND REPLACE THOSE FOUR COLORS WITH YOUR OWN PALETTE.

*/

/*OPTIONAL COMPONENTS*/

.hide,
#webnetwork,
#store_links,
#header #MainMenu,
#footer #poweredby,
#footer #footermenu,
#footer #copyright{display: none;}

html,
body{
  font: 12px Arial, Helvetica, Sans-Serif;
  color: black;
  padding: 0px;
  margin: 0px;
}

#marquee{
  float: left;
  top: 0;
  left: 0;
  position: absolute;
}

#container{
  float: left;
  left: 50px;
  position: relative;
  width: 710px;
  background: url(../../../images/css/background_content.gif) repeat-y;
}

form,
input{
  padding: 0px;
  margin: 0px;
}

.indent{
  margin-left: 20px;
}

.Padded{
  margin: 10px;
}

a{
  color: #B4B8D1;
  text-decoration: none;
}

a:hover{
  background: none;
  text-decoration: underline;
}

h1{
  padding: 10px;
  margin: 0px;
  font: 28px Arial, Helvetica, sans-serif;
  background: #F8F8F8;
  color: #00245D;
}

h3{
  font: 23px Arial, Helvetica, sans-serif;
  padding: 5px 0px;
  margin: 0px;
  color: #B4B8D1;
}

h4{
  padding: 5px;
  margin: 0px;
  background: #CCCCCC;
  font: bold 12px Arial, Helvetica, Sans-Serif;
  color: black;
  text-align: center;
}

h6{
  font: bold 15px Arial, Helvetica, sans-serif;
  padding: 5px 0px;
  margin: 0px;
  color: #B4B8D1;
}

td{
  vertical-align: top;
}

p{
  padding: 0px 0px 10px;
  margin: 0px;
}

/*POPUP*/

#popupContainer{
  height: 100%;
  margin: 0px auto;
  background: white;
}

/*HEADER*/

#header{
  float: left;
  background: none;
  height: 120px;
  background: url(../../../images/css/background_short.gif) repeat-x;
}

#header #BrandingArea{}

#header #search{
  background: none;
}

/*SITEMENU-OPTIONAL*/

#SiteMenu{
  float: left;
  width: 480px;
  margin: 10px 0px 0px;
}

#SiteMenu ul{
  float: left;
  padding: 0px;
  margin: 0px;
}

#SiteMenu ul li{
  display: inline;
  list-style: none;
  padding: 2px 5px 5px 10px;
}

#SiteMenu ul li a{
  color: #999;
  font: bold 11px Arial, Helvetica, sans-serif;
}

/*CART-OPTIONAL*/

#ShoppingCartLink{
  float: left;
  margin: 10px 0px 0px;
}
#ShoppingCartLink a{
  color: #999;
  font: bold 11px Arial, Helvetica, sans-serif;
}

#MiniCart{
  float: left;
  padding: 0px 0px 0px 15px;
  margin: 10px 0px 0px;
  color: #ccc;  
  font: bold 11px Arial, Helvetica, sans-serif;
}

#Header1_MiniCartTotal_lblItemCount,
#Header1_MiniCartTotal_lblSubTotal{
  color: #ccc;
}


/* START HOMEPAGE TAGS */

#HomeTable{
  padding: 0px;
  margin: 0px;
  width: 710px;
}

/*CONTENT NARROW-EQUIVALENT*/

#NavColumn,
#navcolumn,
#HomeColumn1{
  width: 145px;
  margin: 0px;
  padding: 0px;
  padding: 5px 5px 5px 15px;
}


/*CONTENT WIDE-EQUIVALENT*/

#ContentColumn{
  vertical-align: top;
  width: 515px;
  padding: 5px 0px 5px 5px;
}


/*MAINCONTENT-CONTAINER-DIRECT CHILD OF CONTENT WIDE*/

#maincontent{
  float: left;
  width: 515px;
}

#HomeColumn2{
  float: left;
  width: 540px;
  display: inline;
}

#page_name{
  width: 505px;
  height: 75px;
  margin: 0px;
  position: relative;
  display: block;
}

#HomepageSample1,
#HomePageSample2{
  float: left;
  width: 510px;
  padding: 15px;
}

#HomeColumn3{
  display: none;
}

/* #page is used by pages without a sidebar */

#Page{
  width: 100%;
  padding: 0px;
  margin: 0px;
}

#Page #maincontent{
  float: left;
  width: 630px;
  padding: 15px;
}

/* END HOMEPAGE TAGS */


/*CATEGORIES*/

.CategoryList,
.SearchBoxForm,
.MailingListSignupForm{
  float: left;
  background: white;
  border: 1px solid #F9F9F9;
  padding: 1px;
  margin: 0px 0px 5px;
  font-size: 11px;
  color: black;
  width: 145px;
}

.CategoryListContent{
  float: left;
  width: 145px;
}

.CategoryListContent ul{
  padding: 0px;
  margin:0px;
  list-style: none;
}

.CategoryListContent ul li{
  margin: 0px;
  display: block;
  float: left;
  background: #F9F9F9;
}

.CategoryListContent ul li span{}

.CategoryListContent ul li a{
  color: black;
  text-decoration: none;
  display: block;
  padding: 4px 5px 4px 10px;
  width: 130px;
  background: #F9F9F9;
  border-bottom: dashed 1px #DDD;
}


/*ACTIVE CATEGORY*/

.CategoryListContent ul li .CurrentCategory{}

.CategoryListContent ul li .CurrentCategory a{
  background: #B4B8D1;
  color: white;
  font-weight: bold;
}


/*OTHER CATEGORY*/

.CategoryListContent ul li .OtherCategory a:hover{
  color: #00245D;
  background: #FFEBA4;
}


/*SUBCATEGORIES*/

.CategoryListContent ul li ul li a{
  background: #F0F0F0;
  color: #B4B8D1;
}

.CategoryListContent ul li ul li a:hover{
  background: #FFEBA4;
  color: #B4B8D1;
}


/*SEARCH BOX*/

.SearchBoxFormContent{
  padding: 5px 5px 5px 10px;
  background: #F9F9F9;
}

.FormInput,
.FormInputError{
  padding: 2px;
  margin: 2px 0px;
  font: 11px Arial, Helvetica, sans-serif;
  border: 1px solid #CCC;
  background: white;
  color: #333;
  width: 90px;
  float: left;
}

.FormInputError{
  border-color: 1px solid red;
}


/* START BREADCRUMB TAGS */

#BreadCrumbs{
  padding: 5px 10px;
  margin: 0px;
  font: 11px Arial, Helvetica, sans-serif;
  background: #ECECEC;
  color: #666;
  border: 1px solid #CCC;
  border-right: none;
  border-left: none;
  border-top: 3px solid #B4B8D1;
}

.BreadCrumbTrailSpacer{}

.BreadCrumbTrailNoLink{
  font-weight: bold;
  color: #00245D;
}

#BreadCrumbs a{
  color: #666;
  text-decoration: none;
}

#BreadCrumbs a:hover{
  color: #B4B8D1;
}


/*CATEGORY PAGE*/

#CategoryListHeader{}

#CategoryListHeader #LayoutTable{
  width: 100%;
  font-size: 11px;
}


/*SORT BAR*/

#RecordsFound,
#Pager,
#Sorter{
  background: #ECECEC;
  height: 20px;
  border-top: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
  padding: 3px 0px;
  margin: 0px 0px 5px;
  text-align: left;
}

#lblPager,
#lblPager a{
  color: #B4B8D1;
}

#lstSort{
  font: 11px Arial, Helvetica, sans-serif;
  color: black;
}

#Sorter{}

#Records{
  width: 520px;
  padding: 0px 4px 20px;
  background: white;
}


/*PRODUCT PAGE*/

#ProductPageContainer{
  width:520px;
}

#ProductPageImageColumn{
  text-align:center;
  width: 165px;
  padding: 15px 5px 5px;
  background: #FAFAFA;
  border-right: 1px solid #CCC;
}
#ProductPageImageColumn img{
  padding: 0px 0px 3px;
}

#ProductImage{}

#ProductPageContentColumn{
  padding: 10px 10px 0px;
  font: 12px Arial, Helvetica, sans-serif;
}

#ProductPageContentColumn h1{
  font-size: 22px;
  background: none;
  border: none;
  color: #B4B8D1;
  width: 275px;
  display: block;
  padding: 10px 0px;
}

#lblName{}

#ProductDescription{
  padding: 10px;
  margin: 20px 0px;
  background: #F8F8F8;
  border: 1px solid #CCC;
}

#lblDescription{
  display: block;
  margin: 0px;
  padding: 0px 3px 0px 0px;
  height: 125px;
  overflow: auto;
  line-height: 16px;
}

#ProductProperties{}

#ProductProperties ul{
  margin: 10px 0px 0px;
  list-style-type: none;
  color: #333;
}
#ProductProperties ul li{
  margin: 0px 0px 10px;
}

.ProductPropertyLabel{
  color: #B4B8D1;
  font-weight: bold;
}

#ProductProperties ul ul{
  margin: 5px 0px 0px 50px;
  list-style-type: disc;
}

#ProductControls{
  background: #F8F8F8;
  border: 1px solid #CCC;
  text-align: center;
  padding: 5px 0px 0px;
}

#ProductControls .DiscountText,
#ProductControls .SitePrice,
#ProductControls .ListPrice{
  color: black;
}

#ProductControls .YouSave,
#ProductControls .SitePriceDiscounted{
  color: red;
}

#ProductControls .SitePriceDiscounted, 
#ProductControls .YouSave{
  background: none;
  border: none;
  padding: 0px;
  display: block;
}

#ProductControls table td{
  padding: 5px;
}

#ProductReviews, #ProductReviewNew{
  margin: 20px 0px 10px 0px;
}

#ProductReviews h3{
  padding: 5px;
  margin: 0px 0px 5px;
  font: bold 14px Arial, Helvetica, Sans-Serif;
  color: white;
  text-align: center;
  background: #B4B8D1;
  border: 1px solid #00245D;
}

.ProductReviewRating{
  color: #B4B8D1;
}

.ProductReview{
  margin: 10px 10px 15px 10px;
}

.ProductReviewKarma{
  color:#666;
}


/*NAV COLUMN - SUBSTITUTES CATEGORIES COLUMN, DISPLAYS LINKS TO YOUR ACCOUNT*/

.NavColumnBlock{
  float: left;
  background:#F9F9F9;
  padding: 0px 0px 15px;
  margin: 0px 0px 5px;
  font-size: 11px;
  color: black;
  width: 145px;
}

.NavColumnBlock ul{
  float: left;
  padding: 0px;
  margin: 0px;
  list-style: none;
}

.NavColumnBlock ul li{
  float: left;
  padding: 0px;
  margin: 0px;
  display: block;
}

.NavColumnBlock ul li a{
  color: black;
  display: block;
  padding: 4px 5px 4px 10px;
  width: 130px;
  background: #F9F9F9;
  border-bottom: dashed 1px #DDD;
  text-decoration: none;
}

.NavColumnBlock ul li a:hover{
  background: #FFEBA4;
  color: #B4B8D1;
}

.NavColumnBlockContent a{}

#NavColumn h4,
.CategoryList h4,
.SearchBoxForm h4{
  background: #00245D url(../../images/h4.jpg) top center;
  font: bold 12px Arial Narrow;
  text-align: left;
  color: white;
  text-transform: uppercase;
}


/*MY ACCOUNT*/

#MyAccountMenu1_lstMyAccountMenu{}
#MyAccountMenu1_TitleLabel{}


/*CATEGORIES PRODUCT LINKS*/

.SingleProductDisplay,
.SingleCategoryDisplay{
  text-align:center;
  width: 150px;
  border: 5px solid #DFDFDF;
  margin: 10px 10px 0px 0px;
}

.SingleProductDisplayImage img,
.SingleCategoryDisplayImage img{
  padding: 5px;
}

.NavColumnBlock .SingleProductDisplay,
.NavColumnBlock .SingleCategoryDisplay{}

.SingleProductDisplayName, 
.SingleCategoryDisplayName, 
.ListCategoryDisplay{
  font: 11px Arial, Helvetica, Sans-Serif;
  display: block;
}

.SingleProductDisplayName a, 
.SingleCategoryDisplayName a, 
.ListCategoryDisplay a{
  display: block;
  background: #EFEFEF;
  border: 1px solid #CCC;
  padding: 3px;
  color: black;
  text-decoration: none;
}

.SingleProductDisplayName a:hover, 
.SingleCategoryDisplayName a:hover, 
.ListCategoryDisplay a:hover{
  background: #FFEBA4;
  border-color: #FFE04F;
  color: #00245D;
}

.SingleProductDisplayPrice a:hover{
  font: bold 12px Arial, Helvetica, Sans-Serif;
  padding: 3px 0px;
  display: block;
  background: #00245D;
  color: white;
  text-decoration: none;
  border-bottom-width: 2px;
}

.DiscountText,
.SitePriceDiscounted,
.YouSave,
.SitePrice,
.ListPrice{
  font: bold 13px Arial, Helvetica, sans-serif;
  color: white;
}

.ListPrice{
  text-decoration:line-through;
}

.SitePriceDiscounted, 
.YouSave{
  background: red;
  border: 1px solid #CC0000;
  padding: 2px 0px;
  display: block;
}

.ListProductDisplay, 
.ListCategoryDisplay{
  text-align:left;	
  width:500px;
}

.ListProductDisplayPrice{
  text-align:right;
}

.ListCategoryDisplayDescription{
  margin:3px 10px 10px 0px;
}

.DetailProductDisplay{
  border-top: solid 1px #CCC;
  padding: 5px 10px 10px 10px;
  text-align:left;
  width:550px;
}

.DetailProductDisplayImage{
  vertical-align:top;
  text-align:left;
  width:120px;
  height:120px;
  float:right;
}

.DetailProductDisplayName,
.DetailProductDisplayPrice,
.DetailProductDisplayDescription{
  padding: 3px 0px;
}

.DetailProductDisplayDescription ul{
  padding: 10px 0px;
  margin: 0px;
  list-style: none;
}

.DetailProductDisplayDescription ul li{
  padding: 0px 0px 5px;
  margin: 0px;
}

.DetailProductDisplayName{
  font: 18px Arial, Helvetica, sans-serif;
}


/*WISH LIST*/

#CartWishList{
  background: #F8F8F8;
  border: 1px solid #CCC;
  margin: 10px 0px;
}

#CartWishList h3{
  background: #B4B8D1;
  border: 1px solid #00245D;
  color: white;
  padding: 5px;
}

#dgWishList{
  width: 100%;
}


#dgWishList .DiscountText,
#dgWishList .SitePrice,
#dgWishList .ListPrice{
  color: #B4B8D1;
  text-decoration: none;
}

#dgWishList .SitePriceDiscounted, 
#dgWishList .YouSave{
  color: red;
  border: none;
  background: none;
  display: compact;
  text-decoration: none;
}

#dgWishList .DetailProductDisplay{
  border: none;
  padding: 5px 10px 10px 10px;
  text-align:left;
  width:550px;
}


/*SHOPPING CART*/

#CartTitle{}

#CartSubTitle{}

#CartContainer{
  width: 100%;
  padding: 0px;
  text-align: center;
  margin: 0px 0px 20px;
}

#CartItemBlock{
  padding: 10px;
}

#tblItems{
  border: 1px solid #CCC;
  text-align: left;
  width: 100%;
}

.Header{
  background: #B4B8D1;
  border: 1px solid #00245D;
  border-right: 1px solid #B4B8D1;
  border-left: 1px solid #B4B8D1;
  font: bold 13px Arial, Helvetica, Sans-Serif;
  color:#FFF;
  padding:3px;
}

.Item,
.CartItem{
  background: #F8F8F8;
}

.AlternateItem,
.CartAlternateItem{
  background: #FFF;
}

.CartItem, 
.CartAlternateItem{
  border: 1px solid #CCC;
  border-right: 1px solid #EEE;
  border-left: 1px solid #EEE;
  padding: 5px;
  margin: 0px 0px 1px;
}

#CartUpdateBlock{
  text-align:center;
  color: red;
  font-weight: bold;
}

#CartTotalBlock{
  width:250px;
  text-align:center;
  color: #B4B8D1;
}

#CartCheckoutButtons{
  text-align:right;
  margin-top:10px
}

.formlabel{
  font: bold 11px/14px Arial, Helvetica, Sans-Serif;
  color: #666;	
  letter-spacing: normal;	
}

.FormLabelStrong{
  font: bold 12px/14px Arial, Helvetica, Sans-Serif;
  color: #006699;	
}

.ErrorMessage{
  background: red;
  border: 1px solid #CC0000;
  font: bold 12px Arial, Helvetica, Sans-Serif;
  color: white;
  padding: 3px;
}

.SuccessMessage{
  background:#99FF00;
  color: #000;
  font: 11px/14px Arial, Helvetica, Sans-Serif;
}


/*CHECKOUT*/

#CheckoutTable{
  margin: 0px auto;
  border: 1px solid #CCC;
}

#CheckoutSteps{
  background: white;
  padding: 5px;
}

.CheckoutStep{}

#CheckoutSteps A{
  padding-right: 20px;
  text-decoration:none;
  color: #00245D;
}

.CheckoutStep .CheckoutStepCurrent{
	font: bold 13px Arial, Helvetica, sans-serif;
}

#InstructionsField{
  font: 12px Arial, Helvetica, sans-serif;
  width: 100%;
  margin: 5px 0px 0px;
}

.CheckoutDescription{
  padding: 10px;
  display: block;
}

#AddressBookPanel{
  margin:0px 0px 10px;	
}

.ContentBox{
  margin: 3px 0px 5px 20px;	
  text-align: left;
  background: #FFFFEE;
  border: solid 1px #CCC;
  padding: 10px;
}

#CheckoutTotals{
  background: #B4B8D1;
  border: 1px solid #00245D;
  color: white;
}

#CheckoutTotals table td{
  padding: 3px;
}

#lblGrandTotal{
  font-size: 13px;
  background: #00245D;
  display: block;
  padding: 3px 5px;
}

#PlaceOrderCell{
  text-align: center;
  vertical-align: middle;
  background: #2BFF2B;
  border: 1px solid #00BB00;
}

#CheckoutCoupons, 
.ControlArea{
  background: #F8F8F8;
  border: 1px solid #CCC;
  padding:5px;
}

#CheckoutPayment{
  background: white;
  border: 1px solid #CCC;
  padding: 10px;
  line-height: 16px;
}

#ProductControls{
  margin-top:20px;
}

#VolumeDiscounts{
  font: 12px Arial, Helvetica, sans-serif;
  margin:5px;
  padding: 5px;
  background: white;
  border: 1px solid #CCC;
}

.VolumePricingHeader{
  background: #B4B8D1;
  border: 1px solid #00245D;
  color: white;
  font-weight: bold;
}

.VolumePricingText{
  color: black;
  font-weight: bold;
}

.NewProductBadge{
  height:110px;	
  margin-top:-30px;
  position: relative;
}

.NewProductBadge img{
  position:relative;
  left:-55px;
}

/*FOOTER*/

#footer{
  float: left;
}


/*ERROR MESSAGE BOX*/

.WebPageMessage{
  width: 550px;
  background: red;
  border: solid 3px #CC0000;
  color: white;
  font: bold 13px Arial, Helvetica, sans-serif;
  padding:0px;
  margin: 10px auto;
}

.WebPageMessageError, 
.WebPageMessageWarning, 
.WebPageMessageInformation, 
.WebPageMessageQuestion, 
.WebPageMessageOK{
  padding: 5px;
  background-position: 5px 10px;
  background-repeat: no-repeat;
}

.WebPageMessageError{
  background-image: url(WebPageMessageError.gif);
}

.WebPageMessageWarning{
  background-image: url(WebPageMessageWarning.gif);
}

.WebPageMessageInformation{
  background-image: url(WebPageMessageInformation.gif);
}

.WebPageMessageQuestion{
  background-image: url(WebPageMessageQuestion.gif);
}

.WebPageMessageOK{S
  background-image: url(WebPageMessageOK.gif);
}

.WebPageMessage .Message{
  padding: 0px 0px 15px 40px;
}
