@font-face {
    font-family: 'silentmind';
    src: url('../inc/SilentmindRough-Regular.woff2') format('woff2'), url('../inc/SilentmindRough-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
	font-size:16px;
	font-family:sans-serif;
	margin:0;
	padding:0;
	opacity:0.75;
	background:transparent url( '../images/woodgrainbg.jpg') repeat;
	box-sizing:border-box;
}

body * {	
	font-family:sans-serif;
}

p {
	color:#444;
	margin:5px 0 10px;
}

p:last-child {
	margin-bottom:0;
}

.gtslider {
	
}

.gtslider .active {
	
}

.headline-silentmind {
	font-weight:900;
	font-family:"silentmind",sans-serif!important;
	font-size:9.5em;
	margin:0 0 -40px;
}

.intro {
	text-align:left;
	font-size:1.7em;
	padding:10px 0px 55px;
}

.intro h2 {
	font-weight:500!important;
}

.intro p {
}

.filters {
	display:block;
	background:#fc9;
	background:#206;
	text-align:center;
	padding:30px 0;
}

.filters h3 {
	margin:0 0 20px;
	padding:0;
	font-weight:300;
	font-size:2.0em;
	color:#fff;
}

.filters form {
	margin:20px auto;
	text-align:center;
	display: table;
    width:100%;
    max-width:800px;
}

.filters .td {
	display:table-cell;
	width:75%;
}

filters .td:last-child {
	width:24.99%;
}

.filters input {
	font-size:1.25em;
	padding:15px 25px;
	border-radius:10px 0 0 10px;
	width:100%;
	margin:0;
	border:solid 5px rgba( 0, 0, 0, 0.25 );
	border-width:0;
	outline:0;
	transition:box-shadow 0.2s;
}

.filters input:focus {
	box-shadow:inset 0 0 1px 3px #f90;
}

.filters form button {
	margin:0;
	font-size:1.25em;
	padding:15px 25px;
	border-radius:0 10px 10px 0;
	width:100%;
	border:solid 5px rgba( 0, 0, 0, 0.25 );
	border-width:0;
	color:#fff;
	background:linear-gradient( 180deg, #f90 0%, #f90 100% );
}

.filter {
	background:linear-gradient( 180deg, #fff 0%, #fff 100% );
	border-radius:4px;
	border:0;
	padding:15px 30px;
	cursor:pointer;
	color:#c30;
	font-size:1.25em;
	transition:background 0.3s, color 0.3s;
}

.filter:hover {
	background:rgba( 255, 130, 30, 1.0 );
	color:#fff;
	box-shadow:0 0 10px rgba( 150, 30, 0, 0.15 );
	background:linear-gradient( 180deg, #f90 0%, #f90 100% );
}

.filter:active {
	background:linear-gradient( 180deg, #f90 0%, #f90 100% );
	color:#eee;
}

.filter.filtered {
	background:linear-gradient( 180deg, #f60 0%, #f60 100% );
	color:#fff;
}

.filter_link {
	background:transparent;
	padding:5px 10px;
}
.filter_link:hover {
	background:transparent;
	color:#000;
	box-shadow:none;
}

.filters p {
	margin:20px auto;
	background:#f90;
	color:#fff;
	width:50px;
	line-height:50px;
	border-radius:50%;
}

#header {
	text-align:center;
	position:fixed!important;
	left:0;
	right:0;
	width:100vw;
	transition:background 0.2s linear;
	background:rgba( 0, 0, 0, 0.20 );
}

.scrollbg, #bodystory #header, #bodycontact, #bodyproducts, #bodysince1989 {
	background:rgba( 0, 0, 0, 0.5 )!important;
}

.divider, .clearfix:after {
	content: "";
	display: table;
	clear:both;
	width:90%!important;
}

.divider {
	margin:25px auto 25px;
	background:linear-gradient(to right, rgba(0, 0, 0, 0.0) 0%, rgba(0, 0, 0, 0.15) 25%, rgba(0, 0, 0, 0.1f5) 75%, rgba(0, 0, 0, 0.0) 100% );
	height:1px;
}

.results {
	max-width:1080px;
	width:100%;
	margin:0 auto;
	padding:20px;
	border:solid 0px rgba( 255, 150, 0, 0.25 );
	border-radius:10px;
	background:rgba( 255, 255, 255, 1.0 );
	box-shadow:0 0 20px rgba( 50, 50, 50, 0.15 );
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

.recipe {
	width:calc( 19.99% - 10px );
	float:left;
	padding:5px;
	height:320px!important;
}

.recipe h3 {
	margin:-10px 0 10px;
	font-weight:300;
	font-size:1.3em;
}

.recipe a {
	color:#f60;
	text-decoration:none;
}

.recipe_details {
	margin-top:10px;
	font-size:0.9em;
	color:#666;
}

.preptime:before {
	content:"PREP TIME: ";
}

.cooktime:before {
	content:"COOK TIME: ";
}

.servingsize:before {
	content:"SERVES: ";
}

.preptime:before, .cooktime:before, .servingsize:before {
	color:#666;
	font-weight:600;
}

.recipe_details span {
	display:block;
}

.recipe_single {
	width:99.99%;
	display:flex;
	justify-content:space-between;
}

.recipe_single img {
	border-bottom:solid 5px rgba( 255, 190, 0, 0.5 );
	object-fit:cover;
}

.recipe_single .ingredients {
	margin:20px 0 0;
	padding:0;
}

.recipe_single .ingredients li {
	margin:10px 0;
	list-style-position:inside;
	list-style-type:none;
	padding:0 0 10px;
	text-transform:capitalize;
	border-bottom:solid 1px rgba( 0, 0, 0, 0.25 );
}

.ingredients li:last-child {
	border-bottom:none;
}

.recipe_single span {
	display:inline;
	margin:20px 0 20px 20px;
	line-height:2.5em;
}

.recipe_single > div:first-child {
	width:30%;
}

.recipe_single > div:first-child h3 {
	color:#c30;
	font-size:1.6em;
	font-weight:300;
	border-bottom:solid 1px #c30;
}

.recipe_single > div:last-child {
	width:69.9%;
}

.recipe_single h1 {
	margin:0 0 0 20px;
	font-weight:300;
	font-size:3.0em;
}

.recipe_content {
	display:none;
}

.recipe_content h3 {
	font-size:1.8em;
	margin:30px 0 20px 20px;
	font-weight:300;
	color:#222;
	border-bottom:solid 1px #222;
}

.recipe_single .recipe_content {
	display:block;
}

.recipe_single .intro {
	line-height:1.3em;
	display:block;
	font-weight:300;
	margin:10px 0 0 20px;
	padding:0;
	color:#406;
}

.recipe_single ol {
	list-style: none;
	counter-reset: my-awesome-counter;
	display: flex;
	flex-wrap: wrap;
	margin: 20px 0 0 40px;
	padding: 0;
}

.recipe_single ol li {
	counter-increment: my-awesome-counter;
	display: flex;
	width: 90%;
	font-size: 1.2em;
	margin:20px 0;
}

.recipe_single ol li::before {
	content:counter(my-awesome-counter);
	font-weight: bold;
	font-size: 3rem;
	margin-right: 0.5em;
	color:#c30;
	font-family: 'Abril Fatface', serif;
	line-height: 0.5;
}

.recipe_single .credit {
	font-size:0.8em;
	color:rgba( 0, 0, 0, 0.5 );
}

.recipe_single .credit a {
	color:rgba( 0, 30, 255, 0.75 );
}

.recipe img {
	width:calc( 99.99% - 1px );
	height:200px;
	margin-bottom:10px;
	object-fit:cover;
	opacity:0.75;
	transition:opacity 0.5s;
}

.recipe img:hover {
	opacity:1.0;
}


#bodystory #header {
	background:url( '../images/nav-bg2.jpg' ) center center no-repeat;
	background-size:100% 151px;
	width:100%;		
	display:block;
	position:fixed;
}

/*#bodystory #header:after {
    content : "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background:#000 url( 'images/bg-story.jpg' ); 
    width: 100%;
    height: 100%;
    opacity : 0.5;
    z-index: -1;
}*/

#header img {
	width:175px;
	height:auto;
}

#nav a:link, #nav a:visited {
	color:#fff;
	font-size:1.0rem;
	text-transform:uppercase;
	font-weight:600;
	font-family:"Montserrat", sans-serif;
	transition:all 0.25s linear;
	cursor:pointer;
	margin:10px 25px;
	text-shadow:0 1px 3px rgba( 0, 0, 0, 0.25 );
}

#nav {
	margin:20px 0;
	transition:all 0.2s linear;
}

#nav a:hover, #nav a:active {
	text-decoration:none;
	color:#f30;
	cursor:pointer;
	text-shadow:0 1px 2px #000;
}

#wrapper {
	position:relative;
	display:block;
}

#story {
	padding:0;margin:0;
	background:#fec;
	position:relative;
}

.carousel-caption {
	text-align:left;
	top:30%;
	right:50%;
	left:5%;
	font-size:2.5rem;
	text-shadow:1px 1px 3px #444;
}

.gthide {
	display:none;
}

.max-w-99 {
	max-width:99%;
}

h5 {
	font-size:5.0rem;
	font-weight:900;
}

#social {
	background:#693;
	color:#fff;
	text-align:center;
	position:relative;
}

#social h2 {
	font:900 3.5rem "Montserrat", sans-serif;
	margin-right:25px;
}

#story h2 {
	font-size:2.5rem;
}

#footer {
	background:#fff9f3 url( '../images/bg-vine.png' ) right center no-repeat;
	background-position:calc( 0% - 50px ) center;
	background-size:40% auto;
	box-shadow:inset 0 5px 3px -3px #999;
}

.header-sm-m {
	transform: scale( 0.85);
	padding:0;
}

.recipe_list {
	width:99%;
}

.recipe_list h3 {
	font-size:2.2em;
	color:#f60;
	font-weight:300;
	text-decoration:none;
}

.recipe_list a {
	text-decoration:none;
}

.recipe_list img {
	width:150px;
	height:150px;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 2s;
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 576px) {
	
	#header {
		background:#222;
	}
	#gt-carousel {
		position:relative;
	}
	#nav {
		display:block;
		text-align:center!important;
	}
	#nav img {
		text-align:center;
		display:block!important;
		clear:both;
		margin: 0 auto 25px;
	}
	#nav a:link, #nav a:visited {
		margin:5px 5px;
		font-size:0.9rem;
	}
	
}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 768px) {
	#header, #nav {
		margin:0;
		padding:0;
	}
	#nav {
		padding:0 0 5px;
	}
	#nav img {
		text-align:center;
		display:block!important;
		clear:both;
		margin: 0 auto 15px;
	}
	#nav a:link, #nav a:visited {
		margin:0px 5px;
		font-size:0.8rem;
	}
	
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.lead {
		font-size:1.5rem;
	}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}




/* recipe list page */
.recipe_list {
	display:flex;
	margin-bottom:25px;
}

.recipe_link {
	cursor:pointer;
}

.recipe_link:hover {
	background:#eee;
	border-radius:4px;
}

.recipe_list img {
	margin:10px;
	display:inline-block;
	box-shadow:0 5px 0px 0px #406;
	width:99%;
	max-width:100px;
	height:auto;
}

.recipe_list:hover {
	background:#eee;
	border-radius:4px;
}

.recipe_list span.first-child {
	width:12%;
	padding:0;
	margin:0;
}

.recipe_list span.last-child {
	width:30%;
}

.recipe_list h1 {
	font-size:2.8em;
	font-weight:300;
	margin:10px 0;
	padding:0;
	line-height:1.0em;
	color:#406;
}

.recipe_list span.last-child span {
	font-size:1.0em;
	text-transform:uppercase;
	margin-right:20px;
}

.cooktype:before {
	content: "Cook Method: ";
	text-transform:uppercase;
	font-weight:600;
}

.cooktime:before {
	content: "Cook Time: ";
	text-transform:uppercase;
}

.credit_button {
	display:inline-block;
	padding:8px 14px;
	background:#406;
	color:#fff;
	margin-top:5px;
	border-radius:4px;
}


select {
	margin:10px 0;
}
select {
	display: block;
    font-size: 1.2em;
    font-family: sans-serif;
    font-weight: normal;
    color: #444;
    line-height: 1.3;
    padding: 10px 16px;
    width: 100%;
    max-width: 100%; /* useful when width is set to anything other than 100% */
    box-sizing: border-box;
    margin: 10px 0 0;
    border: 1px solid #aaa;
    border-radius: 10px;
    -webkit-appearance: none;
    background-color: #fff;
    /* note: bg image below uses 2 urls. The first is an svg data uri for the arrow icon, and the second is the gradient. 
        for the icon, if you want to change the color, be sure to use `%23` instead of `#`, since it's a url. You can also swap in a different svg icon or an external image reference
        
    */
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
      linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
    background-repeat: no-repeat, repeat;
    /* arrow icon position (1em from the right, 50% vertical) , then gradient position*/
    background-position: right .7em top 50%, 0 0;
    /* icon size, then gradient */
    background-size: .65em auto, 100%;
}
/* Focus style */
.select-css:focus {
    border-color: #aaa;
    box-shadow: none;
    color: #222; 
    outline: none;
}

/* Set options to normal weight */
.select-css option {
    font-weight:normal;
}

.dropfilters {
	display:flex;max-width:800px;margin:20px auto;
}
.dropfilters select {
	margin-right:10px;
}
.dropfilters select:last-child {
	margin-right:0;
}