/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* Base styles: opinionated defaults
--------------------------------------------- */
html,button,input,
select,textarea {
	color: #232323;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
	background: #FF0;
	color: #222;
	text-shadow: none;
}

::selection {
	background: #FF0;
	color: #222;
	text-shadow: none;
}

::-webkit-input-placeholder { /* WebKit browsers */
	color: #232323;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color: #232323;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	color: #232323;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
	color: #232323;
}

/* A better looking default horizontal rule */
hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

/* Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */
img {
	vertical-align: middle;
}

/* Remove default fieldset styles. */
fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

/* Allow only vertical resizing of textareas. */
textarea {
	resize: vertical;
}

a {
	color: #232323;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}


/* General styles
--------------------------------------------- */
#wrapper {
	width: 1000px;
	margin: 0 auto;
	overflow: hidden;
}

#content .page,
#content .post.single {
	margin: 40px 40px 40px 0;
}
.btn {
	font: 700 14px/14px "Arial Narrow", "Helvetica Narrow", Arial, Helvetica, sans-serif;
	display: inline-block;
	padding: 8px 10px;
	background: #FF0;
	color: #232323;
	text-decoration: none;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

input {
	font-size: 12px;
	border: 0;
	padding: 7px 8px 8px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}
textarea {
	font-size: 12px;
	padding: 7px 8px 8px;
}

.yellow {
	color: #FF0;
}
.white {
	color: #FFF;
}
.strong {
	font-weight: 700;
}


#front-comments {
	background-color: #F4F4F4;
	padding: 25px 33px 65px;
	margin-bottom: 48px;
}
#front-comments .comment {
	width: 210px;
}
#front-comments .comment + .comment {
	margin-left: 12px;
}
#front-comments .comment blockquote {
	position: relative;
	background-color: #FF0;
	height: 70px;
	margin: 0;
	padding: 16px;
	font-style: italic;
	font-size: 12px;
	-webkit-border-radius: 15px;
	   -moz-border-radius: 15px;
			border-radius: 15px;
}
#front-comments .comment blockquote:after {
	border-color: #FF0 transparent transparent #FF0;
	border-style: solid;
	border-width: 8px 16px;
	left: 30px;
	top: 100%;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
#front-comments .comment blockquote > div {
	height: 4em;
	overflow: hidden;
}
#front-comments .comment blockquote a {
	position: absolute;
	bottom: 16px;
	left: 16px;
	font-style: normal;
	font-weight: 700;
	color: #838383;
}
#front-comments .comment blockquote + .meta {
	margin-top: 20px;
}

#front-comments .comment.meta a.userpic {
	margin: 0 15px 0 0;
	display: block;
}
.comment-meta .userpic {
	margin: 0 15px 15px 0;
	display: block;
}
#front-comments .comment .meta img.avatar,
.comment-meta img.avatar {
	-webkit-border-radius: 50px;
	   -moz-border-radius: 50px;
			border-radius: 50px;
}
#front-comments .comment .meta a.author {
	font-size: 12px;
	font-weight: 700;
	color: #232323;
}
#front-comments .comment .meta time {
	display: block;
	font-size: 11px;
}
/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
	/* Style adjustments for viewports that meet the condition */
}

@media print,
	   (-o-min-device-pixel-ratio: 5/4),
	   (-webkit-min-device-pixel-ratio: 1.25),
	   (min-resolution: 120dpi) {
	/* Style adjustments for high resolution devices */
}

/*Fix masonry block height*/
#content > section.columns > article.post {
	max-height: inherit !important;
}
