/*   
Theme Name: Typesense
Theme URI: http://matmm.me/typesense
Description: A simple, responsive theme for writers. 
Author: Mathieu Mayer-Mazzoli
Author URI: http://matmm.me
Version: 1.0
Note: Used HTML5 Reset Theme to reset most of the CSS properties. This great project comes with little extra features that I decided to keep here in case you need them (https://github.com/murtaugh/HTML5-Reset-WordPress-Theme);
*/

/* Apply a natural box layout model to all elements: http://paulirish.com/2012/box-sizing-border-box-ftw/ */
 * {font-family:"Courier New", Courier, monospace!important} * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.chromeframe {position: absolute; top: 0;}

/* Ok, this is where the fun starts. 
-------------------------------------------------------------------------------*/

body {font-family: Georgia, Serif; background-color: #fcfcfc; border-top:4px solid #333; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;}

body, select, input, textarea {color: #111;}

h1, h2, h3, .entry-title, .entry, #sidebar {text-align: center;}

h1, #header a {font-family: Helvetica Neue, Helvetica, Arial}
#header a {text-decoration: none}

/* Font-size of natural elements */

#header h1 {font-size: 3em; font-weight: 100;}
p {font-size: 1.30rem; font-weight: normal; font-style: normal; line-height: 2.15rem; /*Paragraph spacing*/margin-bottom: 2rem;}
h2, .entry-title {font-family: Georgia, Serif; font-size: 2.8rem; line-height: 1.2em; font-weight: normal; margin: 0 0 0.5em 0;}
h3 {font-size: 1.2rem; font-weight: normal; font-style: italic; line-height: 1.2em;}
ul, ol {font-size: 1.30rem;}

/* Colors */
body, select, input, textarea {color: #111;}
h3, h3 a, .read-more {color: #727A8B;}

a {color: #111;}
a:hover, #header a:hover {color: #69f;}

/* Blockquotes */
blockquote {margin-left: 5%; padding-left: 2em; border-left: 5px solid #555; color: #555;}
blockquote p, blockquote a {font-style: italic;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #70B4F8; color: #fff; text-shadow: none;}
::selection {background: #70B4F8; color: #fff; text-shadow: none;} 

ins {background-color: #70B4F8; color: #000; text-decoration: none;}
mark {background-color: #70B4F8; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }

/* Logo done with the amazing font-icon generator icomoon.io. If you remove the logo from the header.php, you may want to remove the below lines as well */

@font-face {
	font-family: 'icomoon';
	src:url('_/inc/fonts/icomoon.eot');
	src:url('_/inc/fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('_/inc/fonts/icomoon.woff') format('woff'),
		url('_/inc/fonts/icomoon.ttf') format('truetype'),
		url('_/inc/fonts/icomoon.svg#icomoon') format('svg');
	font-weight: normal; font-style: normal;}

.icon-feather {font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; font-size: 4.8rem; text-align: center;}
.icon-feather:before {content: "\e001";}


/* And here begins the WordPress fun.
-------------------------------------------------------------------------------*/

#header {width: 100%; max-width: 1000px; padding: 5em 5% 1em; margin: 0 auto 5em;}
footer {width: 100%; background: #fff; padding: 4em 0 4em 0; text-align: center; clear: both; border-top: 1px dotted #333;}

nav {text-align: center; border-top: 1px dotted #333; border-bottom: 1px dotted #333; padding: 1rem 0; margin-bottom: 2em;}
nav ul li {display: inline; padding: 0 1.5em 0 1.5em;font-variant: small-caps; font-size: 1.2rem;}
nav ul li a {}

#wrapper, .footer-wrap {width: 100%; max-width: 1000px; margin: 0 auto; padding: 0 5%;}

.post h2 a {text-decoration: none;}
.post {margin-bottom: 6.5rem;}

.pagetitle {font-size: 2rem; border-bottom: 1px dotted #333; padding-bottom: 0.5rem; font-variant: small-caps; margin-bottom: 2em;}
.time-author {margin: 0.5em auto 2.2em;}

.entry-content, .entry {max-width: 720px; margin: 0 auto;}

/* Content Headings */
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5  {font-family: Georgia, Serif; text-align: left; color: #111; font-weight: bold; padding: 0 0 1em 0; margin: 0; font-style: normal;}
.entry-content h1 {font-size: 2rem;}
.entry-content h2 {font-size: 1.8rem;}
.entry-content h3 {font-size: 1.6rem;}
.entry-content h4 {font-size: 1.4rem;}
.entry-content h5 {font-size: 1.2rem;}

/* Content Lists */
.entry-content ul, .entry-content ol {margin-bottom: 2rem; padding-left: 1.8em; font-weight: normal; line-height: 1.95rem;}
.entry-content ul {list-style-type: circle;}


/* Content Img */
.entry-content img {width: 100%; height: 100%;}
.gallery-item {padding: 0 2% 4% 2%;}
.gallery-size-thumbnail {width: 100%;}
.wp-caption {max-width: 100%; max-height: 100%;}
.wp-caption-text {font-size: 1em; text-align: center;}

.read-more {font-size: 0.86em; margin-top: 1.5em; font-variant: small-caps;}

#sidebar {}
#sidebar ul {font-size: 1rem;}
#sidebar ul li {display: inline-block; line-height: 1.5; padding: 0 1.5em;}
.sidebar-sub {margin-bottom: 3em;}

.navigation {font-size: 1rem; margin-bottom: 4.5em; text-align: center;}
.next-posts, .prev-posts {display: inline;}
.next-posts {padding-right: 1em;}
.prev-posts {padding-left: 1em;}

#searchform {}
#s {width:60%; background:#fff; border-radius: 25px; font-family: Georgia, Serif; font-size: 1em; border: 1px solid #BCC9CA; padding: 0.6em 2em; text-align: center; color: #999; font-variant: small-caps;}
#s:focus {border: 1px solid #111!important; outline: none !important;}
#searchsubmit {}
	
ol.commentlist {list-style: none;}
ol.commentlist li {}
ol.commentlist li.alt {}
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment {border-bottom: 1px dotted #666; padding: 10px;}
ol.commentlist li.comment div.comment-author {}
ol.commentlist li.comment div.vcard {}
ol.commentlist li.comment div.vcard cite.fn {font-style: normal;}
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar {float:right; margin: 0 0 10px 10px;}
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta {font-size: 10px;}
ol.commentlist li.comment div.comment-meta a {color: #ccc;}
ol.commentlist li.comment p {}
ol.commentlist li.comment ul {}
ol.commentlist li.comment div.reply {font-size: 11px;}
ol.commentlist li.comment div.reply a {font-weight: bold;}
ol.commentlist li.comment ul.children {list-style: none; margin: 10px 0 0;}
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {border-left: 5px solid #555; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-3 {border-left: 5px solid #999; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-4 {border-left: 5px solid #bbb; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-5 {}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even {background: #fff;}
ol.commentlist li.odd {background: #f6f6f6;}
ol.commentlist li.parent {border-left: 5px solid #111;}
ol.commentlist li.thread-alt {}
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */

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

	#header {padding-top: 4em!important; margin-bottom: 4em;}
	#header h1 {font-size: 2.8em;}
	.icon-feather {font-size: 4.4rem;}
	p {font-size: 1.20rem; line-height: 2rem; /*Paragraph spacing*/margin-bottom: 1.9rem;}
	h2, .entry-title {font-size: 2.5rem; line-height: 1.2; margin: 0 0 0.5em 0;}
	ul, ol {font-size: 1.20rem;}
	.pagetitle {font-size: 1.6rem;}
	.entry-content h1 {font-size: 1.8rem;}
	.entry-content h2 {font-size: 1.6rem;}
	.entry-content h3 {font-size: 1.4rem;}
	.entry-content h4 {font-size: 1.2rem;}
	.entry-content h5 {font-size: 1.1rem;}
}

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

	#header {padding-top: 2.8em!important; margin-bottom: 3.2em;}
	#header h1 {font-size: 2em;}
	.icon-feather {font-size: 3rem;}
	.post {margin-bottom: 4.5rem!important;}
	.pagetitle {font-size: 1.4rem;}
	p {font-size: 1.15rem; line-height: 1.88rem; /*Paragraph spacing*/margin-bottom: 1.7rem;}
	h2, .entry-title {font-size: 2rem;}
	h3 {font-size: 1rem; line-height: 1.2em;}
	ul, ol {font-size: 1.15rem;}
	nav ul li {font-size: 1rem;}
	#s {width: 75%;}
	.entry-content h1 {font-size: 1.6rem;}
	.entry-content h2 {font-size: 1.45rem;}
	.entry-content h3 {font-size: 1.35rem;}
	.entry-content h4 {font-size: 1.25rem;}
	.entry-content h5 {font-size: 1rem;}
}