@charset "UTF-8";

/*   
Theme Name: Crepes of Wrath
Description: Updates to Crepes of Wrath - Fall 2015.
Version: 3.0 
Author: jilladelphia
Author URI: http://www.jilladelphia.com
*/

/* RESET
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;	padding: 0;	border: 0;	outline: 0;	font-size: 100%;	vertical-align: baseline;	background: transparent;}									
article, aside, figure, footer, header, hgroup, nav, section {display: block;}
img,object,embed {max-width: 100%;}
html {overflow-y: scroll;}
ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}
hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}
input, select {vertical-align: middle;}
::-webkit-input-placeholder {color:#333;font-size:.9em;}
:-moz-placeholder {color:#333;font-size:.9em;}
pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}
input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}
select, input, textarea {font: 99% sans-serif;}
table {font-size: inherit; font: 100%;}
a:hover, a:active {outline: none;}
small {font-size: 85%;}
strong, th {font-weight: bold;}
td, td img {vertical-align: top;} 
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
pre, code, kbd, samp {font-family: monospace, sans-serif;}
.clickable,label, input[type=button], input[type=submit], button {cursor: pointer;}
button, input, select, textarea {margin: 0; max-width: 100%;}
button {width: auto; overflow: visible;}
.ie7 img {-ms-interpolation-mode: bicubic;}
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  


/* TYPE */

::-moz-selection{background: #000; color: #fff; text-shadow: none;}
::selection {background: #000; color: #fff; text-shadow: none;}

body {font: 11pt 'PT Sans', Helmet, Freesans, sans-serif; line-height:18pt;}
body, select, input, textarea {color: #333;}

a {color: #666;}
a:hover {color: #000;}
a:link {-webkit-tap-highlight-color: #666;} 
a:visited {color: #000;}

h1 {font-size:1.5em; font-family: 'Arvo', Courier, serif;}
h2 {font-size:1.4em; font-family: 'Arvo', Courier, serif;}
h3 {font-size:1.3em;}
h4 {font-size:1.2em;}

ins {background-color: #666; color: #fff; text-decoration: none;}
mark {background-color: #666; color: #fff; font-style: italic; font-weight: bold;}


/* LAYOUT
-------------------------------------------------------------------------------*/

html { height: 100%; }

body {
	color:#333;
	height: 100%;
  margin: 0 auto;
  position: relative;
	width:972px;
}

.wrapper {position:relative;}

#sidebar {
  float:left;
	height:100%;
	margin: 0 28px;
	text-align: justify;
	width: 160px;
}
	#sidebar.pinned {position: fixed;}

.branding {
	background: url('_/img/logo.png') no-repeat 50% 0;
	display:block;
	height:245px;
	text-indent: -9999px;
	width:160px;
  -webkit-transition: opacity 1s ease;
  -moz-transition: opacity 1s ease;
  -ms-transition: opacity 1s ease;
  -o-transition: opacity 1s ease;
  transition: opacity 1s ease;
}
  .branding:hover {
    opacity:.6;
    -webkit-transition: opacity 1.5s ease;
    -moz-transition: opacity 1.5s ease;
    -ms-transition: opacity 1.5s ease;
    -o-transition: opacity 1.5s ease;
    transition: opacity 1.5s ease;
  }


#content {
	height: 100%;
	margin: 0 28px 0 216px;
	width:728px;
}
  .ie9 #content {position:absolute;}

p {margin: 7px 0;}

article {text-align:left;}
article img {margin: 0;width:728px;}
  article > img {margin-bottom:7px;}
  article img.actual-size {width: auto;}
  div.actual-size img {border:none;width: auto;}
  article img.half-size {width:50%;}
  article table.quadrants td {width:50%;}
    article table.quadrants td img {margin:0;width:100%;}

#footer {
  background:#fff;
  clear:both;
  margin: 0;
  padding-top:1em;
  text-align: right;
}

.flex-video {
  height: 0;
  margin-bottom: 1rem;
  overflow: hidden;
  padding-bottom: 67.5%;
  padding-top: 1.5625rem;
  position: relative; }
  .flex-video.widescreen {
    padding-bottom: 56.34%; }
  .flex-video.vimeo {
    padding-top: 0; }
  .flex-video iframe,
  .flex-video object,
  .flex-video embed,
  .flex-video video {
    height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    left: 0; }


/* Ads
-------------------------------------------------------------------------------*/

#pushdown {padding-top:10px;padding-bottom:10px;text-align:right;}
  #pushdown img, #pushdown embed, #pushdown object {max-width:inherit;}
#sidebar .delicious-posts ul {font-size:.8em;text-align:left;}
#sidebar #martha a {background:url('_/img/marthas-circle.gif')no-repeat;border-top:1px solid #000;height: 142px;margin: .5em auto 0;width: 158px;}
  #martha {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%); -o-filter: grayscale(100%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
  }
  #martha:hover {
    filter: none;
    -webkit-filter: none; -moz-filter: none;
    -ms-filter: none; -o-filter: none;
    -webkit-transition: -webkit-filter 1.5s linear;
    -moz-transition: -moz-filter 1.5s linear;
    -ms-transition: -ms-filter 1.5s linear;
    -o-transition: -o-filter 1.5s linear;
    transition: filter 1.5s linear;
  }

/* Navigation & Social
-------------------------------------------------------------------------------*/

nav.main {
  border:1px solid #000;
  border-left:none;
  border-right:none;
  color:#000;
  font-family: 'Arvo', Courier, serif;
  text-transform:uppercase;
}
  nav.main:first-of-type {margin-bottom: .6em;}
  nav a {
    color: #000;
    text-decoration:none;
  }
    nav a, nav li.search span {
      -webkit-transition: color .8s ease;
      -moz-transition: color .8s ease;
      -ms-transition: color .8s ease;
      -o-transition: color .8s ease;
      transition: color .8s ease;
    }
    nav a:hover, nav li.search span:hover {
      color: #666;
      -webkit-transition: color .5s ease;
      -moz-transition: color .5s ease;
      -ms-transition: color .5s ease;
      -o-transition: color .5s ease;
      transition: color .5s ease;
    }
  nav li.index, nav li.faq, nav li.search {font-weight:bold;}
  nav li.index {font-size:48px;line-height:48px;}
  nav li.about {font-size:44px;line-height:44px;}
  nav li.faq {font-size:20px;line-height:20px;letter-spacing:3px;text-align:center;}
    nav li.faq span {background:#fff;}
  nav li.contact {font-size:30px;line-height:30px;}
  nav li.search {cursor:pointer;font-size:36px;line-height:36px;}
    nav li.search #searchform, nav li.search #searchsubmit {display:none;}
    nav.main input#s,form.subscribe input {margin:0 0 .25em 0;width:100%;}
      nav.main input#s {font-size:.5em;}
  nav li.archive {font-size:33px;line-height:33px;}
  nav li.random {font-size:33px;line-height:33px;}
  nav li.recipes {font-size:37px;line-height:37px;}

article nav h3, #sidebar h3 {clear:both;text-align:center;}
  article nav h3 {margin:0 1em;}
  #sidebar h3 {font-size:1em;}
.nav-title {background:#fff;font-family: 'Arvo', Courier, serif;font-size:.8em;font-weight:normal;padding:0 .5em;text-align:center;text-transform:uppercase;}
article nav:first-of-type ul {margin-left:49px;} 
article nav > ul > li {border-right:1px solid #000;float:left;margin-right:20px;padding-right:20px;}
  article nav > ul >li:last-child{margin-right:0;padding-right:0;}

@font-face
{ 
    font-family: SocialIcons;
    src: url('_/type/social.eot');
    src: url('_/type/social.eot?#iefix') format('embedded-opentype'),
        url('_/type/social.ttf') format('truetype'),
        url('_/type/social.woff') format('woff'),
        url('_/type/social.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
.social-icon
{
  font-family: 'SocialIcons';
  font-weight: normal; font-style: normal;
  -webkit-font-smoothing:  antialiased !important;
  -moz-font-smoothing:  antialiased !important;
  font-smoothing:  antialiased !important;
  line-height:1em;
}
 
a.social-icon, span.social-icon, small.social-icon {
  display: -moz-inline-stack;
  display:inline-block;
  zoom: 1;
  *display: inline;
}
 
[class^="icon-"], [class*=" icon-"]
{
  font-family: 'SocialIcons';
  font-weight: normal; font-style: normal;
  -webkit-font-smoothing:  antialiased !important;
  -moz-font-smoothing:  antialiased !important;
  font-smoothing:  antialiased !important;
  line-height:1em;
}
 
a[class^="icon-"], a[class*=" icon-"], span[class^="icon-"], span[class*=" icon-"], small[class^="icon-"], small[class*=" icon-"] {
  display: -moz-inline-stack;
  display:inline-block;
  zoom: 1;
  *display: inline;
}
  
.icon-facebook:before { content:""; } 
.icon-twitter:before { content:""; } 
.icon-youtube:before { content:""; } 
.icon-instagram:before { content:""; } 
.icon-pinterest:before { content:""; } 
.icon-tumblr:before { content:""; }
.icon-foodgawker:before { content:""; } 
.icon-tastespotting:before { content:""; } 

.social a, .share span {
  background:#000;
  border-radius: .2em;
  color:#fff;
  float:left;
  font-size:2.4em;
  margin-right:6px;
  padding:.2em;
  text-decoration: none;
  -webkit-transition: all .7s ease;
  -moz-transition: all .7s ease;
  -ms-transition: all .7s ease;
  -o-transition: all .7s ease;
  transition: all .7s ease;
}
  .social a.last {margin-right: 0;}
  .share span {cursor: pointer;}
  .share .social, .further .social {font-size:.5em;}
  .further .social li, .archive .social li {display:inline-block;}
  .further .social a, .archive .social a, .archive .social span {margin-right: 3px}

.social a:hover, .share span:hover {
  background-color:#666;
  box-shadow: inset 1px 1px 1px #333;
  text-shadow: 1px 1px 0 #333;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.social .icon-youtube:hover {
  background-color: #bd2f29;
  color: #fff;
}

.social .icon-pinterest:hover {
  background-color: #ce2127;
  color: #fff;
}

.social .icon-instagram:hover {
  background-color: #57261f;
  color: #f5edea;
  box-shadow: inset 1px 1px 1px #111;
}

.social .icon-tumblr:hover {
  background-color: #395975;
  box-shadow: inset 1px 1px 1px #000;
  text-shadow: 1px 1px 0 #000;
}

.social .icon-twitter:hover {
  background-color:#2f2f2f;
  box-shadow: inset 1px 1px 1px #000;
  color:#00c0f7;
  text-shadow: 1px 1px 0 #000;
}

.social .icon-facebook:hover {
  background-color: #3b5998;
}

.social .icon-foodgawker:hover {
  background-color: #333;
  box-shadow: inset 1px 1px 1px #000;
  color: #ce2127;
  text-shadow: 1px 1px 0 #000;
}

.social .icon-tastespotting:hover {
  color:#fff200;
}

.further li.subscribe {margin-right: 10px;padding-right: 10px;}
form.subscribe input {border:1px solid #000; font-size:.9em; padding:.3em 0;}
  article li.subscribe span {display:inline-block; margin-left:30px;}
  article form.subscribe {display:none;}
  article form.subscribe input {width:150px;}
  #sidebar form.subscribe {border-bottom:1px solid #000; margin-bottom: .5em; padding-bottom: .5em;}
  

.line-bg {background:url('_/img/line-1px.png') repeat-x 0 50%;}

/* Home Page & Articles
-------------------------------------------------------------------------------*/

article {
  background:#fff;
  border-bottom:1px solid #000;
  padding: 1em 0;
}
  article:first-of-type {padding-top:0;}

hgroup {text-align:center;}
hgroup h1 {margin-bottom:.5em;text-transform:uppercase;}
hgroup h1 a {color:#000;text-decoration:none;}
hgroup h2 {border:1px solid #000;border-left:none;border-right:none;display:inline;font-weight:normal;text-transform:uppercase;}

article aside {border-left: 1px solid #000; float:right; margin: 0 0 14px 14px; padding-left:14px; width:300px;}
article aside img {width:auto;max-width:300px;}

article time {font-family: 'Arvo', Courier, serif;font-weight:bold;text-transform:uppercase;}
article .author {display:block;}

article .caption {display: block;font-size: .9em;font-style:normal;line-height: 1.4em;margin-top: -7px;padding:.3em 0;text-align: center;}
  article .caption i, article .caption em {font-style: normal;}

article section.share h3 {float:left;margin-right:.5em;}
article section.share ul.share {float:left;}

article footer {
  border-top:1px solid #000;
  border-bottom:1px solid #000;
  display:inline-block;
  font-family: 'Arvo', Courier, serif;
  font-size:1.4em;
  padding:.2em 0 .1em 0;
  text-transform:uppercase;
}
  article footer a {color:#000;text-decoration:none;}
  
a.more-link {display:none;}

.post-meta{
text-align: center;
}
  
/* Archive Page
-------------------------------------------------------------------------------*/

.archive {
	margin: 1em 0; 
	padding-left: 24px;
}

.archive article {
  background: #fff;
	border:1px solid #000;
  float: left;
  height: 350px;
  margin: 0 28px 14px 0;
  padding: 12px;
  position:relative;
  text-align:left;
  width: 300px;
}

.archive article:nth-child(even) { margin-right: 0;}

.archive article figure {border: 1px solid #ccc;height:300px;overflow:hidden;width:300px;}
.archive article figure .post-image {
  height: auto;
  max-width:none;
  width: auto;
}
  .archive article figure .landscape {
    height:300px;
    margin-left: -12.5%;
  }
  .archive article figure .portrait {
    margin-top: -12.5%;
    width: 300px;
  }


.archive h2 {font-size: 1em}
.archive h2 a {color:#000;}

.archive .share {
  bottom: -1px;
  position:absolute;
  right:7px;
}
  .archive .share h3 {display:none;}

.pagination {clear:both;font-family: 'Arvo', Courier, serif;text-align:center;}
.page-numbers, .pagination .arrow a{background:#fff;border:1px solid #000;color:#000;margin:10px 2px 0px 2px;padding:1px 8px 1px 8px;text-decoration:none;}
.page-numbers:hover, .pagination .arrow a:hover{background:#666; color:#FFFFFF;}
.pagination .current, .pagination .current:hover{background:#000;border:1px solid #000;color:#FFFFFF; }


/* Recipe Index
-------------------------------------------------------------------------------*/
.recipe-index span.category {display:inline-block;margin-right:.5em;}
.recipe-index h3 {margin-top:.5em;}


/* Comments
-------------------------------------------------------------------------------*/

section.comments {margin:1em 1em 1em 2em;}
#comments a {text-decoration: none;}
#comments h2 {border-bottom: 1px solid #ccc;}

.commentlist {list-style: none;}
.commentlist > li {border-bottom:1px solid #ccc;}
.comment-body {padding:1em 0 .5em;position: relative;}

.comment-src {float:left; width:20%;}
.comment-author {float:left;font-family: 'Arvo', Courier, serif;font-size:.8em;line-height:1.3em;margin-right:1em;}
  .commentlist cite {font-size:1.2em;font-style:normal;font-weight:bold;}
  .commentlist .says {display:none;}  
.comment-meta {clear:left;float:left;font-size:.8em;line-height:1.2em;}
.comment-body p, .comment-body .reply {font-family:Arial, sans-serif;font-size:.9em;}
.comment-body p {float:right;line-height:1.3em;margin-top: 0; width:75%;}
.comment-body .reply {clear:both;margin-right: 1em; text-align:right;}

.commentlist > li li {margin-left:2em;}
.commentlist > li li .comment-body {box-shadow:inset 1px 1px 1px #ccc;border-bottom:1px solid #eee;border-right:1px solid #eee;margin-left:2em;margin-bottom: 1em; padding-left: .5em;}
.commentlist > li .depth-2 > .comment-body, .commentlist > li .depth-4 > .comment-body {background-color:#f9f9f9;}
.bypostauthor > .comment-body {background-image:url('_/img/logo-sml-faded.png');background-repeat: no-repeat;background-position: 97% 1em;}
  .bypostauthor > .comment-body p {padding-right: 9%;width:71%;}
  .bypostauthor > .comment-body .reply {padding-top:.5em;}

#respond {margin-top: 1em;}

.ERRatingComment {display:none;}

/* WP 
-------------------------------------------------------------------------------*/

#page-wrap {width: 960px; margin: 20px auto;}

.navigation {background:#fff;clear:both;}
.next-posts {float:left;}
.prev-posts {float:right;}

  
/* Helpers
-------------------------------------------------------------------------------*/  

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

.bullet {list-style-type:disc;}
.center {text-align:center;}
.column {float:left;}
  .column:last-child {margin-right:0;}
.hide {display:none;}
.last {border-right:none;margin-right:0;}
  .ie8 .last, .ie7 .last, .ie6 .last {border-right:none !important; margin-right:0 !important;}
.left {float:left;}
.normal {font-weight:normal;}
.nowrap {white-space:nowrap;}
.right {float:right;}
.show {display:block;}
.strong {font-weight:bold;}
.underline {text-decoration:underline;}


/* Media Queries
-------------------------------------------------------------------------------*/
.show-for-small{
display: none;
}
.hide-for-small{
display: inherit;
}
@media all and (max-width:970px) {
  
  body {width:100%;}
  #sidebar {min-width:160px;max-width:160px;}
  #content {position:absolute;width:70%;z-index:500;}
  article {background:#fff;}
  article img {width:100%; height: auto;}
  article aside {width:50%;}
 
 /* Ads */
 #pushdown {padding-right:0;}
 #pushdown img, #pushdown object {width:inherit;max-width:100%;}
}

/* Small screen adjustments */
@media all and (max-width: 640px){
	.hide-for-small{
		display: none !important;
	}
	.show-for-small{
		display: block !important;
	}
	
	.sidebar-container{
	display: none !important;
	}
	#sidebar{
	display: none !important;
	}
	.wrapper{
	width: 100%;
	}
	#content{
	position: relative;
	display: block;
	margin: 0;
	width: 100%;
	padding: 110px 0 0;
	}
	.further{
	width: auto;
    display: block;
    float: none;
    padding: 0;
    border-left: none;
    margin: 0 auto;
    text-align: center;
	}
	.further .box{
	margin: 0 auto;
	}
	/* Subscribe, box navigation, ad, etc on single pages */
	.single .further{
	margin: 50px auto 65px;
	}
	
	/* Box Navigation, etc */
	article nav:first-of-type ul {
    margin: 0;
    overflow: hidden;
	}
	article nav > ul > li{
	border-right: 1px solid #000;
    float: left;
    margin-right: 0;
    padding-right: 0;
    display: table-cell;
    width: 32.333333%;
	}
	.subscribe{
	width: 47%;
	}
	/* Post Title */
	#content hgroup h1{
	margin-bottom: .5em;
    text-transform: uppercase;
    clear: both;
    margin-top: 5px;
    position: relative;
    display: block;
	}
	.post-meta{
	margin-bottom: 10px;
	}
	/* Post Content */
	#content .entry{
	padding: 0 20px;
	}
	
	/* Mobile Header Stlyes */
	.mobile-header{
	width: 100%;
    display: block;
    position: fixed;
    height: 110px;
    background: white;
    z-index: 99999;
    transition: height .4s ease;
    -webkit-transition: height .4s ease;
    -moz-transition: height .4s ease;
	}
	.mobile-logo{
	display: block;
	position: relative;
	margin: 0 auto;
	width: 100%;
	}
	.mobile-logo a{
	text-decoration: none;
	}
	.mobile-logo a img{
	height: 100px;
	width: auto;
	margin: 10px 0 0 10px;
	display: inline-block;
	vertical-align: middle;
	}
	.mobile-logo a h2{
	display: inline-block;
	vertical-align: middle;
	padding-top: 17px;
	}
	#nav-toggle {
    width: 30px;
    height: 40px;
    display: block;
    background: none;
    position: absolute;
    top: 39px;
    right: 20px;
    transition: all 0.3s ease;
    text-align: center;
    margin: 0 auto;
	}
	.panel{
	background: white;
	padding: 15px 0;
	top: 110px;
	}
	.panel ul li a{
	cursor: pointer;
	display: block;
	padding: 4px 0;
	text-align: center;
	}
	/* Bottom Ad */
	#div-gpt-ad-111432534558587806-1{
		display: none !important;
	}
	/* Helper Classes for Header */
	.slideUp{
	height: 0px;
	overflow: hidden;
	transition: height .4s ease;
    -webkit-transition: height .4s ease;
    -moz-transition: height .4s ease;
	}
	.slideDown{
	height: 110px;
	overflow: auto;
	transition: height .4s ease;
    -webkit-transition: height .4s ease;
    -moz-transition: height .4s ease;
	}
	/* Mobile Search */
	.mobile-search{
		margin-top: 15px;
		text-align: center;
	}
	.mobile-search h4{
		color: black;
	}
}