/**
 * Theme Name:  Ravel
 * Theme URI:   http://themehybrid.com/themes/ravel
 * Description: Ravel is a responsive blog, portfolio, and professional profile theme built with the latest standards in Web design. It makes use of <abbr title="Hypertext Markup Language">HTML5</abbr>, utilizes <a href="http://schema.org">Schema.org</a> microdata, and has a beautiful responsive design that looks and performs well on any device. It also integrates with the <a href="http://wordpress.org/plugins/custom-content-portfolio">Custom Content Portfolio</a> plugin to allow you to show off your design, photography, and other artwork.
 * Version:     1.0.0
 * Author:      Justin Tadlock
 * Author URI:  http://themehybrid.com
 * Tags:        one-column, two-columns, custom-header, custom-menu, editor-style, featured-images, post-formats, responsive-layout, right-sidebar, theme-options, threaded-comments, translation-ready
 * License:     GNU General Public License v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: ravel
 *
 * @author    Tung Do, <ttsondo@gmail.com>
 * @author    Justin Tadlock, <justin@justintadlock.com>
 * @copyright Copyright (c) 2014, Tung Do, Justin Tadlock
 */

/**
 * Font Embeds
 ************************************************/
 
/* Font Awesome */
@font-face {
	font-family: 'FontAwesome';
	src: url('fonts/font-awesome/fontawesome-webfont.eot?v=4.0.0');
	src: url('fonts/font-awesome/fontawesome-webfont.eot?#iefix&v=4.0.0') format('embedded-opentype'),
		 url('fonts/font-awesome/fontawesome-webfont.woff?v=4.0.0') format('woff'),
		 url('fonts/font-awesome/fontawesome-webfont.ttf?v=4.0.0') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/**
 * Icon Fonts
 * This sets CSS rules for all elements using icon fonts in this theme.
 * It's positioned early in the CSS file to prevent confusion.
 ************************************************/

/* menu elements */

.menu-toggle::before,

nav.menu li > a::before,
nav.menu li > a::after,

/* content notification styles */

.entry-content .alert::before,
.entry-content .download::before,
.entry-content .note::before,

/* entry footer */

.entry-terms::before,
.entry-footer .entry-permalink::before,

/* additional list styles */

ul.checks li::before,
ul.pages li::before,

/* pagination */

.loop-pagination .prev::before,
.loop-pagination .next::before,

/* comment elements */

#reply-title small a::before,
.comment-reply-link::before,
.comment-reply-login::before,
.comment-form-author label::before,
.comment-form-email label::before,
.comment-form-url label::before,
.comment-form-comment label::before,

/* widget elements */

.sidebar-toggle::before,
.widget ul li::before,
.tabs-nav li a::before,

/* form elements */

.search-form div::before {
	display: inline-block;
	font-family: 'FontAwesome';
	font-size: 14px;
	font-style:	normal;
	font-weight: normal;
	font-variant: normal;
	line-height: 1;
	speak: none;
	vertical-align: middle;
		-webkit-font-smoothing: antialiased;
	}

/**
 * Basic Resets
 ************************************************/
 
*,
::before,
::after {
	box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
	}
	
html, a, abbr, acronym, address, applet, b, big, blockquote, body, caption, center, cite, code, del, dfn, div, dl, dt, dd, em, fieldset, fig, font, form,  h1, h2, h3, h4, h5, h6, hr, i, iframe, img, ins, kbd, label, layer, legend, li, object, ol, p, param, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, tfoot, thead, tr, th, td, tt, var, u, ul, xmp, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	background: transparent;
	border: none;
	font-size: 100%;
	font: inherit;
	margin: 0;
	outline: none;
	padding: 0;
	text-decoration: none;
	vertical-align: baseline;
	}
	
/* HTML5 defaults */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
	}
	
audio, canvas, video {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	}
	
audio:not([controls]) {display: none;}

::selection { /* Don't combine with other elements. Breaks Firefox. */}

/* === Body === */

body {
	background: #2d3a42 url(images/body_gradient.png) repeat-x;
	color: #9cc4dd;
	font: normal 18px/27px Roboto, Arial, Heletica, sans-serif;
	overflow-x: hidden;
	text-shadow: 1px 1px 0 rgba(0,0,0,.25);
	word-wrap: break-word;
	}

	::before,
	::after {
		text-shadow: none;
		}
	
body[direction="ltr"] {direction: ltr;}
body[direction="rtl"] {direction: rtl;}

/* === Links === */

a {
	color: #e3f4ff;
}
	a:hover {
		color: #fff;
		text-decoration: underline;
	}
	a:active {outline:0;}

/* === Headers === */

h1,h2,h3,h4,h5,h6 {
	color: #c6dbe8;
	font-family: Lora, Georgia, serif;
	font-style: normal;
	font-weight: 700;
	padding: 14px 0 13px;
	}
	
h1 {font-size: 48px;line-height: 58px;}
h2 {font-size: 36px;line-height: 48px;}
h3 {font-size: 30px;line-height: 42px;}
h4 {font-size: 24px;line-height: 33px;}
h5 {font-size: 18px;line-height: 27px;}
h6 {font-size: 14px;line-height: 22px;}

/* === Blockquotes, quotes, and cites === */

blockquote {
	color: #9bc4dd;
	font: 400 italic 27px/36px Lora, Georgia, serif;
	margin: 20px 0;
	padding: 18px 47px 18px 60px;
	position: relative;
	text-shadow: 2px 2px 0 rgba(0,0,0,.4);
	}

	blockquote::before,
	blockquote::after {
		content: '\201C';
		color: #f73f37;
		height: 36px;
		font: 400 italic 135px/98px Roboto, Arial, Helvetica, sans-serif;
		font-size: 135px;
		position: absolute;
		text-shadow: 2px 2px 0 rgba(0,0,0,.25);
		vertical-align: middle;
	}

	blockquote::before {
		left: 0;
		top: 0;
		text-indent: -13px;
	}

	blockquote::after {
		content: '\201D';
		/* positioning */
			bottom: 0;
			right: 0;
	}

	blockquote p {padding: 12px 0 9px;}
	
	blockquote blockquote {
		color: #8d9ca6;
		font-size: 80%;
		line-height: 150%;
		margin: 0 0 0 48px;
		padding: 0;
		text-shadow: 1px 1px 0 rgba(0,0,0,.25);
		}

		blockquote blockquote::before,
		blockquote blockquote::after {
			content: '';
			display: none;
		}
		
	/* Cite */

	blockquote cite {
		font-size: 75%;
		font-weight: 400;
		text-shadow: 1px 1px 0 rgba(0,0,0,.25);
	}
		blockquote cite::before {content: '\2014';}

	cite, i, em, var {font-style: italic;}

		cite cite, i i, em em {font-style: normal;}
		
/* === Acronyms, abbreviations, and miscellaneous === */

acronym, abbr {
	border-bottom: 1px dotted rgba(255,255,255,.2);
	cursor: help;
}

b, strong {font-weight: 700;}
	b b, strong strong {font-weight: 400;}
	
big {font-size: 120%;}

del, s, strike {text-decoration: line-through;}
	
dfn, ins {
	border-bottom: 1px solid rgba(255,255,255,.1);
	font-style: italic;
	text-decoration: none;
	}

mark {
	background: #141a1e;
}
	
p {
	padding: 15px 0 12px;
}

p:empty,
.entry-footer:empty {
	margin: 0 !important;
	padding: 0 !important;
	}

small, sup, sub {font-size: 80%;}

sub, sup {
	position: relative;
	vertical-align: baseline;
	}

sub {bottom: -0.25em;}
sup {top: -0.5em;}

hr {border-top: 3px double rgba(255,255,255,.1);}

/* === Code and Preformatted text === */

code, kbd, tt{
	background: rgba(0,0,0,.1);
	color: #8dc63f;
	display: inline-block;
	padding: 0 5px;
	text-shadow: 1px 1px 0 rgba(0,0,0,.25);
	}

pre,
table pre,
.form-allowed-tags code {
	background: #101619;
	color: #8d9ca6;
	font-family: Monaco, monospace, Courier, "Courier New";
	font-size: 14px;
	line-height: 21px;
	margin: 20px 0;
	overflow: auto;
	padding: 6px 12px;
	text-shadow: 1px 1px 0 rgba(0,0,0,.25);
	word-wrap: normal;
	}

	pre code {
		background: transparent;
		color: inherit;
		}
		
/* === <address> tag === */

address {
	font-style: italic;
	margin: 15px 0 12px;
	}
	dd address, li address {margin: 0;}

/* === Lists === */

ul {
	list-style: square;
	list-style-position: outside;
	margin: 0 0 0 36px;
	padding: 15px 0 12px;
}

ul.checks,
ul.checks ul,
ul.pages,
ul.pages ul {
	list-style: none;
}
	ul.checks li::before {
		color: #8dc63f;
		content: '\f05d';
		text-shadow: 1px 1px 0 rgba(0,0,0,.25);
		width: 24px;
	}
	ul.pages li::before {
		color: #00aeef;
		content: '\f15c';
		width: 24px;	
	}

ol {
	list-style: decimal;
	margin: 0 0 0 36px;
	padding: 15px 0 12px;
}
	
	ol ol {list-style: upper-roman;}
	ol ol ol {list-style: lower-roman;}
	ol ol ol ol {list-style: upper-alpha;}
	ol ol ol ol ol {list-style: lower-alpha;}

dl {margin: 15px 0 12px;}

	dt {
		font-weight: 700;
		margin: 11px 0 0;
		}

	dd {margin: 0 0 0 30px;}

/* === Tables === */

table {
	border: 6px solid rgba(0,0,0,.1);
	border-collapse: separate;
	border-spacing: 0;
	margin: 20px 0;
	width: 100%;
	}

	caption {
		margin: 0 0 6px;
		font-variant: small-caps;
		padding: 6px 18px;
		text-align: center;
		}
	
	th, td {
		background: transparent;
		border-top: 1px solid rgba(0,0,0,.1);
		color: inherit;
		margin: 0;
		padding: 12px 18px;
		text-align: left;
		vertical-align: top;
		}

	th {
		font-size: 75%;
		font-weight: 700;
		text-transform: uppercase;
		}
		
	/* remove top border for cells of first table row */
	thead tr:first-child th,
	thead tr:first-child td,
	tbody tr:first-child th,
	tbody tr:first-child td {
		border-top-width: 0;
		}
	
	/* restore top border for cells of first row in tbody and tfoot */
	
	thead ~ tbody tr:first-child th,
	thead ~ tbody tr:first-child td,
	tfoot:first-child th,
	tfoot:first-child td {
		border-top-width: 1px;
		}

/* === Forms === */

form {
	font-family: inherit;
	font-size: inherit;
	}
	
	fieldset {
		border: 3px double rgba(255,255,255,.1);
		margin: 20px 0;
		padding: 0 15px;
	}
		legend {
			font-size: 13px;
			line-height: 24px;
		}
			
		label {
			cursor: pointer;
			display: inline-block;
			font: inherit;
			font-size: 13px;
			line-height: 18px;
			margin: 0;
			padding: 0;
			vertical-align: baseline;
		}
			
			/* Checkbox or Radio inside of a label tag */
			label input[type="checkbox"],
			label input[type="radio"]{
				margin: 0;
				}
			
		.protected label {
			line-height: 36px;
			margin: 6px;
			padding: 0;
			vertical-align: middle;
			}
			
		/* Basic reset */

		button,
		input,
		select,
		textarea {
			border: 0;
			box-sizing: border-box;
				-ms-box-sizing: border-box;
				-moz-box-sizing: border-box;
				-webkit-box-sizing: border-box;
			color: inherit;
			font: inherit;
			margin: 0;
			padding: 0;
			}

		input { display: block; }

		/* Checkbox & Radio */
		input[type="checkbox"],
		input[type="radio"] {
			display: inline-block;
			vertical-align: middle;
			}
			
		/* Label with checkbox or radio before them */
		input[type="checkbox"] +  label,
		input[type="radio"] + label {
			padding-left: 8px;
			vertical-align: middle;
			}
			
		input[type="file"]:focus,
		input[type="file"]:active,
		input[type="radio"]:focus,
		input[type="radio"]:active,
		input[type="checkbox"]:focus,
		input[type="checkbox"]:active {
			box-shadow: none;
			}
			
		/* Search type for webkit browsers */
		input[type="search"]::-webkit-search-decoration {display: none;-webkit-appearance: textfield;}
		input[type="search"]::-webkit-search-cancel-button{-webkit-appearance: none;}

		input[type="date"],
		input[type="datetime"],
		input[type="datetime-local"],
		input[type="email"],
		input[type="month"],
		input[type="number"],
		input[type="password"],
		input[type="search"],
		input[type="tel"],
		input[type="text"],
		input[type="time"],
		input[type="url"],
		input[type="week"],
		textarea,
		select {
		
				-webkit-appearance: none;
			background-clip: padding-box;
				-moz-background-clip: padding;
				-ms-background-clip: padding-box;
				-o-background-clip: padding-box;
				-webkit-background-clip: padding;
			background-color: #161d21;
			border-radius: 0;
			box-shadow: inset 0 1px 3px rgba(0,0,0,0.24);
			display: inline-block;
			height: 36px;
			font-size: 13px;
			line-height: 24px;
			margin: 6px 0;
			max-width: 100%;
			outline: 0;
			padding: 6px 15px;
			vertical-align: middle;
			}
			
		textarea {
			height: auto;
			line-height: 22px;
			min-height: 31px;
			overflow: auto;
			resize: vertical;
			vertical-align: top;
			width: 100%;
			}
			
		/* Select field */
		select {
			padding: 6px 15px;
			}

		/* Select, multi-visible entries */
		select[size],
		select[multiple],
		select[multiple][size] {
			height: auto;
			}

			select optgroup,
			select option {
				font: inherit;
				}
			
		/* select fields in Webkit browsers */
		@media ( -webkit-min-device-pixel-ratio: 0 ) {

			select,
			select[size="0"],
			select[size="1"] {
				background-image: url(images/arrow-select.png);
				background-position: right center;
				background-repeat: no-repeat;
				background-size: 27px 4px;
				padding-right: 30px;
				}
				
			select[size],
			select[multiple],
			select[multiple][size] {
				background-image: none;
				height: auto;
				}
		} /* end select fields in Webkit browsers */
			
		/* File type */
		input[type="file"] {
			height: 36px;
			margin: 6px 0;
			vertical-align: middle;
			}
		input[type="file"]:focus,
		input[type="file"]:active {
			box-shadow: none;
			}

		.button,
		button,
		input[type="submit"],
		input[type="reset"],
		input[type="button"] {
				-webkit-appearance: none;
			background-clip: padding-box;
				-webkit-background-clip: padding;
				-moz-background-clip: padding;
				-ms-background-clip: padding-box;
				-o-background-clip: padding-box;
			background-color: #161d21;
			border: 2px solid #3d484e;
			box-shadow: 7px 7px 0 rgba(0,0,0,.08);
			color: #fff;
			cursor: pointer;
			display: inline-block;
			font-size: 13px;
			font-weight: 700;
			line-height: 32px;
			height: 36px;
			margin: 6px 0;
			max-width: 100%;
			outline: 0;
			padding: 0 13px;
			vertical-align: middle;
			width: auto;
			}
			
		/* General Buttons hover */
		.button:hover,
		button:hover,
		input[type="button"]:hover,
		input[type="reset"]:hover,
		input[type="submit"]:hover {
			border-color: #4e5d65;
			}
			
		/* Media Player Buttons */
		.mejs-button button {box-shadow: none;}

		/* Link Buttons */
		a.button {
			height: auto;
			line-height: 22px;
			min-height: 32px;
			padding: 5px 13px;
			text-transform: none;
			}
		/* Link Buttons Hover */
		a.button:hover {
			text-decoration: none;
			}
			
		/* === Reset alternate form field states === */
		
		/* Disabled state */
		button[disabled],
		input[disabled],
		input.disabled,
		select[disabled],
		select[disabled] option,
		select[disabled] optgroup,
		textarea[disabled],
		textarea.disabled {
			color: #788690;
			cursor: default;
			user-select: none;
				-moz-user-select: -moz-none;
				-webkit-user-select: none;
				-khtml-user-select: none;
			}
			
		/* Focused or Active state */
		button:focus,
		input:focus,
		select:focus,
		textarea:focus {
			z-index: 1;
			}
		input[type="file"]:focus,
		input[type="file"]:active,
		input[type="radio"]:focus,
		input[type="radio"]:active,
		input[type="checkbox"]:focus,
		input[type="checkbox"]:active {
			box-shadow: none;
			}
			
		/* Invalid state */
		button:invalid,
		input:invalid,
		select:invalid,
		textarea:invalid {
			background-color: #f74037;
			box-shadow: none;
			color: #fff;
			}
			
		/* Reset Firefox browser spacing rules */
		button::-moz-focus-inner,
		input::-moz-focus-inner,
		select::-moz-focus-inner,
		textarea::-moz-focus-inner {
			border: 0;
			padding: 0;
			}
			
		/* place holders, cannot combine placeholder rules or they will be ignored completely */
		input::-webkit-input-placeholder,
		textarea::-webkit-input-placeholder {
			color: #8d9ca6;
		}
		input::-moz-placeholder,
		textarea::-moz-placeholder {
			color: #8d9ca6;
			opacity: 1;
		}
		input:-moz-placeholder,
		textarea:-moz-placeholder {
			/* Older versions of Firefox */
			color: #8d9ca6;
			opacity: 1;
		}
		input:-ms-input-placeholder,
		textarea:-ms-input-placeholder { 
			color: #8d9ca6;
		}

		/* Search Form */

		.search-form,
		.search-form div {
			position: relative;
			width: 288px;
		}
			.search-form::before,
			.search-form::after,
			.search-form div::after {
				border: 6px solid rgba(0,0,0,.25);
				content: '';
				height: 48px;
				position: absolute;
					left: 17px;
					top: 0;
				transform: rotate(45deg);
					-webkit-transform: rotate(45deg);
					-moz-transform: rotate(45deg);
					-ms-transform: rotate(45deg);
					-o-transform: rotate(45deg);
				width: 48px;
			}
			
			.search-form::before,
			.search-form::after {border: 1px solid rgba(255,255,255,.08);}
			.search-form::before {margin-left: -7px;}
			.search-form::after {margin-left: 7px;}
			
			/* search form DIV */
			
				.search-form div::before {
					color: #8d9ca6;
					content: '\f002';
					font-size: 18px;
					height: 48px;
					line-height: 48px;
					position: absolute;
						left: 17px;
						top: 0;
					text-align: center;
					width: 48px;
					z-index: 2;
				}
				
				/* search label */
				.search-form label {
					margin: 0;
					padding: 0;
					vertical-align: middle;
				}
					
				/* search form fields */
				
				.search-form input[type="text"],
				.search-form input[type="search"]{
					background: transparent;
					box-shadow: none;
					color: #8d9ca6;
					font: 700 italic 16px/24px Lora, Georiga, sans-serif;
					padding-left: 6px;
					margin-left: 82px;
					text-shadow: 1px 1px 0 rgba(0,0,0,0.25);
					width: 206px;
				}
				.search-form input[type="submit"] {
					background: transparent;
					border: 0;
					box-shadow: none;
					font-size: 0;
					height: 0;
					line-height: 0;
					margin: 0;
					min-height: 0;
					padding: 0;
					width: 0;
				}

/**
 * Images
 * --------------------------------------------------------------------------- */

img.size-full,
.attachment-full,
.ravel-full {
	height: auto !important;
	max-width: 100% !important;
	width: auto !important;
	}
	
img.wp-smiley,
.widget .wp-smiley {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: 0;
	height: auto;
	margin: 0;
	max-height: none;
	max-width: none;
	min-height: 0;
	min-width: 0;
	padding: 0;
	width: auto;
	}
	
/* Image Alignment */
	
.aligncenter {
	clear: both;
	display: block;
	margin: 20px auto;
	}
	
.alignnone {
	clear: both;
	margin: 14px 0;
	}

.alignleft {
	float: left;
	margin: 18px 24px 12px 0;
	max-width: 50%;
	}

.alignright {
	float: right;
	margin: 18px 0 12px 24px;
	max-width: 50%;
	}
	
img.aligncenter,
img.alignnone,
img.alignleft,
img.alignright{
	margin-top: 5px;
	margin-bottom: 8px;
	}
	
img.aligncenter:only-child,
img.alignnone:only-child {
	margin-bottom: 8px;
	}

/* === Captions === */

.wp-caption {max-width: 100%;}

	.wp-caption img {height: auto;}

	.wp-caption-text,
	.gallery-caption {
		border: 0;
		display: block;
		font-size: 13px;
		line-height: 18px;
		margin: 0;
		padding: 6px 12px 0;
		text-align: center;
		}

/* === Gallery === */

.gallery {
	clear: both;
	float: left;
	margin: 15px auto 12px;
	width: 100%;
	}
.gallery + p {clear: both;}
	
	.gallery-row {
		clear: both;
		float: left;
		width: 100%;
		word-spacing: -4px;
		}

		.gallery-item {
			display: inline-block;
			padding: 0;
			text-align: center;
			vertical-align: top;
			width: 33.3%;
			word-spacing: 0;
			}
			
		.gallery-col-1 .gallery-item,
		.gallery-columns-1 .gallery-item {width: 100%;}
		.gallery-col-2 .gallery-item,
		.gallery-columns-2 .gallery-item {width: 50%;}
		/* .gallery-col-3 is the default one above */
		.gallery-col-4 .gallery-item,
		.gallery-columns-4 .gallery-item {width: 25%;}
		.gallery-col-5 .gallery-item,
		.gallery-columns-5 .gallery-item {width: 20%;}
		.gallery-col-6 .gallery-item,
		.gallery-columns-6 .gallery-item {width: 16%;}
		.gallery-col-7 .gallery-item,
		.gallery-columns-7 .gallery-item {width: 14%;}
		.gallery-col-8 .gallery-item,
		.gallery-columns-8 .gallery-item {width: 12.5%;}
		.gallery-col-9 .gallery-item,
		.gallery-columns-9 .gallery-item {width: 11%;}
		.gallery-col-10 .gallery-item,
		.gallery-columns-10 .gallery-item { width: 10%;}
		.gallery-col-11 .gallery-item,
		.gallery-columns-11 .gallery-item { width: 9.09%;}
		.gallery-col-12 .gallery-item,
		.gallery-columns-12 .gallery-item { width: 8.33%;}
		.gallery-col-13 .gallery-item,
		.gallery-columns-13	.gallery-item { width: 7.69%;}
		.gallery-col-14 .gallery-item,
		.gallery-columns-14 .gallery-item { width: 7.14%;}
		.gallery-col-15 .gallery-item,
		.gallery-columns-15 .gallery-item { width: 6.66%;}
		.gallery-col-16 .gallery-item,
		.gallery-columns-16 .gallery-item { width: 6.25%;}
		.gallery-col-17 .gallery-item,
		.gallery-columns-17 .gallery-item { width: 5.88%;}
		.gallery-col-18 .gallery-item,
		.gallery-columns-18 .gallery-item { width: 5.55%;}
		.gallery-col-19 .gallery-item,
		.gallery-columns-19 .gallery-item { width: 5.26%;}
		.gallery-col-20 .gallery-item,
		.gallery-columns-20 .gallery-item { width: 5%;}
		.gallery-col-21 .gallery-item,
		.gallery-columns-21 .gallery-item { width: 4.76%;}
		.gallery-col-22 .gallery-item,
		.gallery-columns-22 .gallery-item { width: 4.54%;}
		.gallery-col-23 .gallery-item,
		.gallery-columns-23 .gallery-item { width: 4.34%;}
		.gallery-col-24 .gallery-item,
		.gallery-columns-24 .gallery-item { width: 4.16%;}
		.gallery-col-25 .gallery-item,
		.gallery-columns-25 .gallery-item { width: 4%;}
		.gallery-col-26 .gallery-item,
		.gallery-columns-26 .gallery-item { width: 3.84%;}
		.gallery-col-27 .gallery-item,
		.gallery-columns-27 .gallery-item { width: 3.7%;}
		.gallery-col-28 .gallery-item,
		.gallery-columns-28 .gallery-item { width: 3.57%;}
		.gallery-col-29 .gallery-item,
		.gallery-columns-29 .gallery-item { width: 3.44%;}
		.gallery-col-30 .gallery-item,
		.gallery-columns-30 .gallery-item { width: 3.33%;}

			.gallery-icon {
				margin: 0;
				padding: 0;
				}

				.gallery-icon a {
					display: block;
					line-height: 18px; /* should match .gallery-caption line-height */
				}

					.gallery-icon img {
						display: inline-block;
						height: auto;
						margin: 6px auto;
						max-width: 100%;
						width: auto;
						}
						
					.gallery-caption {
						padding: 0 12px;
					}

			/* .gallery-caption {} goes here, view .wp-caption */

			.singular-attachment .gallery-caption {display: none;}

/* === Embeds === */

.twitter-tweet {width: 100%;}

.embed-wrap {
	height: 0;
	margin: 5px 0 8px;
	overflow: hidden;
	padding-bottom: 56.25%;
	padding-top: 30px;
	position: relative;
	}

	.embed-wrap iframe,
	.embed-wrap object,
	.embed-wrap embed {
		height: 100%;
		max-width: 100%;
		position: absolute;
			left: 0;
			top: 0;
		width: 100%;
		}
		
	iframe.twitter-tweet {margin: 20px 0 !important;}

	.mejs-audio,
	.mejs-video {margin: 20px 0;}
	
	.mejs-container,
		.mejs-container video,
		.mejs-layer {
			max-width: 100% !important;
			}
	

/* === Clearing Floats === */

.clearfix::after,
#branding::after,
.content-container::after,
.entry::after,
#footer::after,
#comments::after 
.comment-respond::after,
li.comment::after,
li.comment > article::after,
li.ping::after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
	
/**
 * Layout
 *
 * This section of the stylesheet defines the overall layout of the theme's major structural elements. It is essentially the foundation for the entire design.
 * --------------------------------------------------------------------------- */

.page-container > .wrap {
	margin: 0 auto;
	max-width: 1200px;
	position: relative;
	}

	/* start background decoration shapes */
	.page-container > .wrap::before,
	.page-container > .wrap::after {
		background: transparent;
		border: 700px solid rgba(0,0,0,0.07);
		content: '';
		height: 3200px;
		margin: -1600px -128px 0 0;
		position: absolute;
			right: 50%;
			top: 0;
		transform: rotate(45deg);
			-webkit-transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			-o-transform: rotate(45deg);
		width: 3200px;
		z-index: -1;
	}

	.page-container > .wrap::after {
		margin-left: -128px;
		margin-right: 0;
		left: 50%;
		right: auto;
	}
	/* end background decoration shapes */
	
	/* macro layout grouping */
	#header,
	.content-container,
		.entry,
	#comments-template,
	#footer {
		clear: both;
		float: left;
		width: 100%;
		}
		
		.content-container {
			padding: 24px 0 0;
		}
		.page-template-intro .content-container {
			padding: 9px 0 0;
		}

			/* content area is 64% by default */
			.content {
				float: left;
				margin-left: 4%;
				width: 64%;
				}
				
			/* on specific pages, the content area is 100% */
			.page-template-intro .content,
			.archive-portfolio_item .content,
			.taxonomy-portfolio .content,
			.singular-portfolio_item .content  {
				margin: 0;
				width: 100%;
			}

				.entry {/* view "macro layout grouping" */}

				
					/* micro layout grouping */
					.entry-byline,
					.singular-page .entry-header,
					#comments-header {
						border-right: 3px double rgba(255,255,255,.1);
						color: #8d9ca6;
						float: left;
						font: normal normal 16px/24px Lora, Georgia, serif;
						padding: 18px 24px 18px 0;
						text-align: right;
						width: 26.562%;
					}
					.entry-title,
					.featured-media,
					.entry-content,
					.entry-summary,
					.entry-footer,
					.loop-pagination,
					.comment-list,
					.comment-respond,
					.comments-closed {
						clear: right;
						float: right;
						width: 70.315%;
					}

			/* sidebar */
			#sidebar-primary {
				float: right;
				margin-right: 4%;
				width: 24%;
				}
				.sidebar-toggle {
					font-size: 0;
					line-height: 0;
					padding: 0;
				}

		/* === Responsive Sidebar === */
		@media (max-width: 1199px) {
			
			#sidebar-primary {
				background: #2d3a42;
				box-shadow: 0 0 10px rgba(0,0,0,.5);
				margin-left: -336px;
				overflow-y: scroll;
				padding: 84px 24px 24px;
				position: fixed;
					bottom: 0;
					left: 0;
					top: 0;
				transition: all 0.4s ease-in-out;
					-webkit-transition: all 0.4s ease-in-out;
					-ms-transition: all 0.4s ease-in-out;
					-moz-transition: all 0.4s ease-in-out;
					-o-transition: all 0.4s ease-in-out;
				width: 336px;
				z-index: 99999;
			}

			#sidebar-primary.active {
				margin-left: 0;
				}

				/* sidebar-toggle */
				.sidebar-toggle {
					cursor: pointer;
					display: block;
					height: 36px;
					margin: 24px;
					position: fixed;
						left: 0;
						top: 0;
					text-align: center;
					width: 36px;
					z-index: 99;
					}

					/* sidebar toggle icon */
					.sidebar-toggle::before {
						color: #fff;
						content: '\f054';
						font-size: 18px;
						line-height: 36px;
						min-width: 36px;
					}
					
					.sidebar-toggle:hover::before {
						margin-left: 8px;
					}
					
					/* sidebar toggle active icon */
					.sidebar-toggle.active::before {
						content: '\f053';
						margin-left: -3px;
						}
					
					.sidebar-toggle.active:hover::before {
						margin-left: -11px;
					}
					
					/* sidebar icon background */
					.sidebar-toggle::after {
						background: #f74037;
						box-shadow: 6px 0 0 rgba(0,0,0,.2);
						content: '';
						position: absolute;
							bottom: 0;
							left: 0;
							right: 0;
							top: 0;
						transform: rotate(45deg);
							-webkit-transform: rotate(45deg);
							-moz-transform: rotate(45deg);
							-ms-transform: rotate(45deg);
							-o-transform: rotate(45deg);
						z-index: -1;
					}
					
			/* === Sidebar relative to WP admin bar === */

			.admin-bar #sidebar-primary,
			.admin-bar .sidebar-toggle {
				top: 32px;
			}


		}

		/* === Responsive Sidebar: Adjustment to 2nd version of WP admin bar === */
		@media (max-width: 782px) {
			.admin-bar #sidebar-primary,
			.admin-bar .sidebar-toggle {
				top: 46px;
			}
		}

/**
 * Header and Footer
 *
 * Handles the output of the main site header and footer content.
 * --------------------------------------------------------------------------- */


/**
 * Handles the output of the header content.
 */

#header {
	clear: both;
	float: left;
	padding: 70px 0 0;
	position: relative;
	width: 100%;
	}

	#branding {
		margin: 32px 0 30px;
		padding: 0 15%;
		text-align: center;
		}
		
		#branding img {
			height: auto;
			max-width: 100%;
			width: auto;
		}

		#site-title {
			color: #a0cfeb;
			display: inline-block;
			font-size: 72px;
			font-weight: 700;
			font-style: italic;
			letter-spacing: -0.02em;
			line-height: 90px;
			margin: 0 auto;
			text-shadow: 9px 9px 0 rgba(0,0,0,.2);
		}
		
			#site-title a {
				color: #a0cfeb;
				display: inline-block;
			}
			#site-title a:hover {
				color: #e3f4ff;
				text-decoration: none;
			}

			/* single letter site-title version */
			.single-letter #site-title a {
				border: 9px solid #a0cfec;
				box-shadow: 9px 9px 0 rgba(0,0,0,.2), inset 9px 9px 0 rgba(0,0,0,.2);
				display: inline-block;
				font-size: 0;
				height: 108px;
				overflow: hidden;
				width: 108px;
			}
			.single-letter #site-title a:hover {
				border-color: #e3f4ff;
				}
			.single-letter #site-title a:first-letter {
				font-size: 72px;
				line-height: 90px;
			}

	/* === Menu: Primary === */

	nav#menu-primary {
		padding: 9px 0;
		text-align: center;
		z-index: 4;
	}

			/* skip to content link */
			.assistive-text,
			.screen-reader-text {
				left: -9999em;
				overflow: hidden;
				position: absolute;
				top: -9999em;
				}

			/* Hide menu toggle */
			.menu-toggle {display: none;}

				/* === 1ST LEVEL STRUCTURE === */

				nav.menu ul {
					list-style: none;
					margin: 0;
					padding: 0;
					word-spacing: -4px;
					}

					/* === 2ND LEVEL STRUCTURE === */

					nav.menu ul ul {
						background: #101619;
						left: 0;
						margin: 0;
						min-width: 220px;
						opacity: 0;
						position: absolute;
						top: 48px;
						visibility: hidden;
						z-index: 99;
						}
						nav.menu li > ul::before {
							border-bottom: 4px solid #101619;
							border-left: 4px solid transparent;
							border-right: 4px solid transparent;
							content: '';
							left: 24px;
							position: absolute;
							top: -4px;
							}
					nav.menu li:hover > ul {
						opacity: 1;
						visibility: visible;
						}

						/* === 3RD LEVEL STRUCTURE === */
						nav.menu ul ul ul {
							left: 100%;
							margin: 0 0 0 20px;
							top: 0;
							}
							nav.menu li li > ul::before {
								border-right: 4px solid #101619;
								border-bottom: 4px solid transparent;
								border-top: 4px solid transparent;
								left: -8px;
								position: absolute;
								top: 10px;
								}
						nav.menu li li:hover > ul {
							margin: 0 0 0 6px;
							}

				/* === 1ST LEVEL CONTENT === */

				.menu-items {zoom: 1;}

					/* menu item */
					nav.menu li {
						display: inline-block;
						position: relative;
						text-align: left;
						word-spacing: 0;
						}

						/* links */
						nav.menu li a {
							color: #e3f4ff;
							display: block;
							font-size: 24px;
							font-weight: 700;
							line-height: 36px;
							margin: 0;
							padding: 6px 18px 5px;
							text-transform: uppercase;
							text-shadow: 2px 2px 0 rgba(0,0,0,.2);
							}
						/* link hovers */
						nav.menu li a:hover {
							background: rgba(0,0,0,.1);
							text-decoration: none;
							}

						/* current links */
						nav.menu li.current-menu-item > a {color: #a0cfec;}

							/* drop-down indicator */
							nav.menu li > a::after {
								color: #f73f37;
								content: "\f0d7";
								font-size: 24px;
								line-height: 36px;
								margin: 0 0 0 10px;
								text-shadow: 2px 2px 0 rgba(0,0,0,.2);
								vertical-align: baseline;
								}

					/* === 2ND LEVEL CONTENT === */

						nav.menu li li {width: 100%;}

							nav.menu li li a {
								border-bottom: 1px solid #1d2529;
								display: block;
								font-size: 17px;
								font-weight: 400;
								line-height: 24px;
								margin: 0;
								padding: 8px 18px;
								position: relative;
								text-transform: none;
								text-shadow: none;
								}
							nav.menu li li a:hover {
								background: #000;
								}
								nav.menu li li > a::after {
									content: '\f0da';
									font-size: 18px;
									line-height: 24px;
									position: absolute;
									right: 20px;
									}
								.rtl nav.menu li li > a::after {
									content: '\f0d9';
									left: 20px;
									right: auto;
									}

				/* === ALL LEVELS RESET === */

							/* no drop-down indicator for single items */
							nav.menu li a:only-child::after {
								content: '';
								margin: 0;
								}

				/* === Social Media Icons === */

							/* email icon*/
							nav.menu li > a[href*="mailto:"]:only-child::after,

							/* social media menu icons */
							nav.menu li > a[href*="dribbble.com"]:only-child::after,
							nav.menu li > a[href*="facebook.com"]:only-child::after,
							nav.menu li > a[href*="flickr.com"]:only-child::after,
							nav.menu li > a[href*="foursquare.com"]:only-child::after,
							nav.menu li > a[href*="github.com"]:only-child::after,
							nav.menu li > a[href*="plus.google.com"]:only-child::after,
							nav.menu li > a[href*="instagram.com"]:only-child::after,
							nav.menu li > a[href*="linkedin.com"]:only-child::after,
							nav.menu li > a[href*="pinterest.com"]:only-child::after,
							nav.menu li > a[href$="/feed"]:only-child::after,
							nav.menu li > a[href$="/feed/"]:only-child::after,
							nav.menu li > a[href*="skype.com"]:only-child::after,
							nav.menu li > a[href*="tumblr.com"]:only-child::after,
							nav.menu li > a[href*="twitter.com"]:only-child::after,
							nav.menu li > a[href*="vimeo.com"]:only-child::after,
							nav.menu li > a[href*="youtube.com"]:only-child::after {
								color: #9cc4dd;
								content: '\f09e';
								font-size: 16px;
								margin: 0 0 0 8px;
								}

							/* dribbble */
							nav.menu li > a[href*="dribbble"]:only-child::after {
								content: '\f17d';
								}

							/* email */
							nav.menu li > a[href*="mailto"]:only-child::after {
								content: '\f0e0';
								}
							/* facebook */
							nav.menu li > a[href*="facebook.com"]:only-child::after {
								color: #3b5998;
								content: '\f09a';
								}
							/* flickr */
							nav.menu li > a[href*="flickr.com"]:only-child::after {
								color: #ff0084;
								content: '\f16e';
								}
							/* foursquare */
							nav.menu li > a[href*="foursquare.com"]:only-child::after {
								color: #1eaeeb;
								content: '\f180';
								}
							/* google plus */
							nav.menu li > a[href*="github.com"]:only-child::after {
								color: #444;
								content: '\f09b';
								}
							/* google plus */
							nav.menu li > a[href*="plus.google.com"]:only-child::after {
								color: #dd4b39;
								content: '\f0d5';
								}
							/* instagram */
							nav.menu li> a[href*="instagram.com"]:only-child::after {
								color: #ab8163;
								content: '\f16d';
								}
							/* linkedin */
							nav.menu li > a[href*="linkedin.com"]:only-child::after {
								color: #0077b5;
								content: '\f0e1';
								}
							/* pinterest */
							nav.menu li > a[href*="pinterest.com"]:only-child::after {
								color: #cb2027;
								content: '\f0d2';
								}
							/* rss icon */
							nav.menu li > a[href$="/feed"]:only-child::after,
							nav.menu li > a[href$="/feed/"]:only-child::after {
								color: #f0bd89;
								}
							/* skype */
							nav.menu li > a[href*="skype.com"]:only-child::after {
								color: #04b1f5;
								content: '\f17e';
								}
							/* tumblr */
							nav.menu li > a[href*="tumblr.com"]:only-child::after {
								color: #444;
								content: '\f173';
								}
							/* twitter */
							nav.menu li > a[href*="twitter.com"]:only-child::after {
								color: #55acee;
								content: '\f099';
								}
							/* vimeo */
							nav.menu li > a[href*="vimeo.com"]:only-child::after {
								color: #444;
								content: '\f194';
								}
							/* youtube */
							nav.menu li > a[href*="youtube.com"]:only-child::after {
								color: #cc181e;
								content: '\f166';
								}
								
/* === Responsive Menu === */
@media only screen and (max-width: 782px) {

	nav#menu-primary {
		margin: 0;
		padding: 0;
		text-align: left;
	}
		
		/* menu toggle */
		.menu-toggle {
			cursor: pointer;
			display: block;
			font-size: 0;
			line-height: 0;
			margin: 5px auto 15px;
			padding: 0;
			text-align: center;
		}

			/* menu toggle icon */
			.menu-toggle::before {
				color: #e3f4ff;
				content: '\f0c9';
				font-size: 28px;
				line-height: 36px;
				text-shadow: 2px 2px 0 rgba(0,0,0,.2);
			}
			.menu-toggle.active::before {
				content: '\f057';
			}

				.menu-toggle-link:hover::before {color: #fff;}

		nav#menu-primary .wrap {
			clear: both;
			display: none;
			margin-bottom: 12px;
			float: left;
			width: 100%;
		}
		
			/* Menu structure */

			nav#menu-primary ul ul {
				background: transparent;
				left: auto;
				min-width: 0;
				opacity: 1;
				position: static;
				top: auto;
				visibility: visible;
			}
				nav#menu-primary li > ul::before {display: none;}
				
				nav#menu-primary ul ul ul {
					left: auto;
					margin: 0;
					top: auto;
				}
					nav#menu-primary li li > ul::before {display: none;}

				nav#menu-primary li li:hover > ul {
					margin: 0;
				}
					
			/* Menu content */
			
			nav#menu-primary li {
				width: 100%;
				word-spacing: 0;
			}
			
				/* links */
				nav#menu-primary li a,
					nav#menu-primary li li a {
					background: #101619;
					border: 0;
					border-bottom: 1px solid #1d2529;
					font-size: 17px;
					font-weight: 400;
					line-height: 24px;
					text-transform: none;
				}
					nav.menu li > a::after {
						content: '';
						margin: 0;
					}

				/* link hovers */
				nav#menu-primary li a:hover,
					nav#menu-primary li li a:hover  {
					background: #000;
				}
					nav.menu li li > a::after,
					.rtl nav.menu li li > a::after { content: ''; }
						
					/* === lower level links === */

					nav#menu-primary li li a {
						padding-left: 35px;
					}

						nav.menu li li a::before {
							color: rgba(255,255,255,.5);
							content: '\f10c';
							font-size: 9px;
							line-height: 24px;
							margin-right: 15px;
							vertical-align: top;
							}

						nav#menu-primary li li li a {padding-left: 75px; }

							nav#menu-primary li li li li a {padding-left: 115px;}
							
				/* current links */
				nav#menu-primary li.current-menu-item > a,
					nav#menu-primary li li.current-menu-item > a {
						color: #a0cfec;
						}
					
} /* end @media max-width 782 */

/* === Responsive Menu Reset === */
@media only screen and (min-width: 783px) {

		.menu > .wrap { display: block !important; }
	
} /* end @media min-width 783 */


/* === Header/Footer Dividers === */

	#header::after,
	#footer::before {
		background: url(images/divider.png) center center no-repeat;
		clear: both;
		content: '';
		display: block;
		height: 57px;
		margin: 0 auto;
		width: 50%;	
	}
	
	@media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
		#header::after,
		#footer::before {
			background-image: url(images/divider-2x.png);
			background-size: 1200px 9px;
		}
	}
	
	#footer::before {width: 80%;}

/* === Footer === */

	/* social media menu */
	#menu-social {
		float: left;
		padding: 15px 0 24px 10%;
		text-align: right;
		vertical-align: top;
		width: 50%;
		word-spacing: 0;
	}
		#menu-social ul {word-spacing: 0;}

			#menu-social li a {
				font-size: 0;
				line-height: 0;
				padding: 0;
				}
			#menu-social li a:hover {
				background: transparent;
			}
				#menu-social li a::after {
					border: 3px solid #8d9ca6;
					border-radius: 50%;
					color: inherit;
					font-size: 18px;
					line-height: 36px;
					margin: 9px 9px 0 0;
					min-width: 42px;
					opacity: .6;
					text-align: center;
					text-shadow: none;
				}
				#menu-social li a:hover::after {
					opacity: 1;	
				}
			#menu-social ul ul {display: none;}
			
	.footer-content {
		float: left;
		font-size: 13px;
		line-height: 18px;
		padding: 37px 15% 40px;
		text-align: center;
		text-transform: uppercase;
		width: 100%;
	}

	#menu-social + .footer-content {
		padding-left: 12px;
		text-align: left;
		width: 50%;
	}
		.footer-content p {
			display: inline-block;
			padding: 0;
		}

/**
 * Main and Content
 *
 * This section deals with the #main section of the site, which wraps the content.
 * --------------------------------------------------------------------------- */

	.content img,
	.widget img {max-width: 100%;}
	
	.entry-content img,
	.featured-media > img,
	.featured-media > a > img,
	.featured-media figure,
	.chat-transcript,
	.widget,
	.page-template-intro .content p img,
	.archive-portfolio_item .content figure,
	.taxonomy-portfolio .content figure {
		background: #161d21;
		border: 1px solid #333b41;
		box-shadow: 12px 12px 0 rgba(0,0,0,.08);
		padding: 11px;
	}
	
	.entry-content img {box-shadow: none;}

/**
 * Posts Listing
 ************************************************/

.entry {
	margin-bottom: 24px;
	}

	/* === entry footer === */

	.entry-footer {
		color: #8d9ca6;
		font: normal normal 11px/18px Arial, Helvetica, sans-serif;
		padding: 14px 0 19px;
		text-shadow: none;
		word-spacing: -4px;
		}
		.entry-footer a {color: #8d9ca6;}
		.entry-footer a:hover {color: #e3f4ff;text-decoration: none;}

		.entry-footer .entry-permalink {
			float: right;
			font-size: 0;
			line-height: 0;
			opacity: 0.2;
			text-align: right;
			width: 10%;
		}
		.entry-footer .entry-permalink:hover {
			opacity: 1;	
		}
			.entry-footer .entry-permalink::before {
				content: '\f0c1';
				font-size: 15px;
				margin-top: 6px;
				line-height: 24px;
				vertical-align: top;
				width: 30px;
			}

		.entry-terms {
			margin-right: 9px;
			vertical-align: top;
		}

			.entry-terms.category::before,
			.entry-terms.post_tag::before,
			.entry-terms.portfolio::before {
				content: '\f02c';
				font-size: 18px;
				margin: 6px 7px 0 0;
				line-height: 24px;
				vertical-align: top;
			}

			.entry-terms.category::before {
				content: '\f07c';
			}

			.entry-terms a {
				background: rgba(0,0,0,.1);
				display: inline-block;
				margin: 6px 3px 0; 
				padding: 3px 10px;
				vertical-align: top;
				word-spacing: 0;
			}
			.entry-terms a:hover {
				background: rgba(0,0,0,.3);
			}

	/* === byline === */

	.entry-byline {
		margin-bottom: 18px;	
	}

		.entry-byline .entry-published {
			display: block;	
			color: #f74037;
			font-weight: 700;
			text-transform: uppercase;
		}
		.entry-byline .comments-link {
			display: block;	
		}
		
		/* edit link */
		.post-edit-link {
			background: rgba(0,0,0,.15);
			display: inline-block;
			font-size: 12px;
			font-weight: 700;
			padding: 0 9px;
			text-transform: uppercase;
		}
			.post-edit-link:hover {
				background: rgba(0,0,0,.5);
				text-decoration: none;
			}

	/* === entry title === */

	.entry-title {
		font-size: 48px;
		font-style: italic;
		letter-spacing: -0.025em;
		line-height: 58px;
		padding: 3px 24px 8px;
		text-align: center;
	}
		.entry-title a:hover {
			text-decoration: none;
		}
			
	@media (max-width: 1199px) {
		.entry-title {
			padding-left: 0;
			padding-right: 0;
			text-align: left;
		}
	}

	/* === featured media === */

	.featured-media {
		padding-bottom: 16px;
		position: relative;
	}
	.entry-title + .featured-media {
		margin-top: 18px;	
	}
		/* reset child floats and margins */
		.featured-media > *,
		.featured-media img[class*="align"],
		.featured-media .wp-video .mejs-video {
			float: none;
			margin: 0;
		}
		
		/* removed extra spacing */
		.featured-media > a,
		.featured-media > figure > a,
		.featured-media > figure > img,
		.featured-media > figure > a > img {
			display: block;
		}
			
		/* for targetted images in featured-media */
		.featured-media > a > img,
		.featured-media > figure > img,
		.featured-media > figure > a > img {
			height: auto;
			max-width: 100%;
		}
		
		.post .featured-media .wp-caption-text {
			padding: 12px 12px 0;
		}
	
	/* === Entry Content === */
		
		/* === Paragraph styles === */
		.entry-content .alert,
		.entry-content .download,
		.entry-content .note {
			border: 6px solid rgba(0,0,0,.1);
			clear: both;
			margin: 20px 0;
			padding: 11px 20px 10px;
		}
			
			/* icons */
			.entry-content .alert::before,
			.entry-content .download::before,
			.entry-content .note::before {
				display: inline-block;
				float: left;
				font-size: 36px;
				margin: 9px 30px 12px 0;
				text-shadow: 1px 1px 1px rgba(0,0,0,.20);
				}

			.entry-content .alert::before {color: #f74037;content: '\f071';}
			.entry-content .download::before {color: #8dc63f;content: '\f019';}
			.entry-content .note::before {color: #00aeef;content: '\f05a';}

/* === Post Format: Chat */

	.chat-transcript {
		color: #8d9ca6;
		font: normal normal 15px/22px "Courier", Monaco, monospace, Courier;
		margin: 20px 0;
	}

		.chat-row {
			border-top: 1px solid #1d2529;
			border-bottom: 1px solid #101517;
			padding: 11px 18px;
			word-spacing: -4px;
		}
		.chat-row:first-child {border-top: 0;}
		.chat-row:last-child {border-bottom: 0;}
		.chat-row:nth-child(odd) {
			background-color: rgba(0,0,0,.1);	
		}

			.chat-author,
			.chat-text {
				display: inline-block;
				vertical-align: top;
				word-spacing: 0;
			}

			/* chat author */
			.chat-author {
				font-weight: 700;
				padding-right: 18px;
				text-align: right;
				width: 22%;
			}
			.chat-speaker-1 .chat-author {color: #8dc63f;}
			.chat-speaker-2 .chat-author {color: #00aeef;}
			.chat-speaker-3 .chat-author {color: #3877eb;}
			.chat-speaker-4 .chat-author {color: #aa38eb;}
			.chat-speaker-5 .chat-author {color: #eb38e9;}
			.chat-speaker-6 .chat-author {color: #e6a4ff;}
			.chat-speaker-7 .chat-author {color: #ef4f00;}
			.chat-speaker-8 .chat-author {color: #efae00;}
			.chat-speaker-9 .chat-author {color: #ecef00;}
			.chat-speaker-10 .chat-author {color: #c50505;}
			
				.chat-author cite {font-style: normal;}

			/* chat text */
			.chat-text {
				width: 76%;
			}
				.chat-text p {padding: 0;}
				.chat-text p + p {padding-top: 14px;}

/* === Post Format: Gallery */
	.gallery-items-count {
		background: rgba(0,0,0,.3);
		display: inline-block;
		color: #fff;
		font-size: 13px;
		line-height: 24px;
		padding: 0 9px;
		position: absolute;
			left: 12px;
			top: 12px;
		text-shadow: none;
		}

/* === Entry Content Pagination */

.page-links {
	font-weight: 700;
	line-height: 42px;
	padding: 17px 0 16px;
	text-transform: uppercase;
	word-spacing: -4px;
}
	/* page links text */
	.page-links-text {
		background: rgba(0,0,0,.1);
		display: inline-block;
		margin: 3px 24px 3px 0;
		padding: 0 10px 0 18px;
		position: relative;
		vertical-align: top;
		word-spacing: 0;
	}
		.page-links-text::before {
			border-top: 21px solid transparent;
			border-bottom: 21px solid transparent;
			border-left: 21px solid rgba(0,0,0,.1);
			display: block;
			content: '';
			height: 0;
			margin-right: -21px;
			position: absolute;
				right: 0;
				top: 0;
			width: 0;
		}

	/* page numbers */
	.page-links a,
	.page-links .page-numbers {
		border-bottom: 0;
		color: #e3f4ff;
		display: inline-block;
		margin: 3px;
		position: relative;
		text-align: center;
		vertical-align: top;
		width: 42px;
		word-spacing: 0;
	}

	.page-links a:hover {
		text-decoration: none;
	}

		.page-links a::before,
		.page-links .page-numbers::before {
			background: rgba(0,0,0,.1);
			content: '';
			height: 30px;
			margin-left: -15px;
			position: absolute;
				left: 50%;
				top: 6px;
			transform: rotate(45deg);
				-webkit-transform: rotate(45deg);
				-moz-transform: rotate(45deg);
				-ms-transform: rotate(45deg);
				-o-transform: rotate(45deg);
			width: 30px;
			z-index: -1;
		}
			.page-links a:hover::before {
				background: rgba(0,0,0,.3);	
			}

		.page-links .page-numbers::before {
			background: rgba(0,0,0,.3);	
		}

/* === Archive Pagination */

.loop-pagination {
	clear: both;
	font: 700 normal 16px/36px Lora, Georgia, serif;
	padding: 0 0 24px;
	word-spacing: -4px;
	}

	.loop-pagination .page-numbers {
		display: inline-block;
		margin: 0 1px 0 0;
		min-width: 48px;
		padding: 0;
		position: relative;
		text-align: center;
		text-transform: uppercase;
		vertical-align: top;
		word-spacing: 0;
	}
	.loop-pagination a:hover {
		text-decoration: none;
	}
		/* use ::after as background to later skew it */
		.loop-pagination .page-numbers::after {
			background: rgba(0,0,0,.1);
			display: inline-block;
			content: '';
			position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
				top: 0;
			z-index: -1;
		}
		.loop-pagination .page-numbers:hover::after,
		.loop-pagination .current::after {
			background: rgba(0,0,0,.3);
		}

	.loop-pagination .prev,
	.loop-pagination .next {
		font-size: 0;
		padding: 0;
		}
		.loop-pagination .prev::before,
		.loop-pagination .next::before {
			content: '\f0da';
		}
		.loop-pagination .prev::before {
			content: '\f0d9';	
		}

/**
 * Singular Page
 ************************************************/

.singular-page .entry-header .entry-title {
	color: #f74037;
	font-size: 16px;
	font-style: normal;
	letter-spacing: 0;
	line-height: 24px;
	padding: 0;
	text-align: right;
	text-transform: uppercase;
}

/**
 * Comments Template
 *
 * This section handles the output of the comments template.  In particular, it styles the output of the 
 * comments section (comments list) and the respond section (comment form).
 * --------------------------------------------------------------------------- */

/**
 * Comments
 *
 * Handles the output of the comments list and related elements.
 */
 
#comments-template {
	margin-bottom: 24px;
}

	/**
	 * Comments
	 *
	 * Handles the output of the main comments area.
	 */
	
		/* === Comments Header === */

		#comments-header {
			/* view '.entry .byline' */
			padding-top: 3px;
			padding-bottom: 6px;
		}
			#comments-number {
				color: #f73f37;
				font-size: 25px;
				letter-spacing: -0.02em;
				line-height: 36px;
				padding: 0;
				text-shadow: 2px 2px 0 rgba(0,0,0,.2);
			}

			/* Comments Nav */

			.comments-nav {
				color: #8d9ca6;
				font: 400 normal 16px/24px Lora, Georgia, sans-serif;
				text-transform: uppercase;
			}
				.comments-nav a {
					display: block;
					font-weight: 700;
				}

		/* === Comment list === */

		.comment-list,
		.comment-list ul.children {
			list-style: none;
			margin: 0;
			padding: 0;
		}
			
			.comment-list li.comment,
			.comment-list li.ping {
				clear: both;
				display: block;
				margin-bottom: 12px;
			}

				.comment-wrap {
					position: relative;
					}

				/* === START threaded comments === */

				.comment-list li li.comment {
					margin-bottom: 0;
					margin-top: 12px;
				}

					.comment-list li li .comment-wrap {
						margin-left: 60px;
					}

				.comment-list li li li .comment-wrap {margin-left: 120px;}
				.comment-list li li li li .comment-wrap {margin-left: 180px;}
				.comment-list li li li li li .comment-wrap{margin-left: 240px;}
				.comment-list li li li li li li .comment-wrap{margin-left: 300px;}
							
				@media (max-width: 999px) {
					.comment-list li li .comment-wrap,
					.comment-list li li li .comment-wrap,
					.comment-list li li li li .comment-wrap,
					.comment-list li li li li li .comment-wrap,
					.comment-list li li li li li li .comment-wrap{margin-left: 0;}	
				}
				
				/* === END threaded comments === */

					/* === Comment Meta === */

					.comment-meta {
						background: rgba(0,0,0,.1);
						float: left;
						clear: both;
						color: #8d9ca6;
						font-size: 13px;
						line-height: 21px;
						padding: 10px 42px 10px 18px;
						width: 100%;
					}
					
					.has-avatar .comment-meta {
						padding-left: 60px;
						position: relative;
					}
					
					/* comment meta background color for comments by the post author */
					.bypostauthor > .comment-wrap .comment-meta {
						background: rgba(0,0,0,.3);
					}
					
						.comment-meta a {color: #8d9ca6;}

						.comment-meta br {display: none;}

						/* === Meta Elements === */

						.comment-wrap .avatar {
							box-shadow: 1px 0 0 rgba(255,255,255,0.05);
							float: left;
							height: 42px;
							padding: 10px;
							position: absolute;
								left: 0;
								top: 0;
							width: 42px;
						}
						
						.comment-author {
							display: inline-block;
							font: 700 normal 14px/22px Lora, Georgia, serif;
							margin-right: 18px;
							vertical-align: top;
						}
						
							.comment-author  a {color: #e3f4ff;}

						.comment-published,
						.comment-edit-link {
							display: inline-block;
							font-family: Verdana, Arial, Helvetica, sans-serif;
							font-size: 11px;
							line-height: 22px;
							margin-right: 18px;
							vertical-align: top;
							text-shadow: none;
						}

						/* === .comment-content {} === */

						.has-avatar .comment-content {
							clear: both;
							padding-left: 60px;
						}

							/* Ordered lists style reset */
							.comment-content ul,
							.comment-content ol {
								margin: 0 0 0 36px;
								padding: 15px 0 12px;
							}
							.comment-content ol {
								list-style: decimal;
							}
							.comment-content ol ol {list-style: upper-roman;}
							.comment-content ol ol ol {list-style: lower-roman;}
							.comment-content ol ol ol ol {list-style: upper-alpha;}
							.comment-content ol ol ol ol ol {list-style: lower-alpha;}

							/* === Reply link === */
							
							.comment-reply-link,
							.comment-reply-login {
								background: rgba(0,0,0,.05);
								font-size: 0;
								line-height: 42px;
								position: absolute;
									right: 0;
									top: 0;
								text-align: center;
								width: 42px;
							}
							.comment-reply-link:hover,
							.comment-reply-login:hover {
								background: rgba(0,0,0,.15);
								color: #fff;
								text-decoration: none;
							}

								/* reply icon */
								.comment-reply-link::before,
								.comment-reply-login::before {
									content: '\f112';
									font-size: 12px;
								}
								
	/**
	 * Closed Comments
	 *
	 */

	.comments-closed {
		color: #f74037;
		font-weight: 700;
		margin-bottom: 12px;
		text-align: center;
		}

	/**
	 * Respond
	 *
	 * Handles the output of the comment form.
	 */

	/* normal respond form container when there are no comments yet */
	.comment-respond {
		border: 6px solid rgba(0,0,0,.1);
		font-size: 13px;
		line-height: 21px;
		padding: 12px 30px 18px;
		}
	/* comment respond within threaded .comments-list */
	.comment-list .comment-respond {
		margin: 0 0 24px;
		width: 100%;
	}

		.comment-respond .required {color: #c00;}

		/* reply title */
		#reply-title {
			color: #e3f3ff;
			font-size: 16px;
			font-style: italic;
			line-height: 24px;
			padding: 6px 18px 12px;
			position: relative;
			text-align: center;
		}

			/* cancel reply link container positioning */

			#reply-title small {
				height: 36px;
				margin-top: -12px;
				margin-right: -30px;
				position: absolute;
					right: 0;
					top: 0;
				width: 36px;
			}
			
				/* cancel reply link*/
				#reply-title small a {
					font-size: 0;
					padding-right: 6px;
					position: absolute;
						right: 0;
						top: 0;
					text-align: right;
					}
	
				#reply-title small a:hover {text-decoration: none;}

					/* cancel icon */
					#reply-title small a::before {
						color: #fff;
						content: '\f00d';
						line-height: 20px;
						vertical-align: top;
					}
					#reply-title small a:hover::before {
						text-shadow: 2px 2px 0 rgba(0,0,0,.2);	
					}
					
					/* cancel icon background */
					#reply-title small a::after {
						border-color: transparent #f74137 transparent transparent;
						border-style: solid;
						border-width: 0 36px 36px 0;
						content: '';
						height: 0;
						position: absolute;
							right: 0;
							top: 0;
						width: 0;
						z-index: -1;
					}
				
		/* comment form */

		.comment-form {
			clear: both;
		}

			.comment-form p {
				padding: 0;
			}
			
			.comment-form .comment-notes,
			.comment-form .logged-in-as {
				background: rgba(0,0,0,0.05);
				color: #8d9ba5;
				font: 400 italic 12px/18px Lora, Georga, sans-serif;
				margin: 6px 0;
				padding: 9px 18px;
				text-align: center;
			}

			/* comment form field containers */
			.comment-form-author,
			.comment-form-email,
			.comment-form-url,
			.comment-form-comment {
				position: relative;
			}

				/* comment form labels */
				.comment-form-author label,
				.comment-form-email label,
				.comment-form-url label,
				.comment-form-comment label {
					display: block;
					font-size: 1px; /* allow screen reader to read text */
					height: 36px;
					line-height: 1px;
					margin: 6px 0;
					overflow: hidden;
					position: absolute;
						right: 0;
						top: 0;
					text-align: center;
					visibility: hidden;
					width: 36px;
					z-index: 2;
				}
					/* label icons */
					.comment-form-author label::before,
					.comment-form-email label::before,
					.comment-form-url label::before,
					.comment-form-comment label::before {
						/* place icons on top of invisible label texts instead of completely hiding label texts from screen readers */
						color: rgba(255,255,255,.15);
						line-height: 36px;
						position: absolute;
							left: 0;
							top: 0;
						visibility: visible;
						width: 36px;
						z-index: 2;
					}
					.comment-form-author label::before {content: '\f007';}
					.comment-form-email label::before {content: '\f0e0';}
					.comment-form-url label::before {content: '\f0c1';}
					.comment-form-comment label::before {content: '\f075';}

				/* comment form fields */
				.comment-form input[type="text"],
				.comment-form input[type="email"],
				.comment-form input[type="url"],
				.comment-form textarea {
					padding-right: 36px;
					width: 100%;
				}

			/* comment allowed HTML */
			.comment-form .form-allowed-tags {
				background: rgba(0,0,0,.1);
				font-size: 13px;
				margin: 6px 0;
				padding: 9px 15px 0;
			}
				.comment-form .form-allowed-tags code {
					display: block;
					margin: 9px -15px 0;
				}

/**
 * Widgets
 *
 * This section handles the output of the sidebar content.
 * --------------------------------------------------------------------------- */

.widget {
	clear: both;
	float: left;
	font-size: 13px;
	line-height: 21px;
	margin-bottom: 24px;
	padding: 0;
	width: 100%;
	/* find '.entry img' for rest of widget styles */
}

	/* Widget headings */

	.widget h1,
	.widget h2,
	.widget h3,
	.widget h4,
	.widget h5,
	.widget h6,
	.comment-content h1,
	.comment-content h2,
	.comment-content h3,
	.comment-content h4,
	.comment-content h5,
	.comment-content h6 {
		line-height: 1.5em;
		padding: 12px 0 11px;
	}
	
	.widget h1,
	.comment-content h1 {font-size: 30px;}
	.widget h2,
	.comment-content h2 {font-size: 24px;}
	.widget h3,
	.comment-content h3 {font-size: 16px;}
	.widget h4,
	.comment-content h4 {font-size: 13px;}
	.widget h5,
	.comment-content h5 {font-size: 12px;}
	.widget h6
	.comment-content h6 {font-size: 11px;}

	.widget .widget-title {
		background: #101619 url(images/pattern-triangles.png) left bottom repeat-x;
		background-size: 10px 4px;
		color: #8d9ca6;
		font: 700 normal 16px/24px Roboto, Arial, Helvetica, sans-serif;
		padding: 11px 23px 12px;
		text-shadow: 2px 2px 0 rgba(0,0,0,.2);
		text-transform: uppercase;
	}
	
	/* Widget images */
	
	.widget img {
		background: #000;
		border: 1px solid #1f262b;
		height: auto;
		padding: 5px;
		}
	.widget-title img {
		background: transparent;
		border: 0;
		padding: 0;
	}
	
	/* Widget paragraphs */
	
	.widget p {
		padding: 12px 23px 11px;
	}
	
	.widget .widget_authors .authors,
	.widget .style-none,
	.widget .term-cloud,
	.widget .post_tag-cloud {
		padding-bottom: 14px;
	}
	
	/* Widget Lists */
	
	.widget ul {
		list-style: none;
		font-size: 16px;
		line-height: 24px;
		margin: 0;
		padding: 0;
		}
		.widget ul li {
			border-top: 1px solid #1d2529;
			border-bottom: 1px solid #101517;
			padding: 11px 23px 11px 41px;
			position: relative;
			}
		.widget ul li:first-child {border-top: 0;}
		.widget ul li:last-child {border-bottom: 0;}
		.widget ul li:nth-child(even) {background: rgba(0,0,0,.1);}
		
			.widget ul li::before {
				color: #f74037;
				content: '\f0da';
				position: absolute;
					left: 23px;
					top: 15px;
			}
			
			.widget ul ul {
				border-left: 1px dotted rgba(255,255,255,.1);
				font-size: 13px;
				line-height: 21px;
				margin: 6px 0;
				padding-left: 18px;
			}
				.widget ul ul li {
					border: 0;
					padding: 0;
				}
				.widget ul ul li:nth-child(even) {background: transparent;}
					.widget ul ul li::before {
						content: ''
					}
	
	/* Widget Forms */
	
	.widget input[type="date"],
	.widget input[type="datetime"],
	.widget input[type="datetime-local"],
	.widget input[type="email"],
	.widget input[type="month"],
	.widget input[type="number"],
	.widget input[type="password"],
	.widget input[type="search"],
	.widget input[type="tel"],
	.widget input[type="text"],
	.widget input[type="time"],
	.widget input[type="url"],
	.widget input[type="week"],
	.widget textarea,
	.widget select {
		background-color: #2a363d;
	}
	
	.button,
	button,
	input[type="submit"],
	input[type="reset"],
	input[type="button"] {
		background-color: #101619;
	}
	
	/* Widget Tables */
	
	.widget table,
	.comment-content table {
		border-width: 3px;
		margin: 12px 0 11px;
	}
	
	.widget caption,
	.widget th,
	.widget td,
	.comment-content caption
	.comment-content th,
	.comment-content td {
		padding: 2px 6px;
	}

/* === Calendar === */

.calendar-wrap {
	padding: 9px 23px 23px;
}
	.widget .wp-calendar {
		margin: 0;
		width: 100%;
	}

/* === Recent Entries === */

.widget_recent_entries .post-date {
	color: #8d9ca6;
	display: block;
	font-size: 13px;
	line-height: 21px;
}

/* === RSS === */

.widget_rss .widget-title .rsswidget img {
	display: inline-block;
	height: 12px;
	margin-right: 6px;
	width: 12px;
}

	.widget_rss ul li {
		padding-left: 23px;
	}
		.widget_rss ul li::before {
			display: none;
		}
		
		.widget_rss ul li .rsswidget {
			display: block;
			padding-right: 24px;
		}
		
		.widget_rss ul li .rssSummary {
			font-size: 13px;
			line-height: 21px;
			}
		
		.widget_rss ul li .rss-date,
		.widget_rss ul li cite {
			color: #8d9ca6;
			display: block;
			font: 400 italic 13px/21px Lora, Georgia, serif;
		}

/* === Search === */

.widget_search {
	background: transparent;
	border: 0;
	box-shadow: none;
	padding: 10px 0 0;
	margin: 0 0 34px;
}

	.widget_search .widget-title {
		display: none;
		}
		
	.widget_search input[type="text"],
	.widget_search input[type="search"]{
		background: transparent;
	}

/* === Text Widget === */

.textwidget {
	padding: 6px 23px;
}

	.widget .textwidget p {
		padding-left: 0;
		padding-right: 0;
	}

	.widget .textwidget ul {
		list-style: square;
		list-style-position: outside;
		font-size: 13px;
		line-height: 21px;
		margin: 0 0 0 18px;
		padding: 12px 0 11px;
	}
		.widget .textwidget ul li {
			border: 0;
			padding: 0;
		}
		.widget .textwidget ul li:nth-child(even) {background: transparent;}

			.widget .textwidget ul li::before {
				content: '';
				width: auto;
			}
			
			.widget .textwidget ul ul,
			.widget .textwidget ol {
				border-left: 0;
				margin: 0 0 0 18px;
				padding: 12px 0 11px;
				}

/**
 * Ravel Utility Tabs (based on Alx Tabs)
 *
 * --------------------------------------------------------------------------- */


	/* reset styles inherited from .widget ul */
	.widget_util_tabs ul {
		font-size: 13px;
		line-height: 21px;	
	}

		.widget_util_tabs ul li {
			clear: both;
			float: left;
			padding: 23px 23px 18px;
			width: 100%;
		}
			.widget_util_tabs ul li::before {
				display: none;
			}
		
	/* === Tabs Nav === */

	.widget_util_tabs .tabs-nav {
		background: #141a1e;
		border-bottom: 1px solid #242b30;
		clear: both;
		float: left;
		width: 100%;
		}
		/* reset widget list style for Tabs Nav list */
		.widget_util_tabs .tabs-nav li {
			clear: none;
			float: left;
			border: 0;
			padding: 0;
			width: 25%;
			}
		.widget_util_tabs .tabs-nav li:nth-child(even) {background: transparent;}
		
			/* Tabs Nav link */
			.widget_util_tabs .tabs-nav li a{
				border: 1px solid transparent;
				color: #8d9ca6;
				display: block;
				font-size: 0;
				margin: -1px 0;
				position: relative;
				text-align: center;
				z-index: 2;
			}
			.widget_util_tabs .tabs-nav li a:hover {
				color: #e3f4ff;
				text-decoration: none;
			}

				/* Tabs Nav link icon */
				.widget_util_tabs .tabs-nav li a::before {
					font-size: 18px;
					line-height: 46px;
				}
				.widget_util_tabs .tabs-nav li.tab-recent a::before {content: '\f017';}
				.widget_util_tabs .tabs-nav li.tab-popular a::before {content: '\f005';}
				.widget_util_tabs .tabs-nav li.tab-comments a::before {content: '\f086';}
				.widget_util_tabs .tabs-nav li.tab-tags a::before {content: '\f02c';}

			/* Tabs Nav link */
			.widget_util_tabs .tabs-nav li[aria-selected="true"] a {
				background: #161d21;
				border-color: #f74037 #252d31 #161d21 #252d31;
			}
			.widget_util_tabs .tabs-nav li:first-child a {border-left: 0;	}
			.widget_util_tabs .tabs-nav li:last-child a {border-right: 0;}

	/* === Tabs Container === */

	.tabs-container {clear: both;}

		/* thumbnail */
		.tab-thumbnail {
			float: left;
		}
			.tab-thumbnail img {
				background: #000;
				border: 1px solid #1f262b;
				display: block;
				height: 60px;
				padding: 5px;
				width: 60px;
			}
			.tab-thumbnail.avatar img {
				height: 48px;
				width: 48px;	
			}
			
		/* title and byline */
		.tab-thumbnail + .tab-content {padding-left: 78px;}
		.tab-thumbnail.avatar + .tab-content {padding-left: 66px;}

			.tab-author,
			.tab-post-format,
			.tab-date {
				font-family: Lora, Georgia, sans-serif;
				font-size: 12px;
			}
				.tab-author cite {
					font-style: normal;
					font-weight: 700;
				}

			.tab-post-format a {
				color: #8d9ca6;
				text-transform: uppercase;	
			}
			
/**
 * Template 404 / Error
 * --------------------------------------------------------------------------- */

.error-404 .content {
	width: 92%;
}
		
	.error-404 .entry {
		margin: 0 auto;
		text-align: center;
		width: 
	}
		.entry.error .entry-title {
			color: #9cc4dd;
			font: 700 italic 145px/1 Lora, Georgia, serif;
			letter-spacing: -0.02em;
			padding: 0 0 27px;
			text-shadow: 12px 12px 0 rgba(0,0,0,.2);
		}
		@media (max-width: 600px) {
			.entry.error .entry-title { font-size: 72px; }
		}
		
		.entry.error .entry-title,
		.entry.error .entry-content {
			text-align: center;
			width: 100%;
		}
		
			.entry.error .entry-content .search-form {
				margin: 24px auto;
			}


/**
 * Template Intro
 * --------------------------------------------------------------------------- */
 
.page-template-intro .content {
	margin: 0 0 12px;
	text-align: center;
	word-spacing: -4px;
}

	.page-template-intro .col,
	.page-template-intro .col {
		display: inline-block;
		padding: 0 12px;
		text-align: left;
		vertical-align: top;
		width: 564px;
		word-spacing: 0;
	}
	
		#hero-image-container img {
			display: block;
			height: auto;
			max-width: 100%;
		}
		
	@media (max-width: 564px) {
		.page-template-intro .col,
		.page-template-intro .col {
			width: 100%;
		}
		
		.page-template-intro .thumbnail.hero-image {
			height: auto;
			width: auto;
		}
	}/* end @media max-width 564 */
 
/**
 * Template Portfolio Archive Pages
 * --------------------------------------------------------------------------- */
	
	/* === Menu Portfolio === */
	
	#menu-portfolio {
		clear: both;
		float: left;
		padding: 0 0 36px;
		text-align: center;
		width: 100%;
		}
		
		#menu-portfolio li {
			margin: 0 1px 0 0;
			text-align: left; /* check this */
			}
			#menu-portfolio li a {
				display: block;
				font: 400 normal 16px/36px Lora, Georgia, serif;
				margin: 0;
				min-width: 48px;
				padding: 0 18px;
				text-align: center;
				text-transform: none;
				text-shadow: none;
			}
			/* link hovers */
			#menu-portfolio li a:hover {
				background: transparent;
				text-decoration: none;
				}
				
				/* use ::after as background to later skew it */
				#menu-portfolio li a::after {
					background: rgba(0,0,0,.2);
					display: inline-block;
					content: '';
					position: absolute;
						bottom: 0;
						left: 0;
						right: 0;
						top: 0;
				transform: skew(-45deg);
					-webkit-transform: skew(-45deg);
					-moz-transform: skew(-45deg);
					-ms-transform: skew(-45deg);
					-o-transform: skew(-45deg);	
					z-index: -1;
				}
				#menu-portfolio li a:hover::after {
					background: rgba(0,0,0,.3);
				}
				
	/* === Loop Entries Gallery === */
	
	.loop-entries-gallery {
		clear: both;
		float: left;
		list-style: none;
		margin: 0 0 12px;
		padding: 0 3%;
		text-align: center;
		width: 100%;
		word-spacing: -4px;
		}
		.loop-entries-gallery li {
			display: inline-block;
			margin: 12px;
			position: relative;
			vertical-align: top;
			width: 28%;
			word-spacing: 0;
			}
		 
		@media (max-width: 768px) {.loop-entries-gallery li {width: 40%;}}
		@media (max-width: 600px) {.loop-entries-gallery li {width: auto;}}

			.loop-entries-gallery figure {
				z-index: 1;
			}
			
				.loop-entries-gallery li figure a,
				.loop-entries-gallery li figure a img {
					/* remove additional spacing at the bottom of each entry */
					display: block;
				}

				.loop-entries-gallery li figure a img {
					height: auto;
					max-width: 100%;
				}
				
			.loop-entries-gallery .entry-title {
				background: rgba(0,0,0,.8);
				clear: none;
				float: none;
				font: normal 18px/27px Roboto, Arial, Heletica, sans-serif;
				letter-spacing: 0;
				margin: 0;
				opacity: 0;
				padding: 10px 18px;
				position: absolute;
					right: 12px;
					bottom: 12px;
					left: 12px;
				text-align: center;
				width: auto;
				z-index: 1;
				}
			
			.loop-entries-gallery li:hover .entry-title {
				opacity: 1;
				}
			
	/* === Pagination === */

	.archive-portfolio_item .loop-pagination,
	.taxonomy-portfolio .loop-pagination {
		padding: 24px 0;
		text-align: center;
		width: 100%;
	}

			/* skew the background on portfolio pages */
			.archive-portfolio_item .loop-pagination .page-numbers::after,
			.taxonomy-portfolio .loop-pagination .page-numbers::after {
				transform: skew(-45deg);
					-webkit-transform: skew(-45deg);
					-moz-transform: skew(-45deg);
					-ms-transform: skew(-45deg);
					-o-transform: skew(-45deg);	
			}
 
/**
 * Template Singular Portfolio Item
 * --------------------------------------------------------------------------- */
 
.singular-portfolio_item .content {
	padding: 0 3%;
	}

	.singular-portfolio_item .featured-media {
		clear: left;
		float: left;
		margin: 0 12px;
		padding: 0;
		width: 64.54%;
	}
		/* reset margin bottom for all first level childs */
		.singular-portfolio_item .featured-media > *{
			margin-bottom: 24px;
		}
		
		/* reset all `figure` tags */
		.singular-portfolio_item .featured-media figure,
		.singular-portfolio_item .featured-media figure[class*="align"]{
			margin: 0 0 24px;
			overflow: hidden;
			position: relative;
		}
		
			.singular-portfolio_item .featured-media figcaption {
				background: rgba(0,0,0,0.5);
				color: #fff;
				display: block;
				font: 400 normal 11px/18px Arial, Helvetica, sans-serif;
				margin: 0 0 -30px;
				overflow: hidden;
				padding: 6px 15px;
				position: absolute;
					bottom: 0;
					left: 11px;
					right: 11px;
				text-align: left;
				z-index: 2;
			}
			
			.singular-portfolio_item .featured-media figure:hover figcaption {margin-bottom: 11px;}
			
	.singular-portfolio_item .entry {
		clear: right;
		float: right;
		margin: 0 12px 12px;
		width: 29.8%;
	}

		.singular-portfolio_item .entry-title {
			font-size: 24px;
			line-height: 36px;
			padding-left: 0;
			padding-right: 0;
			text-align: left;
			width: 100%;
		}
		.singular-portfolio_item .entry-content,
		.singular-portfolio_item .entry-footer {
			width: 100%;
		}
		
			.button.portfolio-item-link {text-transform: uppercase;}
			
@media (max-width: 910px) {
	.singular-portfolio_item .featured-media,
	.singular-portfolio_item .entry {
		width: 46%;
	}
}/* end @media max-width 910 */

@media (max-width: 728px) {
	.singular-portfolio_item .featured-media,
	.singular-portfolio_item .entry {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
}/* end @media max-width 728 */

/**
 * Plugins
 * --------------------------------------------------------------------------- */
 
/* === Clean My Archives === */

	.clean-my-archives ul {list-style: none;}

		.clean-my-archives li {
			padding-left: 40px;
			position: relative;
			}
			
			.clean-my-archives .day,
			.clean-my-archives .comments-number {
				display: inline-block;
				font-size: 18px;
				}

			.clean-my-archives .day {
				font-weight: 700;
				left: 0;
				position: absolute;
				}

			.clean-my-archives .day-duplicate .day {
				border-left: 1px dotted rgba(255,255,255,.2);
				margin-left:  12px;
				text-indent: -9999em;
				}

/**
 * Grouping for Convenience
 * --------------------------------------------------------------------------- */

a,
button,
input,
select,
textarea,
.menu-toggle::before,
nav.menu a::after,
nav.menu ul ul,
.page-links a::before,
.loop-pagination .page-numbers::after,
#sidebar-primary,
.sidebar-toggle:hover::before,
.loop-entries-gallery .entry-title,
.singular-portfolio_item .featured-media figcaption {
	transition: all 0.3s ease-in-out;
		-webkit-transition: all 0.3s ease-in-out;
		-ms-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
}

/**
 * Responsive CSS
 * --------------------------------------------------------------------------- */
 
/* === 1st break point === */
 
@media (max-width: 1199px) {
			
			.content {width: 92%;}
			
} /* end @media max-width: 1199px */

/* === 2nd break point === */

@media (max-width: 600px) {

/* Image Alignment */

.alignleft,
.alignright {
	float: none;
	margin: 20px auto;
	}

	/* === Gallery === */
	
		/* .gallery-col-3 is the default one above */
		.gallery-col-4 .gallery-item,
		.gallery-columns-4 .gallery-item,
		.gallery-col-5 .gallery-item,
		.gallery-columns-5 .gallery-item,
		.gallery-col-6 .gallery-item,
		.gallery-columns-6 .gallery-item,
		.gallery-col-7 .gallery-item,
		.gallery-columns-7 .gallery-item,
		.gallery-col-8 .gallery-item,
		.gallery-columns-8 .gallery-item,
		.gallery-col-9 .gallery-item,
		.gallery-columns-9 .gallery-item,
		.gallery-col-10 .gallery-item,
		.gallery-columns-10 .gallery-item,
		.gallery-col-11 .gallery-item,
		.gallery-columns-11 .gallery-item,
		.gallery-col-12 .gallery-item,
		.gallery-columns-12 .gallery-item,
		.gallery-col-13 .gallery-item,
		.gallery-columns-13 .gallery-item,
		.gallery-col-14 .gallery-item,
		.gallery-columns-14 .gallery-item,
		.gallery-col-15 .gallery-item,
		.gallery-columns-15 .gallery-item,
		.gallery-col-16 .gallery-item,
		.gallery-columns-16 .gallery-item,
		.gallery-col-17 .gallery-item,
		.gallery-columns-17 .gallery-item,
		.gallery-col-18 .gallery-item,
		.gallery-columns-18 .gallery-item,
		.gallery-col-19 .gallery-item,
		.gallery-columns-19 .gallery-item,
		.gallery-col-20 .gallery-item,
		.gallery-columns-20 .gallery-item,
		.gallery-col-21 .gallery-item,
		.gallery-columns-21 .gallery-item,
		.gallery-col-22 .gallery-item,
		.gallery-columns-22 .gallery-item,
		.gallery-col-23 .gallery-item,
		.gallery-columns-23 .gallery-item,
		.gallery-col-24 .gallery-item,
		.gallery-columns-24 .gallery-item,
		.gallery-col-25 .gallery-item,
		.gallery-columns-25 .gallery-item,
		.gallery-col-26 .gallery-item,
		.gallery-columns-26 .gallery-item,
		.gallery-col-27 .gallery-item,
		.gallery-columns-27 .gallery-item,
		.gallery-col-28 .gallery-item,
		.gallery-columns-28 .gallery-item,
		.gallery-col-29 .gallery-item,
		.gallery-columns-29 .gallery-item,
		.gallery-col-30 .gallery-item,
		.gallery-columns-30 .gallery-item{ width: 33.3%;}

	/* === Layout === */
		
					/* micro layout grouping */
					.entry-byline,
					.singular-page .entry-header,
					#comments-header {
						border-right: 0;
						padding: 0 0 12px;
						text-align: center;
						width: 100%;
					}
					
						.entry-byline .entry-published,
						.entry-byline .entry-author, /* didn't exist before */
						.entry-byline .comments-link,
						.comments-nav a {
							display: inline-block;
						}
						
						.entry-byline .entry-published,
						.entry-byline .entry-author,
						.comments-nav a:first-child {
							border-right: 1px solid rgba(255,255,255,.1);
							margin-right: 9px;
							padding-right: 9px;
						}
						.entry-byline .post-edit-link {
							margin-left: 9px;
						}
						
						.comments-nav .page-numbers + a {
							border-left: 1px solid rgba(255,255,255,.1);
							margin-left: 9px;
							padding-left: 9px;
						}
						
						.singular-page .entry-header .entry-title {
							font-size: 25px;
							font-style: italic;
							line-height: 36px;
							text-align: center;
							text-transform: none;
						}
					
					.entry-title,
					.featured-media,
					.entry-content,
					.entry-summary,
					.entry-footer,
					.loop-pagination,
					.comment-list,
					.comment-respond,
					.comments-closed {
						width: 100%;
					}
					
					.loop-pagination {text-align: center;}
					
						.entry-title {
							font-size: 25px;
							letter-spacing: 0;
							line-height: 36px;
							text-align: center;
						}
						
/* === Header === */

#header {
	padding: 36px 0 0;
}

	#branding {
		margin: 32px 0 30px;
		padding: 0 15%;
		text-align: center;
		}

		#site-title {
			font-size: 36px;
			line-height: 48px;
		}

/* === Footer === */

	#menu-social,
	.footer-content,
	#menu-social + .footer-content {
		padding: 15px 5%;
		text-align: center;
		width: 100%;
	}
	
				#menu-social li a::after {
					margin: 9px 0 0 0;
				}
		
} /* end @media max-width: 600px */