/*
Theme Name: Eat Alternative
Theme URI: http://www.eatalternative.com
Description: Eat Alternative WordPress Theme
Version: 1.0
Author: Mitch Varro
Author URI: http://www.mitchvarro.com
*/

html {
	background: #000;
	background-image: url(images/main-background.jpg), url(images/main-header.jpg);
	background-repeat: repeat, repeat-x; 
	background-position: center center, top center;
	 
	width: 100%; 
	height: 100%; 
	margin: 0; 
	border: 0; 
	padding: 0; 
	font-family: Arial, Helvetica, sans-serif; 
	-webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

body {
	background-image: url(images/main-header.jpg);
	background-repeat: repeat-x; 
	background-position: top center;
	
	width: 100%; 
	height: 100%; 
	margin: 0 auto; 
	border: 0; 
	padding: 0; 
}


*:focus { outline: none; }
textarea { resize: none !important; }
input { border: 0; }

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #DDD;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #DDD;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #DDD;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #DDD;
}

input:invalid {
	box-shadow: none; 
    -moz-box-shadow: none;
}


.css_hide { display: none; }

.fl { float: left; }
.fr { float: right; }
.cr { clear: right; }
.cb { clear: both; }




/* anchor links / images */
a img { border-width: 0; margin: 0; }
a { color: #ff9500; text-decoration: none; position: relative; }
	a:hover, a.active { color: #ff9500 !important; }
	.icon { clear: left; display: inline-block; }
	.icon * { float: left; }
	.icon img { margin: 2px 5px; }


/* list styling */
ul,ol,li { margin: 0; padding: 0; }
	ul li { list-style: none; }


/* headers */
h1,h2,h3,h4,h5,h6 { 
	margin: 0; 
	padding: 0; 
	display: block; 
}




/* FONTS */

/* Quicksand */
@font-face {
	/* CSS3 */
	font-family: Quicksand Book; 
	font-style: normal; 
	font-weight: normal; 
	src: url('fonts/Quicksand_Book.eot'); /* IE9 */
	src: url('fonts/Quicksand_Book.woff') format('woff'), url('fonts/Quicksand_Book.ttf') format('truetype'), url('fonts/Quicksand_Book.svg') format('svg');
	
}

@font-face {
	/* CSS3 */
	font-family: Quicksand Bold; 
	font-style: normal; 
	font-weight: normal; 
	src: url('fonts/Quicksand_Bold.eot'); /* IE9 */
	src: url('fonts/Quicksand_Bold.woff') format('woff'), url('fonts/Quicksand_Bold.ttf') format('truetype'), url('fonts/Quicksand_Bold.svg') format('svg');
	
}

/* Walkway */
@font-face {
	/* CSS3 */
	font-family: Walkway Bold;
	src: url('fonts/Walkway_Bold.ttf'),
		 url('fonts/Walkway_Bold.eot'); /* IE9 */
	
}

@font-face {
	/* CSS3 */
	font-family: Walkway UltraBold; 
	font-style: normal; 
	font-weight: normal; 
	src: url('fonts/Walkway_UltraBold.eot'); /* IE9 */
	src: url('fonts/Walkway_UltraBold.woff') format('woff'), url('fonts/Walkway_UltraBold.ttf') format('truetype'), url('fonts/Walkway_UltraBold.svg') format('svg');
	
}


/* H1 */	
h1#main-banner a {
	width: 200px; 
	height: 75px; 
	float: left; 
}

/* H2 */
h2 {
	width: 100%; 
	float: left; 
	
	font-family: Quicksand Book; 
	font-size: 1.5em; 
	font-weight: normal; 
}

h2 a {
	color: #7f994c; 
}

/* H3 */
h3 {
	padding: 0 0 0 10px; 
	position: relative; 
	
	color: #6a8040; 
	font-family: Walkway UltraBold; 
	font-size: 1.13em; 
	font-weight: normal; 
	text-transform: uppercase; 
	letter-spacing: 0.09em; 
}

.article h3 {
	display: block; 
	float: left; 
	clear: both; 
}

h3 span {
	background: none; 
	width: 100%; 
	height: 100%; 
	display: block; 
	position: absolute; 
	z-index: 50; 
	top: 0; 
	left: 0; 
	
	/* CSS3 */
	background: -moz-linear-gradient(top,  rgba(255,255,255,0.75) 0%, rgba(255,255,255,0.75) 10%, rgba(255,255,255,0) 75%, rgba(255,255,255,0) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.75)), color-stop(10%,rgba(255,255,255,0.75)), color-stop(75%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0)));
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 10%,rgba(255,255,255,0) 75%,rgba(255,255,255,0) 100%);
	background: -o-linear-gradient(top,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 10%,rgba(255,255,255,0) 75%,rgba(255,255,255,0) 100%);
	background: -ms-linear-gradient(top,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 10%,rgba(255,255,255,0) 75%,rgba(255,255,255,0) 100%);
	background: linear-gradient(to bottom,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 10%,rgba(255,255,255,0) 75%,rgba(255,255,255,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfffffff', endColorstr='#00ffffff',GradientType=0 );
}

/* H4 */
h4 {
	padding: 0 0 10px 0; 
	position: relative; 
	
	color: #333; 
	font-family: Walkway UltraBold; 
	font-size: 1; 
	font-weight: normal; 
	text-transform: uppercase; 
	letter-spacing: 0.13em; 
}

.hr {
	width: 100%; 
	padding: 0 10px; 
	display: block; 
	box-sizing: border-box; 
	float: left; 
	clear: both; 
}

hr {
	width: 100%; 
	border: 0; 
	border-top: 1px solid #CCC; 
	box-sizing: border-box; 
	display: block; 
}

.time {
	color: #bfb199; 
	font-family: Quicksand Book; 
	font-size: 0.88em; 
	text-transform: uppercase; 
}




#responsive-menu-checkbox {
	opacity: 0; 
	position: absolute; 
}

.responsive-menu-label {
	display: none; 
	position: absolute; 
}

.article, #contact-form {
	
	/* CSS3 */
	border-radius: 3px; 
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
}

.article {
	margin: 0 0 15px 0; 
}

.article p {
	margin: 10px 0; 
	padding: 10px; 
	box-sizing: border-box; 
	display: block; 
	float: left; 
	
	color: #666; 
	font-size: 0.88em; 
}

#container { 
	margin: 0 auto; 
	position: relative; 
	display: block; 
}
	
	#breadcrumbs {
		height: 12px; 
		display: inline-block; 
		
		color: #556633; 
		font-size: 0.88em; 
		font-family: Arial, Helvetica, sans-serif; 
	}
	
	#breadcrumbs a {
		color: #99bf4c; 
		text-decoration: underline; 
	}


#content {
	background: #FFF; 
	height: auto; 
	padding-bottom: 30px; 
	
	position: relative; 
	display: block; 
	float: left; 
	
	/* CSS3 */
	border-radius: 10px; 
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px; 
	
	box-shadow:  0px 0px 10px 0px #666;
	-webkit-box-shadow:  0px 0px 10px 0px #666;
}

#main, #aside {
	margin: 10px; 
}

#information {
	width: 100%; 
	margin: 0 0 15px 0; 
}

#information tbody {
	padding: 0 5%; 
	box-sizing: border-box; 
}

#information td, #information th {
	width: 30%; 
	text-align: center; 
}

#information th {
	color: #666; 
	font-size: 0.75em; 
	font-weight: normal; 
}

#information td {
	color: #6a8040; 
	font-size: 1.13em; 
	font-family: Quicksand Bold; 
	font-weight: normal; 
}

#ingredients {
	padding: 0 0 15px 0; 
	float: left; 
	clear: left;
}

#ingredients div:not(.hr) {
	background: #eee; 
	padding: 20px; 
	box-sizing: border-box; 
	display: inline-block; 
	
	/* CSS3 */
	border-radius: 10px; 
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px; 
}

#ingredients ul {
	padding: 0 0 0 10px; 
}

#ingredients ul li {
	list-style: disc; 
}

#directions {
	width: 100%; 
	padding: 10px; 
	box-sizing: border-box; 
	display: block; 
	float: left; 
	clear: both; 
}

#directions ol {
	padding: 0 0 0 25px; 
	
	color: #666; 
	font-size: 0.88em; 
}

#directions ol li {
	padding: 5px 10px; 
}
	
body.single-recipe #main img.attachment-post-thumbnail {
	width: 100% !important; 
	height: auto; 
	border: 2px solid #ccc9c2; 
	padding: 2px; 
	display: block; 
	position: relative; 
	box-sizing: border-box; 
	
	/* CSS3 */
	border-radius: 2px; 
	-moz-border-radius: 2px; 
	-webkit-border-radius: 2px; 
}

body.single-recipe #main img.attachment-post-thumbnail:before {
	content: " ";
	position: absolute; 
	z-index: 2; 
	top: 0; 
	right: 0; 
	bottom: 0; 
	left: 0; 
	border: 2px solid #FFF !important;
}

.aside-featured-image {
	margin: 0 0 5px 0; 
	display: block; 
	position: relative; 
}
	
.aside-featured-image > a {
	background-size: 100% !important; 
	display: block; 
	position: relative; 
	border: 2px solid #ccc9c2; 
	
	/* CSS3 */
	border-radius: 2px; 
	-moz-border-radius: 2px; 
	-webkit-border-radius: 2px; 
}

.aside-featured-image > a:before {
	content: " ";
	position: absolute; 
	z-index: 2; 
	top: 0; 
	right: 0; 
	bottom: 0; 
	left: 0; 
	border: 1px solid #FFF !important;
}

.aside-featured-image a:hover {
	border-color: #d9d5ce; 
	opacity: 0.92; 
}

.aside-featured-image a img {
	width: 100%; 
	height: auto; 
	display: block; 
}
	
.aside-featured-image a span {
	background: rgba(0,0,0,0.5); 
	padding: 10px; 
	display: block; 
	position: absolute; 
	right: 1px; 
	bottom: 1px; 
	left: 1px; 
	color: #EEE; 
	font-family: Quicksand Book; 
	font-size: 1em; 
	
	/* CSS3 */
	text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
}

.aside-featured-image a:hover span {
	color: #FFF !important; 
}

#newsletter {
	background: url(images/newsletter-background.jpg); 
	width: 100%;
	padding: 10px; 
	position: relative; 
	float: left; 
	box-sizing: border-box; 
	
	/* CSS3 */
	border-radius: 3px; 
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
}

#newsletter label {
	display: none; 
}

#newsletter input {
	font-family: Walkway UltraBold; 
	
	/* CSS3 */
	border-radius: 3px; 
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
}

#newsletter input[type='text'], #newsletter input[type='email'] {
	background: #889963; 
	height: 22px; 
	width: 100%; 
	margin-bottom: 5px; 
	padding: 0; 
	float: left; 
	
	color: #EEE !important; 
	font-size: 14px; 
	text-indent: 6px; 
	letter-spacing: 1px; 
	
	/* CSS3 */
	-webkit-box-shadow: inset 0px 0px 4px 0px rgba(0,0,0,0.15);
	-moz-box-shadow: inset 0px 0px 4px 0px rgba(0,0,0,0.15);
	box-shadow: inset 0px 0px 4px 0px rgba(0,0,0,0.15);
}
	
#newsletter input[type='submit'] {
	background: #4a4d45; 
	height: 26px; 
	float: left; 
	
	color: #AAA; 
	font-size: 14px; 
	letter-spacing: 1px; 
}
	
	#newsletter a#privacy-statement-link {
		margin: 5px 0 5px 3px; 
		float: left; 
		
		color: #4a4d45; 
		font-size: 10px; 
	}

#privacy-policy {
	width: 640px; 
	
	position: relative; 
	display: block; 
	float: right; 
	
	font-size: 14px; 
}
	
#footer {
	height: 125px; 
	
	float: left; 
	clear: left; 
}


/* DIETS */


.cleanse-friendly, 
.gluten-free, 
.lactose-free, 
.macrobiotic, 
.nightshade-free, 
.nut-free, 
.paleolithic, 
.raw-food, 
.unsweetened, 
.vegan, 
.vegetarian {
	margin: 3px 5px 0 0; 
	border-style: solid; 
	border-width: 1px; 
	padding: 2px 6px; 
	position: relative; 
	float: left; 
	
	color: #fff !important; 
	font-size: 0.63em; 
	text-transform: uppercase; 
	
	/* CSS3 */
	border-radius: 4px; 
	-moz-border-radius: 4px; 
	-webkit-border-radius: 4px; 
}

.diet-tags {
	display: inline-block; 
}

.diet-tags a:hover {
	color: #fff !important; 
}

.cleanse-friendly {
	background: #e695d8; 
	border-color: #b37daa !important; 
}

.gluten-free {
	background: #e65c5c; 
	border-color: #cc6666 !important; 
}

.lactose-free {
	background: #f2ca79; 
	border-color: #ccad70 !important; 
}

.macrobiotic {
	background: #e58a5c; 
	border-color: #cc8866 !important; 
}

.raw-food {
	background: #e6a373; 
	border-color: #cc9066 !important; 
}

.paleolithic {
	background: #95cbe6; 
	border-color: #7da1b3 !important; 
}

.nightshade-free {
	background: #a395e6; 
	border-color: #867db3 !important; 
}

.nut-free {
	background: #bf9373; 
	border-color: #997e6b !important; 
}

.unsweetened {
	background: #fff; 
	border-color: #666 !important; 
	color: #666 !important; 
}


.vegan {
	background: #c3d957; 
	border-color: #8c994c !important; 
}

.vegetarian {
	background: #8dd9a6;
	border-color: #6b997a !important; 
}

.diet-tags a.unsweetened:hover {
	color: #666 !important; 
}

#contact-form {
	border: 2px solid #eee; 
	padding: 10px; 
}


/* RESPONSIVE DESIGN */

@media all and (min-width: 980px) { /* DESKTOP */
	
	#container {
		width: 960px; 
	}
	
	#header {
		width: 960px; 
		height: 75px; 
	}
	
	#nav {
		width: 640px; 
		padding: 0 25px 0 75px; 
		float: right; 
	}
	
	#nav-menu > li > a {
		padding: 30px 10px; 
		font-size: 1.25em; 
	}
	
	#content {
		width: 960px; 
	}
	
	#breadcrumbs {
		padding: 0 0 0 320px; 
	}
	
	#main {
		width: 620px; 
	}
	
	#aside {
		width: 300px; 
	}
	
	.aside-featured-image {
		width: 300px; 
	}
	
	#newsletter, #newsletter * {
		position: relative; 
		display: block; 
	}
	
	#newsletter-mail-icon {
		background: url(images/newsletter-mail-icon.png); 
		width: 80px; 
		height: 80px; 
		float: left; 
	}
	
	#newsletter form {
		width: 190px; 
		margin: 0; 
		position: absolute; 
		left: 90px; 
	}
	
	#privacy-statement-link:hover {
		color: #333 !important; 
	}
	
	#footer {
		width: 960px; 
	}
	
	#ingredients div:not(.hr), 
	.recipe-servings, 
	.recipe-time {
		width: 300px; 
	}
}


@media all and (min-width: 768px) {
	
	#nav {
		height: 75px; 
	}
	
	#nav-menu {
		display: block;
		float: right; 
	}
	
	#nav-menu > li {
		float: left; 
	}
	
	h1#main-banner a {
		background: url(images/main-banner_200x75.png); 
	}
	
	#nav-menu > li > a {
		height: 20px; 
		display: block; 
		
		color: #998f82; 
		font-family: Walkway UltraBold !important; 
		font-weight: 500; 
		text-align: center; 
		text-transform: uppercase; 
		letter-spacing: 0.08em; 
		line-height: 20px; 
	}
	
	#nav-menu li a:hover {
		background: rgba(255,255,255,0.75);
	}
	
	.current-menu-item a, 
	.current_page_item a, 
	body.single-recipe #nav-menu > li.nav-recipes > a, 
	body.tax-recipes:not(.tax-articles) #nav-menu > li.nav-recipes > a, 
	body.single-article #nav-menu > li.nav-articles > a, 
	body.tax-articles #nav-menu > li.nav-articles > a {
		background: url(images/nav-li_bg.png) !important; 
		color: #665f57 !important; 
		
		/* CSS3 */
		-webkit-box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.15);
		-moz-box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.15);
		box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.15);
	}
	
	#main {
		float: right; 
	}
	
	#breadcrumbs {
		margin: 15px 10px 5px 10px; 
	}
	
	#aside {
		float: left; 
	}
	
	#ingredients ul li {
		font-size: 0.75em; 
	}
	
	.recipe-servings, 
	.recipe-time {
		margin: 0 !important; 
	}
	
}


@media all and (min-width: 768px) and (max-width: 979px) { /* PORTRAIT, TABLET */
	
	#container {
		width: 720px; 
	}
	
	#nav {
		width: 510px; 
		padding: 0; 
		float: left; 
	}
	
	#nav-menu > li > a {
		padding: 30px 9px; 
		font-size: 1em; 
	}
	
	#content {
		width: 720px; 
	}
	
	#breadcrumbs {
		padding: 0 0 0 240px; 
	}
	
	#main {
		width: 460px; 
	}
	
	#aside {
		width: 220px; 
	}
	
	.aside-featured-image {
		width: 216px; 
	}
	
	.aside-featured-image > a {
		width: 216px; 
		height: 110px; 
	}
	
	.aside-featured-image span {
		width: 194px; 
	}
	
	#ingredients div:not(.hr) {
		width: 240px; 
	}
	
	.recipe-servings, 
	.recipe-time {
		width: 160px; 
	}
	
}

@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) { /* MOBILE, SMARTPHONE */
	
	#container {
		width: 100%; 
		min-width: 320px; 
		padding: 0 5px; 
		box-sizing: border-box; 
	}
	
	h1#main-banner a {
		background: url(images/main-banner_400x150.png); 
		background-size: 200px 75px; 
	}
	
	#nav-menu {
		display: none; 
	}
	
	#content {
		width: 100%; 
	}
	
	#newsletter {
		width: 100%; 
	}
	
	#newsletter-mail-icon {
		background: url(images/newsletter-mail-icon.png); 
		width: 80px; 
		height: 80px; 
	}
	
	#mc_embed_signup_scroll {
		width: 100%; 
	}
	
	.mc-field-group {
		width: 100%; 
	}
	
	#mc_embed_signup {
		position: absolute; 
		top: 10px; 
		right: 10px; 
		left: 100px; 
	}
	
	.aside-featured-image {
		box-sizing: border-box; 
	}
	
	.aside-featured-image a {
		height: 0;
		padding-bottom: 50%; 
	}
	
	.responsive-menu-label {
		background:  url(images/responsive-menu-icon_96x96.png); 
		background-size: 48px 48px; 
		width: 48px; 
		height: 48px; 
		display: inline-block; 
		position: absolute; 
		z-index: 10001; 
		top: 10px; 
		right: 12px; 
		cursor: pointer; 
	}
	
	#responsive-menu-checkbox.checkbox_hack:checked ~ #nav-menu {
		display: block; 
	}
	
	#nav-menu {
		background: #222; 
		padding: 10px 10px 8px 10px; 
		position: absolute; 
		z-index: 10000; 
		text-align: center; 
		display: none; 
		font-size: 1.25em; 
		font-family: Walkway UltraBold, Arial, Helvetica, sans-serif; 
		text-transform: uppercase; 
		letter-spacing: 0.125em; 
		top: 64px; 
		right: 12px; 
		left: 12px; 
		
		
		/* CSS3 */
		border-radius: 6px; 
		-moz-border-radius: 6px; 
		-webkit-border-radius: 6px; 
		
		box-sizing: border-box;         /* Opera/IE 8+ */
		-moz-box-sizing: border-box;    /* Firefox, other Gecko */
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	}
	
	#nav-menu > li > a {
		background: #111; 
		margin-bottom: 2px; 
		padding: 8px 0; 
		display: block; 
		font-weight: normal; 
		
		
		/* CSS3 */
		border-radius: 3px; 
		-moz-border-radius: 3px; 
		-webkit-border-radius: 3px; 
	}
	
	#breadcrumbs {
		margin: 15px 10px 5px 10px; 
	}
	
	#ingredients ul li {
		font-size: 0.88em; 
	}
	
}

@media all and (min-width: 480px) and (max-width: 767px) { /* MEDIUM RESOLUTION MOBILE */
	
	.aside-featured-image {
		width: 50%; 
		clear: none; 
		box-sizing: border-box; 
	}
	
	#featured-recipe {
		padding: 0 5px 0 0;
		float: left; 
	}
	
	#featured-article {
		padding: 0 0 0 5px;
		float: left; 
	}
	
	#newsletter {
		max-width: 430px; 
		clear: both; 
	}
	
}

@media all and (max-width: 479px) {
	.aside-featured-image {
		width: 100%; 
		float: left; 
		box-sizing: border-box; 
	}
	
	#breadcrumbs {
		margin: 15px 10px 15px 10px; 
	}
}

@media all and (min-width: 320px) {
	html, body {
		max-width: 100%; 
	}
}