/*___ layout.css: Positioning and Layout Styles ___*/

/*___ Section 1: Global Positioning/Layout Styles ___*/

html 
{
    position        : relative;
}

body 
{
}

h1 
{
}

h2 
{
}

h3 
{
}

h4 
{
	line-height     : 1.5em;
}

h5 
{
}

h6 
{
}

p 
{
    padding-bottom  : 1em;
}

ul 
{
}

ol 
{
    padding-left    : 20px;
}

li 
{
}

strong 
{
}

em 
{
}

u 
{
}

a 
{
}

a:visited 
{
}

a:hover 
{
}

table 
{
}

tr 
{
}

th 
{
}

td 
{
}

img 
{
}

/*___ Section 2: Site-Specific Positioning/Layout Modules ___*/
.footer *
{
    word-spacing    : normal;
}

.tertiary .header,
.secondary .header
{
    padding-bottom  : 10px;
    margin-bottom   : 5px;
}

.primary .extraInfo
{
    padding         : 20px 0 0 0;
}

#success br
{
    display         : none;
}

.year a,
.paging a
{
    margin          : 3px 0 3px 1px;
    padding         : 3px 5px;
}

/*___ Section 3: Unique Element-Specific Position/Layout Styles ___*/

/*___ DIV _________________________________________________________________*/
.headerWrapper
{
    position        : absolute;
    width           : 100%;
    height          : 180px;
    left            : 0;
    z-index         : 2;
}


#header
{
    position        : relative;
    width           : 960px;
    height          : 180px;
    margin          : 0 auto;
}

#content
{
    position        : relative;
    width           : 920px;
    margin          : 0 auto;
    padding         : 190px 20px 20px 20px;
    overflow        : hidden;
    z-index         : 1;
}

.primary
{
	padding-top		: 45px;	
}

.threeColumn .primary
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    width           : 507px;
    padding         : 45px 20px 0;
    float           : left;
    margin-left     : 203px;
}

.oneColumn .primary
{
    display         : block;
    width           : 920px;
    padding         : 45px 0 0;
    float           : none;
    margin          : 0;
}

.twoColumn .primary
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    width           : 697px;
    float           : right;
}

.threeColumn .secondary
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    width           : 203px;
    float           : left;
    margin-left     : -81.3%;
}

.twoColumn .secondary
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    width           : 203px;
    float           : left;
}

.tertiary
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    padding-left    : 10px;
    width           : 155px;
    padding-top		: 45px;
}

.footer
{
    position        : relative;
    width           : 960px;
    margin          : 0 auto;
    word-spacing    : -1em;
}

.testimony
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    width           : 193px;
    padding         : 20px;
}

.success
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    width           : 331px;
    padding         : 20px 0;
}

div.flickr
{
    position        : relative;
    display         : inline-block;
    vertical-align  : top;
    width           : 180px;
    padding         : 20px 0 20px 30px;
}

.welcome
{
    padding-bottom  : 10px;
}

.featured
{
    padding-bottom  : 10px;
    margin-bottom   : 10px;
}

.tv
{
    margin-top      : 10px;
    padding         : 140px 15px 15px;
}

.teach
{
    margin-top      : 10px;
    padding         : 15px;
}

.flickr_badge_image
{
    display         : inline-block;
    vertical-align  : top;
    margin          : 0 20px 20px 0;
}

div[id$="BuyProductPanel"]
{
    display         : inline-block;
    vertical-align  : top;
    width           : 200px;
}

div.productOptions div[id$="BuyProductPanel"]
{
    position        : relative;
    width           : 100%;
    margin-bottom   : 20px;
}

.ProductItemView div
{
    padding         : 0;
    border          : none;
}

.description
{
    padding         : 20px;
    margin-bottom   : 20px;
}

.results
{
    text-align      : right;
}

.primary .header
{
    padding-bottom  : 10px;
}

.pageHeader
{
    padding-bottom  : 10px;
}

.calculate
{
    margin          : 20px 0 40px 0;
}

.moreItems
{
    margin-bottom   : 20px;
}

.clear
{
    height          : 1px;
    clear           : both;
}

.primary .section
{
    padding-bottom  : 10px;
    clear           : both;
}

.results
{
    margin-bottom   : 1em;
    padding-bottom  : .5em;
}

.tableNode div
{
    position        : relative;
    width           : 100%;
    height          : 100%;
}

.tableNode .button
{
    position        : absolute;
    bottom          : 0;
    left            : 22%;
    width           : auto;
    height          : auto;
}

#success li > div
{
    width           : 48%;
    display         : inline-block;
    vertical-align  : top;
    padding         : 0 5px 1em 5px;
}

#success .blogger-post-footer
{
    display         : block;
    width           : auto;
    padding         : 0;
}

.nav.utility
{
    text-align      : right;
    margin-top      : -15px;
}

.fragCalculator .step
{
    margin          : 10px 0 50px 20px;
    padding	    : 50px 15px 20px;
    position	    : relative;
    width	    : 650px
}

.essentialOils,
.fragranceOils
{
    display         : inline-block;
    vertical-align  : top;
}

.essentialOils
{
     margin-right    : 25px;
}

.lyeCalculator .pseudolabel.soaptype,
.lyeCalculator .pseudolabel.units
{
	padding-bottom	: 10px;	
}

.warning-box
{
	width			: 240px;
	padding			: 10px;	
	float			: right;
	margin-right	: 130px;
}

.reset-weight-header
{
	padding-bottom	: 10px;	
}

#reset-weight
{
	margin-bottom	: 20px;	
}

/*___ SPAN _________________________________________________________________*/
.product
{
    position        : relative;
    overflow        : hidden;
    padding-left    : 130px;
    width           : auto !important;
    min-height      : 122px;
    margin-bottom   : 20px;
    text-align      : left;
}

span.summary
{
    display         : block;
}

span.price
{
    display         : inline-block;
	vertical-align	: top;
	padding			: 15px 5px 0 0;
}

.footer .vcard
{
    display         : block;
    padding         : 5px 0 10px 0;
    text-align      : center;
}

.street-address,
.country-name
{
    display         : block;
}

.calculate span
{
    display         : inline-block;
    margin-right    : 17px;
}

.footer .street-address
{
    display         : inline;
}

.footer .adr
{
    display         : block;
}

.product .options + .price
{
    display         : none;
}

#success li > span
{
    display         : block;
}

.news span
{
    display         : block;
    margin-bottom   : 5px;
    padding-bottom  : 10px;
    padding-top     : 2px;
}

.testimonials span.date
{
    display         : block;
    padding-top     : 3px;
}

label[id$="recipe"] span.labelName,
.pseudolabel.soaptype span.labelName,
.pseudolabel.units span.labelName,
label[id$="notes"] span.labelName,
.fragCalculator .pseudolabel .labelName
{
     padding	     : 0 10px 0 0;
     display	     : block;
     margin	     : 5px 0 5px 0;
}

.highlight
{
	padding	      : 7px;
}

.date
{
    display             : block;
    padding-bottom      : 7px;
}


/*___ H1 _________________________________________________________________*/

/*___ H2 _________________________________________________________________*/
#header h2
{
    position        : absolute;
    top             : 80px;
    left            : 243px;
}

/*___ H3 _________________________________________________________________*/

.primary h3
{  
    margin          : 15px 0 20px 0;
}

.primary h3.heading
{
    margin-bottom   : 0;
}

.secondary h3 
{
    padding-top     : 10px;    
}

/*___ H4 _________________________________________________________________*/
.tv h4
{
    margin-bottom   : 5px;
}

.news h4
{
    margin-top      : 10px;
}

h4.title
{
    margin-bottom   : 15px;
}

.step.two h4
{
	margin-bottom	: 10px;	
}

/*___ H5 _________________________________________________________________*/

/*___ H6 _________________________________________________________________*/

#reset-weight h6
{
	margin-bottom	: 5px;	
}

/*___ P _________________________________________________________________*/
.tv p
{
    padding-bottom  : 25px;
}

table[id$="ProductList"] p.detailsInnerPara
{
    height          : 3em;
}

p.note
{
	padding	    : 4px 5px 3px;
	line-height : 100%;
}
/*___ UL _________________________________________________________________*/
.primary .productNews
{
    padding         : 0;
    margin-right    : -20px;
}

.shortcuts
{
    position        : absolute;
    top             : 5px;
    right           : 10px;
}

.phone
{
    position        : absolute;
    top             : 43px;
    left            : 233px;
}

.about
{
    position        : absolute;
    top             : 40px;
    right           : 10px;
}

.productPages
{
    position        : absolute;
    bottom			: -46px;
    left            : 243px;
}

.social
{
    position        : relative;
    display         : inline-block;
    width           : 165px;
    padding         : 20px 10px;
}

.description ul
{
    padding         : 0 20px 20px 30px;
}

.stickylist
{
    position        : relative;
}

.stickyList ul
{
    display         : none;
}

.stickyList .stuck ul,
.stickyList li:hover ul
{
    display         : block;
    position        : absolute;
    top             : -1px;
    left            : 170px;
    z-index         : 5;
    width           : 140px;
}

.description ul
{
    line-height     : 1.8em;
}

.primary ul
{
    position        : relative;
    padding-left    : 20px;
}

.blog ul
{
    margin          : 10px 0 0 0;
}

.primary .oils
{
    padding-left    : 0;
}

.primary #success
{
    padding-left    : 0;
}

.primary ul.news,
.primary ul.testimonials,
.primary .year ul,
.primary ol.paging
{
    padding-left    : 0px;
    margin-bottom   : 20px;
}

.primary ul.news
{
    margin-top      : -20px;
}

.primary ul.news ul
{
    padding-bottom  : 10px;
}

.primary .year ul,
.primary ol.paging
{
    text-align      : right;
}

.primary .fragCalculator ul
{
    overflow        : auto;
    width           : 306px;
    height          : 380px;
    padding	    : 0;
}

/*___ OL _________________________________________________________________*/

.primary ul.testimonials li ol
{
    padding-bottom  : 10px;
}

ol.paging
{
	list-style-type	: none;	
}

/*___ LI _________________________________________________________________*/
.primary ol li
{
    list-style-type : decimal;
}

.primary .productNews li
{
    display         : inline-block;
    vertical-align  : top;
    width           : 203px;
    padding         : 20px 20px;
    margin-right    : 17px;
    overflow        : hidden;
}

.primary .extraInfo li
{
    display         : inline-block;
    vertical-align  : top;
    width           : 28.8%;
    padding         : 10px;
}

.blog li
{
    padding         : 5px 0 5px 23px;
    line-height     : 1.3em;
    margin          : 0 0 0 10px;
}

.secondary .categories li
{
    position        : relative;
    margin-left     : 0;
    margin-top      : 0;
}

.primary .description li
{
    padding         : 0;
    margin-right    : 10px;
}

.categories > li
{
    margin          : 0;
    margin-top      : .3em;
}

.shortcuts li
{
    display         : inline-block;
    vertical-align  : top;
    padding         : 0 10px;
}

.phone li
{
    display         : inline-block;
    vertical-align  : top;
    padding         : 0 10px;
}

.phone li:first-child
{
    padding-right   : 15px;
}

.about li
{
    display         : inline-block;
    vertical-align  : bottom;
}

.productPages li
{
    display         : block;
    float			: left;
    width			: 90px;
    height			: 118px;
    padding			: 0 11px 0 0;
    margin			: 0;
}

.productPages li:first-child
{
    padding-left    : 0;
}

.social li
{
    display         : inline-block;
    vertical-align  : top;
    padding         : 0 10px 20px 10px;
}

.secondary li 
{
    margin-top          : .3em;
}

.subcategories li
{
    display         : inline-block;
    vertical-align  : top;
    width           : 30%;
    padding         : 0 10px 10px 0;
}

.primary .oils li
{
    position        : relative;
    display         : inline-block;
    width           : 30%;
    padding         : 0;
}

.stuck ul li:first-child,
.stickyList li:hover ul li:first-child
{
    width           : 100.5%;
    margin-left     : -1px;
}

.categories > li
{
    padding			: 1px;
}

.categories .stuck,
.categories li:hover
{
    padding			: 0px;
}

.primary li
{
    padding         : 0 0 10px 20px;
}

.primary #success > li
{
    padding         : 0 0 2em 0;
    list-style-type : none;
}

.primary ul.news li,
.primary ul.testimonials li,
.primary .year ul li,
.primary ol.paging li
{
    padding-left    : 0;
}

.primary ul.news ul li
{
    padding         : 0 0 0 15px;
}

.primary ul.testimonials li
{
    padding         : 10px 15px 45px;
    margin          : 0 -1px;
}

.year ul li,
ol.paging li
{
    display         : inline-block; 
}

.primary ul.testimonials li ol li
{
    padding         : 0 0 0 3px;
    margin          : 0 0 0 20px;
}

.primary .fragCalculator ul li
{
	padding	     : 0;
}

.testimonials li[class*="page"]
{
	display		: none;
}

.testimonials li.show
{
	display		: block;
}

/*___ STRONG _________________________________________________________________*/

/*___ EM _________________________________________________________________*/

/*___ U _________________________________________________________________*/

/*___ A _________________________________________________________________*/
.about a,
.about a:hover,
.about a:visited
{
    display         : block;
    padding         : 5px 10px 3px 10px;
}

a.moreDetails, a.addToCart {
	display			: inline-block;
	width			: 118px;
	height			: 50px;
}

a.altoddButton,
a.altoddButton:visited,
a.altoddButton:hover
{
    height          : 21px;
    padding         : 4px 5px;
}

.stickyList a,
.stickyList a:visited,
.stickyList a:hover
{
    display         : block;
    width           : 90%;
    padding         : 5px 10px;
}

.stickyList .stuck ul a,
.stickyList .stuck ul a:hover,
.stickyList .stuck ul a:visited,
.stickyList li:hover ul a,
.stickyList li:hover ul a:hover,
.stickyList li:hover ul a:visited
{
    width           : 120px;
}

.productOptions .button,
.productOptions .button:hover,
.productOptions .button:visited
{
    margin-left     : 10px;
}

.moreItems a,
.moreItems a:hover,
.moreItems a:visited
{
    display         : block;
}

.product .add,
.product .add:hover,
.product .add:visited,
.product .details,
.product .details:hover,
.product .details:visited
{
	display			: inline-block;
	vertical-align	: middle;
	margin-bottom	: 3px;
}

.productPages li a
{
	display			: block;
	width			: 90px;
	height			: 34px;
	padding-top		: 84px;
	margin-top      : 0;
	text-align		: center;	
}

.productPages li a:hover
{
	padding-top		: 125px;
	margin-top		: -41px;
}

.newsletter,
.newsletter:hover,
.newsletter:visited
{
    position        : relative;
    display         : block;
    width           : 167px;
    height          : 86px;
    margin          : 10px 0 0 0;
    text-indent     : -9999em;
}

.yourCart,
.yourCart:hover,
.yourCart:visited
{
    position        : relative;
    display         : block;
    width           : 185px;
    height          : 51px;
    margin          : 10px 0 0 0;
    text-indent     : -9999em;
}

.orderSummary a,
.orderSummary a:hover,
.orderSummary a:visited
{
    margin          : 15px 0;
}

.nav.utility a.previous
{
    padding         : 0 7px 0 10px;
    margin          : 6px 0;
    border-right    : 1px solid #347799;
    cursor          : pointer;
    display         : inline-block;
}

.nav.utility a.next
{
    padding         : 0 12px 0 4px;
    margin          : 6px 0;
    cursor          : pointer;
    display         : inline-block;
}

.primary .fragCalculator ul li a
{
	display			: inline-block;
	vertical-align	: middle;
	padding			: 10px 0 10px 30px;
	width			: 75%;
}

.primary .fragCalculator ul li .info
{
	display			: inline-block;
	vertical-align	: middle;
	text-indent		: -9999em;
	width			: 11%;
	height			: auto;
	float			: right;
	padding			: 10px 0 10px 5px;
}

/*___ TABLE _________________________________________________________________*/
table.addressBook
{
    width           : 100%;
}

table.opcFrame
{
    width           : 100%;
}

table.recentOrders
{
    margin-bottom   : 10px;
}

#results
{
    width           : 695px;
    margin	    : 20px 0 30px;
}

table.quantity
{
	display			: inline-block;
	vertical-align	: middle;
	margin			: 0 5px 0 0;
}

/*___ TR _________________________________________________________________*/

/*___ TH _________________________________________________________________*/
.productOptions tr:first-child th,
.header th
{
    padding-bottom  : 10px;
}

/*___ TD _________________________________________________________________*/
table.productOption td
{
	padding-bottom  : 5px;
}

table.addressBook td.entries
{
    padding         : 0;
}

table[id$="WishlistGrid"] td
{
    padding         : 5px;
}

.login table.inputForm .rowHeader
{
    text-align      : left;
    padding         : 0;
}

td.login
{
    padding-right   : 20px;
}

table.recentOrders td
{
    padding         : 5px 0;
}

.ourDepartmentsCell td
{
    padding         : 2px;
}

table[id$="ProductList"] td
{
    padding         : 5px;
    vertical-align  : top;
}

table[id$="ProductList"] .tableNode
{
    height          : 220px;
    padding-bottom  : 30px;
}

table#results tr.recommended td
{
    position        : relative;
    padding-top     : 10px;
}

table[id$="BasketGrid"] td
{
    padding         : 5px 2px;
}

table[id$="BasketGrid"] td:first-child
{
    padding         : 5px;
}

.totalDivider td:first-child hr
{
    display         : none;
}

tr[id$="trShipping"] + .totalDivider td:first-child hr
{
    display         : block;
}

.pagedList tr td:first-child
{
    text-align      : left;
}

table[id$="OrderGrid"] td
{
    padding         : 5px;
}

table#results td
{
	padding		: 5px 0;
}

/*___ IMG _________________________________________________________________*/
.featured img
{
    float           : left;
    margin          : 0 10px 0 0;
}

.productNews img
{
    float           : right;
    margin          : 6px 0 0 10px;
}

div.flickr img
{
    width           : 60px;
    height          : auto;
}

.success img
{
    display         : block;
    float           : right;
    margin          : 0 0 0 20px;
    max-width       : 146px;
    height          : auto;
}

#ProductImage
{
    display         : inline-block;
    vertical-align  : top;
    width           : 300px;
    height          : auto;
    margin-bottom   : 10px;
}

.Thumbnail
{
    max-width       : 110px;
    max-height      : 110px;
}

.product .Thumbnail
{
    position        : absolute;
    top             : 0;
    left            : 0;
    max-width       : 110px;
    height          : auto;
}

.step.one img,
.step.two img
{
	position    : absolute;
	top	    : -20px;
	left        : -20px;
}

/*___ FORM _________________________________________________________________*/

/*___ INPUT _________________________________________________________________*/
input[type="text"] 
{
    margin-bottom  : 5px;    
}

table.productOption input
{
	margin-right   : 5px;
}

.opcFrame input[type="radio"]
{
    margin          : 3px 5px 2px 0;
}

input[type="checkbox"]
{
    margin-right    : 5px;
}

label[id$="recipe"] input
{
	width	    : 300px;
	padding	    : 2px;
}

label[id$="notes"] textarea
{
	width	     : 675px;
	height	     : 150px;
	display	     : block;
	margin-bottom: 10px;
	padding	     : 2px;
}

select[id$="product"]
{
    width       : 350px;
    margin      : 10px 0 20px;
    padding     : 4px;
}

input[id$="amount"],
select[id$="amount"]
{
    margin      : 10px 0 0;
    padding     : 4px;
}


input[id$="amount"]
{
    margin-right: 10px;
}

.warning-box input
{
	margin: 0 15px 10px 0;	
}

.recalc-weight
{
	width		: 4em;
	text-align	: center;
	padding		: 2px 0;	
}

#reset-weight .calculate.button
{
	display		: block;
	margin		: 5px 0;
}

/*___ LABEL _________________________________________________________________*/
label[id$="recipe"],
.pseudolabel.soaptype,
.pseudolabel.units
{
	margin-bottom	: 10px;
}

.pseudolabel.units label,
.pseudolabel.soaptype label
{
	margin			: 0 30px 0 5px;
	width			: 30px;
	display			: inline-block;
}

.rbl-units label
{
	margin			: 0 5px 0 2px;	
}

/*___ CITE _________________________________________________________________*/
.mindfly
{
    display         : block;
    width           : 100%;
    text-align      : center;
    padding-bottom  : .5em;
}

/*___ SELECT _________________________________________________________________*/
.calculate select
{
    display         : inline-block;
    margin-right    : 40px;
}

/*___ BUTTON _________________________________________________________________*/
.calculate.button,
.calculate.button:visited,
.calculate.button:hover
{
    margin-right    : 5px;
}

.button,
.button:visited,
.button:hover
{
	padding	    : 2px 5px 3px;
}

input.button.fragrance
{
	margin	     : -20px 0 0 20px;
}

/*___Group/Section/Class_________________________________________________________________*/