body {
	font-size: 1.25rem;
	font-family: 'Open Sans', sans-serif;
}
/* header */
.spec {
	padding: 10px 0;
	background-color: #9aea71;
	text-align: center;
	text-transform: uppercase;
	color: #077917;
	font-size: 1rem;
}
.spec a:hover {
	color: #fff;
	text-decoration: none;
}
.arrow {
	font-size: 1.8rem;
	margin-top: -10px;
}
.metro {
	background-color: #eee;
	height: 55px;
	text-align: center;
}
.metro img {
	margin-top: 5px;
	width: 65px;
}
.page-header {
	background: #399f3c;
	position: relative;
}
/*.page-header a:hover{
	color: #fff;
}*/
.metro-logo {
	padding: 45px 0 80px;
	background: url('../img/background.jpg') no-repeat center top;
	background-size: cover;
	text-align: center; 
}
.metro-logo img {
	height: 250px;
	margin-bottom: 10px
}
.festival-info {
	color: #f8e60c;
}
.festival-info span {
	background-color: #1c407b;
	padding: 0px 5px;
	vertical-align: middle;
}

/* chefs */
.chefs {
	display: grid;
	margin-top: -60px;
	padding: 0 20px;
	grid-template-columns: 304px 304px 304px 304px;
	grid-auto-flow: dense;
}
.img-long, .img-short, .img-width {
	position: relative;
	margin: 0 5px 10px;
	width: 295px;
	height: 304px;
	overflow: hidden;
}
.chef-text {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(255,105,107,0.95);
	opacity: 0;
	cursor: pointer;
	transform: scale(0.75);
	transition: .5s;
}
.grey {
	filter: grayscale(80%);
}
.img-long:hover .chef-text, .img-short:hover .chef-text {
	opacity: 1;
	transform: scale(1);
}
.name {	
	position: relative;
	font-family: 'Neucha', cursive;
	padding: 15px;
	color: #fff;
	font-size: 2rem;
}
.name:after {
	content: '';
	position: absolute;
	z-index: -1;
	width: 100px;
	height: 5px;
	left: 15px;
	bottom: 5px;
	background-color: #fff;
}
.info-text {
	padding: 15px;
	color: #fff;
}
.chef-text a {
	position: absolute;
	color: #fff;
	bottom: 5px;
	right: 15px;
	font-family: 'Neucha', cursive;
	font-size: 1.2rem
}
.chef-text a:hover {
	text-decoration: none;
}
.learn {
	background-color: #cbd959;
	color: #23a638;
}
.learn-title {
	position: absolute;
	font-size: 2.5rem;	
	font-family: 'Neucha', cursive;
	padding: 30px 50px;
	text-align: center;
	cursor: pointer;
}
.learn img {
	width: 85%;
	height: auto!important;
	position: absolute;
	bottom: 40px
}
.why {
	background-color: rgba(200,0,50, .3);
	position: absolute;
	padding: 40px 50px;
	color: #fff;
	font-family: 'Neucha', cursive;
	font-size: 2.5rem;
	text-align: center;
}
.why a:hover {
	text-decoration: none;
	color: #fff
}
.img-long {
	height: 618px;
	grid-row: span 2;
}
.img-width {
	width: 618px;
	grid-column: span 2;
}
.img-long img, .img-short img {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	height: 100%;
}
/* ferms */
.bg1 {
	background: url('../img/backgrounds/infogr1.jpg') no-repeat center top;
	background-size: 65%;
	height: 360px;
	text-align: center;
	padding-top: 90px;
}
.bg2 {
	background: url('../img/backgrounds/infogr3.jpg') no-repeat center top;
	background-size: 65%;
	height: 360px;
	text-align: center;
	padding-top: 60px;
}
.bg3 {
	background: url('../img/backgrounds/infogr2.jpg') no-repeat center top;
	background-size: 65%;
	height: 360px;
	text-align: center;
	padding-top: 90px;
}
.text-holder {
	margin: 85px auto 0px;
	width: 400px;
}
.green-text, .red-text {
	display: inline-block;
	position: relative;
	margin: 0 auto;
	font-size: 2.125rem;
	font-family: 'Neucha', cursive;
}
.red-text {
	font-size: 1.9rem;
}
.green-text:after {
	content: '';
	position: absolute;
	z-index: -1;
	width: 100%;
	height: 10px;
	left: 0;
	bottom: 12px;
	background-color: #a2e2b5;
}
.red-text:after {
	content: '';
	position: absolute;
	z-index: -1;
	width: 100%;
	height: 8px;
	left: 0;
	bottom: 11px;
	background-color: #f39496;
}
/* reds */
.red-left {
	background: url('../img/backgrounds/50_50_BGR.jpg') no-repeat right top;
}
.left-container {
	position: absolute;
	right: 140px;
	padding-top: 100px;	
	text-align: center;
}
.red-right {
	background-color: #ff696b;
	padding: 50px 0 50px 50px;
	font-size: 1.375rem
}
.right-container {
	max-width: 615px;
}
.title {
	position: relative;
	display: inline;
	text-transform: uppercase;
	font-size: 2.625rem;
	font-family: 'Neucha', cursive;
	z-index: 1
}
.title:after {
	content: '';
	position: absolute;
	width: 100%;
	z-index: -1;
	height: 10px;
	left: 0;
	bottom: 8px;
	background-color: #ff898b;
}
.hr-left, .hr-right {
	position: relative;
	margin: 50px 0;
	border-top: 1px solid white 
}
.hr-left:after {
	content: '';
	position: absolute;
	width: 100px;
	height: 3px;
	left: 50px;
	bottom: -1px;
	background-color: #fff;
}
.hr-right:after {
	content: '';
	position: absolute;
	width: 100px;
	height: 3px;
	right: 50px;
	bottom: -1px;
	background-color: #fff;
}
.text-white {
	color: white;
	font-family: 'Neucha', cursive;
	font-size: 1.813rem
}
/* recepti */
.hr-h2 {
	position: relative;
	margin: 100px auto 20px;
	width: 200px;
	border-top: 1px solid black 
}
.hr-h2:after{
	content: '';
	position: absolute;
	z-index: -1;
	width: 100px;
	height: 3px;
	left: 50px;
	bottom: -1px;
	background-color: #000;
}
.holder {
	margin-bottom: 50px;
	text-align: center;
}
h1 {
	font-family: 'Neucha', cursive;
	font-size: 3rem
}
h1 span {
	position: relative;
}
h2 {
	display: inline-block;
	position: relative;
	text-transform: uppercase;
	font-family: 'Neucha', cursive;
	font-size: 3rem
}
h1 span:after, h2:after {
	content: '';
	position: absolute;
	z-index: -1;
	width: 100%;
	height: 10px;
	left: 0;
	bottom: 10px;
	background-color: #a2e2b5;
}
.green-bg {	
	background: url('../img/backgrounds/recipesBGR.jpg') no-repeat center top;
	padding: 60px 0 200px;
}
.post-text {
	position: absolute;
	background-color: #fff;
	width: 80%;
	min-height: 135px;
	padding: 10px;
	margin: -45px 0 0 25px;
	font-size: .875rem
}
.post-text a:hover {
	color: #399f3c;
	text-decoration: none;
}
.post-text p.post-title {
	margin-bottom: 15px;
	font-family: 'Neucha', cursive;
	font-size: 1.75rem;
	line-height: 2rem
}
.post-text p {
	margin-bottom: 0px;
}
/* footer */
footer {	
	background: url('../img/backgrounds/footerBGR2.jpg') no-repeat center top;
	background-size: 110%;
	padding: 130px 0 50px;
	text-align: center;
}
.footer-title {
	margin-bottom: 50px;
	font-size: 2.5rem;
	color: #fff;
	font-family: 'Neucha', cursive;
}
.ml {
	margin-left: 150px;
}
.clear {
	clear: both;
}
@media screen and (max-width: 1500px) {
	.animation img {
		width: 100%
	}
}
@media screen and (max-width: 1365px) {
	.metro-logo {
		background-size: auto 100%;
	}
	.chefs {		
		grid-template-columns: 304px 304px 304px;
	}
	.img-long, .img-short {
		width: auto;
	}
	.red-left {
		background-position: center top; 
	}
	.red-right {
		font-size: 1rem;
		padding: 50px
	}
	.title {
		font-size: 1.4rem;
	}
	.title:after {
		bottom: 4px;
	}
	.text-white {
		font-size: 1.3rem
	}
	.green-bg img {
		width: 100%
	}
	.post-text {
		left:10px;
	}
	footer {
		background-size: auto 115%;
	}	
}

@media screen and (max-width: 767px) {
	.chefs {		
		grid-template-columns: 50% 50%;
	}
	.img-width, .img-width img {
		width: 100%;
		height: auto;
	}
	.bg1 {
		background-size: 75%;
		height: 300px;
		padding-top: 40px;
	}
	.bg2 {
		background-size: 75%;
		height: 300px;
		padding-top: 25px;
	}
	.bg3 {
		background-size: 75%;
		height: 300px;
		padding-top: 40px;
	}
	.bg1 img, .bg2 img, .bg3 img, .left-container img {
		width: 100%;
	}
	.text-holder {
		margin: 20px auto 0px;
		text-align: center;
	}
	.left-container {
		position: relative;
		margin-left: auto;
		margin-right: auto;
		right: auto;
	}
	.title {
		font-size: 1.1rem
	}
	.title:after {
		bottom: 4px;
	}
	.text-white {
		font-size: 1.1rem
	}
	h2 {
		font-size: 1.9rem
	}
	h2:after {
		bottom: 10px
	}
	.green-bg {
		padding-bottom: 0px;
		background-repeat: repeat-y;
	}
	.green-bg .col-md-4 {
		height: 500px;
	}
	.green-bg .col-md-4:last-child{
		height: 400px
	}
	footer img {
		display: block;
		margin: 0 auto;
	}
	.ml {
		margin-left: auto;
		margin-top: 50px;
	}
}

@media screen and (max-width: 480px) {
	.chefs {		
		grid-template-columns: 100%;
	}	
	.img-width {
		display: none;
	}
	.text-holder {		
		text-align: center;
		width: 320px;
	}
	.green-text, .red-text {
		font-size: 1.5rem;
	}
	.hr-h2 {
		margin-top: 50px;
	}
	.red-left {
		background-size: 130%; 
	}
	.left-container{
		padding-top: 20px;
		margin-bottom: 50px
	}
	.bg1, .bg2, .bg3 {
		background-size: 90%;
		height: 270px;
	}	
	footer {
		padding-top: 170px;
	}
	.footer-title {
		font-size: 2rem
	}
}

/* articles */
.green-frame {
	position: absolute;
	width: 110%;
	left: -23px;
}
.main-article-pic {
	position: absolute;
	width: 100%;
	top: 40px;
}
.article {
	padding: 20px 0 0 60px;
	font-size: 1rem;
}
.article a, .interview a, .article-text a {
	color: #399f3c
}
.article a:hover, .interview a:hover, .article-text a:hover {
	text-decoration: none;
}
.hr-h1 {
	position: relative;
	margin: 40px 0;
	width: 200px;
	border-top: 1px solid black 
}
.hr-h1:after {
	content: '';
	position: absolute;
	z-index: -1;
	width: 100px;
	height: 3px;
	left: 50px;
	bottom: -1px;
	background-color: #000;
}
.author {
	margin-top: 40px;
}
.author p {
	margin: 0;
	font-size: .875rem
}
.social {
	margin-top: 40px;
	font-size: 2rem;
	color: #bbb;
}
.mt-60 {
	margin-top: 60px;
}
.article-text {
	padding-left: 80px;
}
.article-text p {
	margin: 20px 0;
}
.article-text img {
	margin: 20px 0;
	width: 100%;
}
.links a:hover {
	text-decoration: none;
	color: #399f3c
}
.big-letter {
	margin: -5px 10px 0px -15px;
	float: left;
	font-family: 'Neucha', cursive;
	font-size: 5.7rem;
	line-height: 3rem;
}
.article-image {
	margin-top: 40px;
}
.article-image img {
	width: 100%;
}
.article-image p {
	font-size: 0.75rem
}
.ads {
	text-align: center;
}
.ads img {
	margin-bottom: 80px;
	width: 100%;
	max-width: 300px;
}

@media screen and (max-width: 1365px) {
	.green-frame {
		left: -10px;
	}
	.main-article-pic {	
		top: 30px;
	}
}

@media screen and (max-width: 990px) {
	.article-img-holder {
		height: 480px;
	}
	.green-frame {
		left: -20px;
	}
	.main-article-pic {	
		top: 40px;
	}
}

@media screen and (max-width: 767px) {
	.article {
		padding: 0;
	}
	.article-img-holder {
		height: 360px;
	}
	.article-text {
		padding: 0
	}
	.big-letter {
		margin-left: -5px;
	}
	.green-frame {
		left: -13px;
	}
	.main-article-pic {
		top: 30px;
	}
}

@media screen and (max-width: 480px) {
	.article-img-holder {
		height: auto;
		margin: 20px 0 40px;
	}
	.green-frame {
		display: none;
	}
	.main-article-pic {	
		position: relative;
		top: 0;
	}
}

/* interview */
.interv-img-holder {
	height: 1200px
}
.green-frame-interv {
	position: absolute;
	width: 120%;
	left: -50px;
}
.main-interv-pic {
	position: absolute;
	width: 100%;
	top: 108px;
}
.interview {
	padding: 150px 0 0 90px;
}
.interview h1 {
	font-size: 3.75rem
}
.interview h1.smaller {
	font-size: 3rem
}
.owl-carousel img:hover {
	opacity: 0.75;
}
.owl-carousel .nav-btn{
  height: 47px;
  position: absolute;
  width: 26px;
  cursor: pointer;
}
.owl-carousel .owl-prev.disabled,
.owl-carousel .owl-next.disabled{
pointer-events: none;
opacity: 0.2;
}
.owl-nav {
	position: relative;
}
.owl-prev {
	float: left;
	margin-top: -90px;
	margin-left: -30px
}
.owl-next {
	float: right;
	margin-top: -90px;
	margin-right: -30px
}
.fest-imgs {
	text-align: center;
}
.fest-imgs img {
	height: 100px;
	margin-left: 80px;
}
.interview-title {
	margin-top: 35px;
	margin-bottom: 15px;
	padding-left: 50px;
	font-family: 'Neucha', cursive;
	font-size: 1.9rem;
}
.blockquote {	
	display: flex;
	align-items: center;
	margin-top: 50px;
	padding: 0 170px;
	height: 400px;
	background: url('../img/interview/yellow-back.jpg') center top;
	background-size: 100%;
	font-family: 'Neucha', cursive;
	font-size: 3.2rem
}
.blockquote p {
	position: relative;
}
.blockquote i {
	position: absolute;
	margin-left: -60px;
	margin-top: -15px;
}
.no-quote {
	font-size: 1.5rem
}

@media screen and (max-width: 1365px) {
	.green-frame-interv {
		left: -33px;
	}
	.main-interv-pic {
		top: 80px;
	}
	.interview h1 {
		font-size: 2.75rem
	}
	.owl-carousel {
		margin-top: 50px;
	}
}

@media screen and (max-width: 990px) {
	.green-frame-interv {
		left: -58px;
	}
	.main-interv-pic {
		top: 117px;
	}
	.interview {
		padding-left: 0
	}
	.interview h1 {
		font-size: 3.75rem
	}
	.owl-prev, .owl-next {
		margin-top: -100px
	}
	.blockquote {	
		display: block;
		font-size: 2.5rem;
		padding-right: 50px;
		height: auto;
	}
	.interview-title {
		padding-left: 0
	}
}

@media screen and (max-width: 767px) {	
	.interv-img-holder {
		height: 650px
	}
	.green-frame-interv {
		position: absolute;
		width: 100%;
		left: 0px;
	}
	.main-interv-pic {
		position: absolute;
		width: 85%;
		top: 68px;
		margin-left: 25px;
	}
	.owl-prev, .owl-next {
		margin-top: -110px
	}
	.blockquote {
		padding-left: 60px;		
		padding-right: 10px;
		font-size: 2.2rem;
		line-height: 2.5rem;
	}
	.no-quote {
		font-size: 1.25rem;
		line-height: 1.4rem;
	}
}

@media screen and (max-width: 480px) {
	body {
		font-size: 1rem
	}
	.interv-img-holder {
		height: auto
	}
	.green-frame-interv {
		display: none;
	}
	.main-interv-pic {
		position: relative;
		top: 20px;
	}
	.interview {
		padding-top: 50px
	}
	.interview h1 {
		font-size: 2.5rem
	}
	.interview h1.smaller {
		font-size: 2rem
	}
	.interview-title {
		font-size: 1.5rem;
		line-height: 1.7rem;
	}
	.owl-prev {
		margin-top: -140px;
		margin-left: 0;
	}
	.owl-next {
		margin-top: -140px;
		margin-right: 0;
	}
	.fest-imgs img {
		margin: 0;
	}
	.blockquote {
		background-size: auto 100%;
		padding-left: 40px;		
		font-size: 1.7rem;
		line-height: 1.9rem;
	}
	.blockquote i {
		margin-left: -35px;
		margin-top: -10px;
	}
}