/* --- "Styles" Stylesheet
   Contains CSS for content types, taxonomy pages, 
		store checkout and various other bits
  --- */

/* --- Feature displays (common to home page and category landing pages) ---- */

.feature-block {
	position:relative;
}

.front .feature-block {
	margin-bottom:10px;
}

.feature-block .inset {
	position:absolute;
	width:200px;
	padding:20px;
	bottom:65px;
	right:0;
	background:#ffffff;
	background:rgba(255, 255, 255, 0.7);
	font-size:14px;
	line-height:1.4;
}

#content-container .feature-block .inset h1 {
	font-size:30px;
	text-transform:lowercase;
	line-height:1;
	margin-bottom:10px;
}

.feature-block h1 a {
	color:#464646;
}

/* Home page slideshow */

.views_slideshow_cycle_slide {
	z-index:2;
}

.views-slideshow-controls-bottom {
	position:absolute;
	bottom:5px;
	right:0px;
	z-index:20;
	width:200px;
	height:12px;
	padding:26px;
	text-align:center;
}

.views-slideshow-pager-field-item, .views-slideshow-pager-field-item div {
	display:inline-block;
}

.views-slideshow-pager-field-item {
	text-indent:-9999px;
	background:#ffffff;
	border-radius:6px;
	cursor:pointer;
	height:11px;
	width:11px;
	margin-right:6px;
}

.views-slideshow-pager-field-item.active,
.views-slideshow-pager-field-item:hover {
	background:#464646;
}

.views-slideshow-pager-field-item:last-child {
	margin-right:0px;
}

/* Home page small features */

.view-display-id-small_features ul {
	overflow:auto;
}

.view-display-id-small_features ul li {
	float:left;
	margin-right:10px;
}

.view-display-id-small_features ul li.views-row-last {
	margin-right:0;
}

.view-display-id-small_features ul li a {
	display:block;
}

.view-display-id-small_features ul li > a {
	height:178px;
}

.view-display-id-small_features li h2 a {
	font-weight:normal;
	text-transform:lowercase;
	color:#464646;
	font-size:18px;
	background:#c5e2ea;
	padding:2px 10px;
}

.view-display-id-small_features li:hover h2 a {
	background:#91c9da;
}

/* ---- All product displays  ---- */

.field-name-commerce-price {
	font-weight:bold;
	font-size:14px;
}

/* Product display for Category landing pages, sub-category landing pages, and Related products */

.view.product-list li.views-row,
#block-views-related-products-block-block .views-row {
	width:230px;
	height:382px;
	margin-right:17px;
	float:left;
	position:relative;
	font-size:11px;
	line-height:1.2em;
}

.view.product-list li:nth-child(3n),
#block-views-related-products-block-block .views-row:nth-child(3n) {
	margin-right:0;
}

.view.product-list li .node .content {
	padding:10px;
}

#content .view.product-list li .node h2 {
	margin:4px 0 8px;
	font-size:14px;
	height:2em;
	line-height:1.2em;
}

.view.product-list .node .content .field {
	margin-bottom:5px;
}

.view.product-list .field-name-commerce-price {
	margin-top:12px;
}

/* Adjustments for Related products */

#block-views-related-products-block-block {
	clear:left;
	overflow:auto;
	padding-top:50px;
}

#block-views-related-products-block-block h2 {
	width:160px;
	padding-top:30px;
	float:left;
	font-weight:normal;
	font-size:22px;
	text-transform:lowercase;
	line-height:1.1em;
	color:#464646;
}

#block-views-related-products-block-block .views-row {
	width:160px;
	height:auto;
}

#block-views-related-products-block-block h3 {
	font-size:12px;
	margin-top:8px;
}

/* ---- Category and sub-category landing pages --- */

.page-taxonomy #block-system-main {
	margin-bottom:30px;
}

.page-taxonomy #content h1 {
	text-transform:lowercase;
	color:#464646;
	font-size:30px;
}

.page-taxonomy #content .block-views {
	overflow:auto;
}

/* ---- Product pages ---- */

.node-type-product-display .region-content {
	overflow:auto;
}

.node-type-product-display #block-system-main {
	float:left;
	width:600px;
}

.node-type-product-display #block-system-main .field-name-field-product-image {
	float:left;
	margin:0px 20px 0 0;
	text-align:center;
}

.node-type-product-display #block-system-main .content {
	padding-top:20px;
	overflow:auto;
}

.node-type-product-display #content h1 {
	font-size:16px;
	font-weight:bold;
	margin:20px 0 1em;
}

.node-type-product-display .field-name-field-product-description {
	font-size:14px;
	line-height:1.3;
	margin-bottom:20px;
}

/* Size/Skin type fields */

.node-type-product-display .field-name-field-product-size,
.node-type-product-display .field-name-field-product-skintype {
	overflow:auto;
}

.node-type-product-display .field-label {
	width:70px;
	float:left;
}

.node-type-product-display .field-name-field-product-size .field-items,
.node-type-product-display .field-name-field-product-skintype .field-items {
	float:left;
	width:235px;
}

.node-type-product-display #skin-type-link {
	text-indent:70px;
	margin-bottom:40px;
}

/* Price/Add to cart buttons */

.node-type-product-display .field-name-commerce-price {
	float:left;
	font-size:16px;
}

.node-type-product-display .field-name-field-product-reference {
	float:right;
}

.node-type-product-display .field-name-field-product-reference .form-item {
	display:inline-block;
	margin:0 8px 0 0;
}

.node-type-product-display .field-name-field-product-reference label {
	width:auto;
	padding-right:3px;
}

.node-type-product-display .field-name-field-product-reference input#edit-quantity {
	width:1em;
}

/* option fields */

.node-type-product-display .field-name-field-product-reference #edit-line-item-fields {
	display:inline;
}

.node-type-product-display .field-widget-options-select {
}

/* Ingredients/Use icons */

#block-views-ingredients-use-pop-outs-block {
	width:55px;
	margin:40px 25px 0 40px;
	float:left;
}

#block-views-ingredients-use-pop-outs-block .views-field a {
	display:block;
	text-indent:-9999px;
	height:44px;
	width:56px;
	margin-bottom:20px;
	background:url(../images/ingredients-howto-sprites.png) top left no-repeat;
}

#block-views-ingredients-use-pop-outs-block .views-field-colorbox a {
	background-position:0 0;
}

#block-views-ingredients-use-pop-outs-block .views-field-colorbox-1 a {
	background-position:0 -59px;
}

/* Colorbox Overlays */

#cboxLoadingOverlay {
	background:#ffffff;
}

#cboxLoadingGraphic {
	background:url(../images/loading.gif) no-repeat center center;
}

#cboxLoadedContent {
	background:#f5f5f5;
	color:#464646;
	overflow:auto;
}

#cboxLoadedContent div {
	padding:10px;
}

#cboxLoadedContent h1 {
	background:url(../images/ingredients-howto-sprites.png) top left no-repeat;
	width:96px;
	height:91px;
	float:left;
	text-indent:-9999px;
}

#cboxLoadedContent #colorbox-inline-1 h1 { /* Ingredients */
	background-position:-68px -4px;
}

#cboxLoadedContent #colorbox-inline-2 h1 { /* How to use */
	background-position:-72px -108px;
}

#colorbox .content {
	overflow:auto;
	padding:40px 40px 20px 20px;
	height:365px;
}

#colorbox h2 {
	color:#148bac;
	font-size:16px;
}

#colorbox h2 + p {
	color:#148bac;
	margin-bottom:1.5em;
}

/* ---- Social links ---- */

.region-social {
	margin-top:20px;
}

#content .region-social p {
	margin-bottom:0;
}

#block-block-7,
#block-block-8,
#block-block-9,
#block-sharethis-block-sharethis-block {
	padding:0 8px;
	position:relative;
}

#block-block-8,
#block-block-9,
#block-sharethis-block-sharethis-block {
	float:right;
}

#block-block-8,
#block-block-9 {
	border-right:1px solid #999999;
}

/* Personalize links */

#block-block-7 {
	font-weight:bold;
	font-size:11px;
	padding:4px 0;
	float:left;
	clear:both;
}

.front #block-block-7 {
	font-size:14px;
}

#block-block-7 p a {
	padding-left:19px;
	background:url(../images/sprites.png) 2px -52px no-repeat;
}

/* Facebook like block */

#block-block-8 a#facebook-like {
	height:24px;
	display:block;
}

/* "join us" Mailchimp link */
#block-block-9 {
	padding:3px 8px;
}

#block-block-9 p {
	margin:0;
}

#block-block-9 a.colorbox-inline {
	background:url(../images/sprites.png) right -109px no-repeat;
	padding-right:27px;
	color:#464646;
	text-transform:lowercase;
}

/* Share links */
#content .region-social .block h2 {
	float:left;
	font-size:12px;
	font-weight:normal;
	text-transform:lowercase;
	color:#464646;
	margin:0 2px 0 0;
}

.region-social #block-sharethis-block-sharethis-block {
	padding:3px 0 3px 8px;
}

/* Mailchimp form */

.region-social #block-mailchimp-lists-1,
#edit-mailchimp-lists-mailchimp-1-title {
	display:none;
}

#cboxLoadedContent #block-mailchimp-lists-1 div.form-item {
	padding:0;
}

#cboxLoadedContent #block-mailchimp-lists-1 div.form-item label {
	width:120px;
}

#cboxLoadedContent #block-mailchimp-lists-1 input[type=submit] {
	margin-left:125px;
	padding:6px 8px;
}

/* applies to all colorboxes */
#cboxLoadedContent div {
	padding:0;
}

#cboxLoadedContent {
	padding:20px;
}

/* ---- Cart and checkout pages ---- */

.page-cart #content-container h1,
.page-checkout #content-container h1 {
	margin-bottom:25px;
	text-transform:lowercase;
}

/* Cart table */

.view-commerce-cart-form {
	font-size:13px;
}

.page-cart #content table,
.page-checkout #content table,
.view-commerce-line-item-table table,
.field-name-commerce-order-total {
	width:100%;
	margin-bottom:0;
}

.page-cart #content-container td,
.page-cart #content-container th,
.page-checkout #content-container td,
.page-checkout #content-container th {
	vertical-align:middle;
}

.view-commerce-cart-form .views-field-edit-delete input { /* remove button */
	background:none;
	border:none;
	text-transform:uppercase;
	font-weight:bold;
	color:#464646;
	cursor:pointer;
}

td.views-field-field-product-teaser-image {
	width:80px;
}

#content table .line-item-title {
	font-size:14px;
}

table .views-field-product-attributes .field-label,
table .views-field-product-attributes .field-items,
table .views-field-product-attributes .field-item {
	display:inline;
}

.page-cart table input[type='text'],
.page-checkout table input[type='text'] {
	width:30px;
}

.page-cart .views-field-commerce-total,
.page-checkout .views-field-commerce-total {
	font-weight:bold;
	width:60px;
}

.page-cart .line-item-summary,
.page-checkout .line-item-summary { /* Total line */
	margin-bottom:6px;
}

.page-cart .line-item-total,
.page-checkout .line-item-total {
	font-weight:bold;
	width:100%;
	background:#eeeeee;
	border-bottom:1px solid #148bac;
	color:#000000;
}

.page-cart .line-item-total span,
.page-checkout .line-item-total span {
	padding:4px 6px;
	display:inline-block;
}

.page-cart .line-item-total .line-item-total-raw,
.page-checkout .line-item-total .line-item-total-raw {
	width:60px;
	text-align:left;
}

.page-cart .commerce-line-item-actions,
.page-checkout .commerce-line-item-actions {
	margin-top:0;
}

.page-cart #continue-shopping {
	float:left;
	padding-left:20px;
	background:url(../images/sprites.png) 0 -160px no-repeat;
	text-transform:uppercase;
	font-weight:bold;
	font-size:11px;
}

/* Checkout page 2 */

#edit-customer-profile-billing label {
	width:100px;
}

.addressfield-container-inline > div.form-item {
	margin-bottom:0; /* no idea why there is a gap just in these fields! */
}

.addressfield-container-inline.locality-block > div.form-item {
	margin-bottom:-2em; /* no idea why there is a gap just in these fields! */
	float:none;
}

.commerce_fieldgroup_pane__group_checkout_instructions__1 .fieldset-wrapper {
	overflow:auto;
}

.field-name-field-commerce-instructions .form-type-textarea,
.field-name-field-commerce-instructions .form-type-textarea label,
.field-name-field-commerce-instructions .form-type-textarea .form-textarea-wrapper {
	display:block;
	margin-top:4px;
}

#edit-continue {
	margin-right:1em;
}

/* Checkout review; in a table for some reason ... */

body.page-checkout-review #content h1 {
	margin-bottom:4px;
}

#content-container table.checkout-review {
	margin-bottom:20px;
}

#content-container table.checkout-review tr.pane-title > td,
#content-container table.checkout-review tr.pane-data > td {
	border:none;
	padding:0;
}

#content-container table.checkout-review tr.pane-title td {
	font-size:20px;
	text-transform:lowercase;
	margin-bottom:10px;
	font-weight:normal;
	padding:20px 0 10px;
}

.field-name-commerce-customer-billing .field-label,
.field-name-commerce-customer-shipping .field-label,
.field-name-field-commerce-instructions .field-label {
	font-size:20px;
	text-transform:lowercase;
	margin-bottom:10px;
	font-weight:normal;
	padding:20px 0 10px;
}

.field-name-field-billing-contact-phone .field-label {
	font-size:12px;
	font-weight:400;
	font-style:normal;
	margin-top:-20px;
	margin-right:5px;
	text-transform:none;
}

.page-checkout-review .field-name-field-billing-contact-phone .field-label {
	margin-top:0;
}

body.page-admin-commerce .field-type-commerce-customer-profile-reference div.field-label {
	font-size:20px;
	text-transform:lowercase;
	margin-bottom:10px;
	font-weight:normal;
	padding:20px 0 10px;
}

#content-container table.checkout-review label {
	font-size:12px;
}

.field-name-commerce-order-total .commerce-price-formatted-components {
	width:100%;
}

#edit-contact { display:none; }

.form-item-customer-profile-shipping-shipasbill { display:none; }

/* #commerce-checkout-form-checkout #edit-cart-contents { display: none; } */

#edit-customer-profile-billing-field-billing-contact-phone {
	line-height:21px;
	margin-top:10px;
	padding-top:10px;
}

.field-name-field-billing-contact-phone {
	line-height:21px;
	margin-top:6px;
}

/* ---- Contact form ---- */

.page-contact #content form {
	margin:20px 40px 40px 0;
	padding:30px 40px;
	background:#f5f5f5;
}

.page-contact form input[type='text'] {
	width:250px;
	padding:4px 6px;
	color:#828282;
}

.page-contact form select {
	width:240px;
}

/* ---- Search page ---- */

/* Basic search form */

.page-search #edit-basic {
	background:#f5f5f5;
	padding:10px;
}

.page-search #edit-basic label {
	padding-right:2px;
}

.page-search #edit-basic .form-text {
	background:#ffffff;
}

.page-search #edit-basic .form-submit {
	padding:4px;
}

/* Advanced search box */

.page-search fieldset#edit-advanced {
	margin:0;
	clear:left;
}

.page-search fieldset#edit-advanced .fieldset-wrapper {
	background:#f5f5f5;
	padding:10px;
	overflow:auto;
}

.page-search fieldset#edit-advanced * {
	font-size:11px;
}

.page-search fieldset#edit-advanced label {
	font-size:12px;
	width:180px;
}

.page-search fieldset#edit-advanced .form-type-checkbox {
	margin-left:0;
}

/* Search results */

.page-search #content ol {
	list-style:none;
	margin-left:0;
}

.page-search #content h3 {
	font-weight:normal;
}

.search-results .search-snippet-info {
	padding-left:0;
}