/*****************************************************************************************

	Styles for the Mars Drinks Flavia UK Micro Site
	
	
	Colour Pallette
	--------------------------
	espresso 		= #5f504e (Light Brown)
	earlybirdBlue 	= #7aa4dd (Light Blue)
	goldenRoast 	= #f6a800 (Yellow)
	chaiSpice 		= #a8133e (Red/Purple)
	mocha 			= #512c1e (Dark Brown)
	marsBlue 		= #236093 (Dark Blue)
	herbalOrange 	= #e74c39 (Orange)
	baristaGreen 	= #799a05 (Green)
	
	
*****************************************************************************************/


/****************************************************************************
	Global Classes
****************************************************************************/

	.text-center{
		text-align: center;
	}
		
	/* CLEARFIX */
	.clearfix:after { content:""; display:block; clear:both; visibility:hidden; line-height:0; height:0; }
	.clearfix { display:block; }
	html[xmlns] .clearfix { display:block; }
	* html .clearfix             { zoom: 1; } /* IE6 */
	*:first-child+html .clearfix { zoom: 1; } /* IE7 */
	
	/* CLEAR */
	.clearL { clear: left; }
	.clearR { clear: right; }
	.clearB { clear: both; }
	
	/* FLOATS */
	.fl {float: left!important;}
	.fr {float: right!important;}
	.fn {float: none!important;}
	
	/* DISPLAY */
	.db { display: block!important; }
	.dn { display: none!important; }
	.dib { display: inline-block!important; }
	
	/* TEXT ALIGN */
	.tac { text-align: center; }
	.tar { text-align: right; }
	
	/* PADDINGS */
	.p0 { padding: 0!important;}
	.p10 {padding: 10px!important;}
	.p20 {padding: 20px!important;}
	.p30 {padding: 30px!important;}
	.p40 {padding: 40px!important;}
	.p50 {padding: 50px!important;}
	.p60 {padding: 60px!important;}
	
	.pt0 {padding-top: 0px!important;}
	.pt10 {padding-top: 10px!important;}
	.pt20 {padding-top: 20px!important;}
	.pt30 {padding-top: 30px!important;}
	.pt40 {padding-top: 40px!important;}
	.pt50 {padding-top: 50px!important;}
	.pt60 {padding-top: 60px!important;}
	
	.pb0 {padding-bottom: 0px!important;}
	.pb10 {padding-bottom: 10px!important;}
	.pb20 {padding-bottom: 20px!important;}
	.pb30 {padding-bottom: 30px!important;}
	.pb40 {padding-bottom: 40px!important;}
	.pb50 {padding-bottom: 50px!important;}
	.pb60 {padding-bottom: 60px!important;}

	.pl0 {padding-left: 0px!important;}
	
	.pr0 {padding-right: 0px!important;}
	

	/* MARGINS */
	.m0 { margin: 0!important;}
	.m10 {margin: 10px!important;}
	.m20 {margin: 20px!important;}
	.m30 {margin: 30px!important;}
	.m40 {margin: 40px!important;}
	.m50 {margin: 50px!important;}
	.m60 {margin: 60px!important;}
	
	.mt0 {margin-top: 0px!important;}
	.mt10 {margin-top: 10px!important;}
	.mt20 {margin-top: 20px!important;}
	.mt30 {margin-top: 30px!important;}
	.mt40 {margin-top: 40px!important;}
	.mt50 {margin-top: 50px!important;}
	.mt60 {margin-top: 60px!important;}
	
	.mb0 {margin-bottom: 0px!important;}
	.mb10 {margin-bottom: 10px!important;}
	.mb20 {margin-bottom: 20px!important;}
	.mb30 {margin-bottom: 30px!important;}
	.mb40 {margin-bottom: 40px!important;}
	.mb50 {margin-bottom: 50px!important;}
	.mb60 {margin-bottom: 60px!important;}
	
	/* HIDE ON MOBILE */
	@media screen and (max-width: 639px) {
		.mobileHide { display: none!important; }
	}
	/* HIDE ON DESKTOP */
	@media screen and (min-width: 640px) {
		.desktopHide { display: none!important; }
	}
	
	/* HTML */
		html {
			background-color: #fff;
			padding: 0;
			margin: 0;
		}
		body {
			font-family: 'proxima-nova' , arial , sans-serif;
			padding: 100px 0 0 0;
			margin: 0;
		}
			@media screen and (max-width: 900px) {
				body { padding-top: 0px; }
			}

	/* CENTRALISED WRAPPER FOR CONTENT */
		@media screen and (min-width: 1024px) {
			.wrapper {
				max-width: 990px;
				margin: auto;
				position: relative;
			}
		}
		@media screen and (max-width: 1023px) {
			.wrapper {
				padding: 0 10px;
				position: relative;
			}
		}
	
	/* IMG SCALING */
		.img img { display: block; }
		.imgScale img {
			display: block;
			min-height: 1px;
			height: auto!important;
	        width: 100%;
		}

	/* Columns */
		@media screen and (min-width: 768px) {
			.col2-3s { width: 66.6666%; }
		}
		@media screen and (min-width: 640px) {
			.col2, .col3, .col2-3s, .col2, .col4 { float: left; }
			.col2 { width: 50%;	}
			.col3 { width: 33.33333%; }
				.col3 .content { padding: 0px 20px; }
				.col4 .content { padding: 0px 20px; }
			.col4 { width: 25%; }
			
		}
		@media screen and (max-width: 639px) {
			.col3 .content { padding: 0 20px 60px; }
			.col3:last-child .content { padding-bottom: 0px; }
			.col4 .content { padding: 0 20px 60px; }
			.col4:last-child .content { padding-bottom: 0px; }
		}
		
	.introduction .revolve{
		position: relative;
		height: 565px;
	}
	
	.introduction .revolve img{
		position: absolute !important;
		right: 0px;
		top: 0px;
		display: none;
	}
	
	.introduction .revolve img:first-child{
		display: block;
	}
	
	
	
/****************************************************************************
	Header & Navigation
****************************************************************************/

	.head {
		background-color: #fff;
		width: 100%;
		padding: 10px 0;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 100;
	}
		@media screen and (max-width: 900px) {
			.head {
				position: static;
				left: initial;
				top: initial;
			}
		}
	/*---------------------------------------------------------------
		Logo
	---------------------------------------------------------------*/
	
		.head .logo {
			float: left;
			width: 120px;
		}
		
	/*---------------------------------------------------------------
		Phone Number CTA
	---------------------------------------------------------------*/
		
		@media screen and (min-width: 769px) {
			.head .phoneNumber {
				width: 160px;
			}
		}
		
		.head .phoneNumber {
			float: right;
			margin-bottom: 6px;
			color: #236093; /* Dark Blue */
			font-size: 20px;
		}
			.head .phoneNumber span {
				display: block;
				color: #bdbdbd;
				font-size: 14px;
			}
	
	/*---------------------------------------------------------------
		Navigation
	---------------------------------------------------------------*/
		
		@media screen and (max-width: 900px) {
			.head .navigation li { display: none; }
			.head .navigation li.mobileNav { display: block; }
			.head .navigation li.quote { display: block; margin-left: 4px; }
				
			.head .navigation li.social { display: block; }
		}
		@media screen and (max-width: 639px) {
			.head .navigation li.quote span { display: none; }
		}
		
		.head .navigation {
			float: right;
			font-size: 12px;
			text-align: left;
			padding: 0;
			margin: 0;
			list-style-type: none;
		}
			.head .navigation li {
				float: left;
				margin: 0 18px;
			}
			.head .navigation li.mobileNav,
			.head .navigation li.social { margin: 0 0 0 4px; }
			.head .navigation li.quote { margin-right: 0; }
			
				.head .navigation li a {
					display: inline-block;
					color: #236093; /* Dark Blue */
					text-decoration: none;
					line-height: 30px;
				}
					.head .navigation li.active a { font-weight: bold; }
					.head .navigation li a:hover { text-decoration: underline; }
				
				.head .navigation li.mobileNav a {
					background: url(../images/head/icon-mobileNav.png) center top no-repeat #efefef;
					background-size: 30px;
					width: 30px;
					height: 30px;
					overflow: hidden;
					text-indent: -1000px;
				}
					.head .navigation li.mobileNav.active a {
						background-color: #236093;
						background-position-y: -30px;
					}
				.head .navigation li.quote a {
					background-color: #236093; /* Dark Blue */
					color: #fff;
					font-weight: bold;
					padding: 0 15px;
				}					
				.head .navigation li.social a {
					width: 30px;
					height: 30px;
					overflow: hidden;
					text-indent: -1000px;
				}
					.head .navigation li.social.linkedIn a {
						background: url(../images/head/icon-linkedIn.png) center center no-repeat #4e4e4e; /* Grey */
						background-size: 100%;
					}
					.head .navigation li.social.twitter a {
						background: url(../images/head/icon-twitter.png) center center no-repeat #858585; /* Grey */
						background-size: 100%;
					}
					.head .navigation li.quote a:hover,
					.head .navigation li.social a:hover { text-decoration: none; opacity: 0.9; }
			
	/*---------------------------------------------------------------
		Mobile Navigation
	---------------------------------------------------------------*/
	
			.mobileNavigation {
				display: none;
				list-style-type: none;
				padding: 0;
				margin: 10px 0 0 0;
				border-top: solid #ccc 2px;
			}
				.mobileNavigation li {
					display: block;
					line-height: 4em;
					font-size: 14px;
					border-bottom: solid #eee 1px;
				}
					.mobileNavigation li:last-child { border-bottom: none; }
					
					.mobileNavigation li a {
						display: block;
						color: #236093; /* Dark Blue */
						text-decoration: none;
						padding: 0 20px;
					}
					.head .mobileNavigation li.active a { font-weight: bold; }
						
			@media screen and (min-width: 900px) {
				.head .navigation li.mobileNav { display: none; }
			}
		
		
/****************************************************************************
	H1-H6, Paragraphs
****************************************************************************/
	
	h1, h2, h3, h4, h5, h6 { margin: 0 0 10px 0; }
	h1 {
		font-size: 28px;
		text-transform: uppercase;
		line-height: 1em;
	}
	h2 {
		font-size: 28px;
		text-transform: uppercase;
		line-height: 1em;
	}
	h3 {
		font-size: 18px;
	}
	h4 {
		font-size: 24px;
		font-weight: normal;
	}
	h5 {
		font-size: 18px;
		font-weight: normal;
	}
	h6 { 
		font-size: 14px;
		font-weight: normal;
		line-height: 24px;
		color: #5f5e5e;
	}
	p, ul li {
		font-size: 12px;
		color: #636363;
	}
		p.blue { color: #236093; /* Mars Blue */ }
		p .blue { color: #236093; /* Mars Blue */ }
		p .green { color: #799a05; /* Barista Green */ }
		
		p.smallPrint { font-size: 10px; }
		
		a { text-decoration: none; }
			a:hover { text-decoration: underline; }
		
		sup {
			font-size: 0.5em;
			line-height: 100%;
		}
		
	@media screen and (max-width: 639px) {
		h1 { font-size: 24px; }
		h2 { font-size: 24px; }
		h4 { font-size: 18px; }
	}
	
	/*---------------------------------------------------------------
		Colour Combinations
	---------------------------------------------------------------*/
		
		.espresso h2, .espresso h3 				{ color: #5f504e; }
		.earlybirdBlue h2, .earlybirdBlue h3 	{ color: #236093; }
		.goldenRoast h2, .goldenRoast h3 		{ color: #f6a800; }
		.chaiSpice h2, .chaiSpice h3 			{ color: #a8133e; }
		.mocha h2, .mocha h3 					{ color: #512c1e; }
		.herbalOrange h2, .herbalOrange h3 		{ color: #e74c39; }
		.baristaGreen h2, .baristaGreen h3 		{ color: #799a05; }
		.baristaBlack h2, .baristaBlack h3 		{ color: #000201; }
		
		.espresso p span.highlight,
		.espresso h6 .highlight,
		.espresso p a.highlight 			{ color: #5f504e; }
		.earlybirdBlue h3 .highlight,
		.earlybirdBlue h6 .highlight,
		.earlybirdBlue p span.highlight,
		.earlybirdBlue p a.highlight	 	{ color: #7aa4dd; }
		.goldenRoast p span.highlight,
		.goldenRoast p a.highlight			{ color: #f6a800; }
		.chaiSpice p span.highlight,
		.chaiSpice p a.highlight			{ color: #a8133e; }
		.mocha p span.highlight,
		.mocha p span.a						{ color: #512c1e; }
		.herbalOrange p span.highlight,
		.herbalOrange p a.highlight 		{ color: #e74c39; }
		.baristaGreen p span.highlight,
		.baristaGreen p a.highlight 		{ color: #799a05; }
		.baristaBlack p span.highlight,
		.baristaBlack p a.highlight 		{ color: #000201; }
		
		p.espresso 		{ color: #5f504e; }
		p.earlybirdBlue { color: #7aa4dd; }
		p.goldenRoast 	{ color: #f6a800; }
		p.chaiSpice 	{ color: #a8133e; }
		p.mocha 		{ color: #512c1e; }
		p.herbalOrange 	{ color: #e74c39; }
		p.baristaGreen 	{ color: #799a05; }
		p.baristaBlack 	{ color: #000201; }
		
		.espresso ul li .highlight 			{ color: #5f504e; }
		.earlybirdBlue ul li .highlight		{ color: #7aa4dd; }
		.goldenRoast ul li .highlight		{ color: #f6a800; }
		.chaiSpice ul li .highlight			{ color: #a8133e; }
		.mocha ul li .highlight				{ color: #512c1e; }
		.herbalOrange ul li .highlight		{ color: #e74c39; }
		.baristaGreen ul li .highlight		{ color: #799a05; }
		.baristaBlack ul li .highlight		{ color: #000201; }
		
/****************************************************************************
	Banners
****************************************************************************/

	/*---------------------------------------------------------------
		container
	---------------------------------------------------------------*/
		
		.espresso .banner { background-color: #5f504e; }
		.earlybirdBlue .banner { background-color: #7aa4dd; }
		.goldenRoast .banner { background-color: #f6a800; }
		.chaiSpice .banner { background-color: #a8133e; }
		.mocha .banner { background-color: #512c1e; }
		.marsBlue .banner { background-color: #236093; }
		.herbalOrange .banner { background-color: #e74c39; }
		.baristaGreen .banner { background-color: #799a05; }
		.baristaBlack .banner { background-color: #000201;}
		
		.baristaBlack .banner #bannerText{ 
			background-image: url(../images/banners/barista_banner_top.jpg);
			background-position: center bottom;
			background-repeat: no-repeat;
			height: 420px;
		}
		.baristaBlack .banner h1{
			text-align: center;
			padding-top: 49px;
			background-image: url(../images/banners/barista-title.png);
			background-position: 50% 38px;
			background-repeat: no-repeat;
			padding-bottom: 20px;
			text-indent: -2000px;
			width: 100%;
			position: relative;
			overflow: hidden;
		}			
			
		.banner {
			background-size: auto 100%;
			background-position: center center;
			background-repeat: no-repeat;
			color: #fff;
			min-height: 350px;
			width: 100%;
			line-height: 28px;
			overflow-x: hidden;
		}
			.home .banner { background-size: 100% auto; }
			
			
			
			@media screen and (max-width: 640px) {
				
				.baristaBlack .banner #bannerText{
					background: none;
					height: auto;
				}
			
				.baristaBlack .banner h1{
					background-size: 223px;
					background-image: url(../images/banners/introducing-barista-mobile.png);
					padding-bottom: 106px;
					padding-top: 0px;
					background-position: 50% 25px;
				}
				
				.baristaBlack .banner{
					min-height: inherit;
				}
				
				.baristaBlack .banner #bannerText .wrapper::after{
					background: url(../images/banners/barista_banner_top.jpg);
					background-size: auto 212px;
					position: relative;
					width: 100%;
					height: 154px;
					float: left;
					visibility: visible;
					background-position: center bottom;
				}
				
				#mars-footer-panel.mars-footer-icons .mars-footer-list-right li{
					width: auto !important;
				}
				
			}
					
	/*---------------------------------------------------------------
		COLUMNS
	---------------------------------------------------------------*/
		
		.banner .col2, .banner .col3 { min-height: 350px; }
		.banner .col2 .content { padding: 60px 40px; }
		.banner .col3 .content { padding: 60px 20px; }
		
		.banner .col2.gradient,
		.banner .col3.gradient {
			background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0) 100%);
			background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(50%,rgba(0,0,0,0.3)), color-stop(100%,rgba(0,0,0,0)));
			background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 50%,rgba(0,0,0,0) 100%);
			background: -o-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 50%,rgba(0,0,0,0) 100%);
			background: -ms-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 50%,rgba(0,0,0,0) 100%);
			background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 50%,rgba(0,0,0,0) 100%);
		}
			
	/*---------------------------------------------------------------
		PLAY BUTTON & CALL TO ACTION
	---------------------------------------------------------------*/
		
		.banner .playBtn {
			background: url(../images/banners/btn-play.png) center center no-repeat;
			background-size: 100%;
			width: 50px;
			height: 50px;
			display: block;
			margin: 0 0 10px 100px;
			transition: all 0.4s;
			-webkit-transition: all 0.4s; /* Safari */
		}
			.banner .playBtn:hover { opacity: 0.8; }
			
			.banner .col3 .playBtn {
				margin: 0 auto 10px;
			}
			
		@media screen and (max-width: 1024px) {
			.banner .playBtn {
				width: 48px;
				height: 48px;
			}
		}
		
		.banner a.btn {
			border-color: #fff;
			border-width: 2px;
			color: #fff;
			font-weight: bold;
			margin-top: 10px;
		}
			.banner a.btn:hover { background-color: #fff; color: #236093; }
					
	/*---------------------------------------------------------------
		AROMAS
	---------------------------------------------------------------*/
		
		.banner .aroma {
			width: 166px;
			height: 350px;
			position: absolute;
			bottom: 0;
			right: 0;
			margin-right: -83px;
		}
			.banner .aroma.left { left: 0; right: inherit; }
			
			.espresso .banner .aroma 		{ background: url(../images/banners/aroma-espresso.png) center bottom no-repeat; }
			.earlybirdBlue .banner .aroma 	{ background: url(../images/banners/aroma-earlybirdBlue.png) center bottom no-repeat; }
			.goldenRoast .banner .aroma 	{ background: url(../images/banners/aroma-goldenRoast.png) center bottom no-repeat; }
			.chaiSpice .banner .aroma 		{ background: url(../images/banners/aroma-chaiSpice.png) center bottom no-repeat; }
			.mocha .banner .aroma 			{ background: url(../images/banners/aroma-mocha.png) center bottom no-repeat; }
			.marsBlue .banner .aroma 		{ background: url(../images/banners/aroma-marsBlue.png) center bottom no-repeat; }
			.herbalOrange .banner .aroma 	{ background: url(../images/banners/aroma-herbalOrange.png) center bottom no-repeat; }
			.baristaGreen .banner .aroma 	{ background: url(../images/banners/aroma-baristaGreen.png) center bottom no-repeat; }
			
			
			
	/*---------------------------------------------------------------
		CONTENT
	---------------------------------------------------------------*/
	
		.banner h6 	{ color: #fff; }
			.banner h6:last-child 	{ margin: 0; }
		.chaiSpice.drinks .banner h1 	{ color: #a8133e; }
		.chaiSpice.drinks .banner h6 	{ color: #636363; }
					
	/*---------------------------------------------------------------
		DRINKS BANNER
	---------------------------------------------------------------*/
		
		.drinks .banner .col3 { position: relative; }
			.drinks .banner .col3 .carousell {
				height: 350px;
				list-style-type: none;
				margin: 0;
				overflow: hidden;
			}
			
	/*---------------------------------------------------------------
		VIDEO STRUCTURE
	---------------------------------------------------------------*/
		
		#bannerText.hideText { display: none; }
		#bannerVideo {
			display: none;
			background-color: #151515;
			position: relative;
			padding: 40px 0;
		}
			#bannerVideo .closeBtn {
				background: url(../images/banners/video-close-btn.png) top center no-repeat #2a2a2a;
				width: 48px;
				height: 48px;
				border-radius: 48px;
				position: absolute;
				right: 40px;
				top: 40px;
			}
				#bannerVideo .closeBtn:hover { background-position-y: -48px; }
			
	/*---------------------------------------------------------------
		RESPONSIVE
	---------------------------------------------------------------*/
		
		/* Desktop Banner */
		@media screen and (min-width: 640px) {
			.home .banner 			{ background-image: url(../images/banners/home.jpg); }
			.technology .banner		{ background-image: url(../images/banners/technology.jpg); }
			.technologyRange .banner		{ background-image: url(../images/banners/technology.jpg); }
			.barista-main .banner		{ background-image: url(../images/banners/barista-header.jpg); }
			.c500 .banner		{ background-image: url(../images/banners/c500-header.jpg); }
			.drinks .banner 		{ background-image: url(../images/banners/drinks.jpg); }
			.about .banner 			{ background-image: url(../images/banners/about.jpg); }
			.sustainability .banner { background-image: url(../images/banners/sustainability.jpg); }
		}
		@media screen and (max-width: 639px) {
		}
		
		/* Sizing Banner ../images */
		@media screen and (min-width: 640px) and (max-width: 1023px) {
			.home .banner { background-size: auto 100%; }
			
			.drinks .banner .wrapper { padding: 0; }
			.drinks .banner .col3.mobileHide { display: none; }
			.drinks .banner .aroma { display: none; }
			.drinks .banner .col3 { width: 50%; }
			.drinks .banner .col3.gradient {
				background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
				background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0)));
				background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
				background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
				background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
				background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
			}
			.drinks .banner .col3.gradient .content { padding: 60px; }
			
			.about .banner .wrapper { padding: 0; }
			.about .banner .col3 { width: 50%; }
			.about .banner .col3.gradient {
				background: -moz-linear-gradient(left,  rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);
				background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.3)), color-stop(100%,rgba(0,0,0,0)));
				background: -webkit-linear-gradient(left,  rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
				background: -o-linear-gradient(left,  rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
				background: -ms-linear-gradient(left,  rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
				background: linear-gradient(to right,  rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
			}
			.banner .col3 .content { padding: 60px 30px 60px 50px; }
		}
		@media screen and (min-width: 1024px) and (max-width: 1279px) {
			.home .banner { background-size: cover; }
		}
		@media screen and (min-width: 1441px) {
			.banner { background-size: cover; }
		}
		
		@media screen and (min-width: 768px) and (max-width: 1279px) {
			/* VIDEO BANNER */
			#bannerVideo .closeBtn {
				right: 50%;
				top: 14px;
				z-index: 10;
				margin-right: -25px;
				border: solid #151515 1px;
			}
		}
				
		/* Mobile Banner */		
		@media screen and (max-width: 639px) {
		
			/* Image changes & Sizing */		
				.banner {
					background-size: auto 100%;
					background-position: right center;
				}
				.home .banner 			{ background-image: url(../images/banners/home-mobile.jpg); background-size: auto 100%; }
				.technology .banner 	{ background-image: url(../images/banners/technology-mobile.jpg); }
				.technologyRange .banner 	{ background-image: url(../images/banners/technology-mobile.jpg); }
				.barista-main .banner 	{ background-image: url(../images/banners/barista-main-mobile.jpg); }
				.c500 .banner 	{ background-image: url(../images/banners/c500-main-mobile.jpg); }
				.drinks .banner 		{ background-image: url(../images/banners/drinks-mobile.jpg); }
				.about .banner 			{ background-image: url(../images/banners/about-mobile.jpg); background-position: -80px center; }
				.sustainability .banner { background-image: url(../images/banners/sustainability-mobile.jpg); background-position: center center; }
				
			/* Box Model */		
				.banner .wrapper { padding: 0; }
					.banner .col3.gradient {
						background: -moz-linear-gradient(left,  rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
						background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.3)), color-stop(100%,rgba(0,0,0,0)));
						background: -webkit-linear-gradient(left,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
						background: -o-linear-gradient(left,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
						background: -ms-linear-gradient(left,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
						background: linear-gradient(to right,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
					}
					
					.banner .col2, .banner .col3 	{ min-height: 350px; }
					.banner .col2 .content 			{ padding: 40px 20px;  }
					.banner .col3 .content 			{ padding: 40px 25% 60px 20px; }
				
			/* Text & Content */		
				.banner h1 { line-height: 1em; }
				.banner h6 { line-height: 1.5em; }
				.banner .col3 .playBtn {
					width: 48px;
					height: 48px;
					margin: 10px 40px;
				}
				.banner .aroma { right: -24px; }
				.sustainability .banner .aroma { right: -24px; left: initial; }
				.drinks .banner .aroma { right: -24px; left: initial; }
				
			/* Drinks Banner */
				.drinks .banner { background-position: right center; }
					.drinks .banner .wrapper { min-height: 350px; padding: 0; }
					.drinks .banner .col3.gradient {
						position: absolute;
						left: 0px;
						top: 0px;
						z-index: 10;
					}
					.drinks .banner .col3 .content { padding: 40px 50% 0px 20px; }
					
					.drinks .banner .carousellHolder {
						position: absolute;
						right: 0;
						bottom: 0;
						width: 200px;
						overflow: hidden;
						top: initial;
						min-height: initial;
					}
					.drinks .banner .aroma { display: none; }
				
		}
				
/****************************************************************************
	Introduction
****************************************************************************/

	/*---------------------------------------------------------------
		container
	---------------------------------------------------------------*/
		
			.introduction { padding: 60px 0; }
			
			
						
			.introduction .content h6 { color: #636363; line-height: 24px; }
			.introduction .content p { line-height: 24px; }
			
			/* PAGE SPECIFIC */
				.drinks .introduction .content h2 { margin-bottom: 30px; }
				.drinks .introduction .content h6 { padding: 0 12%; }
				.barista .introduction .content h6 { padding: 0 27%; margin-bottom: 30px }

			.introduction .col3 .content ul { list-style-type: none; padding: 0; margin: 0; }
			.introduction .col3 .content ul li:before {
				content: "– ";
			}
			.introduction .content ul li {
				font-weight: bold;
				line-height: 24px;
				margin-bottom: 10px;
			}
				.introduction .col3 .content ul li.darkBlue { color: #236093; }
							
			.home .introduction .flaviaCreation {
				margin-top: -460px;
				margin-bottom: 0px;
				-webkit-transition: margin 1s; /* For Safari 3.1 to 6.0 */
			    transition: 		margin 1s;	
			}
			
			.home .introduction .flaviaCreation img{
				width: auto;
				position: relative;
				left: -280px;
			}

	/*---------------------------------------------------------------
		Move Image when Video Playing
	---------------------------------------------------------------*/
		
			.home .introduction .flaviaCreation.move {
				margin-top: -100px;
			}

	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
			@media screen and (min-width: 640px) and (max-width: 1023px) {
				.home .introduction .flaviaCreation {
					margin: -480px 0 40px -80px;
				}
			}
			@media screen and (max-width: 639px) {
				.introduction { padding: 40px 0; }
				.home .introduction .flaviaCreation {
					width: 260px;
					margin: -100px auto 0px;
					
				}
				
				.barista .introduction .content h6{
					padding: 0px;
				}
			}
			@media screen and (max-width: 320px) {
				.home .introduction .flaviaCreation {
					margin-top: -80px;
				}
			}

	/*---------------------------------------------------------------
		Logos
	---------------------------------------------------------------*/
		
		.introduction .logos {
			margin-top: 60px;
		}
			.introduction .logos .img {
				float: left;
				width: 9.11%;
				margin: 0 1%
			}
				.introduction .logos .img img {
					max-width: 106px;
					margin: 0 auto;
				}
				
			@media screen and (max-width: 639px) {
				.introduction .logos .img {
					width: 29.3333%;
					margin: 20px 2%;
				}
			}

/****************************************************************************
	Quote Panel
****************************************************************************/

	/*---------------------------------------------------------------
		Content
	---------------------------------------------------------------*/
		
		.quotePanel { padding: 60px 0; }
			.quotePanel .col2-3s .content { padding: 0 20px; }
			.quotePanel .img {
				float: right;
				width: 160px;
			}
		@media screen and (max-width: 479px) {
			.quotePanel .content { padding: 0; }
			.quotePanel .img { margin: 5%;	}
		}
		
	/*---------------------------------------------------------------
		Colours
	---------------------------------------------------------------*/
		
		.earlybirdBlue .quotePanel h6 	{ color: #7aa4dd; }
		.goldenRoast .quotePanel h6 	{ color: #f6a800; }
		.chaiSpice .quotePanel h6 		{ color: #a8133e; }
		.herbalOrange .quotePanel h6 	{ color: #e74c39; }
		.baristaGreen .quotePanel h6 	{ color: #799a05; }
		.black .quotePanel h6 			{ color: #000000; }
		

/****************************************************************************
	D-Cup Panel
****************************************************************************/

	/*---------------------------------------------------------------
		container
	---------------------------------------------------------------*/
		
		.espresso .dCupPanel 		{ background-color: #5f504e; /* EXPRESSO */  }
		.earlybirdBlue .dCupPanel 	{ background-color: #7aa4dd; /* EARLY BIRD BLUE */ }
		.herbalOrange .dCupPanel 	{ background-color: #e74c39; /* HERBAL ORANGE */ }
		.goldenRoast .dCupPanel		{ background-color: #5f504e; /* MOCHA */ } 
		.mocha .dCupPanel		{ background-color: #512c1e; /* MOCHA */ }
		.baristaBlack .dCupPanel	{ background-color: #000201; /* BLACK */ }
		
		.home .dCupPanel { background-image: url(../images/dcup/dcup-home.jpg); }
		.technology .dCupPanel { background-image: url(../images/dcup/dcup-home.jpg); }
		.technologyRange .dCupPanel { background-image: url(../images/dcup/dcup-home.jpg); }
		.barista-main .dCupPanel { background-image: url(../images/dcup/dcup-barista-main.jpg); }
		.c500 .dCupPanel { background-image: url(../images/dcup/dcup-c500-main.jpg); }
		.about .dCupPanel { background-image: url(../images/dcup/dcup-about.jpg); }
		.barista .dCupPanel { background-image: url(../images/dcup/dcup-barista.jpg); }
		
		.dCupPanel {
			position: relative;
			background-size: 54% auto;
			background-position: 0 20%;
			background-repeat: no-repeat;
		}
			.home .dCupPanel .col2 			{ background-image: url(../images/dcup/dcup-mask-chaiSpice.png); }
			.technology .dCupPanel .col2 	{ background-image: url(../images/dcup/dcup-mask-earlybirdBlue.png); }
			.technologyRange .dCupPanel .col2 	{ background-image: url(../images/dcup/dcup-mask-earlybirdBlue.png); }
			.barista-main .dCupPanel .col2 	{ background-image: url(../images/dcup/dcup-mask-mocca.png); }
			.c500 .dCupPanel .col2 	{ background-image: url(../images/dcup/dcup-mask-espresso.png); }
			.about .dCupPanel .col2 		{ background-image: url(../images/dcup/dcup-mask-espresso.png); }
			.barista .dCupPanel .col2 		{ background-image: url(../images/dcup/dcup-mask-baristaBlack.png); }
			
			.dCupPanel .lockupLogo {
				position: absolute;
				bottom: 0;
				left: 28%;
				z-index: 10;
			}
			
			.dCupPanel .col2 {
				float: right;
				position: relative;
				background-position: left top;
				background-size: auto 100%;
				background-repeat: no-repeat;
				width: 58%;
			}
				.dCupPanel .col2 .content {
					padding: 60px 40px 60px 200px;
					color: #fff;
					text-align: right;
					position: relative;
				}
					.dCupPanel .content h2 { color: #fff!important; }
					.dCupPanel .content h6 {
						line-height: 26px;
						color: #fff;
						margin-bottom: 20px;
					}
					.dCupPanel .content h6 span{
						border: 1px solid #FFF;
						padding: 3px;
						display: inline-block;
						padding-top: 0px;
						padding-bottom: 0px;
						line-height: 20px;
					}
					.dCupPanel .content p { color: #fff!important; }
					.dCupPanel .content ul { list-style-type: none; padding: 0; margin: 0 0 20px 0; }
					.dCupPanel .content ul li {
						color: #fff;
						line-height: 18px;
						margin-bottom: 12px;
					}
				
				.dCupPanel a.btn {
					border-color: #fff;
					color: #fff;
				}
					.dCupPanel a.btn:hover { background-color: #fff; }
					.earlybirdBlue .dCupPanel a.btn:hover { color: #236093; }
					.herbalOrange .dCupPanel a.btn:hover { color: #e74c39; }
					.espresso .dCupPanel a.btn:hover { color: #5f504e; }
					.mocha .dCupPanel a.btn:hover { color: #512c1e; }
					
					
				.dCupPanel p.smallPrint {
					margin-bottom: -20px;
				}

	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
			@media screen and (min-width: 1024px) and (max-width: 1120px) {
				.dCupPanel {
					background-size: auto 100%;
				}
				
				.barista .dCupPanel{
					background-size: 54% auto;
				}
			}
			@media screen and (min-width: 768px) and (max-width: 800px) {
				.about .dCupPanel {
					background-position: -150px 0;
				}
			}
			@media screen and (min-width: 640px) and (max-width: 1023px) {
				.dCupPanel {
					background-size: auto 100%;
				}
				.dCupPanel .col2 .content {
					padding: 60px 20px 60px 160px;
				}
				
				.barista .dCupPanel {
					background-size: 54% auto;
				}
			}
			
			
			@media screen and (min-width: 640px) and (max-width: 868px) {
				.barista .dCupPanel {
					background-size: 84% auto;
					background-position: -91px;
				}
			}
			
			@media screen and (max-width: 639px) {
				.dCupPanel {
					background-image: none!important;
				}
				
				.barista .dCupPanel .col2{
					background: none;
				}
				
				.barista .dCupPanel {
					background-image: none;
				}
				
				.dCupPanel:before {
					content: "";
					background-position: left center;
					background-repeat: no-repeat;
					background-size: 100% auto;
					display: block;
					width: 100%;
					height: 213px;
				}
				
				.barista .dCupPanel:before{
					background-image: url(../images/dcup/dcup-barista-mobile.jpg) !important;
				}
				
					.home .dCupPanel:before 		{ background-image: url(../images/dcup/dcup-home-mobile.jpg); }
					.technology .dCupPanel:before 	{ background-image: url(../images/dcup/dcup-home-mobile.jpg); }
					.technologyRange .dCupPanel:before 	{ background-image: url(../images/dcup/dcup-home-mobile.jpg); }
					.barista-main .dCupPanel:before 	{ background-image: url(../images/dcup/dcup-barista-main-mobile.jpg); }
					.c500 .dCupPanel:before 	{ background-image: url(../images/dcup/dcup-c500-main-mobile.jpg); }
					.about .dCupPanel:before 		{ background-image: url(../images/dcup/dcup-about-mobile.jpg); }
				
				.dCupPanel .lockupLogo {
					top: -85px;
					right: 10px;
					left: inherit;
				}
					.dCupPanel .lockupLogo img { width: 150px; }
				
				.dCupPanel .col2 {
					background: none;
					width: 100%;
				}
				.dCupPanel .col2 .content {
					text-align: left;
					padding: 40px 20px 40px;
				}
				.dCupPanel p.smallPrint {
					margin-bottom: 0px;
				}
			}
			
/****************************************************************************
	Superior Quality Panel
****************************************************************************/

	/*---------------------------------------------------------------
		Container
	---------------------------------------------------------------*/
		
		.goldenRoast .superiorQuality { background-color: #5f504e; }
		
		.superiorQuality {
			background-position: right top;
			background-repeat: no-repeat;
			background-size: auto 100%;
		}
			.about .superiorQuality { background-image: url(../images/superiorQuality/about.jpg); }
						
	/*---------------------------------------------------------------
		Content
	---------------------------------------------------------------*/
	
		.superiorQuality .col2 { width: 50%; }
			.superiorQuality .col2 .content {
				padding: 60px 40px;
				color: #fff;
			}
				.superiorQuality .content h2 {
					color: #fff!important;
					margin-bottom: 20px;
				}
				.superiorQuality .content h6 { line-height: 28px; color: #fff; }
				
				.superiorQuality a.btn {
					border-color: #fff;
					color: #fff;
					margin-top: 20px;
				}
					.superiorQuality a.btn:hover {
						background-color: #fff;
					}
					.goldenRoast .superiorQuality a.btn:hover { color: #5f504e; }
					
	/*---------------------------------------------------------------
		Resonsive
	---------------------------------------------------------------*/
	
		@media screen and (min-width: 480px) and (max-width: 1023px) {
			.superiorQuality {
				/*background-position: 150% top;*/
			}
				.superiorQuality .col2 { width: 55%; }
					.superiorQuality .col2 .content { padding: 100px 40px; }
		}
		@media screen and (max-width: 479px) {
			.superiorQuality {
				background-position: 50% top;
			}
				.goldenRoast .superiorQuality .wrapper { background-color: rgba(95,80,78,0.5); }
					.superiorQuality .col2 {
						width: 100%;
					}
						.superiorQuality .col2 .content { padding: 60px 40px 150px; }
		}

/****************************************************************************
	Did you know?
****************************************************************************/
	
	.didYouKnow {
		position: relative;
		height: 125px;
	}
		.didYouKnow .content {
			position: absolute;
			left: 50%;
			top: -125px;
			width: 250px;
			height: 250px;
			background-color: #fff;
			color: #236093;
			text-align: center;
			border-radius: 250px;
			margin-left: -125px;
		}
			.didYouKnow .content .padding { padding: 60px 30px; }
				
				.didYouKnow .content h5 {
					font-weight: bold;
					text-transform: uppercase;
				}
				.didYouKnow .content h6 { line-height: 1.4em; }
				
/****************************************************************************
	Hassle Free Technology
****************************************************************************/
	
	.hassleFree { padding: 0 0 60px; }
		.hassleFree .content { padding: 0 40px; }
		.hassleFree h2 {
			text-align: center;
			margin-bottom: 40px;
		}
			.hassleFree p {
				line-height: 2em;
			}
				.hassleFree p:first-child { margin-top: 40px; }
			.hassleFree .btn { margin-top: 20px; }
			
			.hassleFree .img { padding: 0 20px; }
			
	@media screen and (max-width: 767px) {
		.hassleFree p { margin: 0 0 20px; }
		.hassleFree .btn { margin-bottom: 40px; }
	}
	
/****************************************************************************
	5 Circles Area
****************************************************************************/

	/*---------------------------------------------------------------
		CONTENT
	---------------------------------------------------------------*/
		
		.fiveCircles {
			text-align: center;
			min-height: 250px;
			padding: 60px 0;
		}
			.fiveCircles h2 { line-height: 1.3em; padding: 0 120px; margin-bottom: 40px; }
			.fiveCircles h6 { line-height: 2em; color: #5f5e5e; }
			
			.fiveCircles .tapInstruction { display: none; }
			
			.fiveCircles .content { padding: 0 20px; }
			.fiveCircles .circles {
				width: 1250px;
				padding-top: 40px;
				margin: 0 auto;
			}
				.fiveCircles .circles .circle {
					border-radius: 250px;					
				}
					.about .fiveCircles .circles .circle {
						width: 20%;
						float: left;
					}
					
				.fiveCircles .circles .circleImage {
					background-position: center center;
					background-repeat: no-repeat;
					background-size: 100%;
				}
					.technology .fiveCircles .circles .firstImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-tech-01.jpg); }
					.technology .fiveCircles .circles .secondImage .circleImage { background-image: url(../images/fiveCircles/circleImage-tech-02.jpg); }
					.technology .fiveCircles .circles .thirdImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-tech-03.jpg); }
					.technology .fiveCircles .circles .fourthImage .circleImage { background-image: url(../images/fiveCircles/circleImage-tech-04.jpg); }
					.technology .fiveCircles .circles .fifthImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-tech-05.jpg); }
					
					.technologyRange .fiveCircles .circles .firstImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-tech-01.jpg); }
					.technologyRange .fiveCircles .circles .secondImage .circleImage { background-image: url(../images/fiveCircles/circleImage-barista-02.jpg); }
					.technologyRange .fiveCircles .circles .thirdImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-tech-03.jpg); }
					.technologyRange .fiveCircles .circles .fourthImage .circleImage { background-image: url(../images/fiveCircles/circleImage-barista-04.jpg); }
					.technologyRange .fiveCircles .circles .fifthImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-barista-05.jpg); }
					
					.barista-main .fiveCircles .circles .firstImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-barista-01.jpg); }
					.barista-main .fiveCircles .circles .secondImage .circleImage { background-image: url(../images/fiveCircles/circleImage-barista-02.jpg); }
					.barista-main .fiveCircles .circles .thirdImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-tech-03.jpg); }
					.barista-main .fiveCircles .circles .fourthImage .circleImage { background-image: url(../images/fiveCircles/circleImage-barista-04.jpg); }
					.barista-main .fiveCircles .circles .fifthImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-barista-05.jpg); }
					
					.c500 .fiveCircles .circles .firstImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-c500-05.jpg); }
					.c500 .fiveCircles .circles .secondImage .circleImage { background-image: url(../images/fiveCircles/circleImage-c500-03.jpg); }
					.c500 .fiveCircles .circles .thirdImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-c500-01.jpg); }
					.c500 .fiveCircles .circles .fourthImage .circleImage { background-image: url(../images/fiveCircles/circleImage-c500-04.jpg); }
					.c500 .fiveCircles .circles .fifthImage .circleImage 	{ background-image: url(../images/fiveCircles/circleImage-c500-02.jpg); }
					
					.about .fiveCircles .circles .circleImage.firstImage 	{ background-image: url(../images/fiveCircles/circleImage-about-01.jpg); }
					.about .fiveCircles .circles .circleImage.secondImage 	{ background-image: url(../images/fiveCircles/circleImage-about-02.jpg); }
					.about .fiveCircles .circles .circleImage.fourthImage 	{ background-image: url(../images/fiveCircles/circleImage-about-04.jpg); }
					.about .fiveCircles .circles .circleImage.fifthImage 	{ background-image: url(../images/fiveCircles/circleImage-about-05.jpg); }
				
				.fiveCircles .circles .circle .padding {
					padding: 60px 34px;
				}
				.fiveCircles .circles .circle p {
					color: #fff;
					font-size: 14px;
					line-height: 2em;
				}
					.about .fiveCircles .circles .circle p {
						line-height: 1.6em;
						padding: 35px;
					}
					.fiveCircles .circles .circle p.smallPrint {
						font-size: 8px;
						line-height: 10px;
					}
				
			.espresso .fiveCircles .circles .circle 		{ background-color: #5f504e; }
			.earlybirdBlue .fiveCircles .circles .circle 	{ background-color: #7aa4dd; }
			.goldenRoast .fiveCircles .circles .circle 		{ background-color: #f6a800; }
			.chaiSpice .fiveCircles .circles .circle 		{ background-color: #a8133e; }
			.mocha .fiveCircles .circles .circle 			{ background-color: #512c1e; }
			.marsBlue .fiveCircles .circles .circle 		{ background-color: #236093; }
			.herbalOrange .fiveCircles .circles .circle 	{ background-color: #e74c39; }
			.baristaGreen .fiveCircles .circles .circle 	{ background-color: #799a05; }
			
	/*---------------------------------------------------------------
		3D Animation
	---------------------------------------------------------------*/
		
		/* entire container, keeps perspective */
		.fiveCircles .flip-container {
			-webkit-perspective: 1000;
			-moz-perspective: 1000;
			-ms-perspective: 1000;
			perspective: 1000;
			-ms-transform: perspective(1000px);
			-moz-transform: perspective(1000px);
			-moz-transform-style: preserve-3d;
			-ms-transform-style: preserve-3d;
			
			float: left;
			width: 20%;
		}
			/* flip the pane when hovered */
		
		@media screen and (min-width: 1025px) {
			.flip-container:hover .flipper {
				-webkit-transform: 	rotateY(180deg);
				-ms-transform: 		rotateY(180deg);
				transform: 			rotateY(180deg);
			}
		}
		@media screen and (max-width: 1024px) {
			.flip-container.hover .flipper {
				-webkit-transform: 	rotateY(180deg);
				-ms-transform: 		rotateY(180deg);
				transform: 			rotateY(180deg);
			}
		}
				
		/* flip speed goes here */
		.fiveCircles .flip-container .flipper {
			-webkit-transition: 0.6s;
			-webkit-transform-style: preserve-3d;
			-ms-transition: 0.6s;
			-moz-transition: 0.6s;
			-moz-transform: perspective(1000px);
			-moz-transform-style: preserve-3d;
			-ms-transform-style: preserve-3d;
			transition: 0.6s;
			transform-style: preserve-3d;
			position: relative;
			
			width: 100%;
			height: 100%;
		}
		
		/* hide back of pane during swap */
		.fiveCircles .flip-container .front,
		.fiveCircles .flip-container .back {
			-webkit-backface-visibility: hidden;
			-moz-backface-visibility: hidden;
			-ms-backface-visibility: hidden;
			backface-visibility: hidden;
			-webkit-transition: 0.6s;
			-webkit-transform-style: preserve-3d;
			-moz-transition: 0.6s;
			-moz-transform-style: preserve-3d;
			-o-transition: 0.6s;
			-o-transform-style: preserve-3d;
			-ms-transition: 0.6s;
			-ms-transform-style: preserve-3d;
			transition: 0.6s;
			transform-style: preserve-3d;
			
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
		
		/* front pane, placed above back */
		.fiveCircles .flip-container .front {
			-webkit-transform: 	rotateY(0deg);
			-ms-transform: 		rotateY(0deg);
			transform: 			rotateY(0deg);
			z-index: 2;
		}
		
		/* back, initially hidden pane */
		.fiveCircles .flip-container .back {
		    -webkit-transform: 	rotateY(180deg);
			-ms-transform: 		rotateY(180deg);
			transform: 			rotateY(180deg);
		}
		
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (max-width: 1249px) {
			.fiveCircles h2 { padding: 0; }
			.fiveCircles .circles { width: 100%; }
		}
		
		@media screen and (max-width: 1024px) {
			.fiveCircles .tapInstruction { display: block; }
			.fiveCircles .tapInstruction p {
				font-size: 10px;
				text-transform: uppercase;
				margin: 0 0 30px 0;
			}
		}
		
		@media screen and (min-width: 1024px) and (max-width: 1280px) {
			
			.fiveCircles .circles .circle .padding { padding: 20% 15%; }
			
			.about .fiveCircles .circles .thirdImage p {
				line-height: 1.5em;
				padding: 30px 33px;
				margin: 0;
				font-size: 12px;
			}
		}
		
		@media screen and (min-width: 600px) and (max-width: 1023px) {
			.fiveCircles .circles .circle .padding { padding: 20px; }
			.fiveCircles .circles .circle p {
				font-size: 12px;
				line-height: 1.5em;
			}
			.about .fiveCircles .circles { width: 80%; }
			.about .fiveCircles .circles .circle {
				width: 50%;
			}
				.about .fiveCircles .circles .circleImage.thirdImage {
					float: none;
					clear: left;
					margin: 0 auto;
					width: 45%;
				}
					.about .fiveCircles .circles .thirdImage p {
						line-height: 1.8em;
						padding: 60px 39px;
						font-size: 14px;
					}
		}
		
		@media screen and (max-width: 599px) {
			.fiveCircles .flip-container,
			.about .fiveCircles .circles .circle {
				width: 50%;
			}
				.fiveCircles .flip-container.thirdImage {
					float: none;
					clear: left;
					margin: 0 auto;
				}
					.about .fiveCircles .circles .circleImage.thirdImage {
						float: none;
						clear: left;
						margin: 0 auto;
						width: 250px;
					}
				
				.fiveCircles .circles .circle .padding { padding: 20% 15%; }
				.fiveCircles .circles .fourthImage .circle .padding { padding: 13%; }
				.technology .fiveCircles .circles .circle p {
					font-size: 14px;
					line-height: 1.5em;
					
				}
				.technologyRange .fiveCircles .circles .circle p {
					font-size: 14px;
					line-height: 1.5em;
					
				}
				
				.barista-main .fiveCircles .circles .circle p {
					font-size: 14px;
					line-height: 1.5em;
					
				}
					.fiveCircles .circles .circle p.smallPrint { font-size: 6px; }
					
				.about .fiveCircles .circles p { padding: 20% 15%; }
		}
						
/****************************************************************************
	Triple Calls to Action
****************************************************************************/

	/*---------------------------------------------------------------
		Lead In Title
	---------------------------------------------------------------*/
		
		.tripleCallLead {
			position: relative;
			padding: 50px 0;
			text-align: center;
		}
			.espresso .tripleCallLead, .espresso .tripleCallLead:after { background-color: #5f504e; }
			.earlybirdBlue .tripleCallLead, .earlybirdBlue .tripleCallLead:after { background-color: #7aa4dd; }
			.goldenRoast .tripleCallLead, .goldenRoast .tripleCallLead:after { background-color: #f6a800; }
			.chaiSpice .tripleCallLead, .chaiSpice .tripleCallLead:after { background-color: #a8133e; }
			.mocha .tripleCallLead, .mocha .tripleCallLead:after { background-color: #512c1e; }
			.herbalOrange .tripleCallLead, .herbalOrange .tripleCallLead:after { background-color: #e74c39; }
			.baristaGreen .tripleCallLead, .baristaGreen .tripleCallLead:after { background-color: #799a05; }
			.baristaBlack .tripleCallLead, .baristaBlack .tripleCallLead:after { background-color: #000; margin-top: 4px;}
			
			.baristaBlack .tripleCallLead{background-image: url(../images/tripleCallLead/bg-pattern-barristaBlack.gif);background-repeat: repeat;}
			.baristaBlack .tripleCallLead:after{background-image: url(../images/tripleCallLead/bottom_arrow.gif);
background-repeat: no-repeat;
background-position: top left;
transform: none;
-ms-transform: none;
-webkit-transform: none;
width: 32px;
bottom: -20px;
background-color: #FFF;
				
			}
			
			.tripleCallLead h2, .tripleCallLead h4 { color: #fff; line-height: 1.3em; }
			.baristaBlack .tripleCallLead h4{
				font-weight: 100;
			}
			.baristaBlack .tripleCallLead h4 span{
				border: 1px solid #FFF;
				padding: 4px;
				display: inline-block;
				padding-top: 0px;
				padding-bottom: 0px;
				line-height: 27px;
				text-transform: uppercase;
			}
			
			.tripleCallLead h4 { margin: 0; }
			
			.tripleCallLead:after {
				content: "";
				width: 20px;
				height: 20px;
				position: absolute;
				left: 50%;
				bottom: -10px;
				margin-left: -10px;
				transform:rotate(45deg);
				-ms-transform:rotate(45deg); /* IE 9 */
				-webkit-transform:rotate(45deg); /* Opera, Chrome, and Safari */
			}
		
	/*---------------------------------------------------------------
		Triple Call to Action
	---------------------------------------------------------------*/
				
		.tripleCallToAction {
			padding: 60px 0;
			background-position: center bottom;
			background-repeat: no-repeat;
		}			
		@media screen and (min-width: 1026px) {
			.espresso .tripleCallToAction 		{ background-image: url(../images/tripleCallAction/vignette-espresso.png); }
			.earlybirdBlue .tripleCallToAction 	{ background-image: url(../images/tripleCallAction/vignette-earlybirdBlue.png); }
			.goldenRoast .tripleCallToAction 	{ background-image: url(../images/tripleCallAction/vignette-goldenRoast.png); }
			.chaiSpice .tripleCallToAction 		{ background-image: url(../images/tripleCallAction/vignette-chaiSpice.png); }
			.mocha .tripleCallToAction 			{ background-image: url(../images/tripleCallAction/vignette-mocha.png); }
			.herbalOrange .tripleCallToAction 	{ background-image: url(../images/tripleCallAction/vignette-herbalOrange.png); }
			.baristaGreen .tripleCallToAction 	{ background-image: url(../images/tripleCallAction/vignette-baristaGreen.png); }
		}
			
			.tripleCallToAction .col3 h3, .tripleCallToAction .col3 p {
				padding: 10px 0;
				margin: 0;
			}
				.tripleCallToAction .col3 p { border-top: solid #e0e0e0 1px; }
					.tripleCallToAction .col3 p .small { font-size: 10px; }
					.tripleCallToAction .col3 p .smaller { font-size: 8px; }
				
				.tripleCallToAction .col3 a.btn { margin: 20px 0px; }
				.tripleCallToAction .col3 h6 {
					font-weight: bold;
					text-transform: uppercase;
					color: #5f5e5e;
					margin: 0;
				}
				
				.tripleCallToAction .col3:nth-child(1) h3 {
					background: url(../images/tripleCallAction/header-technology-barista.jpg) right top no-repeat;
				}
				.tripleCallToAction .col3:nth-child(2) h3 {
					/*background: url(../images/tripleCallAction/header-drinks.jpg) right center no-repeat;*/
				}
				
				
				body.c500 .tripleCallToAction .col3:nth-child(1) h3 {
					background: url(../images/tripleCallAction/header-technology-c500.jpg) right top no-repeat;
				}
				
				body.barista-main .tripleCallToAction .col3:nth-child(1) h3 {
					background: url(../images/tripleCallAction/header-technology-barista.jpg) right top no-repeat;
				}
				
				body.technology .tripleCallToAction .col3:nth-child(1) h3 {
					background: url(../images/tripleCallAction/header-technology.jpg) right top no-repeat;
				}
				
				
				.no-bg{
					background: none !important;
				}
				
					@media screen and (min-width: 641px) and (max-width: 768px) {
						.tripleCallToAction .col3:nth-child(2) h3 { background-size: 60%; }
					}
				.tripleCallToAction .col3 h5 {
					text-transform: uppercase;
					color: #5f5e5e;
					margin: 0;
				}
				
			.barista .col4 a.btn{
				min-width: 0px;
				display: block;
			}
			
			.barista .col4 strong{
				text-transform: uppercase;
			}
			
			.barista .col4 a{
				font-weight: bold;
				color: black;
				margin-top: 25px;
			}
			
			.barista .col4 h6{
				margin-top: 10px;
			}
				
/****************************************************************************
	50/50 Panel
****************************************************************************/

	/*---------------------------------------------------------------
		Core
	---------------------------------------------------------------*/
	
		.fiftyFifty {
			padding: 60px 0;
			background-position: center bottom;
			background-repeat: no-repeat;
		}			
		@media screen and (min-width: 1026px) {
			.espresso .fiftyFifty 		{ background-image: url(../images/tripleCallAction/vignette-espresso.png); }
			.earlybirdBlue .fiftyFifty 	{ background-image: url(../images/tripleCallAction/vignette-earlybirdBlue.png); }
			.goldenRoast .fiftyFifty 	{ background-image: url(../images/tripleCallAction/vignette-goldenRoast.png); }
			.chaiSpice .fiftyFifty 		{ background-image: url(../images/tripleCallAction/vignette-chaiSpice.png); }
			.mocha .fiftyFifty 			{ background-image: url(../images/tripleCallAction/vignette-mocha.png); }
			.herbalOrange .fiftyFifty 	{ background-image: url(../images/tripleCallAction/vignette-herbalOrange.png); }
			.baristaGreen .fiftyFifty 	{ background-image: url(../images/tripleCallAction/vignette-baristaGreen.png); }
		}
			.fiftyFifty .content { padding: 0 20px; }
		
				.fiftyFifty .content ul { list-style-type: none; padding: 0; margin: 0; }
					.fiftyFifty .content ul li:before {
						content: "– ";
					}
					.fiftyFifty .content ul li {
						font-weight: bold;
						line-height: 24px;
						margin-bottom: 10px;
					}
						.introduction .content ul li.darkBlue { color: #236093; }
					
				.fiftyFifty .energyRating {
					position: absolute;
					bottom: -60px;
					right: -20px;
				}
				
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (max-width: 639px) {
			.fiftyFifty .col2:first-child { margin-bottom: 20px; }
		}
		
/****************************************************************************
	Mars Moments Panel
****************************************************************************/
	
	/*---------------------------------------------------------------
		Core
	---------------------------------------------------------------*/
		
		.marsMoments.debug { background-color: pink; }
		
		.marsMoments {
			background-repeat: no-repeat;
			padding: 100px 0;
			color: #fff;
			margin-bottom: 4px;
		}
			.home .marsMoments 			{ background-image: url(../images/marsMoments/home.jpg);  }
			.technology .marsMoments 	{ background-image: url(../images/marsMoments/barista.jpg); }
			.technologyRange .marsMoments 	{ background-image: url(../images/marsMoments/home.jpg); }
			.barista-main .marsMoments 	{ background-image: url(../images/marsMoments/technology.jpg); background-size: cover; }
			.c500 .marsMoments 	{ background-image: url(../images/marsMoments/c500.jpg); background-size: cover; }
			.drinks .marsMoments 		{ background-image: url(../images/marsMoments/drinks.jpg); }
			.about .marsMoments 		{ background-image: url(../images/marsMoments/drinks.jpg); }
			.contact .marsMoments 		{ background-image: url(../images/marsMoments/home.jpg); }
			.quote .marsMoments 		{ background-image: url(../images/marsMoments/drinks.jpg); }
			.barista .marsMoments 		{ background-color: #000; background-position: 30px 30px; padding: 60px 0;}
		
			.barista .marsMoments .wrapper{
				background-image: url(../images/marsMoments/segafredo.jpg);
				background-repeat: no-repeat; 
				background-position: -50px 0px;
			}
		
			.marsMoments .col { float: right; width: 60%; }
			.marsMoments .content {
				padding: 0 40px 0 0;
				position: relative;
			}
			.marsMoments h2 {
				font-size: 32px;
				color: #fff;
				line-height: 1.3em;
				margin: 0;
			}
			.marsMoments h3 {
				color: #fff;
				font-weight: normal;
				margin-bottom: 30px;
			}
			.marsMoments h4 {
				line-height: 1.3em;
				margin-bottom: 20px;
			}
			.marsMoments h6 {
				color: #fff;
				line-height: 1.3em;
				margin-bottom: 20px;
			}
			
			.marsMoments a.btn {
				border-color: #fff;
				border-width: 2px;
				color: #fff;
				font-weight: bold;
			}
				.marsMoments a.btn:hover { background-color: #fff; color: #236093; }
			
			.marsMoments p { color: #ccc; }
			
			.barista .marsMoments p{
				font-size: 14px;
				line-height: 25px;
				color: white;
				width: 70%;
			}
			
			.barista .marsMoments p.smallPrint{
				font-size: 10px;
				width: 100%;
				margin: 0px;
				color: #fff;
			}

	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (min-width: 1250px) {
			.marsMoments {
				background-position:  left center;
				background-size: 100% auto;
			}
		}					
		@media screen and (min-width: 421px) and (max-width: 1249px) {
			.marsMoments {
				background-position:  30% center;
				background-size: auto 100%;
			}
		}
		@media screen and (max-width: 420px) {
			.marsMoments {
				background-size: auto 100%;
				background-position:  10% center;
				padding: 0;
			}
				.home .marsMoments 			{ background-image: url(../images/marsMoments/home-mobile.jpg); }
				.technology .marsMoments 	{ background-image: url(../images/marsMoments/c400-mobile.jpg); }
				.technologyRange .marsMoments 	{ background-image: url(../images/marsMoments/home-mobile.jpg);  background-size: cover; }
				.barista-main .marsMoments 	{ background-image: url(../images/marsMoments/technology-mobile.jpg); background-size: cover; }
				.c500 .marsMoments 	{ background-image: url(../images/marsMoments/c500-mobile.jpg); }
				.drinks .marsMoments 		{ background-image: url(../images/marsMoments/drinks-mobile.jpg); }
				.about .marsMoments 		{ background-image: url(../images/marsMoments/drinks-mobile.jpg); }
			
				.marsMoments .wrapper {
					padding: 60px 10px;
					
					background: -moz-linear-gradient(left, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
					background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.3)), color-stop(100%,rgba(0,0,0,0)));
					background: -webkit-linear-gradient(left, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
					background: -o-linear-gradient(left, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
					background: -ms-linear-gradient(left, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
					background: linear-gradient(to right, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
				}
				.marsMoments .col { width: 100%; }
				.marsMoments .content { padding: 0 20px; }
		}
		
		@media screen and (max-width: 600px) {
			.marsMoments h2 { font-size: 24px; }
			.marsMoments h3 { font-size: 14px; margin-bottom: 20px; }
			.marsMoments h4 { font-size: 14px; }
			.barista .marsMoments h4 { font-size: 14px; }
			.barista .marsMoments{ padding-top: 0px;}
			.barista .marsMoments .wrapper{background-position: center top;padding-top: 194px;background-size: 257px;}
			.barista .marsMoments .col{width: 100%;}
		}
		
/****************************************************************************
	outroMerch
****************************************************************************/

	/*---------------------------------------------------------------
		Core
	---------------------------------------------------------------*/
		
		.outroMerch {
			padding: 60px 0;
		}
			.outroMerch .img {
				min-width: 320px;
				max-width: 1000px;
				text-align: center;
				padding: 0;
				margin: 0 auto 20px;
				overflow: hidden;
			}
			@media screen and (max-width: 640px) {
				.outroMerch .img img {
					width: 200%;
					margin-left: -10%;
				}
				
				body.c500 .outroMerch .img img{
					width: auto;
					max-width: 100%;
					margin-left: 0px;
				}
			}
			.outroMerch .col3 p {
				padding: 10px 0;
				margin: 0;
				border-top: solid #e0e0e0 1px;
			}
				.outroMerch .col3 p .small { font-size: 10px; }
				.outroMerch .col3 p .smaller { font-size: 8px; }

				
/****************************************************************************
	Drinks Panels
****************************************************************************/

	.drinksPanel {
		position: relative;
		padding: 0;
	}
		
	/*---------------------------------------------------------------
		IOS SCROLLER CORE
	---------------------------------------------------------------*/
		
		/* slider container */
		.iosslider {
			/* required */
			position: relative;
			top: 0;
			left: 0;
			overflow: hidden;
			width: 100%;
			height: 350px;
		}
		
		/* slider */
		.iosslider .slider {
			/* required */
			width: 100%;
			height: 100%;
		}
		
		/* slide */
		.iosslider .slider .slide {
			/* required */
			float: left;
			width: 100%;
			height: 100%;
		}
			.drinksPanel .iosslider .item {
				float: left;
				width: 100%;
				height: 100%;
			}
			
	/*---------------------------------------------------------------
		Scroll To Controls
	---------------------------------------------------------------*/
		
		.drinksPanel .slideSelectors {
			text-align: center;
			position: absolute;
			width: 100%;
			bottom: 40px;
			z-index: 2;
			padding: 0px;
		}
			.drinksPanel .slideSelectors .item {
				display: inline-block;
				width: 26px;
				border-radius: 30px;
				background-color: #000;
				color: #fff;
				font-weight: bold;
				font-size: 14px;
				text-align: center;
				text-decoration: none;
				line-height: 26px;
				margin: 2px 4px;
			}
				.drinksPanel .slideSelectors .item:hover {
					background-color: #eee;
					color: #000;
				}
				.drinksPanel .slideSelectors .item.selected {
					background-color: #fff;
					color: #000;
					width: 30px;
					line-height: 30px;
					margin: 0px 2px;
				}
								
	/*---------------------------------------------------------------
		ALTERRA
	---------------------------------------------------------------*/
				
		.drinksPanel.alterra {
			background-color: #141414;
		}
			.drinksPanel.alterra .iosslider {
				height: 500px;
			}
				.drinksPanel.alterra .iosslider .item {
					padding: 40px 0;
					height: 420px;
				}
			.drinksPanel.alterra .slideSelectors {
			
			}
				.drinksPanel.alterra .slideSelectors .item {
					background-color: #f47b20;
					color: #141414;
				}
					.drinksPanel.alterra .slideSelectors .item:hover 		{ background-color: #ffba86; }
					.drinksPanel.alterra .slideSelectors .item.selected 	{ background-color: #fffcdf; }
			
			.drinksPanel.alterra h6,
			.drinksPanel.alterra p {
				font-family: trebuchet MS, helvetica, arial;
				color: #fff;
				line-height: 24px;
			}
			
		/*---------------------------------------------------------------
			Slide 1
		---------------------------------------------------------------*/
					
			.drinksPanel.alterra .item1 {
				background: url(../images/drinksPanel/alterra-slide1-bg.gif) center bottom no-repeat;
			}
				.drinksPanel.alterra .item1 h6 {
					padding: 40px 50px 0 60px;
				}
					.drinksPanel.alterra .item1 .hardWorking { margin-top: -40px; }
				
		/*---------------------------------------------------------------
			Slide 2
		---------------------------------------------------------------*/
					
			.drinksPanel.alterra .item2 {
				background: url(../images/drinksPanel/alterra-slide2-bg.gif) center bottom no-repeat;
			}
				.drinksPanel.alterra .item2 .img.bg {
					background: url(../images/drinksPanel/alterra-slide2-image.jpg) left top no-repeat;
					height: 140px;
					padding-top: 230px;
				}
					.drinksPanel.alterra .item2 h6 { padding: 0 40px; }
					.drinksPanel.alterra .item2 .manRight {
						position: absolute;
						bottom: -84px;
						right: -84px; 
					}
	
		/*---------------------------------------------------------------
			Slide 3
		---------------------------------------------------------------*/
					
			.drinksPanel.alterra .item3 {
				background: url(../images/drinksPanel/alterra-slide3-bg.jpg) center center no-repeat;
			}
				.drinksPanel.alterra .item3 p { padding: 0 54px 0 74px; }
				
		/*---------------------------------------------------------------
			Slide 4
		---------------------------------------------------------------*/
					
			.drinksPanel.alterra .item4 {
				background: url(../images/drinksPanel/alterra-slide4-bg.jpg) center bottom no-repeat;
			}
				.drinksPanel.alterra .item4 .content { padding: 70px 30px 0; }
					.drinksPanel.alterra .item4 h6 { padding: 10px 0px 40px; }
					
					
					
					
	/*---------------------------------------------------------------
		ESPRESSO
	---------------------------------------------------------------*/
				
		.drinksPanel.espresso {
			background-color: #235137;
		}
			.drinksPanel.espresso .iosslider {
				height: 500px;
			}
				.drinksPanel.espresso .iosslider .item {
					padding: 40px 0;
					height: 420px;
				}
			.drinksPanel.espresso .slideSelectors {
			
			}
				.drinksPanel.espresso .slideSelectors .item {
					background-color: #235137;
					color: #235137;
				}
					.drinksPanel.espresso .slideSelectors .item:hover 		{ background-color: #235137; }
					.drinksPanel.espresso .slideSelectors .item.selected 	{ background-color: #235137; }
			
			.drinksPanel.espresso h6,
			.drinksPanel.espresso p {
				font-family: trebuchet MS, helvetica, arial;
				color: #fff;
				line-height: 24px;
			}
			
		/*---------------------------------------------------------------
			Slide 1
		---------------------------------------------------------------*/
					
			.drinksPanel.espresso .item1 {
				background: url(../images/drinksPanel/alterra-slide1-bg.gif) center bottom no-repeat;
			}
				.drinksPanel.espresso .item1 h6 {
					padding: 40px 50px 0 60px;
				}
					.drinksPanel.espresso .item1 .hardWorking { margin-top: -40px; }
				
		
					
	/*---------------------------------------------------------------
		BRIGHT TEA
	---------------------------------------------------------------*/
		
		.drinksPanel.brightTea {
			background-color: #c4d82e;
			background-image: url(../images/drinksPanel/brightTea-slideall-bg.jpg);
			background-position: center top;
			background-repeat: no-repeat;
			
		}
			.drinksPanel.brightTea .wrapper {
				width: 660px;
				padding-left: 330px;
			}
			.drinksPanel.brightTea .iosslider {
				height: 500px;
			}
				.drinksPanel.brightTea .iosslider .item {
					padding: 40px 0;
					height: 420px;
				}
				.drinksPanel.brightTea .slideSelectors .item {
					background-color: #231f20;
					color: #fff;
				}
					.drinksPanel.brightTea .slideSelectors .item:hover 		{ background-color: #454545; }
					.drinksPanel.brightTea .slideSelectors .item.selected 	{ background-color: #58beec; }
				
			.drinksPanel.brightTea .slideSelectors {
				position: absolute;
				width: 66%;
				bottom: 40px;
				z-index: 2;
				padding: 0px;
			}
				
				
			.drinksPanel.brightTea .content {
				padding: 0px 40px;
			}
				.drinksPanel.brightTea h3 {
					font-size: 30px;
					font-weight: normal;
					color: #bbd033;
					padding: 0 20px 0 80px;
					background-position: left top;
					background-repeat: no-repeat;
					min-height: 72px;
				}
				.drinksPanel.brightTea p {
					line-height: 24px;
				}
			
		/*---------------------------------------------------------------
			Slide 1
		---------------------------------------------------------------*/
			
			.drinksPanel.brightTea .item1 h3 { background-image: url(../images/drinksPanel/brightTea-slide1-title.png); }
				
				.drinksPanel.brightTea .item1 p b {
					color: #648326;
				}
			
		/*---------------------------------------------------------------
			Slide 2
		---------------------------------------------------------------*/
			
			.drinksPanel.brightTea .item2 { background: url(../images/drinksPanel/brightTea-slide2-bg.png) right 180px no-repeat; }
			
			.drinksPanel.brightTea .item2 h3 {
				background-image: url(../images/drinksPanel/brightTea-slide2-title.png);
				color: #f7901e;
			}
				.drinksPanel.brightTea .item2 p b {
					color: #cb700b;
				}
				
		/*---------------------------------------------------------------
			Slide 3
		---------------------------------------------------------------*/
			
			.drinksPanel.brightTea .item3 { background: url(../images/drinksPanel/brightTea-slide3-bg.png) right top no-repeat; }
			
				.drinksPanel.brightTea .item3 h3 {
					background-image: url(../images/drinksPanel/brightTea-slide3-title.png);
					color: #fdba00;
				}
					.drinksPanel.brightTea .item3 p b {
						color: #7b2a88;
					}
				
		/*---------------------------------------------------------------
			Slide 4
		---------------------------------------------------------------*/
			
			.drinksPanel.brightTea .item4 h3 {
				background-image: url(../images/drinksPanel/brightTea-slide4-title.png);
				color: #58beec;
				margin-bottom: 20px;
			}
				.drinksPanel.brightTea .item4 p b {
					color: #58beec;
				}
				
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (min-width: 640px) and (max-width: 1023px) {
			.iosslider { height: 300px; }
		}
		
		@media screen and (min-width: 768px) and (max-width: 1023px) {
			
			.drinksPanel.alterra .item2 .manRight { bottom: -134px; }
			.drinksPanel.alterra h6 { line-height: 1.6em; }
			.drinksPanel.alterra h6 .mobileHide { display: none; }
				.drinksPanel.alterra .item3 {
					background-size: auto 96%;
					background-position: 51% center;
				}
			
			.drinksPanel.brightTea { background-position: 48% top; }
				.drinksPanel.brightTea .wrapper {
					padding-left: 33.3333%;
					width: 66.6666%;
					padding-right: 0;
				}
					.drinksPanel.brightTea .slideSelectors { width: 66%; }
					
			.freshServePanel { background-position: 30% center!important; }
		}

		@media screen and (max-width: 639px) {
				
		/* ALTERRA */
			.drinksPanel.alterra .iosslider 		{ height: 420px; }
			.drinksPanel.alterra .iosslider .item 	{ height: 380px; padding: 20px 0; }
			.drinksPanel .slideSelectors { bottom: 20px; }
			
			/* Slide 1 */
				.drinksPanel.alterra .item1 .col3:first-child {
					float: left;
					width: 50%;
				}
				.drinksPanel.alterra .item1 .col3:nth-child(2) { clear: both; }
				.drinksPanel.alterra .item1 .col3:nth-child(3) {
					position: absolute;
					right: 0;
					top: 0;
					width: 50%;
				}
					.drinksPanel.alterra .item1 .col3:first-child img {
						width: 160px;
						margin-left: -10px;
						margin-bottom: -10px;
					}
					.drinksPanel.alterra .item1 h6 {
						padding: 20px 10px;
						font-size: 12px;
						line-height: 18px;
						margin: 0;
						min-height: 150px;
					}
					.drinksPanel.alterra .item1 .hardWorking { margin: 0; }
					
			/* Slide 2 */
				.drinksPanel.alterra .item2 .col3:first-child {
					float: left;
					width: 50%;
				}
				.drinksPanel.alterra .item2 .img.bg {
					background-size: auto 100%;
					background-position-x: center;
					padding-top: 210px;
					height: 145px;
				}
				.drinksPanel.alterra .item2 h6 {
					padding: 0px 15px;
					font-size: 12px;
					line-height: 18px;
				}
				.drinksPanel.alterra .item2 .manRight { display: none; }
				
			/* Slide 3 */
				.drinksPanel.alterra .item3 {
					background-size: auto 95%;
					background-position-y: 60px;
				}
				.drinksPanel.alterra .item3 .col3 {
					float: left;
					width: 50%;
				}
				.drinksPanel.alterra .item3 .col3:nth-child(1) .img {
					width: 220px;
					margin: -14px 0 0 -16px;
				}
				.drinksPanel.alterra .item3 .col3:nth-child(3) .img {
					width: 210px;
					margin: -20px 0 0 -30px;
				}
				.drinksPanel.alterra .item3 .col3:nth-child(3) p { display: none; }
				
			/* Slide 4 */
				.drinksPanel.alterra .item4 .col3 {
					float: left;
					width: 50%;
				}
				.drinksPanel.alterra .item4 .content { padding: 20px 10px 0 10px; }
				.drinksPanel.alterra .item4 .col3:nth-child(2) .img {
					width: 270px;
					z-index: 10;
					position: relative;
				}
				.drinksPanel.alterra .item4 .col3:nth-child(2) .img.rfaUtz {
					width: 100%;
					position: absolute;
					height: 20px;
					margin-left: -20px;;
				}
					.drinksPanel.alterra .item4 .col3:nth-child(2) .img.rfaUtz img {
						width: 200px;
						margin: auto;
					}
				.drinksPanel.alterra .item4 .col3:nth-child(3) .img { margin-top: 50px; }
				.drinksPanel.alterra .item4 h6 {
					padding: 10px 0px 10px;
					font-size: 12px;
					line-height: 22px;
				}
				
		/* BRIGHT TEA */
			.drinksPanel.brightTea {
				background-image: url(../images/drinksPanel/brightTea-slideall-bg-mobile.jpg);
			}
			.drinksPanel.brightTea .iosslider 			{ height: 400px; }
			.drinksPanel.brightTea .iosslider .item 	{ height: 360px; padding: 20px 0; }
				.drinksPanel.brightTea .wrapper {
					width: 320px;
					padding: 0px;
					margin: auto;
				}
				.drinksPanel.brightTea .slideSelectors { width: 100%; bottom: 10px; }
				.drinksPanel.brightTea h3 {
					background-size: auto 60%;
					font-size: 20px;
					padding: 0 20px 0 58px;
					margin: 0 0 0 10px;
				}
				.drinksPanel.brightTea .content {
					padding: 0px 20px 0 20px;
				}
				.drinksPanel.brightTea p {
					line-height: 20px;
					margin: 0 0 10px 0;
				}
				
			/* Slide 1 */
				.drinksPanel.brightTea .item1 .clearfix:nth-child(2) { background: url(../images/drinksPanel/brightTea-slide1-logos.png) right top no-repeat; }
				.drinksPanel.brightTea .item1 .content {
					padding: 0px 90px 0 20px;
				}
				
			/* Slide 2 */
				.drinksPanel.brightTea .item2 .col2 {
					width: 50%;
					float: left;
				}
					.drinksPanel.brightTea .item2 .col2:nth-child(1) .content { padding: 0px 10px 0 20px; }
					.drinksPanel.brightTea .item2 .col2:nth-child(2) .content { padding: 0px 20px 0 10px; }
					
			/* Slide 3 */
				.drinksPanel.brightTea .item3 {
					background: url(../images/drinksPanel/brightTea-slide3-bg.png) right top no-repeat;
					background-size: auto 45%;
					background-position: 160px 0;
				}
				.drinksPanel.brightTea .item3 .col2 {
					width: 50%;
					float: left;
				}
					.drinksPanel.brightTea .item3 .col2:nth-child(1) .content { padding: 0px 10px 0 20px; }
					.drinksPanel.brightTea .item3 .col2:nth-child(2) .content { padding: 0px 20px 0 10px; }
					
			/* Slide 4 */
				
				.drinksPanel.brightTea .item4 .col2 {
					float: left;
				}
					.drinksPanel.brightTea .item4 .col2:nth-child(1) { width: 55%; }
					.drinksPanel.brightTea .item4 .col2:nth-child(2) { width: 45%; }
					.drinksPanel.brightTea .item4 .col2:nth-child(1) .content { padding: 0px 10px 0 20px; }
					.drinksPanel.brightTea .item4 .col2:nth-child(2) .content { padding: 0px 20px 0 10px; }
					.drinksPanel.brightTea .item4 h3 { margin-bottom: 10px; }
					.drinksPanel.brightTea .item4 p {
						position: relative;
						z-index: 10;
					}
					.drinksPanel.brightTea .item4 .col2:nth-child(2) .img {
						width: 120%;
						margin-left: -23%;
						margin-top: 70px;
					}
		}
		
/****************************************************************************
	TEA LOVERS PANEL - ABOUT
****************************************************************************/

	/*---------------------------------------------------------------
		IOS SCROLLER CORE
	---------------------------------------------------------------*/
		
		.about .drinksPanel { margin-bottom: 4px; }
			.about .drinksPanel .iosslider { height: 380px; }
				.about .drinksPanel .iosslider .item {
					height: 300px;
					padding: 40px 0px;
				}
			.about .drinksPanel .slideSelectors { bottom: 20px; }

	/*---------------------------------------------------------------
		Slide 1
	---------------------------------------------------------------*/
		
		.about .drinksPanel .item1 .wrapper { padding-top: 30px; }
		
		.about .drinksPanel .item1 {
			background: url(../images/teaLovers/slide1-bg.jpg) center top no-repeat;
		}
			.about .drinksPanel .item1 h4 {
				color: #fff;
				text-transform: uppercase;
				padding-top: 20px;
			}
			.about .drinksPanel .item1 p {
				color: #fff;
				line-height: 24px;
			}
			.about .drinksPanel .item1 .btn {
				border-color: #fff;
				color: #fff;
				margin-top: 140px;
			}
				.about .drinksPanel .item1 .btn:hover {
					background-color: #fff;
					color: #236093;
				}

	/*---------------------------------------------------------------
		Slide 2
	---------------------------------------------------------------*/
					
		.about .drinksPanel .item2 {
			background: url(../images/teaLovers/slide2-bg.jpg) center top no-repeat;
		}
		.about .drinksPanel .item2 .content {
			padding: 30px 20px 0;
		}
			.about .drinksPanel .item2 h4,
			.about .drinksPanel .item2 p { color: #fff; }
			
			.about .drinksPanel .item2 h4 {
				font-weight: bold;
				text-transform: uppercase;
				line-height: 24px;
			}
			.about .drinksPanel .item2 p {
				line-height: 24px;
				margin-bottom: 20px;
			}
				.about .drinksPanel .item2 p b { color: #f6a800; }
				.about .drinksPanel .item2 p.smallPrint {
					font-size: 7px;
					line-height: 12px;
					color: #eee;
					margin: 0;
				}
			.about .drinksPanel .item2 .img {
				max-width: 270px;
				margin: 0 auto;
			}
			
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
					
		@media screen and (min-width: 640px) and (max-width: 768px) {
			
			.about .drinksPanel .item2 .col3 { width: 29%; }
				.about .drinksPanel .item2 .col3:first-child { width: 42%; }
			.about .drinksPanel .item2 h4 {
				font-size: 22px;
				line-height: 1em;
			}
			.about .drinksPanel .item2 p { line-height: 18px; }
			.about .drinksPanel .item2 .img { margin-top: 30px; }
			
		}
		@media screen and (max-width: 639px) {
			.about .drinksPanel .iosslider { height: 400px; }
			.about .drinksPanel .iosslider .item {
				height: 360px;
				padding: 20px 0px;
			}
			/* SLIDE 1 */
				.about .drinksPanel .item2 { background-size: auto 100%; }
				.about .drinksPanel .item2 .col3 { float: left; width: 42%; }
					.about .drinksPanel .item2 .col3:nth-child(1) { width: 58%; }
					
				.about .drinksPanel .item2 .content { padding: 20px 0; }
					.about .drinksPanel .item2 h4 {
						font-size: 16px;
						line-height: 18px;
					}
					.about .drinksPanel .item2 p {
						line-height: 16px;
						margin-bottom: 10px;
					}
					
					.about .drinksPanel .item2 .col3:nth-child(2),
					.about .drinksPanel .item2 .col3:nth-child(3) {
						position: relative;
						left: 20px;
						margin: 20px 0;
					}
					
			/* SLIDE 2 */
				.about .drinksPanel .item1 { background-size: auto 100%; }
					.about .drinksPanel .item1 .wrapper { padding: 20px; }
					.about .drinksPanel .item1 .col3:first-child { float: left; width: 50%; }
						.about .drinksPanel .item1 .col3:last-child .content { padding: 0; }
						.about .drinksPanel .item1 .btn { margin-top: 20px; }
		}
		
/****************************************************************************
	GALAXY HOT CHOCOLATE
****************************************************************************/

	/*---------------------------------------------------------------
		Core
	---------------------------------------------------------------*/
		
		.drinksPanel.galaxy {
			background-color: #60190e;
			background-image: url(../images/drinksPanel/galaxy-bg.jpg);
			background-position: center center;
			background-size: auto 100%;
			background-repeat: no-repeat;
			position: relative;
			padding: 40px 0;
		}
			@media screen and (min-width: 1441px) {
				.drinksPanel.galaxy { background-size: 100% auto; }
			}
			
			.drinksPanel.galaxy h6,
			.drinksPanel.galaxy p {
				 color: #fff;
				 line-height: 1.5em;
			}
				.drinksPanel.galaxy .col2-3s .content {
					padding: 0 20px 0 80px;
					position: relative;
					z-index: 5;
				}
				
				.drinksPanel.galaxy .col2-3s .content .triple {
					margin-bottom: 20px;
				}
				.drinksPanel.galaxy .col2-3s .content .triple .img:first-child { margin-left: 0; }
				.drinksPanel.galaxy .col2-3s .content .triple .img {
					float: left;
					width: 110px;
					margin-left: 6%;
				}
				
				.drinksPanel.galaxy .col2-3s .content .subTitle {
					max-width: 417px;
				}
				
				.drinksPanel.galaxy .col2-3s .content .pack {
					max-width: 147px;
					margin-right: 40px;
				}
				
				.drinksPanel.galaxy .cupGraphic {
					position: absolute;
					top: 0;
					right: 0;
					z-index: 1;
				}
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (max-width: 1159px) {
			.drinksPanel.galaxy .cupGraphic { display: none; }
		}
		
		@media screen and (max-width: 639px) {
			.drinksPanel.galaxy .col2-3s .content {
				padding: 0 20px;
			}
			.drinksPanel.galaxy .col2-3s .content .triple { padding-top: 20px; }
				.drinksPanel.galaxy .col2-3s .content .triple .img {
					width: 29%;
					margin: 2%!important;
				}
			.drinksPanel.galaxy .col2-3s .content .pack { margin: 20px auto; }
		}
		

/****************************************************************************
	Fresh Serve Panel
****************************************************************************/

	/*---------------------------------------------------------------
		Core
	---------------------------------------------------------------*/
		
		.freshServePanel {
			background: url(../images/drinksPanel/flavia-bg.jpg) center center no-repeat #e5e6e7;
			padding: 100px 0;
		}
			.freshServePanel .col2-3s .content {
				padding: 0 40px;
			}
			
			.freshServePanel h2 {
				text-transform: none;
				color: #005596;
				margin-bottom: 20px;
			}
			.freshServePanel h5 {
				text-transform: uppercase;
				color: #005596;
				position: relative;
				margin-bottom: 5px;
			}
				.freshServePanel h5:before {
					content: "";
					display: block;
					position: absolute;
					left: -90px;
					top: -10px;
					background-position: 0 0;
					background-repeat: no-repeat;
					width: 79px;
					height: 61px;
				}
				.freshServePanel h5.step1:before { background-image: url(../images/drinksPanel/flavia-step1.jpg); }
				.freshServePanel h5.step2:before { background-image: url(../images/drinksPanel/flavia-step2.jpg); }
				.freshServePanel h5.step3:before { background-image: url(../images/drinksPanel/flavia-step3.jpg); }
				
			.freshServePanel p {
				line-height: 1.8em;
				margin-top: 0;
			}
				
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (max-width: 639px) {
			.freshServePanel .col2-3s .content .content {
				padding: 0;
			}
			.freshServePanel p { margin-bottom: 40px; }
		}
		
/****************************************************************************
	Five Milestones Panel
****************************************************************************/

	/*---------------------------------------------------------------
		Core
	---------------------------------------------------------------*/
		
		.milestones {
			position: relative;
			overflow: hidden;
		}
			.milestones h2 { color: #f6a800; margin-bottom: 20px; }
			.milestones h5,
			.milestones h6 { color: #fff; line-height: 1.6em; }
						
	/*---------------------------------------------------------------
		Carousell
	---------------------------------------------------------------*/
		
		.milestones .tabs {
			position: absolute;
			width: 35px;
			padding: 20px 0;
			margin: 0 40px;
			top: 70px;
			left: 0;
			z-index: 10;
		}	
		
			.milestones .tabs a {
				background-color: #fff;
				width: 12px;
				height: 12px;
				display: block;
				border-radius: 12px;
				margin: 20px 10px;
				cursor: pointer;
			}
				.milestones .tabs a.current {
					background-color: transparent;
					border: solid #fff 2px;
					width: 14px;
					height: 14px;
					border-radius: 18px;
					margin: 20px 7px;
				}
				
		.milestones .box {
			width: 100%;
			height: 370px;
			position: relative;
			overflow: hidden;
			float: left;
			z-index: 5;
		}
			.milestones .box .vert {
				position: absolute;
				top: 0px;
				left: 0px;
				right: 0px;
			}
			
			.milestones .box .slide {
				display: none;
				background-position: center center;
				background-repeat: no-repeat;
				background-size: 100% auto;
			}
				.milestones .box .slide.slide1 { background-image: url(../images/milestones/carousell-image-1.jpg); }
				.milestones .box .slide.slide2 { background-image: url(../images/milestones/carousell-image-2.jpg); }
				.milestones .box .slide.slide3 { background-image: url(../images/milestones/carousell-image-3.jpg); }
				.milestones .box .slide.slide4 { background-image: url(../images/milestones/carousell-image-4.jpg); }
				.milestones .box .slide.slide5 { background-image: url(../images/milestones/carousell-image-5.jpg); }

				.milestones .box .slide .content {
					margin-left: 50%;
					padding: 100px 100px 0;
					height: 270px;
					background: url(../images/milestones/circle-bg.png) left center no-repeat;
				}
			
			.milestones .cheight {
				position: absolute;
				width: 100%;
				height: 100%;
			}

			
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (min-width: 1024px) and (max-width: 1100px) {
			.milestones .box .slide .content {
				padding: 80px 40px 0 100px;
				height: 290px;
			}
		}
		
		@media screen and (min-width: 769px) and (max-width: 950px) {
			.milestones .box .slide { background-size: auto 100%; }
				.milestones h2 { font-size: 26px; }
				.milestones h5 {
					font-size: 16px;
				}
		}
		@media screen and (min-width: 480px) and (max-width: 768px) {
			.milestones .box .slide { background-size: auto 100%; }
			.milestones .box { height: 400px; }
				.milestones .box .slide { background-size: auto 100%; }
					.milestones .box .slide .content {
						margin-left: 40%;
						padding: 80px 40px 0 100px;
						height: 340px;
					}
					.milestones h2 { font-size: 26px; }
					.milestones h5 {
						font-size: 16px;
					}
		}
		
		@media screen and (max-width: 479px) {
			.milestones .tabs { margin: 0 20px; }
			.milestones .box { height: 400px; }
				.milestones .box .slide { background-size: auto 100%; }
					.milestones .box .slide .content {
						margin-left: 20%;
						padding: 60px 20px 0 60px;
						height: 340px;
					}
					.milestones h5 {
						font-size: 16px;
					}
		}
	
/****************************************************************************
	Certified Coffee Panel
****************************************************************************/

	/*---------------------------------------------------------------
		Core
	---------------------------------------------------------------*/
		
		.certifiedCoffee {
			background: url(../images/certifiedCoffee/certifiedCoffee-bg.jpg) center top no-repeat #141414;
			min-height: 550px;
			margin-bottom: 4px;
		}
			.certifiedCoffee .col2-3s .content { padding: 100px 40px 60px; }
				.certifiedCoffee .col2-3s .content .content { padding: 0px 40px; }
			
			.certifiedCoffee .content h2 {
				text-indent: -1000px;
				color: #fff;
				overflow: hidden;
				background: url(../images/certifiedCoffee/certifiedCoffee-title.png) left top no-repeat;
				min-height: 35px;
			}
			.certifiedCoffee .content p {
				color: #fff;
				line-height: 1.8em;
				margin-bottom: 20px;
			}
				.certifiedCoffee .content p.herbalOrange { color: #e74c39; }
				
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
				
		@media screen and (max-width: 1023px) {
			.certifiedCoffee { background-position: 30% top; }
				.fiftyFifty .img { padding-bottom: 40px; }
				.fiftyFifty .energyRating { right: 0; }
		}
		@media screen and (max-width: 639px) {
			.certifiedCoffee {
				background-image: url(../images/certifiedCoffee/certifiedCoffee-bg-mobile.jpg);
				background-position: -110px -20px;
				/*background-size: 100% auto;*/
			 }
				 .certifiedCoffee .col2-3s .content { padding: 250px 20px 60px; }
					 .certifiedCoffee .col2-3s .content .content { padding: 0px; }
					 
					 .certifiedCoffee .content h2 {
						 background: none;
						 text-indent: 0;
						 overflow: visible;
					 }
		}
	
/****************************************************************************
	Quote & Contact Page
****************************************************************************/

	/*---------------------------------------------------------------
		Form
	---------------------------------------------------------------*/
		
		.contact .form,	
		.quote .form {
			float: left;
			width: 660px;
			min-height: 200px;
		}
			.contact .form .content,
			.quote .form .content {
				padding: 0 20px;
			}
			
				.contact .form h3,
				.quote .form h3 {
					line-height: 100%;
					padding-bottom: 10px;
					border-bottom: solid #e0e0e0 1px;
				}
					.contact .form h3 span.p,
					.quote .form h3 span.p {
						font-size: 12px;
						font-weight: normal;
						color: #636363;
						float: right;
					}
					
	/*---------------------------------------------------------------
		Right Panel
	---------------------------------------------------------------*/
		
		.contact .rightCol 	{ background-color: #5f504e; /*Light Brown*/ }
		.quote .rightCol 	{ background-color: #7aa4dd /*Light Blue*/ }
	
		.contact .rightCol,
		.quote .rightCol {
			float: left;
			width: 330px;
			color: #fff;
			margin-bottom: 40px;
		}
			.contact .rightCol .content,
			.quote .rightCol .content { padding: 20px; }
			
				.contact .rightCol h5,
				.quote .rightCol h5 {
					line-height: 100%;
					padding-bottom: 8px;
					margin: 0 0 10px;
					border-bottom: solid transparent 1px;
				}
					.contact .rightCol h5 { border-color: #7f7371; }
					.quote .rightCol h5 { border-color: #95b6e4; }
					
				.contact .rightCol p,
				.contact .rightCol ul li,
				.quote .rightCol p,
				.quote .rightCol ul li { color: #fff; line-height: 2em; }
				
				.contact .rightCol p,
				.quote .rightCol p {
					
					padding: 0;
					margin: 0 0 10px;
				}
				.contact .rightCol ul,
				.quote .rightCol ul {
					list-style-type: none;
					padding: 0;
					margin: 0 0 4px;
					border-top: solid #95b6e4 1px;
				}
					.contact .rightCol ul li,
					.quote .rightCol ul li {
						font-weight: bold;
						padding: 4px 0;
						border-bottom: solid #95b6e4 1px;
					}
				
				.contact .rightCol .btn,
				.quote .rightCol .btn {
					border-color: #fff;
					color: #fff;
				}
					.contact .rightCol .btn:hover,
					.quote .rightCol .btn:hover {
						border-color: transparent;
						color: #236093;
						background-color: #fff;
					}
					
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (max-width: 1023px) {
			.contact .form,	
			.quote .form,
			.contact .rightCol,
			.quote .rightCol {
				float: none;
				width: auto;
			}
			.contact .rightCol,
			.quote .rightCol {
				margin: 30px -10px 0px;
			}
			.contact .form .content,
			.quote .form .content {
				padding: 0;
			}
			.contact .form h3 span.p,
			.quote .form h3 span.p {
				float: none;
				display: block;
				font-size: 11px;
			}
			.contact .rightCol .content,
			.quote .rightCol .content {
				padding: 40px 20px;
			}
		}
		
/****************************************************************************
	Buttons
****************************************************************************/
	
	a.btn {
		display: inline-block;
		background-color: transparent;
		border: solid #236093 1px;
		font-size: 12px;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		line-height: 2em;
		color: #236093;
		min-width: 200px;
		padding: 0.6em 20px;
		margin: auto;
		
		transition: all 0.4s;
		-webkit-transition: all 0.4s; /* Safari */
	}
		a.btn:hover {
			background-color: #236093;
			color: #fff;
		}
		
	/* BARISTA a.brtn */
	.barista a.btn{border: solid #000 1px; color: black;cursor: pointer;}
			
			.barista a.btn:hover{background: #000; color: white;}
		
	a.btn.highlight {
		background-color: rgb(0,86,150);
		border-color: transparent;
		color: #fff;
	}
		a.btn.highlight:hover {
			background-color: rgba(0,86,150,0.8);
		}
	

	@media screen and (max-width: 1023px) {
		a.btn { min-width: initial; }
	}
	@media screen and (max-width: 639px) {
		a.btn { display: block; }
	}

/****************************************************************************
	Back to top
****************************************************************************/
	
	.backToTop {
		position: relative;
		display: block;
	}
		.backToTop:after {
			content: "";
			width: 48px;
			height: 48px;
			background: url(../images/footer/backToTop.png) center center no-repeat #fff;
			background-size: 100%;
			border-radius: 48px;
			position: absolute;
			left: 50%;
			bottom: -24px;
			margin-left: -24px;
		}
	
/****************************************************************************
	Footer
****************************************************************************/
	
	.footer { background-color: #5d4f4c; min-height: 100px; }
		
		.footer #mars-footer-panel {
			margin-top: 0px;
		}
			.footer #mars-footer-panel .mars-footer-container { margin-top: 60px; }
					
	/*---------------------------------------------------------------
		Responsive
	---------------------------------------------------------------*/
		
		@media screen and (max-width: 640px) {
			.footer-text{width:100%;font-size:82%;}
			.footer-left {padding-top: 10px;width: 100% !important;}
			#mars-footer-panel li {margin: 0 0 16px !important;}
			.footer-left-col{width:50% !important;}
			#mars-footer-panel .mars-footer-container {margin: 22px auto 0;max-width: 100% !important;min-width: 100% !important;width: 100% !important;}
			#mars-footer-panel .stream .var-narrow .tweet .header{padding:0 !important;}
			.footer-brewer {margin: 5% auto auto;width: 95% !important;}
		    .mars-footer-legal {margin: 3% auto 0 !important;width: 82%;}
		    #twitter-widget-0 .tweet .header .h-card .p-author {padding: 0 0 4px !important;}
		}



/* taylors section */
.taylors-section{
	width: 100%;
	position: relative;
	background: url(../images/taylors/taylors-banner.jpg) no-repeat;
	background-position: center top;
	background-size: cover;
	clear: both;
}

.taylors-section .wrapper{
	display: table;
	vertical-align: middle;
	width: 100%;
}

.taylors-section .wrapper .col2{
	display: table-cell;
	vertical-align: middle;
	float: none;
}

.taylors-section .wrapper .intro{
	padding-top: 30px;
	padding-bottom: 30px;
}

.taylors-section .wrapper .freshpack{
	text-align: right;
}

.taylors-section .wrapper .freshpack img{
	width: auto;
	max-width: 70%;
}

.taylors-section .wrapper .col2 .subtitle{
	font-size: 13px;
	line-height: 21px;
	color: white;
}

@media screen and (max-width: 640px){
	.taylors-section .wrapper .col2{
		width: 100%;
		display: block;
		text-align: center;
	}
	
	.taylors-section .wrapper .intro img{
		max-width: 60%;
	}
	
	.taylors-section .wrapper .freshpack img{
		max-width: 50%;
	}
	
}
/* taylors section */


/* segafredo section */
.segafredo-section{
	width: 100%;
	padding-top: 60px;
	padding-bottom: 60px;
	position: relative;
	background: url(../images/segafredo/segafredo-banner2.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
	clear: both;
}

.segafredo-section .wrapper .col2 .subtitle{
	font-size: 15px;
	clear: both;
	line-height: 25px;
	color: #000;
}

.segafredo-section .wrapper .freshpack{
	max-width: 100%;
	width: auto;
}

.segafredo-section .logo{
	max-width: 50%;
	width: auto;
	float: left;
}

@media screen and (max-width: 640px){
	.segafredo-section .wrapper .col2{
		width: 100%;
		display: block;
		text-align: center;
	}
	
	.segafredo-section .wrapper .col2 img{
		float: none;
	}
}
/* segafredo section */



/* yorkshire section */
.yorkshire-section{
	width: 100%;
	padding-top: 60px;
	padding-bottom: 60px;
	position: relative;
	background: url(../images/yorkshire-tea/banner.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
	clear: both;
}

.yorkshire-section .col1-3s{
	width: 33.3%;
	float: left;
}

.yorkshire-section .wrapper .intro,
.yorkshire-section .wrapper .freshpack{
	display: table-cell;
	float: none;
	vertical-align: middle;
}

.yorkshire-section .wrapper .black-opacity{
	background: rgba(0,0,0,0.8);
	color: white;
	padding: 20px;
	padding-top: 17px;
	padding-bottom: 17px;
	box-sizing: border-box;
}

.yorkshire-section .wrapper .black-opacity p{
	padding: 0px;
	margin: 0px;
	margin-bottom: 10px;
}

.yorkshire-section .wrapper .black-opacity p:last-child{
	margin-bottom: 0px;
}

.yorkshire-section .wrapper .subtitle{
	font-size: 13px;
	clear: both;
	line-height: 20px;
	color: #fff;
}
.yorkshire-section .wrapper .freshpack{
	text-align: right;
}

.yorkshire-section .logo{
	max-width: 50%;
	width: auto;
	float: left;
}

@media screen and (max-width: 640px){
	.yorkshire-section .wrapper .intro,
	.yorkshire-section .wrapper .freshpack{
		width: 100%;
		display: block;
		text-align: center;
	}
	
	.yorkshire-section .wrapper img{
		float: none;
	}
}
/* yorkshire section */




/* seedsofchange section */
.seedsofchange-section{
	width: 100%;
	position: relative;
	background: url(../images/seedsofchange/banner.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
	clear: both;
}

.seedsofchange-section .subtitle{
	color: white;
	font-size: 13px;
	line-height: 24px;
	padding-left: 15px;
}

.seedsofchange-section .freshpack{
	margin-left: 60px;
	box-sizing: border-box;
}
/* seedsofchange section */