/*
Theme Name: Yaili
Theme URI: http://yaili.com/
Description: WordPress theme based on Kubrick, adapted for Yaili.com.
Version: 1
Author: Inayaili de Leon Persson
Author URI: http://yaili.com/
Tags: personal, black and white, clean, custom , responsive

	Yaili v1

*/

body {
	font-family: sans-serif;
	font-weight: bold;
	line-height: 1;
	margin: 0 auto;
	color: #707070;
	background: #fff;
	padding: 1.65em 1em 0 1em;
}

/* 
	Typography
*/
	
h1, h2, h3, h4, h5, h6, p, li, ul, ol {
	margin: 0;
	padding: 0;
}

p, li {
	font-size: .875em;
	margin-bottom: 1em;
}
p:last-child, li:last-child {
	margin-bottom: 0;
}
p {
	line-height: 1.6;
	font-weight: normal;
}
li {
	line-height: 1.3;
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1.3;
	margin: 1em 0;
}
h1 {
	font-size: 1.5em;
}
h2 {
	font-size: 1.125em;
	color: #e1e1e1;
}

p+h1, p+h2, p+h3, p+h4, p+h5, p+h6,
ol+h1, ol+h2, ol+h3, ol+h4, ol+h5, ol+h6,
ul+h1, ul+h2, ul+h3, ul+h4, ul+h5, ul+h6 {
	margin-top: 1.5em;
}

pre {
	white-space: -o-pre-wrap;
	white-space: -pre-wrap;
	white-space: -moz-pre-wrap;
	white-space: pre-wrap;
	word-wrap: break-word;
	line-height: 1.3;
}

/* 
	Links
*/

a:link, a:visited {
	font-weight: bold;
	text-decoration: none;
	color: #32979a;
}
a:hover, a:active, a:focus {
	color: #dd4814;
}

#brand a:link, #brand a:visited,
#brand a:hover, #brand a:active {
	color: #fff;
}

p.meta a:link {
	color: #7c7c7c;
}
p.meta a:visited {
	color: #9a9a9a;
}
p.meta a:hover, p.meta a:active, p.meta a:focus {
	color: #dd4814;
}

.back-to-top a:link, .back-to-top a:visited {
	color: white;
	background: black;
	display: inline-block;
	padding: .25em .5em;
}
.back-to-top a:hover, .back-to-top a:active, .back-to-top a:focus {
	background: #464646;
}

a.example:link, a.example:visited,
a.files:link, a.files:visited {
	font-family: sans-serif;
	font-weight: bold;
	font-size: 1em;
	border: 5px solid #e1e1e1;
	box-sizing: border-box;
	background: #e1e1e1;
	color: #707070;
	cursor: pointer;
	padding: .5em 1em;
	position: relative;
	display: inline-block;
}
a.example:hover, a.example:active,
a.files:hover, a.files:active {
	color: #dd4814;
}
a.example:active,
a.files:active {
	top: 1px;
}
a.example:focus,
a.files:focus {
	outline: 1px solid #aaa;
}

/* 
	Brand
*/

#brand {
	font-size: .875em;
	font-weight: bold;
	color: white;
	background: black;
	padding: .5em;
	position: fixed;
	z-index: 100;
	left: 50%;
	margin-left: -7.2em;
	top: 0;
}

/*
	Navigation
*/

.navigation {
	display: table;
	width: 100%;
	border-top: 15px solid #e1e1e1;
    margin-top: 2.5em;
    padding-top: 2.5em;
}
.navigation div {
	display: table-cell;
}
.navigation div:last-of-type {
	text-align: right;
}

/*
	Entries
*/

.post {
	margin-top: 2.5em;
}
.post:first-of-type {
	margin-top: 0;
}

p.meta {
	font-weight: bold;
	color: #aaaaaa;
}
.entry ul,
.entry ol {
	margin-bottom: 1em;
}
.entry li {
	font-weight: normal;
}
.entry blockquote,
.comment blockquote {
	margin: 2em 2em 2em 0;
	padding-left: 2em;
	border-left: 15px solid #e1e1e1;
}

/* 
	Images
*/

p img {
	padding: 0;
	max-width: 100%;
}
img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
}
img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
}
.alignright {
	float: right;
}
.alignleft {
	float: left;
}
	
.wp-caption {
	margin-bottom: 1em;
}
.wp-caption-text {
	font-size: .875em;
	font-weight: bold;
}

/*
	Comments
*/

#comments,
#respond {
	border-top: 15px solid #e1e1e1;
    margin-top: 1.6em;
    padding-top: 1.7em;
}
#respond {
	margin-top: 2.5em;
	padding-bottom: 1.5em;
}
#comments {
	margin-bottom: 1.6em;
}

#respond h2 {
	margin: .5em 0 1.5em;
}

#commentform li {
	list-style: none;
}
#commentform label:not([for=subscribe]) {
	display: block;
	margin-bottom: .5em;
}
#commentform textarea,
#commentform input:not([type=checkbox]) {
	font-family: sans-serif;
	font-weight: bold;
	font-size: 1em;
	padding: .5em;
	border: 5px solid #e1e1e1;
	box-sizing: border-box;
	width: 100%;
	border-radius: 0;
	-webkit-appearance: none;
}
#commentform textarea:focus,
#commentform input:not([type=checkbox]):focus {
	outline: 1px solid #aaa;
}
#commentform input[type=submit] {
	background: #e1e1e1;
	color: #707070;
	cursor: pointer;
	padding: .5em 1em;
	position: relative;
	border-radius: 0;
	-webkit-appearance: none;
}
#commentform input[type=submit]:hover,
#commentform input[type=submit]:active {
	color: #dd4814;
}
#commentform input[type=submit]:active {
	top: 1px;
}

.commentlist li {
	list-style: none;
}

.comment-body {
	border-bottom: 1px solid #e1e1e1;
	padding-bottom: 2.5em;
	margin-bottom: 2.8em;
}
.comment.depth-2 .comment-body {
	padding-left: 1.5em;
}
.comment.depth-3 .comment-body {
	padding-left: 3em;
}
.comment.depth-4 .comment-body {
	padding-left: 4.5em;
}
.comment.depth-5 .comment-body {
	padding-left: 6em;
}

.comment-author {
	font-size: 1.125em;
}
.avatar {
	vertical-align: top;
	margin-bottom: 1em;
}
.comment-meta {
	margin-bottom: 1em;
}

/*
	Sidebar
*/

#sidebar > ul {
	border-top: 15px solid #e1e1e1;
    margin-top: 2.5em;
    padding-top: 2.5em;
}

#sidebar li {
	list-style: none;
}

.popular-posts h2,
.categories h2 {
	margin-top: 0;
}

.categories > ul {
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
}

#searchform input[type=search],
#searchform input[type=submit] {
	font-family: sans-serif;
	font-weight: bold;
	font-size: 1em;
	padding: .5em;
	border: 5px solid #e1e1e1;
	box-sizing: border-box;
	border-radius: 0;
	-webkit-appearance: none;
}
#searchform input[type=search]:focus,
#searchform input[type=submit]:focus {
	outline: 1px solid #aaa;
}
#searchform input[type=submit] {
	background: #e1e1e1;
	color: #707070;
	cursor: pointer;
	padding: .5em 1em;
	position: relative;
}
#searchform input[type=submit]:hover,
#searchform input[type=submit]:active {
	color: #dd4814;
}
#searchform input[type=submit]:active {
	top: 1px;
}

/*
	Footer
*/

footer {
	border-top: 15px solid #e1e1e1;
    margin-top: 2.5em;
    padding-top: 2.5em;
}

.back-to-top {
	text-align: center;
}

/*
	Plugins
*/

#disqus_thread {
	margin-top: 2em;
}

/*
	Media queries
*/

@media screen and (max-width: 640px) {
	#main,
	#sidebar,
	footer {
		margin: auto;
	}
	footer {
		margin-top: 2.5em;
	}
}

@media screen and (min-width: 641px) and (max-width: 999px) {
	p, li {
		font-size: 1em;
	}
	h1 {
		font-size: 2em;
	}
	h2 {
		font-size: 1.5em;
	}
	#main,
	#sidebar,
	footer {
		max-width: 40em;
		margin: auto;
	}
	footer {
		margin-top: 2.5em;
	}
	#commentform textarea,
	#commentform input:not([type=checkbox]) {
		width: 60%;
	}
}

@media screen and (min-width: 1000px) {
	body {
		max-width: 1000px;
	}
	p, li {
		font-size: 1em;
	}
	h1 {
		font-size: 2em;
	}
	h2 {
		font-size: 1.5em;
	}
	#main {
		width: 40em;
		float: left;
	}
	#sidebar {
		width: 20em;
		float: right;
		margin-bottom: 2.5em;
	}
	footer {
		clear: 	both;
	}
	.navigation {
		margin-bottom: 2.5em;
	}
	.categories > ul {
		-webkit-column-count: 1;
		column-count: 1;
	}
	.categories > ul > li {
		width: 100%;
	}
	#searchform input[type=search] {
		width: 58%;
	}
	#searchform input[type=submit] {
		width: 40%;
	}
	#commentform textarea,
	#commentform input:not([type=checkbox]) {
		width: 60%;
	}
}