/* HOME CSS */
@charset "utf-8";

/* ALL SCREEN SIZES /////////////////////////////////////// */


/** HERO / SLIDESHOW **/
#hero	{ height: 760px; background-image: url('/images/home/hero.jpg'); }
.tag { padding-top: 100px; }
.tag h1	{ margin-bottom: 0; }
.tag .greenButton			{ display: inline-block; }
.whiteBox		{ margin-top: -330px; }


.divider		{ clear: both; background: url('../images/global/divider.png') no-repeat center bottom; }
.moreInfo	{ display: inline; }
.video			{ position: relative; }
#award			{ display: block; position: absolute; top: -40px; left: -40px; width: 130px; height: 130px; background:  url('../images/home/award.png') no-repeat left top; }
.related .column{  position: relative; }
.brandURL		{ color: #FFAB03; }
.brandURL:hover	{ color: #FB7D36; }
.brandURL:active{ color: #FDD58C; }
.prodOptions	{ background-image: url('../images/global/prod_options_icons.png'); bottom: 5px; background-repeat: no-repeat; font-size: 1.2em; font-style: oblique; min-height: 35px; colour: #888!important; position: absolute; width: 35px; height: 35px; display: block; }
.gluten			{ background-position: left -71px; right: 50px; }
.dairy			{ background-position: left -151px; right: 2%; }

.imga			{ position: relative; display: block; }


/* FLAVOURS */
.highlight		{ font-size: 2.5em; color: #6B6B6B; margin: 0 0 1em 0; text-align: center; font-weight: bold; }
.highlight span	{ display: inline-block; padding-bottom: 0.5em; border-bottom: solid 1px #E5E5E5; }
.right			{ text-align: right; font-size: 2.2em; }
.ulink			{ color: #67B334; text-decoration: underline; }
.quarter		{ width: 24.5%; }

/* FEATURED */
.related .product			{ margin-bottom: 1.5em; }
.related .product .price	{ font-size: 1.4em; font-weight: 900; font-style: initial; color: #666; }
.related h1.heading 		{ margin: -0.5em 0 0.4em 0; font-size: 4em; }
.related h1.heading span	{ font-family: "Gudea", sans-serif; font-weight: normal; color: #6B6B6B; font-size: 0.6em; }


/* HOME DELIVERY */
.wood				{ background: #87562d url('/images/global/wood-bg.jpg') no-repeat left top; text-align: center; }
.we-deliver			{ height: 126px; margin-bottom: 60px; }
.wood h1, .wood h2	{ color: #FFF; display: inline-block; }
.we-deliver h1		{ font-family: "Pacifico"; width: 370px; background: url('/images/global/delivery-truck.png') no-repeat left center; padding-left: 110px; font-size: 7em; margin: 0 0 0 0.6em; }
.we-deliver h2		{ font-size: 4.2em; font-weight: normal; width: 190px; line-height: 1em; padding-top: 20px; margin: 0; }
.we-deliver p		{ width: 360px; display: inline-block; color: #fff; padding-top: 10px; text-align: left; }
.we-deliver p strong	{ color: #83F62E; }


/* ///////////////////////////// MEDIA QUERIES //////////////////////////////////////////////////////////// */

/* MOBILE PHONES  /////////////////////////////////////// */
@media screen and (max-width: 480px) {
	#orderNow 		{ margin-top: -40px; }
	#orderNow h1	{ width: 100%; }
	#orderNow p		{ width: 100%; }
	.divider		{ padding-bottom: 64px; }
	.shopping		{ margin-bottom: 20px; }
	.greenButton	{ padding: 10px 4% 13px!important; }
}

/* MOBILE PHONES & TABLETS PORTRAIT /////////////////////////////////////// */
@media screen and (min-width: 481px) and (max-width: 773px) {
	.shopping		{ width: 100%; margin-right: 0; }
	.shopping .greenButton, .shopping .button	{ width: 39%; float: left; }
	.greenButton	{ margin-right: 5%; }
	#createAccount	{ padding: 15px 4% 17px; }
	.twoCol			{ width: 35%;  margin-right: 2.7%; float: left; }
	.threeCol		{ width: 100%; margin-right: 0; float: none;  }
	.video			{ width: 55%; margin-right: 0; float: right; }

}

/* MOBILE PHONES & TABLETS PORTRAIT /////////////////////////////////////// */
@media screen and (min-width: 481px) {
	.divider		{ padding-bottom: 94px; }

}

/* ABOVE MOBILE PHONES & TABLETS PORTRAIT /////////////////////////////////////// */
@media screen and (max-width: 773px) {
	.desktopView	{ display: none; }
}

/* MOBILE TO 1279PX /////////////////////////////////////// */
@media screen and (max-width: 1279px) {

	/* SHOPPING */
	.greenButton	{ padding: 15px 4% 17px; }
}

/* TABLETS AND UP /////////////////////////////////////// */
@media screen and (min-width: 481px) and (max-width: 684px){
	.related .column{ height: 322px; }
}

/* TABLETS AND UP /////////////////////////////////////// */
@media screen and (max-width: 600px) {
	.quarter { width: 49%;	}
	.tag h1 { font-size: 5em; }
}

/* TABLETS AND UP /////////////////////////////////////// */
@media screen and (min-width: 685px) {
	.related .column{ height: 270px; }
}


/* FONT BREAK POINT /////////////////////////////////////// */
@media screen and (min-width: 774px) and (max-width: 1279px) {
	.threeCol	{ width: 30%; margin-right: 2.6%; }
	.threeCol .heading { font-size: 3.4em; }
	.video		{ width: 34.23%; margin-right: 0; }
	/* HOME DELIVERY */
	.shopping .button, .shopping .greenButton { font-size: 1.7em; }
	.shopping 	{ padding-bottom: 10px; }
	#createAccount	{ padding: 7px 4% 6px; }
	.shopping		{ padding-left: 4%; width: 20%; }

}

/* 960 AND ABOVE DESKTOPS /////////////////////////////////////// */
@media screen and (min-width: 774px) {
	.shopping 	{ border-left: solid 1px #CCC; }
	.tabletView	{ display: none; }

}

/* 960 to 1280 DESKTOPS /////////////////////////////////////// */
@media screen and (min-width: 481px) and (max-width: 1279px) {
	#orderNow h1	{ width: 30%; }
	#orderNow p		{ width: 65.5%; }
	.threeCol .heading { font-size: 3.4em; }
	.we-deliver h1 { padding-left: 90px; margin-left: 0.2em; font-size: 5.2em; width: 250px; }
	.we-deliver h2 { font-size: 3.8em; width: 170px; }
	.we-deliver p { margin: 0; width: 340px; font-size: 1.4em; }
}

@media screen and (max-width: 1024px) {
	.we-deliver h1	{ padding-left: 80px; margin-left: 0.2em; font-size: 4.5em; line-height: 75px; background-size: 70px; width: auto; }
	.we-deliver h2	{ font-size: 3.6em; margin-left: 10px; width: auto; }
	.we-deliver p	{ display: block; margin: 0 5%; padding-top: 0; width: auto; text-align: center; }
}

/* 1280 AND GREATER DESKTOPS /////////////////////////////////////// */
@media screen and (min-width: 1280px) {
	.shopping	 { padding-left: 54px; width: 212px; padding-bottom: 10px; }
	.threeCol	{ width: 340px; margin-right: 30px; }
	.video		{ width: 380px; margin-right: 0; }

	.greenButton	{ padding: 15px 23px 17px; }
	#createAccount	{ padding: 7px 23px 6px; }
}
