/*
Theme Name: Perennial Plate
Author: Lyra Designs
Version: 1
*/

@import url('css/reset.css');
@import url('topbar.css');
@import url('content.css');
@import url('sidebar.css');
@import url('footer.css');
@import url('form.css');


@font-face { font-family: Helvetica Neue; src: url('css/fonts/HelveticaNeueLTStd-Bd.otf'); } 

@font-face { font-family: Helvetica Neue; font-weight:bold; src: url('css/fonts/HelveticaNeueLTStd-Bd.otf'); } 

@font-face { font-family: Helvetica Neue; font-weight:light; src: url('css/fonts/HelveticaNeueLTStd-Roman.otf'); } 


body {
	font-size: 12px;
	letter-spacing: .2px;
	font-family: Helvetica Neue, 'helvetica', 'arial', 'sans-serif';
	margin:0;
	padding:0;
	background:url(img/layout/bg.jpg) top center repeat;
}

.clear {
	clear:both;
}

b, .bold, strong {font-weight:bold;}
.italic, .italics, em {text-transform:italic;font-family:helvetica;}



.hand_small_black {
	margin-right:5px;
}

h1 a, h2 a, h3 a, h4 a {color:black;text-decoration:none;}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {color:#ff267d;text-decoration:none;}

h1 {}

h2 {}

h3 {
	font-size:20px;
	text-transform:uppercase;
	font-weight:bold;
	padding:20px 0;
}

h4 {
	font-size:20px;
	font-family:Helvetica Neue, 'helvetica', 'arial', 'sans-serif';
	font-weight:bold;
	line-height:1.2em;
	letter-spacing:.4px;
}


/* Wordpress content Styling */
.alignright {float:right;}
.alignleft {float:left;}

.seo, #slogan .seo  {
	display:block;
	height:20px;
	width:20px;
	overflow:hidden;
	font-size:5px;
	margin-top:-20px;
	text-indent:-9999em;
}


/* Post Styling */

.post ul, .entry-content ul {
	margin-left:10px;
}

.post ol, .entry-content ol {
	margin-left:10px;
	margin-top:10px;
	list-style-type: decimal;
}

 .post li, .entry-content li {
	color:#333;
 	line-height:17px;
	margin-left:20px;
	padding-right:200px;
	padding-bottom:5px;

 }

.post h4, .entry-content h4 {
	font-size:20px;
	font-weight:bold;
	letter-spacing:0.4px;
	line-height:1.2em;
	color:#FF267D;
	margin-bottom:0px;
}

.post p, .entry-content p {
	padding-right:30px;
	padding-bottom:0px;
	padding-top:0px;
	font-family:helvetica;
}

.post a, .entry-content a {
	color:#FF267D;
	text-decoration:none;
}

.post a:hover, .entry-content a:hover {
	color:#FF267D;
	text-decoration:underline;
}

.post .postmetadata, .entry-content .postmetadata {
	font-size:12px;
	line-height:12px;

}

.post blockquote, .entry-content blockquote {
	color:#fff;
	background-color:#000;
	background-image:url(img/blockquote.png);
	background-repeat:no-repeat;
	background-position:top left;
	padding-right:30px;
	padding-top:40px;
	padding-bottom:20px;
	padding-left:60px;
}
#home_blogroll .entry{
	font-size: 13px;
	line-height: 1.5em;
}
	
#content_wrap img {
	max-width:100%;
	height:auto;
}

/* Comment styling */

#disqus_thread {
	margin:40px 0 0;
}
/* Mobile logo */

#mobile-logo{
	display: none;
}

/* mobile video unit */


#mobile-video-unit div.description {
  padding: 20px 0;
  font-size: 17px;
  text-align: justify;
  line-height: 1.5em;
}
#mobile-video-unit{
	display: none;
}

/* social */
.st_twitter_hcount {
  display: none;
}
.twitter-share-button {
  display: inline-block;
  height: 22px;
  vertical-align: bottom;
  padding-right: 4px;
}
.gm-twitter-button {
  height: 21px !important;
}
 

#share_ep iframe, .share_ep iframe, #share iframe {
  display: inline-block;
  vertical-align: bottom;
}




#home_ep_description {
  height: auto;
  padding-bottom: 20px;
}




@media only screen and (max-width: 990px){

	#topbar #top_content, #container, #footer .container{
		min-width:100%;
		box-sizing: border-box;
	}

	#slogan > img {
	  height: auto;
	  width: 100% !important;
	}
	#container {
		box-sizing: border-box;
	}
	#container #header h3#slogan {
	  display: block;
	  width: 25%;
	}
	#container #header #logo {
		height: 174px;
		left: 0;
		margin: 0 auto;
		right: 0;
		top: 36%;
		width: 273px;
	}
	#logo img {
	  width: 100%;
	  position: absolute;
	  bottom: 36px;
	}
	
	#home_videos{
		display: none;
	}
	#mobile-video-unit{
		display: block;
	}
	

}
@media only screen and (max-width: 690px){
	#container #main #content_wrap.home #home_videos h3.more_ep {
		position: relative;
		display:block;
		padding-top: 20px;
	}
	#home_ep_meta {
	  position: relative;
	  width: 100%;
	  padding-top: 20px;
	}
	#home_ep_description {
	  height: auto;
	}
	
	/* EPISODES */
	#episodes div.episode {
	  display: block;
	  margin: 0 0 32px;
	  padding: 10px 0;
	  width: 100%;
	}
	#episodes div.episode a.ep_image img {
	  float: none;
	  height: auto;
	  width: 100% !important;
	}
	#episodes div.episode div.info {
	  display: block;
	  float: none;
	  padding: 0 0 0 10px;
	  width: 100%;
	}
	
	#episodes div.episode div.info {
	  display: block;
	  float: none;
	  height: auto !important;
	  padding: 10px 0;
	  width: 100%;
	}
	#episodes div.episode div.info h3 {
	  float: left;
	  max-width: 65%;
	  font-size: 18px;
	  padding: 0;
	}
	#episodes div.episode div.info div.meta {
	  float: right;
	  max-width: 35%;
	  font-size: 16px;
	  position: relative;
	  text-align: right;
	}
	
	.entry iframe {
	  width: 100%;
	}
	
	/* CONTACT */
	.contact-form-container {
	  width: 100%;
	}
	.contact .wpcf7-form {
	  box-sizing: border-box;
	  padding: 5%;
	  width: 100%;
	}
	.contact .wpcf7-form  textarea, .contact .wpcf7-form  input  {
	  width: 100%;
	}
}

@media only screen and (max-width: 500px){

	
	/* HEADER */
	#container #header {
	  margin-bottom: 35px;
	}
	#container #header h3#slogan {
	  bottom: -75px;
	  left: 0;
	  padding: 0;
	  width: 50%;
	}
	#topbar {
	  height: 50px;
	}
	#topbar #top_content {
	  height: 45px;
	}
	#container #header {
	  height: 20px;
	}

	#topbar #top_content {
	  background: rgba(0, 0, 0, 0) url("img/layout/location_rooster.png") no-repeat scroll center center;
	}
	#container #header #nav {
	  display: none;
	}
	#container #header #logo {
		height: auto;
	}
	#main-logo{
		display: none;
	}
	#mobile-logo{
		display: block;
	}
	#logo img {
	  top: 0;
	}
	#container #header #logo {
	  top: 2px;
	  width: 300px;
	}
	#top_hr {
	  top: 68px;
	}
	#container #header h3#slogan {
	  display: none;
	}

	#container #main #content_wrap.home {
	  margin: 0 auto 20px;
	  padding-top: 0px;
	  width: 95%;
	}
	#mobile-video-unit h3 {
	  font-size: 33px;
	}

	/* BLOG */
	div.post {
	  border-bottom: 1px solid #ffbaff;
	  margin-bottom: 40px;
	}
	.blog-post-image {
	  width: 100%;
	}
	.post-text {
	  width: 100%;
	  padding: 0;
	}
	#home_blogroll h4 {
	  font-size: 26px;
	  font-weight: bold;
	  margin: 20px 0;
	}
	.post h4, .entry-content h4 {
	  font-size: 26px;
	  font-weight: bold;
	  margin: 20px 0;
	}
	#content_wrap p {
	  font-size: 17px;
	  margin: 15px 0;
	  text-align: justify;
	  padding: 0;
	}
	#content_wrap span {
	  font-size: 17px !important;
	}
	div.post .postmetadata {
	  color: #9e9582;
	  display: block;
	  font-size: 15px;
	  margin-bottom: 7px;
	  padding-left: 12px;
	  text-align: right;
	}
	.share_ep {
	  padding-top: 8px;
	  text-align: right;
	}

		/* SINGLE */
	#container #main #content_wrap {
		padding-top: 0px;
	}
	#share_ep {
	  height: 36px;
	  text-align: right;
	}
	
	#content_wrap.episode .pageNav, 
	#nav-above, #pageNav, div.pageNav {
	  height: auto;
	  margin-bottom: 30px;
	}
	.previous, .all, .next, .nav-previous, .nav-next, .prev {
	  display: inline-block;
	  margin-right: 0;
	  width: 49%;
	  font-size:17px;
	  vertical-align: top;
	  line-height: 17px;
	}
	.pageNav .prev{

	}
	.pageNav .next{
		text-align: right;
	}
	.pageNav .prev a, .pageNav .next a{
		font-size: 14px;
	  line-height: 14px;

	}
	/* EPISODES */
	.home #episodes{
		padding-top: 0 !important;
	}
	.home #episodes h2{
		display:none !important;
	}
	/* RECIPES */

	.category-recipes div.post .postmetadata {
	  padding-left: 0;
	  text-align: left;
	}
	div.post.recipe {
	  margin-bottom: 40px;
	  padding-bottom: 30px;
	}
	.recipe h4{
	  color: #ff267d;
	  font-size: 20px;
	  font-weight: bold;
	  letter-spacing: 0.4px;
	  line-height: 1.2em;
	  margin: 10px 0;
	}

	#nav-above .all a, #pageNav .all a {
	  font-size: 18px;
	}
	
	/* COMMENTS */
	
	.post li, .entry-content li {
	  padding-right: 0;
	}

	.g-recaptcha{
		width: 100% !important;
		margin-left:-20px;
	}
}
@media only screen and (max-width: 400px){
	#container #header #logo {
	  top: 2px;
	  width: 100%;
	}
	#top_hr {
	  display: none;
	}
}