/****************************************************************../HerSolutionGel/
  GLOBAL ELEMENTS
 
 a few helpers
 ************
 
 -moz-opacity: 0.5; background-color: #f00
 background-position: 0px 0px;
  
****************************************************************/
* {margin: 0; padding: 0}

body {
font-family: arial, sans-serif;
font-size: 12px;
color: #333;
text-align: center;
background: url("") repeat-y top center #fff5f5
}

#container {text-align: left; width: 900px; margin: auto; background-color: #dddedf; border-left: 3px solid #fff; border-right: 3px solid #fff; border-bottom: 3px solid #fff}
#flash {}

b {}
strong {color: #ed1555; font-size: 14px}

hr {border-top: 1px solid #5fa132; border-right: 1px solid #5fa132; border-bottom: 1px solid #a2c888; border-left: 1px solid #5fa132; width: 98%; margin-left: 14px}

form, input, select, textarea {font-size: 12px; color: #656565}

img.noBorder {border: 0px}
img.noMargin {margin: 0px}
img.noFloat {float: none; margin: 0 0 8px 8px}
img.floatRight {float: right; margin: 10px}
img.floatLeft {float: left}
img.topMargin {margin-top: 40px}

a {color: #e14a47}
a:hover {color: #848484; text-decoration: none}

a.button {color: #bbe2ff; text-decoration: none; border: 1px solid #444; padding: 3px; background: url("../HerSolutionGel/link_bg.gif") top right no-repeat #555}
a.button:hover {color: #8eceff; text-decoration: none; border: 1px solid #444; padding: 4px 3px; background: url("../HerSolutionGel/link_bg.gif") top right no-repeat #444}

/****************************************************************
  HEADER ELEMENTS
****************************************************************/

#header {clear: both; width: 900px; height: 434px; background: url("../HerSolutionGel/header_bg.jpg") top left no-repeat}

#header p.headerCopy {clear: right; float: right; width: 248px; height: 180px; margin: 70px 32px 0 0; color: #fff; line-height: 16px}

#header ul#nav {font-size: 16px; float: left; list-style-type: none; text-align: right; width: 190px; margin: 144px 0 0 15px; color: #fff}
#header ul#nav li {padding: 3px 0}
#header ul#nav li a {color: #fff; text-decoration: none}
#header ul#nav li a:hover {text-decoration: underline}

#header ul#nav li.larger {font-size: 20px}

#header ul#nav li.smaller {font-size: 12px}
#header ul#nav li.smaller a {color: #f8c9cd}
#header ul#nav li.smaller a:hover {color: #fff; text-decoration: none}

#header ul#navSmall {float: right; list-style-type: none; width: 151px; margin: 20px 20px 0 0; border-left: 1px dotted #f05a6d; padding: 0 12px}
#header ul#navSmall li {font-size: 11px; text-transform: uppercase; color: #999; padding: 2px 0}
#header ul#navSmall li a {color: #999; text-decoration: none}
#header ul#navSmall li a:hover {text-decoration: underline}

#header #hackersafe {float:right; margin:10px 67px 0 0}

/******* body switcher header images/menu/sidebar/etc ********/

body.internalPage div#container div#header {height: 325px}
body.internalPage div#container div#sidebar {height: 553px; width: 218px; background: url("../HerSolutionGel/internal_pages/sidebars/default.jpg") top left no-repeat; text-align: right; float: left; padding: 0; border-top: 3px solid #fff; border-right: 3px solid #fff; border-bottom: 3px solid #fff}
body.internalPage div#container div#content {width: 678px; background: url("../HerSolutionGel/internal_pages/content_bg.jpg") bottom right no-repeat}

body.about div#container div#header {background: url("../HerSolutionGel/internal_pages/headers/learn_more.jpg") top left no-repeat}

body.whatWomenSay div#container div#header {background: url("../HerSolutionGel/internal_pages/headers/what_theyre_saying.jpg") top left no-repeat}
body.whatWomenSay div#container div#sidebar {background: url("../HerSolutionGel/internal_pages/sidebars/ice_cube.jpg") top left no-repeat}

body.ingredients div#container div#header {background: url("../HerSolutionGel/internal_pages/headers/ingredients.jpg") top left no-repeat}

body.customerService div#container div#header {background: url("../HerSolutionGel/internal_pages/headers/customer_service.jpg") top left no-repeat}

/******* the order page ********/

/* temp order page (-JF) */
body.order2 div#container div#header {background: url("../HerSolutionGel/internal_pages/headers/order.jpg") top left no-repeat}
body.order2 div#container div#sidebar {background: url("../HerSolutionGel/internal_pages/sidebars/ice_cube.jpg") top left no-repeat}

/* shopping cart style (removed until HerSolution Pills are available -JF) */
body.order div#container div#header {background: url("../HerSolutionGel/internal_pages/headers/order.jpg") top left no-repeat}
body.order div#container div#content {background: url("../HerSolutionGel/internal_pages/content_bg_order.jpg") top left no-repeat}

/****************************************************************
  CONTENT ELEMENTS
****************************************************************/

#content {width: 610px; background: url("../HerSolutionGel/content_bg.jpg") bottom right no-repeat; float: left}

#content h1 {padding: 16px 8px 10px 20px; color: #ed1555; font-size: 24px}
#content h2 {padding: 20px 8px 10px 20px; color: #fff; font-size: 16px}
#content h3 {padding: 20px 8px 10px 20px; color: #f05a6d}

#content h1.header {font-size: 17px; padding-top: 1px}
#content h2.header {font-size: 13px; padding-top: 1px}

#content p {margin: 10px 18px 10px 20px; line-height: 16px}
#content p.quote {display: block; width: 440px; padding: 10px 10px 10px 10px; border: 1px solid #fff; border-bottom: none; margin-bottom: 0; font-weight: normal; background-color: #fff5f5}
#content p.signature {display: block; width: 440px; padding: 0 10px 10px 10px; border: 1px solid #fff; border-top: none; margin-top: 0; font-style: italic; background-color: #fff5f5}
#content .leadin {color: #f05a6d; font-weight:bold}

#content div.twoColumn {width: 200px; float: left; margin: 10px 0 10px 10px; line-height: 16px}
#content div.twoColumn p {margin: 10px 8px 10px 10px}

#content ul {list-style-type: none; margin: 0 0 0 20px; padding: 10px}
#content ul li {background: url("../HerSolutionGel/bullet.gif") top left no-repeat; padding: 0 0 10px 18px; margin: 1px}

#content img.wordmark {margin: 20px 0 0 20px}
#content img.copyarea {margin-left:20px}

#content #ingredientsTable {float:left; margin:0 20px 10px 20px}
#content td.head {height:30px; background-color:#F05A6D; color:#fff; font-weight:bold; font-size:14px; padding:5px}
#content td.ingredients {padding:2px 2px 2px 20px; border-bottom:1px #999 dotted; color:#333; font-size:12px}

#content div#orderIcons {height: 168px; text-align: left;}
#content div#orderIcons div {text-align: center; width: 125px; margin: 8px 0 15px 2px; float: left}

/******* the order page ********/
#content div#shelf {width: 640px; height: 300px; margin: auto; margin-bottom: 70px}
.phoneOrder {font-size: 26px; color: #f3858a; margin-bottom: -5px}
.promoCode {font-size: 18px; padding-right: 1px}
#content div#shelf div {width: 200px; height: 280px; float: left; margin: 6px; text-align: center}
#content div#shelf div img {margin: 15px 0 0 5px}
#content div#shelf div p {margin: 0; padding: 10px 0 15px 3px}
#content div#shelf form div h3 {margin: 0; padding: 3px; font-size: 16px; font-weight: normal}
#content div#shelf form div h3 strong {color: #999}
#content div#shelf div input {margin-top: 15px; border: 1px solid #fff; background-color: #ed1555; color: #fff; cursor: pointer}

#content div#shelf div ul {list-style-type: none; margin: 0; padding: 0}
#content div#shelf div ul li {background-image: none; padding: 0; margin: 0}

/****************************************************************
  SIDEBAR ELEMENTS
****************************************************************/

#sidebar {width: 250px; text-align: right; float: left; padding: 27px 20px 20px 20px}

#sidebar p.quote {display: block; width: 245px; padding: 20px 10px 4px 0px; color: #ed1555; font-style: italic}
#sidebar p.signature {display: block; width: 245px; padding: 0 10px 5px 0px; font-style: italic}

/****************************************************************
  FOOTER ELEMENTS
****************************************************************/

#footer {margin: auto; clear: both; color: #CDCDCD; width: 900px; text-align: center; background-color: #fff5f5; padding-top: 26px; padding-bottom: 13px}

#footer p {padding: 4px}
#footer p.footerLinks {color: #bfbfbf; font-size: 10px; text-transform: uppercase; font-weight: normal}
#footer a {color: #999; text-decoration: underline}

/******* body switcher footer ********/

#container div#bottomSeparator {clear: both; width: 900px; height: 13px; background: url("../HerSolutionGel/footer_bg.gif") top left repeat-x #f05a6d}
body.internalPage #container div#bottomSeparator {clear: both; width: 900px; height: 13px; background: url(none) top left repeat-x #f05a6d}
#footer a:hover {color: #ed1555}