@charset "utf-8";
/* CSS Document */

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {

/*  HEADINGS  ============================================================================= */

/*  TYPOGRAPHY  ============================================================================= */

p, ol, ul, dl, address, button {
	margin-bottom : 1.5em;
	margin-top: 0;
	font-size : 1.1em; /* 16 / 16 = 1 */
	line-height: 1.4em;
}

/* LINKS =============================================================================  */

/* BUTTONS  ============================================================================= */

/* IMAGES ============================================================================= */

figcaption {
	padding: 0 5% 6px 5%;
}

.ads-success figure {
	width: 35%;
	float: left;
}

.ads-success img {
	
}

/* TABLES ============================================================================= */

	/* Force table to not be like tables anymore */
	table.responsive, 
	table.responsive thead, 
	table.responsive tbody, 
	table.responsive th, 
	table.responsive td, 
	table.responsive tr { 
		display: block; 
	}
	/* Hide table headers (but not display: none;, for accessibility) */
	table.responsive thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	table.responsive tr { border: 1px solid #f5f2e9; padding: 6px; margin-top:1em;}
	
	table.responsive th { border:none; padding:6px;}
	table.responsive td { 
		/* Behave  like a "row" */
		border: none;
		border-top: 1px solid #f5f2e9; 
		position: relative;
		padding-left: 30%; 
		font-size: 1em;
		width: 70%;
	}
	table.responsive td.product {
		padding-left: 1.5%;
		width: 97.5%;
		border-top: none;
		font-size:1.1em;
	}
	table.responsive td.product-image {
		padding-left: 1.5%;
		width: 25%;
		border-top: none;
	}
	table.responsive td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		right: 6px;
		white-space: nowrap;
	}	
	
	.responsive.basket-table td:nth-of-type(1):before { content: ""; }
	.responsive.basket-table td:nth-of-type(2):before { content: ""; }
	.responsive.basket-table td:nth-of-type(3):before { content: "Quantity"; }
	.responsive.basket-table td:nth-of-type(4):before { content: "Price"; }
	.responsive.basket-table td:nth-of-type(5):before { content: "Total"; }

/* FORMS ============================================================================= */

label {
	display:block;
	width:	100%;
	float: none;
	text-align: left;
}
input[type="radio"] {
	margin-left: 0;
}
form p {
	margin-bottom: 0.5em;
}

/*  MAIN LAYOUT	============================================================================= */

header, .maincontent, #maincontent, footer {
	width: 100%;
}
.nav, .ads, .menu, .content, #blog-header {
	width: 90%;
}

/*  HEADER (AND ELEMENTS) ============================================================================= */

header {
	text-align:center;
}
header img {
	width:65%;
	margin-top: 5px;
}
.tagline {
	font-size:90%;
	margin-bottom:2.5%;
	margin-left:0;
	margin-top:-3px;
}
@media only screen and (max-width: 340px) {
.tagline {
	font-size:80%;
}
}

#tabs li a,
#tabs li.tab-icon a,
#tabs li.blog a {
	padding: 6px 0 6px 1.5%;
	display: inline-block;
	float: left;
	margin: 0;
	text-decoration: none;
	font-weight: bold;
	font-size: 0.9em;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	width: 98.5%;
	border-top: 2px solid white;
	text-align:left;
}
#tabs li.tab-icon.search a {
	display: none;
}
#tabs li.login {
  display:inline;
}
.search-button {
 	position:absolute;
	top:5px;
	right:5px;
}

/*  SEARCH ============================================================================= */

.search-menu {
	text-align:center;
}

/*  SECTIONS  ============================================================================= */

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	margin: 0;
	float:none;
}

/*  GRIDS   ============================================================================= */
.span_3_of_3,
.span_2_of_3,
.span_1_of_3,
.span_2_of_2,
.span_1_of_2,
.span_1_of_7,
.span_1_of_4 {
	width: 100%; 
}

.span_1_of_3.padding {
	width: 90%;
}

/*  CONTENT  ============================================================================= */

.shop-content { 
	border-top: 1px solid #f5f2e9;
	border-bottom: 0;
}

#blog-header {
	padding: 0.5em 5%;
	background-color: #F4F1EA;
	margin-top: 0.5em;
}
#blog-header h1 {
	font-size:1.5em;
}
#blog-header p {
	font-size: 100%;
}
#breadcrumbs {
	display:none;
}

/*  NAVIGATION - LEFT COLUMN  ============================================================================= */

.nav {
	background-color: #F4F1EA;
	margin-left: 0;
	padding: 1.5% 5%;
}
.nav h2 {
	margin-left: 0;
}
.nav-menu {
	display: none;
	height: auto;
}
a#pull {
	display: block;
	position:absolute;
	top:5px;
	left:5px;
}

/*  CONTENT/ADS CONTAINER  ============================================================================= */

.copy-container {
	width: 100%;
}

/*  CONTENT - CENTRAL COLUMN  ============================================================================= */

.content {
	padding:0.5% 5% 2.5% 5%;
}
.copy {
	width: 100%;
	background-color: #F4F1EA;
}
.trial {
	display:none;
}
.content-ad {
	display:none;
}
.successTable {
	width:100%;
}
.successPics {
	width:100%;
}

/*  ADS/PROMO - RIGHT COLUMN  ============================================================================ */

.ads {
	width: 100%;
}
.ads .section {
	padding: 0;
}

/*  FOOTER  =================================================================================== */
footer {
	padding-top: 0;
	margin:0;
}

footer ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
	padding-bottom: 10px;
}

footer li {
	background-color: #edf6f6;
	font-size: 1em;
	padding: 6px 0 6px 2.5%;
	display: inline-block;
	float: left;
	margin: 0;
	text-decoration: none;
	font-weight: normal;
	font-size: 0.9em;
	width: 97.5%;
	border-bottom: 1px solid white;
	text-align:left;
}

/*  BACKGROUND COLOURS  ============================================================================= */

/*  GLOBAL OBJECTS ============================================================================= */

.beigecontainer {
	background-color: #fff;
}

.desktop,
.ads-bible, 
.search-box, 
.header-info {
	display:none;
}
.mobile {
 	display:inline;
}
.padding {
	padding: 5%;
}

/*  HEADER  ============================================================================= */

/* ======= SAVE FOR UPDATE WITH CATEGORIES ========*/

#categories {
  position:static;
}
#categories li {
  float:none;
}
#categories ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
}
#categories li a,
#categories p {
	background-color: #edf6f6;
	font-size: 1em;
	padding: 6px 0 6px 2.5%;
	display: inline-block;
	float: left;
	margin: 0;
	text-decoration: none;
	font-weight: normal;
	font-size: 0.9em;
	width: 97.5%;
	border-top: 2px solid white;
	text-align:left;
}
#categories li a:hover {
	background-color: #9D0000;
	color: #fff;
}
#categories p {
	margin-top: 10px;
}
/*  GRID COLUMN SETUP   ==================================================================== */



/*  NAVIGATION - LEFT COLUMN  ============================================================================= */
 

/*  CONTENT  ============================================================================= */
.checkout-stage {
	display:none;
}
.col.span_1_of_5.checkout-current,
.col.span_1_of_5.checkout-pending,
.col.span_1_of_5.checkout-completed {
	float: left;
}


}