/*
Theme Name:     Ma.tt
Theme URI:      http://ma.tt
Description:    A tribute to Mark Rothko.
Author:         Joen Asmussen
Author URI:     http://ma.tt
Template:       twentythirteen
Version:        1.0.0
*/


/**
 * Import twenty thirteen base styles
 */

@import url("../twentythirteen/style.css");

/**
 * Header
 */

.site {
	border-left: 0 !important;
	border-right: 0 !important;
	max-width: none;
	border: none;
}

.site-header {
	background-image: url('i/header-2x.jpg?20140404') !important;
	background-color: #fba006 !important;
	background-size: 1600px 230px !important;
}

/* IE hacks */
@media \0screen {
	.site-header {
		background-image: url('i/ie/header.jpg?20140404') !important;
	}
}
*+html .site-header {
	background-image: url('i/ie/header.jpg?20140404') !important;
}

.site-header .home-link {
	max-width: 940px;
	color: #fff;
}

.site-description {
	display: none;
}

.site-title {
	font-family: "Source Sans Pro";
	font-size: 30px;
	padding: 150px 0 10px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}

.site-title:after {
	background: url('i/tagline-2x.png') repeat-x left top;
	content: "";
	display: block;
	width: 166px;
	height: 14px;
	background-size: 166px 14px;
	position: absolute;
	top: 168px;
	margin-left: 190px;
}

/* IE hacks */
@media \0screen {
	.site-title:after {
		margin-left: 230px;
		background: url('i/ie/tagline.png') repeat-x left top;
	}
}
*+html .site-title:after {
	margin-left: 230px;
	background: url('i/ie/tagline.png') repeat-x left top;
}

.nav-menu .sub-menu, .nav-menu .children {
	border: 2px solid #fea42c;
	border-top: 0;
}

ul.nav-menu ul a:hover, .nav-menu ul ul a:hover {
	background-color: #d54511;
}


/**
 * Menu
 */
.menu-toggle {
	border:none;
}

.navbar {
	background: url('i/menu-2x.png') repeat-x center bottom;
	background-size: 1600px 60px;
	position: relative;
	z-index: 10;
	margin-bottom: -14px;
	max-width: none;
}

/* IE hacks */
@media \0screen {
	.navbar {
		background: url('i/ie/menu.png') repeat-x center bottom;
	}
}
*+html .navbar {
	background: url('i/ie/menu.png') repeat-x center bottom;
}

.main-navigation {
	height: 60px;
	max-width: 940px;
}

.navbar-fixed .navbar {
	box-shadow: none;
	height: 55px;
}

.nav-menu li a {
	color: #141412;
}

.toggled-on .nav-menu {
	background: #fda42c;
}


/**
 * Posts
 */

.blog .format-link:first-of-type, .single .format-link:first-of-type {
	box-shadow: none;
}

article.post, article.page, #respond {
	position: relative;
}

.entry-content blockquote, .comment-content blockquote {
	font-size: 16px;
	font-weight: normal;
}
.quote blockquote {
	font-weight: 300;
}

.author {
	display:none;
}

#post-1606 h3 {
	clear:none;
}


/**
 * Standard posts (and pages) 
 */
article.format-image, article.format-standard, article.page,
.gallery-1 {
	background: #fff url('i/white-2x.jpg?20140404') repeat center top;
	background-size: 1600px 445px;
}

/* IE hacks */
@media \0screen {
	article.format-image, article.format-standard, article.page, .gallery-1 {
		background: #fff url('i/ie/white.jpg?20140404') repeat center top;
	}
}
*+html article.format-image, *+html article.format-standard, *+html article.page, *+html .gallery-1 {
	background: #fff url('i/ie/white.jpg?20140404') repeat center top;
}

article.page, article.format-standard {
	background-repeat: repeat-x;
}

article.page {
	color: #141412;
}

article.format-image:after, 
article.format-standard:after,
article.page:after,
.gallery-1:after {
	content: "";
	width: 100%;
	display: block;
	height: 33px;
	background: url('i/white-edge-2x.png') repeat-x center bottom;
	background-size: 1600px 33px;
	position: absolute;
	bottom: -7px;
	z-index: 1;
}

/* IE hacks */
@media \0screen {
	article.format-image:after, article.format-standard:after, article.page:after, .gallery-1:after {
		background: url('i/ie/white-edge.png') repeat-x center bottom;
	}
}
*+html article.format-image:after, *+html article.format-standard:after, *+html article.page:after, *+html .gallery-1:after {
	background: url('i/ie/white-edge.png') repeat-x center bottom;
}

.format-image .entry-content a,
.format-image .entry-meta a,
.format-standard .entry-content a,
.format-standard .entry-meta a {
	color: #d44410;
}


/**
 * Links, paging navigation, colophon 
 */

html, .site {
	background: #fea42c;
}

article.format-link, .paging-navigation, .site-footer,
.gallery-5 {
	background: #fea42c url('i/yellow-2x.jpg?20140404') repeat center top;
	background-size: 1600px 525px;
}

.site-footer {
	background: #fea42c url('i/yellow-2x.jpg?20140404') repeat center bottom;
}

/* IE hacks */
@media \0screen {
	article.format-link, .paging-navigation, .gallery-5 {
		background: #fea42c url('i/ie/yellow.jpg?20140404') repeat center top;
	}
	.site-footer {
		background: #fea42c url('i/ie/yellow.jpg?20140404') repeat center bottom;
	}
}
*+html article.format-link, *+html .paging-navigation, *+html .gallery-5 {
	background: #fea42c url('i/ie/yellow.jpg?20140404') repeat center top;
}
*+html .site-footer {
	background: #fea42c url('i/ie/yellow.jpg?20140404') repeat center bottom;
}

article.format-link+article.format-link, .site-footer {
	background-position: center bottom !important;
}

.site-footer a {
	color: #29170b;
}

.paging-navigation .meta-nav {
	background-color: #29170b;
}

.paging-navigation a {
	color: #29170b;
}

.paging-navigation a:hover .meta-nav {
	background-color: #d54511;
}

.paging-navigation a:hover {
	color: #d54511;
}

article.format-link:after, .paging-navigation:after, .gallery-5:after {
	content: "";
	width: 100%;
	display: block;
	height: 50px;
	background: url('i/yellow-edge-2x.png') repeat-x center bottom;
	background-size: 1600px 50px;
	position: absolute;
	bottom: -17px;
	z-index: 1;
}

/* IE hacks */
@media \0screen {
	article.format-link:after, .paging-navigation:after, .gallery-5:after {
		background: url('i/ie/yellow-edge.png') repeat-x center bottom;
	}
}
*+html article.format-link:after, *+html .paging-navigation:after, *+html .gallery-5:after {
	background: url('i/ie/yellow-edge.png') repeat-x center bottom;
}

.format-link .entry-content,
.format-link .entry-meta {
	color: #141412;
}

.format-link .entry-content a,
.format-link .entry-meta a,
.format-link .entry-title a {
	color: #b60000;
}


/**
 * Asides, chats, comment-bg
 */
article.format-aside,
article.format-chat,
.post-navigation,
.gallery-4 {
	background: #5c3820 url('i/light-brown-2x.jpg?20140404') repeat center top;
	background-size: 1600px 725px;
	color: #fff;
}

body.page .site-content,
body.single .site-content {
	background: #5c3820 url('i/light-brown-2x.jpg?20140404') repeat center top;
	background-size: 1600px 725px;
}


/* IE hacks */
@media \0screen {
	article.format-aside, article.format-chat, body.page .site-content, .post-navigation, .gallery-4 {
		background: #5c3820 url('i/ie/light-brown.jpg?20140404') repeat center top;
	}
}
*+html article.format-aside, *+html article.format-chat, *+html body.page .site-content, *+html .post-navigation, *+html .gallery-4 {
	background: #5c3820 url('i/ie/light-brown.jpg?20140404') repeat center top;
}

article.format-aside .entry-title a, article.format-chat .entry-title a, .post-navigation a {
	color: #fff;
}

article.format-aside:after,
article.format-chat:after,
#comments ol.comment-list:after,
.gallery-4:after {
	content: "";
	width: 100%;
	display: block;
	height: 50px;
	background: url('i/light-brown-edge-2x.png') repeat-x center bottom;
	background-size: 1600px 50px;
	position: absolute;
	bottom: -23px;
	z-index: 1;
}


/* IE hacks */
@media \0screen {
	article.format-aside:after, article.format-chat:after, #comments ol.comment-list:after, .gallery-4:after {
		background: url('i/ie/light-brown-edge.png') repeat-x center bottom;
	}
}
*+html article.format-aside:after, *+html article.format-chat:after, *+html #comments ol.comment-list:after, *+html .gallery-4:after {
	background: url('i/ie/light-brown-edge.png') repeat-x center bottom;
}

#comments ol.comment-list:after {
	left: 0;
}

.format-chat .entry-content a,
.format-chat .entry-meta a,
.format-aside .entry-content a,
.format-aside .entry-meta a {
	color: #fda32c;
}



/**
 * Status, quote 
 */
article.format-status,
article.format-quote,
#respond,
.gallery-3 {
	background: #2b170e url('i/brown-2x.jpg?20140404') repeat center top;
	background-size: 1600px 500px;
}

/* IE hacks */
@media \0screen {
	article.format-status, article.format-quote, #respond, .gallery-3 {
		background: #2b170e url('i/ie/brown.jpg?20140404') repeat center top;
	}
}
*+html article.format-status, *+html article.format-quote, *+html #respond, *+html .gallery-3 {
	background: #2b170e url('i/ie/brown.jpg?20140404') repeat center top;
}

article.format-status:after,
article.format-quote:after,
#respond:after,
#respond:before,
.gallery-3:after,
.navbar:before {
	content: "";
	width: 100%;
	display: block;
	height: 50px;
	background: url('i/brown-edge-2x.png') repeat-x center bottom;
	background-size: 1600px 56px;
	position: absolute;
	bottom: -23px;
	z-index: 1;
}

.site-footer {
	background: #2b170e url('i/brown-2x.jpg?20140404') repeat center top;
	color: #fff;
}
.site-footer a {
	color:#fff;
	
}
#respond {
	background: #fea42c url('i/yellow-2x.jpg?20140404') repeat center top;
}
#respond:before {
	background: url('i/yellow-edge-2x.png') repeat center top;
	top: -50px;
}
#respond:after {
	bottom: inherit;
}

.navbar:before {
	top: -9px;
	z-index: 0;
	bottom: auto;
}

/* IE hacks */
@media \0screen {
	article.format-status:after, article.format-quote:after, #respond:after, #respond:before, .gallery-3:after {
		background: url('i/ie/brown-edge.png') repeat-x center bottom;
	}
}
*+html article.format-status:after, *+html article.format-quote:after, *+html #respond:after, *+html #respond:before, *+html .gallery-3:after {
	background: url('i/ie/brown-edge.png') repeat-x center bottom;
}

.format-status .entry-content a,
.format-status .entry-meta a,
.format-quote .entry-content a,
.format-quote .entry-meta a,
.format-quote .linked {
	color: #fda32c;
}

.format-status .entry-content:before, .format-status .entry-meta:before {
	display: none;
}

.format-status .entry-content p:first-child:before {
	background-color: #fda32c;
	margin-top: 15px;
}

.comment-meta, .comment-meta a {
	color: #29170b;
}


/**
 * Gallery, audio, video, commentbox
 */

article.format-gallery,
article.format-audio,
article.format-video,
/*#respond, */
.gallery-2 {
	background: #d44412 url('i/red-2x.jpg?20140404') repeat center top;
	background-size: 1600px 540px;
}

.format-gallery .entry-content a,
.format-gallery .entry-meta a,
.format-audio .entry-content a,
.format-audio .entry-meta a,
.format-video .entry-content a,
.format-video .entry-meta a {
	color: #fff;
}


/* IE hacks */
@media \0screen {
	article.format-gallery, article.format-audio, article.format-video, /*#respond, */.gallery-2 {
		background: #d44412 url('i/ie/red.jpg?20140404') repeat center top;
	}
}
*+html article.format-gallery, *+html article.format-audio, *+html article.format-video, /**+html #respond, */*+html .gallery-2 {
	background: #d44412 url('i/ie/red.jpg?20140404') repeat center top;
}

article.format-gallery:after,
article.format-audio:after,
article.format-video:after,
/*#respond:after,
#respond:before, */
.gallery-2:before {
	content: "";
	width: 100%;
	display: block;
	height: 50px;
	background: url('i/red-edge-2x.png') repeat-x center bottom;
	background-size: 1600px 38px;
	position: absolute;
	bottom: -20px;
	z-index: 2;
}

/* IE hacks */
@media \0screen {
	article.format-gallery:after, article.format-audio:after, article.format-video:after, /*#respond:after, #respond:before, */.gallery-2:before {
		background: url('i/ie/red-edge.png') repeat-x center bottom;
	}
}
*+html article.format-gallery:after, *+html article.format-audio:after, *+html article.format-video:after, /**+html #respond:after, *+html #respond:before, */*+html .gallery-2:before {
	background: url('i/ie/red-edge.png') repeat-x center bottom;
}


/**
 * Gallery Rothko stripes
 */

article.format-video:before {
	margin: 20px auto 0 auto;
	content: "";
	display: block;
	width: 100%;
	max-width: 1000px;
	height: 260px;
	background: url('i/rothko-stripes-2x.png') repeat-x center top;
	background-size: 1000px 260px;
}

/* IE hacks */
@media \0screen {
	article.format-video:before, article.format-gallery:before {
		background: url('i/ie/rothko-stripes.png') repeat-x center top;
	}
}
*+html article.format-video:before, *+html article.format-gallery:before {
	background: url('i/ie/rothko-stripes.png') repeat-x center top;
}

article.format-video>div:first-child {
	margin-top: -280px;
}

article.format-video ~ article.format-video:before {
	background: none;
}

/**
 * Forms
 */

button, input, textarea {
	border: 2px solid #fff;
}

input:focus, textarea:focus {
	border: 2px solid #fea831 !important;
}

button, input[type="submit"], input[type="button"], input[type="reset"] {
	background: #fea22e !important;
	border-bottom-color: #c07313;
	color: #141412;
}

button:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover, button:focus, input[type="submit"]:focus, input[type="button"]:focus, input[type="reset"]:focus {
	background: #ffb75f !important;
	border-bottom-color: #e09130;
}

button:active, input[type="submit"]:active, input[type="button"]:active, input[type="reset"]:active {
	border-top-color: #e09130;
}


/**
 * Gallery template
 */

.gallery-template img.gallery-featured {
	margin-left: -60px;
	max-width: 460px;
	margin-bottom: 40px;
}

.gallery-template .entry-content {
	position: relative;
}

/* four thumbnails */
.gallery-template .gallery {
	float: right;
	width: 264px;
	margin-right: -64px;
}
.gallery-template .gallery-item {
	max-width: none;
	width: 128px;
	height: 128px;
}

.gallery-count {
	position: absolute;
	right: 20px;
	top: 270px;
	width: 160px;
	font-style: italic;
}


/* hide the search form because it's offscreen anyway */
.search-form {
        display:none;
}

/**
 * Fixed navbar
 */

@media (min-width: 643px) {
	
	.navbar {
		position: fixed;
		height: 49px;
		bottom: 0;
		left: 0;
		right: 0;
		/*background: rgba(255, 255, 255, 0.9);
		box-shadow: 0px 0 5px rgba(0,0,0,.2); */
		background: rgba(40, 22, 10, 0.9);
	}
	
	.nav-menu li a {
		padding: 10px 15px;
		color: #f7f5e7;
	}
	
	.site-header .searchform [type="search"], .site-header .searchform [type="text"] {
		height: 28px;
	}
	.site-header .searchform [type="search"]:focus, .site-header .searchform [type="text"]:focus {
		border: 0;
	}

	#main:before {
		content: "";
		display: block;
		background: url('i/menu-2x.png') repeat-x center bottom;
		background-size: 1600px 60px;
		height: 20px;
		z-index: 10;
		position: absolute;
		left: 0;
		right: 0;
	}
	
	#content>article:first-of-type .entry-content {
		margin-top: 20px;
	}
	
	.site-info {
		padding: 30px 0 60px 0;
	}

}
	

/**
 * Comments
 */

#commentform {
	margin-bottom: 30px;
}

ol.comment-list>li:last-child {
	padding-bottom: 20px;
}

.comments-title {
	color: #fff;
}

.comment-list .pingback, .comment-list .trackback {
	padding-top: 0;
}

img.avatar {	/* this fixes an issue with gravatar hovercards */
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}

.comment-list > li:after, .comment-list .children > li:before {
	display: none;
}

.comment-author {
	float: none;
	max-width: none;
}

.comment-metadata, .comment-awaiting-moderation, .comment-content, .comment-list .reply {
	width: auto;
	float: none;
}

.comment-content {
	word-break: break-word;
	overflow: auto;
}

.comment-body {
	position: relative;
	background: #fff;
	padding: 0;
	margin-bottom: 10px;
	margin-left: 100px;
	padding: 15px 20px;
}

.comment-list .trackback .comment-body,
.comment-list .pingback .comment-body {
	background: rgba(255,255,255,.6);
}

.comment-body:before {
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-right: 10px solid #fff;
	border-bottom: 10px solid transparent;
	display: block;
	position: absolute;
	left: -10px;
	top: 34px;
}

.comment-list .trackback .comment-body:before, 
.comment-list .pingback .comment-body:before {
	display: none;
}

.bypostauthor>.comment-body {
	background: #fea42c url('i/yellow-2x.jpg?20140404') repeat center top;
	background-size: 1600px 525px;
	color: #141412;
}

.bypostauthor>.comment-body:before {
	border-right: 10px solid #fea52d;
}

.comment-body a, .comment-body .comment-author .fn, .comment-body .comment-author .url, .comment-body .comment-reply-link, .comment-body .comment-reply-login, .comment-body .pingback .comment-body a, .comment-body .trackback .comment-body a {
	color: #d44410;
}

.bypostauthor .comment-body a, .bypostauthor .comment-body .comment-author .fn, .bypostauthor .comment-body .comment-author .url, .bypostauthor .comment-body .comment-reply-link, .bypostauthor .comment-body .comment-reply-login, .bypostauthor .comment-body .pingback .comment-body a, .bypostauthor .comment-body .trackback .comment-body a {
	color: #b60000 !important;
}


.comment-author img {
	position: absolute;
	left: -100px;
	width: 60px;
	height: 60px;
}

.comment-author .fn a, .comment-author .fn {
	font-size: 16px;
	font-weight: bold;
}

.comment-metadata {
	position: absolute;
	width: auto;
	right: 20px;
	top: 18px;
}

.comment-author {
	margin-bottom: 20px;
}

#respond {
	color: #fff;
}

#respond {
	margin-top: -10px;
	bottom: -20px;
	z-index: 3;
}

ol.comment-list #respond {
	margin-top: -10px;
	margin-bottom: 40px;
}

#comments #respond a {
	color: #fda32c;
}

#reply-title small a {
	position: relative;
	z-index: 999;
}

#reply-title small a:hover {
	color: #fff;
}

#respond p {
	margin: 0 0 12px;
}

#respond #reply-title {
	margin-top: 0;
}

.bypostauthor > .comment-body .fn:before {
	display: none;
}

#respond:before {
	bottom: auto;
	top: -30px;
}

li.comment #respond:before, li.comment #respond:after {
	margin-left: -20px;
}

.form-allowed-tags, .form-allowed-tags code {
	color: #653c20;
}

@media screen and (-webkit-min-device-pixel-ratio:0) { 
	select:focus, textarea:focus, input:focus {
		font-size: 16px;
		background:#eee;
	}
}


/**
 * Galleries
 */

.gallery-1, .gallery-2, .gallery-3, .gallery-4, .gallery-5 {
	min-height: 450px;
}

.gallery-1 a {
	color: #d44410;
}

.gallery-2 a {
	color: #fff;
}

.gallery-3 {
	color: #fff;
}

.gallery-3 a {
	color: #fda32c;
}

.gallery-4 a {
	color: #fda32c;
}

.gallery-5 a {
	color: #b60000;
}

.attachment .hentry {
	background-color: #fff;
}

.attachment .entry-header {
	padding: 30px 0 0 0;
}


/**
 * Responsiveness
 */

@media (max-width: 979px) {

	.site-header .home-link {
		background: url('i/header-right-2x.png') no-repeat right top;
		background-size: 211px 230px;
		max-width: none;
	}
	.site-header {
		background-position: -312px top !important;
	}
	
	.navbar:before {
		display: none;
	}
	
}

@media (max-width: 412px) {

	.site-title:after {
		display: none;
	} 

}

@media (max-width: 643px) {

	#respond:before, #respond:after {
		margin-left: -20px;
	}

	.comment-metadata {
		position: relative;
		right: auto;
		top: -18px;
		margin-bottom: -.5em;
	}
	
}


@media (max-width: 731px) {

	/* galleries */
	.gallery-template .gallery-count {
		position: relative;
		right: auto;
		top: auto;
		margin-bottom: 10px;
	}
	.gallery-template .gallery {
		float: none;
		margin-right: 0;
		width: auto;
	}
	.gallery-template img.gallery-featured {
		margin-left: 0;
		max-width: 100%;
		height: auto;
	}
	
	.gallery-template .gallery {
		margin-bottom: 0;
		margin-left: 0;
	}
	
	.gallery-template .gallery br {
		display: none;
	}

}

@media (max-width: 359px) {

	.comment-body {
		margin-left: 40px;
	}

	.comment-body:before {
		top: 16px;
	}

	.comment-author .avatar {
		left: -40px;
	}

}

