/* -------------------------------------------------------------- 
  
   Screen Styles - Folio 08
   Date Created: 11/02/08
   Author: Wesley Roddy
   
-------------------------------------------------------------- */


/* ---- CSS Browser reset (sets all browsers to display and space default elements equally, remove compatability bugs)
------------------------------------------------------------------------- */

@import 'lib/reset.css';


/* HTML Elements
-------------------------------------------------------------- */

body { background: url(../images/background_pattern.gif) repeat; margin: 0 auto; padding: 0 auto; width: 100%; }

/* Default fonts and colors, designed to set fonts to look the same across main browaser, and align to an even baseline grid with 18px spacing */
   
body { font-size: 75%; color: #666666; font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif; }

h1,h2,h3,h4,h5,h6 { color: #CC9900; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: normal; }


/* Headings
-------------------------------------------------------------- */

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }



/* Text elements
-------------------------------------------------------------- */

p           { margin: 0 0 1.5em; }
p.last      { margin-bottom: 0; }
p img       { float: left; margin: 1.5em 1.5em 1.em 0; padding: 0; }


/*ul, ol      { margin:0 1.5em 1.5em 1.5em; }
*/
ul          { list-style-type: circle; }
ol          { list-style-type: decimal; }
dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin-top: 1.5em; font-style: italic; }
del         { color:#666; }

a:focus, 
a:hover     { color: #000; }
a           { color: #009; text-decoration: underline; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; background: #ffc; }
dfn         { font-weight: bold; }
pre,code    { margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'monotype.com', 'lucida console', monospace; line-height: 1.5; } 
tt          { display: block; margin: 1.5em 0; line-height: 1.5; }

/*
-- causing problem with lots of display issues
table { margin-bottom: 3em}
*/
#m_Basket_LblReturnedHTML table{ margin-bottom: 0em;}
#_basket_LblReturnedHTML table{ margin-bottom: 0em;}
#_basket_LblReturnedHTML a{color:#666666; font-weight: normal; }
#_basket_LblReturnedHTML a:hover {color: #666666; font-weight: normal; text-decoration:none;}

#testtest {width: 20px;}




/* ---- Links ----------------------------------------------------------
------------------------------------------------------------------------- */

	/* -- Links Body -- Gold -- */
a {color: #CC9900;text-decoration:none; font-weight: normal;}
a:visited {color: #CC9900; font-weight: bold;}
a:hover {color: #4B448E; font-weight: normal; font-size:11px;}
a:active {color: #CC9900; font-weight: normal; font-size:11px;}

	/* -- Links -- Main Menu -- */
#main_menu a {font-weight: bold; color:#FFFFFF; padding: 9px 0px 9px 0px; }

	/* -- Links Navigation -- Grey -- */
	/* compatability issue with menu*/

/*#column_a a { color: #666666;}
#column_a a:visited {font-weight: normal;}
#column_a a:hover {font-weight: bold; color: #CC9900;}
#column_a a:active {font-weight: bold; color: #CC9900;}*/

/* -- Links Footer Navigation -- Grey -- */
#footer_tools a {color: #666666; text-decoration:none; font-weight: normal;}
#footer_tools a:visited {}
#footer_tools a:hover {color: #CC9900;}
#footer_tools a:active {color: #CC9900;}


/* ---- Layout ----------------------------------------------------------
------------------------------------------------------------------------- */

#page { background-color:#FFFFFF; padding-top: 20px; }
#header { background: url(../images/background_header.jpg) repeat-x #000033; height: 140px;}

#header h1 { text-indent: -9999px; background:url(../images/header_logo.gif) no-repeat; height:140px;} 

#beautyHeader { background:url(../images/Header_Background_Slice.jpg) repeat-x #000033; height:131px; width:748px}
#beautyHeader h1 {text-indent: -9999px; background:url(../images/headingBeautyHomepage.gif) no-repeat; height: 131px;}

.backgroundBeauty { background:#CC9900; height:24px; padding-top:8px;  }


.search h2 { text-indent: -9999px; background: url(../images/masthead_ProductSearch.gif) no-repeat; height:30px;  margin: 0px 0px 10px 0px; width: 180px; }
.browse_menu h2 { text-indent: -9999px; background: url(../images/masthead_BrowseStore.gif) no-repeat; height:30px;  margin-top: 15px; }
.newsletter_banner h2 { text-indent: -9999px; background: url(../images/masthead_Newsletters.gif) no-repeat; height:30px; margin: 0px; }
.register_banner h2 { text-indent: -9999px; background: url(../images/masthead_Register.gif) no-repeat; height:30px; margin: 0px; }
.product_search { width: 140px; height: 18px; padding: 4px 0px 0px 2px; border: solid 1px #999999; color:#999999; font-size: 10px;}

#column_a {float:left; width: 180px; font-size: 11px;}
#column_b { float:left; width: 1000px; margin-left:10px;}

#main_menu { background: url(../images/background_menu.gif) repeat-x #CC9900; padding-top: 8px; padding-bottom:8px;}

#browse_menu { background: url(../images/background_menu.gif) repeat-x #CC9900; height: 27px; padding-top: 8px;}

#footer_tools { height: 95px; background: #ECECEC; padding: 15px;}
#footer { height: 80px; text-align:center; margin-top:15px;}


/* Classes
-------------------------------------------------------------- */

.container { background: #FFFFFF; width:978px; margin: 0 auto; margin-top:10px; } 
/*div { border:  solid 1px #FF33FF; }*/
.shadow_right { width:978px;  background:url(../images/background_ShadowRight.gif) right repeat-y; padding-right:10px;}
.shadow_bottom {width:978px; margin: 0 auto; background:url(../images/background_ShadowBottom.gif) repeat-x; height: 15px;}
.frame { border: solid #FFFFFF 10px;}

.menu_links li {display:inline; list-style:none; padding-left:26px;}
.menu_links li a {text-decoration:none;}
.menu_links li a:hover {text-decoration:none; padding: 9px 2px 9px 2px; margin-bottom:0px; background: url(../images/background_menu_highlight.gif) repeat-x; height:26px; }



.browse_menu li { list-style:none; line-height: 25px; border-bottom: solid #CCCCCC 1px; text-indent: 10px; background: url(../images/bullet_arrow.gif) 0px 0.8em no-repeat;}

.feature li {line-height: 2em; text-indent: 10px; list-style:none; background: url(../images/bullet_arrow.gif) 0px 0.8em no-repeat; margin:0 1.5em 0em 0em;}

.feature { float:left;}

.banner { clear:both; margin-bottom: 1.5em;}

.content {}

.converter { float:left; margin-left: 40px;}
.converter select { width:120px; margin-top: 5px}

.wrap_image { float:left;}

.clear {clear:both; }


.sprite_euro {display:inline; overflow:hidden; height:18px; padding-left:18px; padding-bottom:5px; background-repeat:no-repeat; background-image: url(../images/currencyEuro.gif); }
.sprite_usdollar {display:inline; overflow:hidden; height:18px; padding-left:18px; padding-bottom:5px; background-repeat:no-repeat; background-image: url(../images/currencyUSD.gif); }
.sprite_sterling {display:inline; overflow:hidden; height:18px; padding-left:18px; padding-bottom:5px; background-repeat:no-repeat; background-image: url(../images/currencyYEN.gif); }
.sprite_yen {display:inline; overflow:hidden; height:18px; padding-left:18px; padding-bottom:5px; background-repeat:no-repeat; background-image: url(../images/currencySTG.gif); }


	
/* ---- Checkout ----------------------------------------------------------
------------------------------------------------------------------------- */
	
#Checkout_menu { background: url(../images/background_menu.gif) repeat-x #CC9900; height: 35px;}

.leftcolumn {float:left; width: 485px;}
.rightcolumn { float:left; width: 485px; padding-left:10px;}
.greybox {padding:10px; background-color:#F2F1F3;}
.greybckgd {padding:10px; background-color:#F2F1F3; margin-bottom: 0px; }
label {font-weight:normal; font-size: 11px;}
.normalLabel {font-weight:normal; font-size:11px;}
.input360 {width: 360px; height:60px; font-family:Arial, Helvetica, sans-serif; font-size:11px; }
.input170 {width: 170px; font-family:Arial, Helvetica, sans-serif; font-size:11px; }
.input80 {width: 80px; font-family:Arial, Helvetica, sans-serif; font-size:11px; }
.DarkGrey {background-color:#DFDDE2; font-weight:bold;}
.LightGrey {background-color:#F2F1F3;}

/* ---- Misc ----------------------------------------------------------
------------------------------------------------------------------------- */

.pageheader {height: 35px; border-top: solid #CCCCCC 1px; border-bottom: solid #CCCCCC 1px;}
.storeheader {background-color:#323A7A; height:35px;}
.rowborder {border-bottom: solid #CCCCCC 1px; padding-top:5px; padding-bottom:5px; vertical-align:text-top;}
.tableheader { height:30px; background-color:#323A7A; font-family: Arial, Helvetica, sans-serif; color:#FFFFFF; font-weight:bold;}


/* css hack to hide unwanted blank extra <td> in menu */
.MenuBreakSpace	{height:1px;background-color :#FAF1DB; width:100%; display:none;}
.MenuBreakSpaceselected	{height:1px;background-color :#FAF1DB; width:100%; display:none;}

.facebookLinkWrapper{float: left; font-size: 11px; margin-left: 40px;}
.facebookLink{ display:block; background: url(../images/facebook_badge.jpg); height:30px; width:30px;}

/* -------------------------------------------------------------- 
  
   Browser Reset, Font size reset from Blueprint CSS Framework 
   * Version:   0.6 (21.9.2007)
   * Website:   http://code.google.com/p/blueprintcss/
   
-------------------------------------------------------------- */