@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;
}

html {
 // Minimum 16x, and grows more slowly 
  // (half the rate of screen growth)
  font-size: calc(1em + 0.5vw);
  
  // Line-height based on font-size,
  // with addition viewport-relative growth
  line-height: calc(1.1em + 0.5vw);
  margin: 0.5em;
}

body {
// font grows 1px for every 100px of viewport width
  font-size: calc(16px + 1vw);
  // leading grows along with font,
  // with an additional 0.1em + 0.5px per 100px of the viewport
  line-height: calc(1.1em + 0.5vw);
	font-family:sans-serif;
	margin:135px 0 0;
	padding:0;
	opacity:1.0;
	background:#eee;
	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 {
	
}

.bookmarks, .pinterest {
	margin:5px 20px 0 0;
}

.headline-silentmind {
	font-weight:900;
	font-family:"silentmind",sans-serif!important;
	font-size:7.5em;
	margin:0 0 -20px;
	word-spacing:-15px;
}

#bookmarklist {
	display:none;
	padding:20px;
	background:#c00;
	border-radius:10px;
	position:fixed;
	top:100px;
	left:50%;
	margin-left:-25%;
	bottom:50px;
	z-index:3;
	color:#fff;
	width:50%;
	min-width:500px;
}

#bookmarklist h4 {
	font-size:2.0em;
	margin:0;
	padding:0;
	font-weight:300;
}

#bookmarklist {
  //clip-path: polygon(0 0, 1600px 0, 1600px 87%, 0 100%);
  clip-path: polygon(0% 0%, 100% 0, 100% 100%, 50% 90%, 0% 100%);
}

.bookmarkcontainer {
	box-shadow:0 0 5px rgba( 0, 0, 0, 0.5 );
}

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

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

.intro p {
}

.filters {
	display:flex;
	align-items:center;
	justify-content:center;
	background:#fc9;
	background:#206;
	background:rgba( 255, 255, 255, 1.0 );
	text-align:center;
	padding:0px 20px;
	box-shadow:0 5px 5px rgba( 0, 0, 0, 0.035 );
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:2;
}

.filters a {

}

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

.filters form {
	margin:20px 20px;
	text-align:center;
	display: table;
    width:450px;
    box-shadow: 0 0 5px 2px rgba( 0, 0, 0, 0.15 );
	border-radius: 30px;
}

.filters .td {
	display:table-cell;
	vertical-align:middle;
	width:calc( 100% - 50px );
}

filters .td:last-child {
	width:50px;
}

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

.filters input:focus {
	//box-shadow:inset 0 0 5px 3px rgba( 0, 0, 0, 0.25 );
}

.filters button span {
	display:none;
}

.filters form button {
	display:inline-block;
	font-size:1.25em;
	padding:15px 25px;
	height:53px;
	line-height:53px;
	border-radius:0 30px 30px 0;
	border:solid 5px #c00;
	border-width:0;
	width:100%;
	color:#fff;
	background:#c00;
	background:#fff url('../images/icon-magnify.png') no-repeat;
	background-size:32px 32px;
	background-position:center center;
}

.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:1200px;
	width:100%;
	margin:0 auto;
	padding:20px;
	border-radius:10px;
}

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

.recipe {
	width:calc( 24.99% - 35px );
	float:left;
	margin-right:35px;
	margin-bottom:35px;
	height:320px!important;
}

.recipe:last-child {
	margin-right:0!important;
}

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

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

.recipe_details {
	margin:0px 15px 0;
	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;
}

.imageholder {
	position:relative;
}
.imageholder .caption {
	position:absolute!important;
	padding:4px 6px;
	top:10px;
	left:0;
	display:inline-block;
	background:rgba( 220, 0, 0, 1.0 );
	color:#fff;
	text-transform:uppercase;
	font-size:0.8em;
	font-weight:600;
	box-shadow:1px 0px 5px rgba( 0, 0, 0, 0.4 );
}
.imageholders .caption {
	top:-290px;
}

.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.9999% );
	height:200px;
	margin-bottom:10px;
	object-fit:cover;
	opacity:1.0;
	transition:opacity 1.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;
}

.unfavorite {
	position:absolute;
	top:-5px;
	right:-5px;
	background:linear-gradient( 0deg, #f30 0%, #f30 100% );
	//border:solid 3px #f30;
	box-shadow:1px 1px 2px rgba( 0, 0, 0, 0.35 );
	border-radius:4px;
	width:20px;
	color:#fff;
	line-height:20px;
	text-align:center;
	text-shadow:-1px -1px rgba( 0, 0, 0, 0.25 );
}

.favorite img {
	width: 25px;
	height: 34px;
	position: absolute;
	top: -5px;
	right: 5px;
}

/* 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;
	}
	.filters {
		box-shadow:0 0 10px 15px rgba( 30, 30, 30, 0.5 );
	}
	.favorite img {
		width: 75px;
		height: auto;
		position: absolute;
		top: -12px;
		right: 5px;
	}
	
}

/* 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 {
	position:relative;
	cursor:pointer;
	background:#fff;
}

.recipe_link:hover {
	background:#fff;
	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;
}





.content {
	display:flex;
	background:transparent;
	width:1200px;
	margin:50px auto;
	justify-content:space-between;
}

.inner_content {
	width:66%;
}

.features {
	width:99.999%;
	display:flex;
	justify-content:space-between;
}

.features > div {
	background:#fff;
}

.features div:last-child {
	margin-right:0;
}

.features > div img {
	width:99.999%;
}

.featured {
	float:left;
}

.featured h3 {
	margin:20px 20px 0;
	font-weight:300;
	font-size:1.8em;
}

.featured h3 a {
	text-decoration:none;
	color:#f60;
	font-size:2.0em.
}

.prime {
	width:99.99%;
	margin-bottom:50px;
	display:flex;
}

.prime h3 {
	padding:0 20px;
}

.prime h3 a {
	font-size:1.9em;
	color:#f60;
	font-weight:300;
	text-decoration:none;
}

.toprecipes p {width:330px;padding:0 20px 20px;line-height:1.4em;font-size:1.2em;}

.features img {
	height:300px;
	display:block;
	object-fit: cover;
}

.getthisrecipe {
	text-decoration:none;
	margin-top:20px;
	color:#f60;
}

.col-33, .col-66, .col-25, .col-50, .col-75 {
	margin-right:20px;
}

.col-33 {
	width: calc( 32.99% - 20px );
}

.col-66 {
	width: calc( 65.99% - 20px );
}

.col-25 {
	width: calc( 24.99% - 20px );
}

.col-50 {
	width: calc( 49.99% - 20px );
}

.col-75 {
	width: calc( 74.99% - 20px );
}

.col-100 {
	width: calc( 99.9999% );
}

.sidebar {
	margin:0 auto;
	padding:35px 0;
	background:rgba( 250, 250, 250, 0.75 );
	border-radius:10px;
	text-align:center;
	//border:solid 1px rgba( 0, 0, 0, 0.15 );
}


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: 250px;
    max-width: 100%; /* useful when width is set to anything other than 100% */
    box-sizing: border-box;
    margin: 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;
}
.dropfilters select {
	margin-right:10px;
	height:2.5em;
}
.dropfilters select:last-child {
	margin-right:0;
}

/* hamburger */
.nav-icon {
  margin: 1em;
  width: 40px;
}

.nav-icon:after, 
.nav-icon:before, 
.nav-icon div {
  background-color: #000;
  border-radius: 3px;
  content: '';
  display: block;
  height: 5px;
  margin: 7px 0;
  transition: all .2s ease-in-out;
}
.nav-icon:hover:before {
  transform: translateY(6px) rotate(135deg) scale(0.75);
  height:6px;
}

.nav-icon:hover:after {
  transform: translateY(0px) rotate(-135deg) scale(0.75);
  height:6px;
}

.nav-icon:hover div {
  transform: scale(0);
}

.drill {
	display:flex;
	align-items:center;
	justify-content:center;
}
.drill-toggle {
	display:none;
}


@media (max-width: 900px) {
	body {font-size:1.0em;}
	.filters {display:flex;padding:15px 20px;justify-content:space-between;}
	.hamburger, .logo, .drill-toggle {width:33.33%;}
	.filters form {width:99.9%;max-width:99%;margin:50px 0 20px;font-size:2.0em;border-radius:10px;}
	.filters input,.filters select {font-size:4.0em;}
	.filters input {border-radius:30px;font-size:3.0em;}
	.filters .dropfilters {max-width:99.99%;margin:30px auto;display:block;}
	.filters select {width:99.9%;margin:0 0 20px;height:2.5em;}
	.bookmarks, .pinterest,.sidebar {display:none;}
	.inner_content {width:99.99%;margin:10px 1% 30px;font-size:1.8em;}
	.toprecipes p {width:95%;}
	.features .imageholder {width:100%;}
	.prime {display:block;}
	.prime h3,.featured h3 {font-size:2.0em;margin-top:20px;margin-bottom:20px;}
	.featured h3 {font-size:2.5em;}
	.recipe {width:calc( 49.9% - 10px );margin:20px 5px;font-size:2.5em;height:500px!important;}
	.imageholder .caption {display:none;position:relative;top:10px;}
	.drill {display:none;}
	.drill-toggle {display:block;text-align:right;}
	.drill-toggle a {background:linear-gradient( 0deg, #eee 0%, #fff 100% );border:solid 1px #e0e0e0;border-radius:10px;font-size:2.0em;text-decoration:none;padding:10px 14px;}
}

@media (max-width: 600px) {
	.filters {display:block;padding:35px 20px;}
	.hamburger, .logo, .drill-toggle {width:99.99%;}
	.logo img {width:calc( 99% - 15px );}
	.nav-icon {display:none;}
	.drill-toggle {display:block;text-align:center;margin-top:30px;position:fixed;bottom:0;left:0;right:0;}
	.drill-toggle a {display:block;font-size:4.0em;text-decoration:none;margin:5px;padding:12px 10px!important;background:#406;color:#fff!important;box-shadow:0 0 10px 10px rgba( 0, 0, 0, 0.250 );}
}

@media (min-width: 901px) {
	.filters {display:flex;}
}

@media (min-width: 1201px) {

}

@media (min-width: 1200px) {

}