/* ==================================================================
   @group Typography
   ================================================================== */

body {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: 400;
	color: #898f94;
}

blockquote, dl, dt, form, h1, h2, h3, h4, h5, dd, h6, li, ol, p, pre, ul {
	font-size: 1em;
	line-height: 1.6;
	margin: 0;
	padding: 0;
}

em, i {
	font-style: italic;
	line-height: inherit;
}

strong, b {
	font-weight: 600;
	line-height: inherit;
}

abbr,
acronym {
	text-transform: uppercase;
	font-size: 90%;
	border-bottom: 1px solid #898f94;
	cursor: help;
}

abbr { text-transform: none }

hr {
	margin: 40px 0;
	height: 0;
	clear: both;
	border: solid #898f94;
	border-width: 2px 0 0;
	opacity: 0.6;
}

p, ol, ul, dl { margin-bottom: 1em }

/* ===[ Links ]=== */

a:link,
a:visited {
	color: #4ebde9;
	text-decoration: none;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	transition: all 200ms ease;
}

a:hover,
a:focus,
a:active {
	color: #ebf2f4;
	outline: none;
	-webkit-transition-duration: 50ms;
	-moz-transition-duration: 50ms;
	-o-transition-duration: 50ms;
	-ms-transition-duration: 50ms;
	transition-duration: 50ms;
}

/* ===[ Headings ]=== */

h1, h2, h3, h4, h5, h6 {
	margin-bottom: 1em;
	font-family: 'Source Sans Pro', sans-serif;
	font-style: normal;
	font-weight: 300;
	line-height: 1.2;
	text-rendering: optimizeLegibility;
	color: #d0dfe7;
}

h1 { font-size: 24px; margin-bottom: 0.5em; }
h2 { font-size: 21px; margin-bottom: 0.5em; }
h3 { font-size: 16px; margin-bottom: 0.5em; }
h4 { font-size: 16px; margin-bottom: 0.5em; }
h5 { font-size: 16px; margin-bottom: 0.5em; }
h6 { font-size: 16px; margin-bottom: 0.5em; text-transform: uppercase; }

/* ===[ Lists ]=== */

ul, ol, dl {
	list-style-position: outside;
	margin-bottom: 1em;
	padding-left: 1.5em;
}

ul li ul,
ul li ol,
ol li ul,
ol li ol { margin: 0.25em 0 }

ul { list-style-type: disc }

ul li ul { list-style-type: circle }

ol { list-style-type: decimal }

ol li ol { list-style-type: lower-alpha }

/* ===[ Quotations ]=== */

blockquote {
	border-left: 3px solid #898f94;
	margin-bottom: 1em;
	padding: 0 1.5em;
}

blockquote p { margin: 0 0 1em }

blockquote > *:last-child { margin-bottom: 0 }

blockquote footer { margin-top: 1em }

blockquote footer:before {
	content: "\2014";
	margin-right: 0.2em;
}

/* ===[ Responsive typesetting ]=== */

@media screen and (min-width: 500px) {
	h1 { font-size: 32px; margin-bottom: 0.5em; }
	h2 { font-size: 24px; margin-bottom: 0.5em; }
	h3 { font-size: 21px; margin-bottom: 0.5em; }
	h4 { font-size: 16px; margin-bottom: 0.5em; }
	h5 { font-size: 16px; margin-bottom: 0.5em; }
	h6 { font-size: 16px; margin-bottom: 0.5em; text-transform: uppercase; }
}

@media screen and (min-width: 700px) {
	h1 { font-size: 36px; margin-bottom: 0.5em; }
	h2 { font-size: 32px; margin-bottom: 0.5em; }
	h3 { font-size: 24px; margin-bottom: 0.5em; }
	h4 { font-size: 21px; margin-bottom: 0.5em; }
	h5 { font-size: 16px; margin-bottom: 0.5em; }
	h6 { font-size: 16px; margin-bottom: 0.5em; text-transform: uppercase; }
}


@media screen and (min-width: 1200px) {
	h1 { font-size: 48px; margin-bottom: 0.5em; }
	h2 { font-size: 36px; margin-bottom: 0.5em; }
	h3 { font-size: 32px; margin-bottom: 0.5em; }
	h4 { font-size: 24px; margin-bottom: 0.5em; }
	h5 { font-size: 21px; margin-bottom: 0.5em; }
	h6 { font-size: 16px; margin-bottom: 0.5em; text-transform: uppercase; }
}


/* ===[ Buttons ]=== */

.button {
	display: inline-block;
	font-size: 21px;
	font-style: normal;
	font-weight: 300;
	line-height: 50px;
	padding: 0 20px;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	border: none !important;
	white-space: nowrap;
	text-overflow: ellipsis;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.button.large {
	font-size: 24px;
	line-height: 60px;
	padding: 0 30px;
}

.button.small {
	font-size: 18px;
	line-height: 40px;
	padding: 0 15px;
}

.button:link,
.button:visited {
	color: #ebf2f4;
	background-color: #8dab36;
}

.button:hover,
.button:focus,
.button:active {
	color: #f8fbfb;
	background-color: #819b31;
}

.button.dark:link,
.button.dark:visited {
	color: #b9bfc0;
	background-color: #52585b;
}

.button.dark:hover,
.button.dark:focus,
.button.dark:active {
	color: #c4c8ca;
	background-color: #5c6366;
}

::selection {
	color: #f8fbfb;
	background-color: #2e3538;
}

::-moz-selection {
	color: #f8fbfb;
	background-color: #2e3538;
}

/* ==[ Alignment ]== */
.align-left {
	float: left;
	margin: 0 1em 1em 0;
}

.align-right {
	float: right;
	margin: 0 0 1em 1em;
}

.align-center {
	display: block;
	margin: 0 auto 1em;
}

.text-align-left { text-align: left; }
.text-align-right { text-align: right; }
.text-align-center { text-align: center; }

.padded { padding: 1em; }
.padded-tb { padding: 1em 0; }
.padded-sides { padding: 0 1em; }


/* ==================================================================
   @group Media
   ================================================================== */

img {
	max-width: 100%;
	height: auto;
}

img.retina { visibility: hidden }

.video-wrapper { background-color: #000 }

/* ==================================================================
   @group Layout
   ================================================================== */

html,
body {
	position: relative;
	height: 100%;
}

body {
	width: 100%;
	position: relative;
	background-color: #3a3e40;
}

.inner {
	max-width: 1440px;
	margin: 0 50px;
	padding: 0 20px;
}

.centered .inner { margin: 0 auto }

.box-model {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#page-wrap {
	width: 100%;
	position: relative;
	overflow: hidden;
}

#page {
	width: 100%;
	min-width: 320px;
	position: relative;
	padding-top: 140px;
}

/* ===[ Swap fade transitions ]=== */

.swap-fade-container .swap-fade-item-hover,
.swap-fade-container:hover .swap-fade-item {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	pointer-events: none;
}

.swap-fade-container .swap-fade-item,
.swap-fade-container:hover .swap-fade-item-hover,
.swap-fade-container.active .swap-fade-item-hover {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
	pointer-events: none;
}

.swap-fade-container .swap-fade-item,
.swap-fade-container:hover .swap-fade-item-hover {
	-webkit-transition: opacity 50ms ease;
	   -moz-transition: opacity 50ms ease;
	     -o-transition: opacity 50ms ease;
	    -ms-transition: opacity 50ms ease;
	        transition: opacity 50ms ease;
}

.swap-fade-container .swap-fade-item-hover,
.swap-fade-container:hover .swap-fade-item {
	-webkit-transition: opacity 200ms ease;
	   -moz-transition: opacity 200ms ease;
	     -o-transition: opacity 200ms ease;
	    -ms-transition: opacity 200ms ease;
	        transition: opacity 200ms ease;
}

/* ===[ Fixed Content ]=== */

#fixed-content {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 100;
}

/* ===[ Content Spacing ]=== */

#banner-slider,
#page-hero,
#call-to-action,
#content-area,
#portfolio-grid,
.post-detail,
.post-detail .categories,
.post-content,
.post-notes,
.post-coomments { margin: 30px auto }

#ajax-buttons { margin-top: -30px }

@media screen and (min-width: 30em) { 
	#aside-right .widget-area-wrap { padding: 30px }
}

@media screen and (min-width: 48em) { 
	.inner { padding: 0 50px }
	#banner-slider,
	#page-hero,
	#call-to-action,
	#content-area,
	#portfolio-grid,
	.post-detail,
	.post-detail .categories,
	.post-content,
	.post-notes,
	.post-coomments { margin: 40px auto }
	#ajax-buttons { margin-top: -40px }
	#aside-right .widget-area-wrap { padding: 40px }
	#aside-right .widget { margin-bottom: 40px !important }
}

@media screen and (min-width: 60em) { 
	#banner-slider,
	#page-hero,
	#call-to-action,
	#content-area,
	#portfolio-grid,
	.post-detail,
	.post-detail .categories,
	.post-content,
	.post-notes,
	.post-coomments { margin: 50px auto }
	#ajax-buttons { margin-top: -50px }
}

/* ===[ Spinner ]=== */

.wf-loading .spinner-underlay {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 888888;
}

#spinner {
	display: block;
	width: 120px;
	height: 120px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin: -60px 0 0 -60px;
	color: #ebf3f5;
	z-index: 999999;
}

/* ==================================================================
   @group Top Widget Area
   ================================================================== */

@media screen and (min-width: 60em) { 
	#top-widget-area {
		height: 0;
		position: relative;
		overflow: hidden;
		background-color: #2c2f30;
		-webkit-transition: height 400ms ease;
		   -moz-transition: height 400ms ease;
		     -o-transition: height 400ms ease;
		    -ms-transition: height 400ms ease;
		        transition: height 400ms ease;
	}

	#top-widget-area #wrapper-outer { width: 100% }

	#top-widget-area #wrapper-inner { width: 10000px }

	#top-widget-area .inner {
		opacity: 0;
		-webkit-transition: opacity 400ms 200ms ease;
		   -moz-transition: opacity 400ms 200ms ease;
		     -o-transition: opacity 400ms 200ms ease;
		    -ms-transition: opacity 400ms 200ms ease;
		        transition: opacity 400ms 200ms ease;
	}

	.js-content-top #top-widget-area { height: 320px }

	.js-content-top #top-widget-area .inner {
		opacity: 1;
		-webkit-transition-delay: 0ms;
		   -moz-transition-delay: 0ms;
		     -o-transition-delay: 0ms;
		    -ms-transition-delay: 0ms;
		        transition-delay: 0ms;
	}

	#top-widget-area:after {
		display: block;
		height: 40px;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		content: "";
		background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.05)));
		background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 100%);
		background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 100%);
		background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 100%);
		background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 100%);
		background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 100%);
		pointer-events: none;
	}

	#top-widget-area .inner {
		height: 300px;
		position: relative;
		overflow: hidden;
	}

	#top-content-toggle {
		display: block;
		width: 48px;
		height: 32px;
		position: absolute;
		top: 0;
		left: 50%;
		margin-left: -24px;
		background-color: #2c2f30;
		border-bottom-left-radius: 5px;
		border-bottom-right-radius: 5px;
	}

	#page-header.small #top-content-toggle { height: 27px }

	#top-content-toggle .toggle-wrap {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba(0, 0, 0, 0.05);
		box-shadow: inset 0 -1px 0 rgba(230, 230, 230, 0.1);
		border-bottom-left-radius: 5px;
		border-bottom-right-radius: 5px;
	}

	#top-content-toggle .toggle-left-corner,
	#top-content-toggle .toggle-right-corner {
		display: block;
		width: 5px;
		height: 5px;
		position: absolute;
		top: 0;
		background-color: #2c2f30;
	}

	#top-content-toggle .toggle-left-corner { left: -5px }
	#top-content-toggle .toggle-right-corner { right: -5px }

	#top-content-toggle .toggle-left-corner:after,
	#top-content-toggle .toggle-right-corner:after {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba(0, 0, 0, 0.1);
		content: "";
	}

	#top-content-toggle:before,
	#top-content-toggle:after {
		display: block;
		width: 10px;
		height: 10px;
		position: absolute;
		top: 0;
		background-color: #35393b;
		border-radius: 10em;
		content: "";
		z-index: 2;
	}

	#top-content-toggle:before { left: -10px }
	#top-content-toggle:after { right: -10px }

	#top-content-toggle .toggle-icon {
		display: block;
		width: 24px;
		height: 3px;
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -3px 0 0 -12px;
		background-color: #4ebde9;
		-webkit-transition: background-color 200ms ease;
		   -moz-transition: background-color 200ms ease;
		     -o-transition: background-color 200ms ease;
		    -ms-transition: background-color 200ms ease;
		        transition: background-color 200ms ease;
	}

	#top-content-toggle .toggle-icon:before,
	#top-content-toggle .toggle-icon:after {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		background-color: #4ebde9;
		content: "";
		-webkit-transition: background-color 200ms ease;
		   -moz-transition: background-color 200ms ease;
		     -o-transition: background-color 200ms ease;
		    -ms-transition: background-color 200ms ease;
		        transition: background-color 200ms ease;
	}

	#top-content-toggle .toggle-icon:before { top: -6px }

	#top-content-toggle .toggle-icon:after { top: 6px }

	#page-header.small #top-content-toggle .toggle-icon {
		height: 2px;
		margin-top: -2px;
	}

	#page-header.small #top-content-toggle .toggle-icon:before { top: -4px }

	#page-header.small #top-content-toggle .toggle-icon:after { top: 4px }

	#top-content-toggle:hover .toggle-icon,
	#top-content-toggle:hover .toggle-icon:before,
	#top-content-toggle:hover .toggle-icon:after {
		background-color: white;
		-webkit-transition-duration: 50ms;
		   -moz-transition-duration: 50ms;
		     -o-transition-duration: 50ms;
		    -ms-transition-duration: 50ms;
		        transition-duration: 50ms;
	}
}

@media screen and (max-width: 60em) { 
	#top-widget-area,
	#top-content-toggle {
		display: none !important;
		visibility: hidden;
	}
}

/* ==================================================================
   @group Header
   ================================================================== */

#page-header {
	height: 140px;
	position: relative;
	background-color: #35393b;
	box-shadow: 0 1px 0 rgba(230, 230, 230, 0.05);
}

#page-header:before {
	display: block;
	height: 80px;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	content: "";
	z-index: 1;
	background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.025)));
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.025) 100%);
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.025) 100%);
	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.025) 100%);
	background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.025) 100%);
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.025) 100%);
}

#page-header .inner {
	height: 100%;
	position: relative;
	z-index: 2;
}

#page-header .header-inside {
	position: relative;
	height: 100%;
	margin: 0 auto;
	border-bottom: 5px solid #4ebde9;
}

/* ===[ Logo ]=== */

#logo {
	position: absolute;
	left: 0;
	bottom: 25px;
}

#logo a:link,
#logo a:visited { color: #f2f2f3 }

#logo a:hover,
#logo a:focus,
#logo a:active { color: #4ebde9 }

#logo h1 {
	display: inline-block;
	margin: 0;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 60px;
	font-style: normal;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -2px;
}

/* ===[ Image Logo ]=== */

#logo .image-logo {
	display: inline-block;
	position: relative;
	vertical-align: top;
}

#logo .image-logo .normal {
	position: relative;
	width: 100%;
}

#logo .image-logo .hover {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}

#logo .image-logo img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
}

/* ===[ Main Navigation ]=== */

#main-navigation {
	position: absolute;
	left: 200px;
	bottom: 0;
}

#main-navigation ul {
	margin: 0;
	padding: 0;
	color: #798086;
}

#main-navigation li {
	display: inline-block;
	height: 32px;
	padding: 0 20px 35px;
	position: relative;
	list-style: none;
}

#main-navigation li:after {
	display: block;
	width: 20px;
	height: 32px;
	position: absolute;
	right: -10px;
	top: 0;
	line-height: 32px;
	text-align: center;
	content: '/';
	z-index: 2;
	opacity: 0.5;
}

#main-navigation li:last-child:after { display: none }

#main-navigation a {
	display: inline-block;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 32px;
	text-transform: capitalize;
}

#main-navigation a:link,
#main-navigation a:visited { color: #798086 }

#main-navigation a:hover,
#main-navigation a:focus,
#main-navigation a:active,
#main-navigation .hovered a { color: #afb3b6 }

/* ===[ Dropdowns ]=== */

#main-navigation .dropdown {
	display: none;
	min-width: 14em;
	position: absolute;
	top: 100%;
	left: 0;
	border-top: 5px solid #4ebde9;
	box-shadow: 0 5px 20px rgba(26, 26, 26, 0.5);
}

#main-navigation .dropdown:before {
	display: block;
	width: 110%;
	height: 5px;
	position: absolute;
	top: -5px;
	left: -5%;
	background-color: #4ebde9;
	content: "";
}

#main-navigation li:hover > ul,
#main-navigation li.hovered > ul { display: block }

#main-navigation .dropdown li {
	display: block;
	width: 100%;
	height: 40px;
	padding: 0;
	border-color: #3a3d40;
	border-style: solid;
	border-width: 0 1px;
	white-space: nowrap;
}

#main-navigation .dropdown li:last-child { border-width: 0 1px 1px }

#main-navigation .dropdown li:after { display: none }

#main-navigation .dropdown a {
	display: block;
	padding: 0 20px;
	font-size: 14px;
	line-height: 40px;
}

#main-navigation .dropdown a:link,
#main-navigation .dropdown a:visited {
	color: #61666b;
	background-color: #2c2e30;
	background-position: 0 -60px;
	background-repeat: no-repeat;
	box-shadow: inset 0 1px 0 rgba(204, 204, 204, 0.05);
}

#main-navigation .dropdown a:hover,
#main-navigation .dropdown a:focus,
#main-navigation .dropdown a:active {
	color: #798086;
	background-color: #222425;
	background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(230, 230, 230, 0.03)), color-stop(100%, rgba(230, 230, 230, 0)));
	background-image: -webkit-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -moz-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -ms-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -o-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: linear-gradient(to bottom, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-position: 0;
	box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.2);
}

.sf-sub-indicator { display: none }

/* ===[ Searchbox ]=== */

#searchbox {
	height: 32px;
	position: absolute;
	right: 0;
	bottom: 0;
	padding-bottom: 35px;
	z-index: 3;
}

#searchbox input[type="text"] {
	display: none;
	position: relative;
	width: 220px;
	height: 32px;
	margin-right: 40px;
	padding: 0 15px;
	font-family: 'Source Sans Pro', sans-serif;
	border: none;
	color: #65707b;
	background-color: #292b2e;
	background-repeat: no-repeat;
	background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(230, 230, 230, 0.03)), color-stop(100%, rgba(230, 230, 230, 0)));
	background-image: -webkit-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -moz-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -ms-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -o-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: linear-gradient(to bottom, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.15);
	border-radius: 99em;
	z-index: 2;
	-webkit-transition: box-shadow 200ms ease;
	   -moz-transition: box-shadow 200ms ease;
	     -o-transition: box-shadow 200ms ease;
	    -ms-transition: box-shadow 200ms ease;
	        transition: box-shadow 200ms ease;
}

#searchbox.has-text-toggle input[type="text"] {
	margin-right: 0;
}

#searchbox input[type="text"]:focus {
	outline: none;
	color: #ebf2f4;
	box-shadow: inset 0 0 0 4px #4ebde9;
}

#searchbox-toggle {
	display: block;
	width: 32px;
	height: 32px;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	z-index: 1;
}

#searchbox-toggle canvas {
	width: 28px;
	height: 28px;
	position: absolute;
	top: 2px;
	left: 2px;
}

#searchbox-toggle.text-toggle {
	width: auto;
	line-height: 32px;
	padding-right: 10px;
}

/* ===[ Small Header ]=== */

#page-header,
#page-header #logo,
#page-header #logo img,
#page-header #logo h1 span,
#page-header #main-navigation,
#page-header #main-navigation li,
#page-header #searchbox {
	-webkit-transition: all 100ms ease-in-out;
	   -moz-transition: all 100ms ease-in-out;
	     -o-transition: all 100ms ease-in-out;
	    -ms-transition: all 100ms ease-in-out;
	        transition: all 100ms ease-in-out;
}

#page-header.small { height: 100px }

#page-header.small:before { height: 60px }

#page-header.small #logo { bottom: 10px }

#page-header.small #main-navigation > ul > li,
#page-header.small #searchbox { padding-bottom: 20px }

/* ===[ Responsive Header and Asides ]=== */

.aside-nav-btn,
.page-aside { display: none }

@media screen and (max-width: 60em) {
	#page { padding-top: 100px }

	#fixed-content { position: absolute }

	#page-header { height: 100px }

	#page-header #logo {
		width: 100%;
		bottom: 10px;
		text-align: center;
	}

	#main-navigation,
	#searchbox { display: none }

	.aside-nav-btn {
		display: block;
		width: 32px;
		height: 32px;
		position: absolute;
		bottom: 20px;
	}

	.aside-nav-btn canvas { position: absolute }

	#left-aside-open-btn { left: 0 }

	#left-aside-open-btn canvas {
		width: 30px;
		height: 23px;
		margin: 5px 0 0 1px;
	}

	#right-aside-open-btn canvas {
		width: 24px;
		height: 24px;
		margin: 4px;
	}

	#right-aside-open-btn { right: 0 }

	#right-aside-open-btn:hover canvas {
		-webkit-transform: rotate(90deg);
		   -moz-transform: rotate(90deg);
		     -o-transform: rotate(90deg);
		    -ms-transform: rotate(90deg);
		        transform: rotate(90deg);
		-webkit-transition: -webkit-transform 200ms ease;
		   -moz-transition: -moz-transform 200ms ease;
		     -o-transition: -o-transform 200ms ease;
		    -ms-transition: -ms-transform 200ms ease;
		        transition: transform 200ms ease;
	}

	.js-aside-left #page { left: 70% }
	.js-aside-right #page { right: 70% }

	.no-js .page-aside { display: none }

	.js .page-aside {
		display: block;
		width: 70%;
		height: 100%;
		position: absolute;
		top: 0;
		background-color: #2c2f30;
	}

	.js #aside-left { left: -70% }
	.js #aside-right { right: -70% }

	.page-aside:after {
		display: block;
		width: 40px;
		height: 100%;
		position: absolute;
		top: 0;
		bottom: 0;
		content: "";
		pointer-events: none;
		z-index: 2;
	}

	#aside-left:after {
		right: 0;
		background-image: -webkit-gradient(linear, left center, right center, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.1)));
		background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
	}

	#aside-right:after {
		left: 0;
		background-image: -webkit-gradient(linear, right center, left center, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.1)));
		background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: -ms-linear-gradient(right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
		background-image: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
	}

	.page-aside { position: relative }

	.page-aside .aside-top {
		height: 100px;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		background-color: rgba(0, 0, 0, 0.15);
	}

	.page-aside .aside-close-btn {
		display: block;
		width: 32px;
		height: 32px;
		position: absolute;
		bottom: 0;
		margin: 20px;
		padding: 5px;
		opacity: 0.4;
	}

	.page-aside .aside-close-btn:hover { opacity: 1 }

	#aside-left .aside-close-btn { left: 0 }
	#aside-right .aside-close-btn { right: 0 }

	.page-aside .aside-close-btn canvas {
		width: 32px;
		height: 32px;
	}

	.page-aside .widget-area-wrap {
		position: relative;
		margin-top: 100px;
		background-color: #2c2f30;
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
	}

	.page-aside .widget { clear: both }

	#aside-left .widget { float: right }
	#aside-right .widget { float: left }

	.csstransforms3d.csstransitions.js #aside-left {
		left: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		   -moz-transform: translate3d(-100%, 0, 0);
		    -ms-transform: translate3d(-100%, 0, 0);
		     -o-transform: translate3d(-100%, 0, 0);
		        transform: translate3d(-100%, 0, 0);
		-webkit-backface-visibility: hidden;
		   -moz-backface-visibility: hidden;
		    -ms-backface-visibility: hidden;
		     -o-backface-visibility: hidden;
		        backface-visibility: hidden;
	}

	.csstransforms3d.csstransitions.js #aside-right {
		right: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		   -moz-transform: translate3d(100%, 0, 0);
		    -ms-transform: translate3d(100%, 0, 0);
		     -o-transform: translate3d(100%, 0, 0);
		        transform: translate3d(100%, 0, 0);
		-webkit-backface-visibility: hidden;
		   -moz-backface-visibility: hidden;
		    -ms-backface-visibility: hidden;
		     -o-backface-visibility: hidden;
		        backface-visibility: hidden;
	}

	.csstransforms3d.csstransitions.js #page {
		left: 0 !important;
		-webkit-transform: translate3d(0, 0, 0);
		   -moz-transform: translate3d(0, 0, 0);
		    -ms-transform: translate3d(0, 0, 0);
		     -o-transform: translate3d(0, 0, 0);
		        transform: translate3d(0, 0, 0);
		-webkit-transition: -webkit-transform 500ms ease;
		   -moz-transition:    -moz-transform 500ms ease;
		     -o-transition:      -o-transform 500ms ease;
		        transition:         transform 500ms ease;
		-webkit-backface-visibility: hidden;
		   -moz-backface-visibility: hidden;
		    -ms-backface-visibility: hidden;
		     -o-backface-visibility: hidden;
		        backface-visibility: hidden;
	}

	.csstransforms3d.csstransitions.js-aside-left #page {
		-webkit-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
		   -moz-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
		    -ms-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
		     -o-transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
		        transform: translate3d(70%, 0, 0) scale3d(1, 1, 1);
	}

	.csstransforms3d.csstransitions.js-aside-right #page {
		-webkit-transform: translate3d(-70%, 0, 0) scale3d(1, 1, 1);
		   -moz-transform: translate3d(-70%, 0, 0) scale3d(1, 1, 1);
		    -ms-transform: translate3d(-70%, 0, 0) scale3d(1, 1, 1);
		     -o-transform: translate3d(-70%, 0, 0) scale3d(1, 1, 1);
		        transform: translate3d(-70%, 0, 0) scale3d(1, 1, 1);
	}
}

@media screen and (max-width: 60em) {
	#page-header #logo .image-logo {
		max-width: 16em;
	}
}

@media screen and (max-width: 30em) {
	#page-header #logo .image-logo {
		max-width: 12em;
	}
}

/* ==================================================================
   @group Slider
   ================================================================== */

#banner-slider { border-bottom: 5px solid #4ebde9 }

.slider {
	position: relative;
	visibility: hidden;
	overflow: hidden;
	padding-bottom: 1px;
}

.swipe-wrap {
	position: relative;
	overflow: hidden;
}

.swipe-wrap > div {
	width: 100%;
	position: relative;
	float: left;
}

.slider img {
	display: block;
	width: 100%;
	height: auto;
}

.slider .direction-nav {
	position: absolute;
	left: 0;
	bottom: 1px;
	-webkit-transform: translate3d(0, 0, 0);
}

.slider .direction-nav a {
	display: block;
	width: 60px;
	height: 60px;
	position: relative;
	float: left;
	margin-right: 1px;
	background-color: #4ebde9;
	cursor: pointer;
}

.slider .direction-nav canvas {
	width: 27px;
	height: 39px;
	position: absolute;
	left: 50%;
	top: 50%;
}

.slider .direction-nav .prev canvas { margin: -20px 0 0 -15px }
.slider .direction-nav .next canvas { margin: -20px 0 0 -13px }

.slider .direction-nav a:hover {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	filter: alpha(opacity=70);
	opacity: 0.9;
}

.slider .control-nav {
	position: absolute;
	top: 0;
	right: 0;
	padding: 20px;
}

.slider .control-nav ul {
	margin: 0;
	padding: 0;
}

.slider .control-nav li {
	display: inline-block;
	list-style: none;
	vertical-align: top;
}

.slider .control-nav a {
	display: block;
	width: 24px;
	height: 12px;
	margin-left: 6px;
	text-indent: 100%;
	overflow: hidden;
	background-color: #4ebde9;
	cursor: pointer;
	white-space: nowrap;
}

.slider .control-nav a:hover { background-color: white }

.slider .control-nav .active a {
	background-color: #494e50;
	cursor: default;
	pointer-events: none;
}

.slider .caption {
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 24px;
	font-style: italic;
	font-weight: 300;
	line-height: 1.2;
	padding: 0.35em 1.2em 0.35em .7em;
	color: #ebf2f4;
	background-color: #4ebde9;
}

@media screen and (min-width: 48em) { 
	.slider .caption { font-size: 30px }
}

@media screen and (min-width: 60em) { 
	.slider .caption { font-size: 36px }
}

@media screen and (min-width: 80em) { 
	.slider .caption { font-size: 48px }
}

@media screen and (max-width: 30em) { 
	.slider .direction-nav { display: none }
	.slider .caption { display: none }
	.slider .caption { position: relative; font-size: 18px; }
	.slider .control-nav { padding: 10px }
}

/* ==================================================================
   @group Hero
   ================================================================== */

#page-hero,
#call-to-action { }

#page-hero {
	font-size: 36px;
	font-weight: 300;
	line-height: 1.1;
	padding: 0.3333em 0;
	color: #ebf2f4;
}

#call-to-action {
	position: relative;
	font-size: 24px;
	font-weight: 300;
	line-height: 1.1;
	padding: 0.6666em 0.8333em;
	color: #383c3e;
	background-color: #9aba3b;
	border-left: 5px solid #819b31;
}

#call-to-action:after {
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	right: 0;
	bottom: 0;
	border-style: solid;
	border-width: 30px 30px 0 0;
	border-color: #819b31 #3a3e40 transparent transparent;
	content: "";
}

#page-hero p,
#call-to-action p {
	margin: -0.1em 0 0.1em;
	font-size: inherit;
	line-height: inherit;
}

#page-hero strong,
#call-to-action strong { font-weight: 600 }

#page-hero a,
#call-to-action a {
	border-bottom-style: solid;
	border-bottom-width: 1px;
}

#page-hero a:link,
#page-hero a:visited {
	display: inline-block;
	line-height: 0.9;
	color: #4ebde9;
	border-bottom-color: #4ebde9;
}

#page-hero a:hover,
#page-hero a:focus,
#page-hero a:active {
	color: white;
	border-bottom-color: white;
}

#call-to-action a:link,
#call-to-action a:visited {
	display: inline-block;
	line-height: 0.9;
	color: white;
	border-bottom-color: white;
}

#call-to-action a:hover,
#call-to-action a:focus,
#call-to-action a:active {
	color: #383c3e;
	border-bottom-color: #383c3e;
}

@media screen and (min-width: 48em) { 
	#page-hero { font-size: 48px }
	#call-to-action { font-size: 36px }
	#page-hero a,
	#call-to-action a { border-bottom-width: 2px }
	#call-to-action:after { border-width: 40px 40px 0 0 }
}

@media screen and (min-width: 60em) { 
	#page-hero { font-size: 60px }
	#call-to-action { font-size: 48px }
}

@media screen and (min-width: 80em) { 
	#page-hero { font-size: 72px }
	#call-to-action { font-size: 60px }
}

/* ==================================================================
   @group Portfolio Filter
   ================================================================== */

#portfolio-filter {
	min-height: 60px;
	position: relative;
	visibility: hidden;
	z-index: 2;
}

.cd-dropdown,
.cd-dropdown *,
.cd-dropdown *:after,
.cd-dropdown *:before {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.cd-dropdown,
.cd-select {
	display: block;
	max-width: 320px;
	position: relative;
	margin: 0;
}

.cd-dropdown > span {
	display: block;
	width: 100%;
	height: 60px;
	position: relative;
	padding: 0 50px 0 30px;
	font-size: 24px;
	font-weight: 300;
	line-height: 60px;
	color: #b9bfc0;
	background: #52585b;
	text-transform: capitalize;
	cursor: pointer;
}

.cd-dropdown > span:after {
	width: 60px;
	height: 60px;
	position: absolute;
	top: 0;
	right: 0;
	font-size: 12px;
	line-height: 60px;
	text-align: center;
	color: rgba(0, 0, 0, 0.4);
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
	box-shadow: -1px 0 0 0 rgba(0, 0, 0, 0.1);
	content: '\25BC';
}

.cd-dropdown.cd-active > span:after { content: '\25B2' }

.cd-dropdown ul {
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.cd-dropdown ul li { display: block }

.cd-dropdown ul li span {
	display: block;
	width: 100%;
	padding: 0 30px;
	font-weight: 300;
	line-height: 60px;
	color: #b9bfc0;
	background: #4b5053;
	text-transform: capitalize;
	cursor: pointer;
}

.cd-dropdown > span,
.cd-dropdown ul li span {
	-webkit-backface-visibility: hidden;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
}

.cd-dropdown {
	-webkit-perspective: 800px;
	   -moz-perspective: 800px;
	     -o-perspective: 800px;
	    -ms-perspective: 800px;
	        perspective: 800px;
}

.cd-dropdown > span {
	-webkit-transform-style: preserve-3d;
	   -moz-transform-style: preserve-3d;
	     -o-transform-style: preserve-3d;
	    -ms-transform-style: preserve-3d;
	        transform-style: preserve-3d;
	-webkit-transform-origin: 50% 0%;
	   -moz-transform-origin: 50% 0%;
	     -o-transform-origin: 50% 0%;
	    -ms-transform-origin: 50% 0%;
	        transform-origin: 50% 0%;
	-webkit-transition: -webkit-transform 200ms;
	   -moz-transition: -moz-transform 200ms;
	     -o-transition: -o-transform 200ms;
	    -ms-transition: -ms-transform 200ms;
	        transition: transform 200ms;
}

.cd-dropdown > span:active {
	-webkit-transform: rotateX(60deg);
	   -moz-transform: rotateX(60deg);
	    -ms-transform: rotateX(60deg);
	     -o-transform: rotateX(60deg);
	        transform: rotateX(60deg);
}

.cd-dropdown > span,
.cd-dropdown ul li:nth-last-child(-n+3) span { box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) }

.cd-dropdown ul {
	width: 100%;
	position: absolute;
	top: 0px;
}

.cd-dropdown ul li {
	position: absolute;
	width: 100%;
	max-width: 100%;
}

.cd-active.cd-dropdown > span { color: #b9bfc0 }

.cd-active.cd-dropdown > span,
.cd-active.cd-dropdown ul li span { box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) }

.cd-active.cd-dropdown ul li span {
	-webkit-transition: all 200ms ease;
	   -moz-transition: all 200ms ease;
	    -ms-transition: all 200ms ease;
	     -o-transition: all 200ms ease;
	        transition: all 200ms ease;
}

.cd-active.cd-dropdown ul li span:hover {
	color: white;
	background: #52585b;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 1px 2px rgba(0, 0, 0, 0.1);
	-webkit-transition-duration: 50ms;
	   -moz-transition-duration: 50ms;
	    -ms-transition-duration: 50ms;
	     -o-transition-duration: 50ms;
	        transition-duration: 50ms;
}

/* ==================================================================
   @group Portfolio Grid
   ================================================================== */

#content-area { position: relative }
#ajax-content { position: relative }

#ajax-buttons {
	position: absolute;
	display: none;
	width: 100%;
	min-height: 60px;
	top: -60px;
}

#ajax-prev-button,
#ajax-next-button,
#ajax-close-button {
	height: 60px;
	z-index: 3;
}

#ajax-prev-button,
#ajax-next-button {
	width: 60px;
	float: left;
}

#ajax-close-button {
	position: absolute;
	width: 60px;
	right: 0;
}

#ajax-prev-button a,
#ajax-next-button a,
#ajax-close-button a {
	display: block;
	height: 60px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	opacity: 0.5;
}

#ajax-prev-button a,
#ajax-next-button a { width: 60px; }
#ajax-close-button a { width: 60px; }

#ajax-prev-button a:hover,
#ajax-next-button a:hover,
#ajax-close-button a:hover {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

#ajax-prev-button canvas,
#ajax-next-button canvas {
	width: 18px;
	height: 32px;
	margin: 14px 21px;
}

#ajax-close-button canvas {
	width: 32px;
	height: 32px;
	margin: 14px;
}

#ajax-buttons .disabled a {
	cursor: default;
	opacity: 0.2;
}

#portfolio-grid {
	position: relative;
	background-color: #35393b;
	border: 1px solid #3f4346;
}

#portfolio-grid .post {
	position: relative;
	float: left;
	overflow: hidden;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#portfolio-grid .post {
	-webkit-transition: opacity 600ms ease-in-out;
	   -moz-transition: opacity 600ms ease-in-out;
	    -ms-transition: opacity 600ms ease-in-out;
	     -o-transition: opacity 600ms ease-in-out;
	        transition: opacity 600ms ease-in-out;
}

#portfolio-grid .post.loading { opacity: 0 }

.js #portfolio-grid.loading .post {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

#portfolio-grid .post-inner {
	position: relative;
	overflow: hidden;
}

#portfolio-grid .image-wrap {
	position: relative;
	padding-top: 100%;
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	        background-size: cover;
	-webkit-transform: scale(1.05);
	   -moz-transform: scale(1.05);
	    -ms-transform: scale(1.05);
	     -o-transform: scale(1.05);
	        transform: scale(1.05);
}

#portfolio-grid .type-photo img,
#portfolio-grid .type-photoset img,
#portfolio-grid .type-audio img,
#portfolio-grid .type-video img {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}

#portfolio-grid .read_more_container {
	display: none;
}

/* ===[ Portfolio Block Sizes ]=== */

#portfolio-grid .post { width: 100% }

@media screen and (min-width: 500px) { 
	#portfolio-grid .post { width: 50% }
}

@media screen and (min-width: 700px) { 
	#portfolio-grid .post { width: 33.3333% }
}

@media screen and (min-width: 1000px) { 
	#portfolio-grid .post { width: 25% }
}

/* ==================================================================
   @group Overlays
   ================================================================== */

#portfolio-grid .image-wrap {
	opacity: 0.6;
}

#portfolio-grid .overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	color: #d0dfe7;
	background-color: #4ab4de;
	cursor: pointer;
}

#portfolio-grid .overlay a {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#portfolio-grid .post:hover .overlay { box-shadow: inset 0 0 0 5px #d0dfe7 }

#portfolio-grid .post:hover .image-wrap,
#portfolio-grid .post:hover .overlay {;
	opacity: 1;
}

#portfolio-grid a { color: #d0dfe7 }

#portfolio-grid .project-title,
#portfolio-grid .categories {
	position: relative;
	margin: 40px;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 48px;
	font-style: normal;
	font-weight: 600;
	line-height: 0.8;
	letter-spacing: -0.04125em;
	left: -0.0625em;
}

#portfolio-grid .project-title:after {
	display: block;
	width: 80px;
	height: 3px;
	position: absolute;
	left: 0.0625em;
	bottom: -23px;
	background-color: #d0dfe7;
	content: "";
}

#portfolio-grid .categories {
	position: absolute;
	left: 0;
	bottom: 0;
	font-size: 30px;
	font-weight: 400;
}

#portfolio-grid .categories span {
	display: inline-block;
	text-transform: capitalize;
}

#portfolio-grid .categories span:after {
	display: inline-block;
	margin-right: 0.2em;
	content: ', ';
}

#portfolio-grid .categories span:last-child:after { display: none }

#portfolio-grid .plus {
	display: block;
	width: 40px;
	height: 10px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -5px 0 0 -20px;
	opacity: 0;
	background-color: #d0dfe7;
}

#portfolio-grid .post:hover .plus {
	opacity: 1;
	-webkit-transform: rotate(90deg);
	   -moz-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	     -o-transform: rotate(90deg);
	        transform: rotate(90deg);
}

#portfolio-grid .plus:after {
	display: block;
	width: 10px;
	height: 40px;
	position: absolute;
	top: -15px;
	left: 15px;
	background-color: inherit;
	content: "";
}

/* ===[ Transitions ]=== */

#portfolio-grid .post,
#portfolio-grid .overlay { -webkit-transform: translate3d(0, 0, 0) }

#portfolio-grid .image-wrap,
#portfolio-grid .overlay {
	-webkit-transition: opacity 200ms ease, box-shadow 200ms ease;
	   -moz-transition: opacity 200ms ease, box-shadow 200ms ease;
	    -ms-transition: opacity 200ms ease, box-shadow 200ms ease;
	     -o-transition: opacity 200ms ease, box-shadow 200ms ease;
	        transition: opacity 200ms ease, box-shadow 200ms ease;
}

#portfolio-grid .post:hover .image-wrap,
#portfolio-grid .post:hover .overlay {
	-webkit-transition: opacity 50ms ease, box-shadow 200ms 50ms ease;
	   -moz-transition: opacity 50ms ease, box-shadow 200ms 50ms ease;
	    -ms-transition: opacity 50ms ease, box-shadow 200ms 50ms ease;
	     -o-transition: opacity 50ms ease, box-shadow 200ms 50ms ease;
	        transition: opacity 50ms ease, box-shadow 200ms 50ms ease;
}

#portfolio-grid .plus {
	-webkit-transition: -webkit-transform 0ms ease, opacity 200ms ease;
	   -moz-transition:    -moz-transform 0ms ease, opacity 200ms ease;
	    -ms-transition:     -ms-transform 0ms ease, opacity 200ms ease;
	     -o-transition:      -o-transform 0ms ease, opacity 200ms ease;
	        transition:         transform 0ms ease, opacity 200ms ease;
}

#portfolio-grid .post:hover .plus {
	-webkit-transition-duration: 200ms;
	   -moz-transition-duration: 200ms;
	    -ms-transition-duration: 200ms;
	     -o-transition-duration: 200ms;
	        transition-duration: 200ms;
}

/* ===[ Block Content Sizes ]=== */

#portfolio-grid .content-huge .project-title { font-size: 72px }

#portfolio-grid .content-huge .categories { font-size: 36px }

#portfolio-grid .content-large .project-title { font-size: 60px }

#portfolio-grid .content-large .categories { font-size: 36px }

#portfolio-grid .content-medium .project-title {
	margin: 30px;
	font-size: 42px;
}

#portfolio-grid .content-medium .categories {
	margin: 30px;
	font-size: 30px;
}

#portfolio-grid .content-small .project-title {
	margin: 20px;
	font-size: 24px;
}

#portfolio-grid .content-small .project-title:after { display: none }

#portfolio-grid .content-small .categories {
	margin: 20px;
	font-size: 18px;
}

#portfolio-grid .content-tiny .project-title { display: none }

#portfolio-grid .content-tiny .project-title:after { display: none }

#portfolio-grid .content-tiny .categories { display: none }


/* ==================================================================
   @group Grid Text Based Posts
   ================================================================== */

#portfolio-grid .reading-pane {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	padding: 40px;
	color: #eee4dd;
	background-color: #f60;
}

#portfolio-grid .reading-pane .read-more-panel {
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 10px 40px 40px;
	background-color: #f60;
}

#portfolio-grid .reading-pane .read-more-panel:after {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: -100%;
	left: 0;
	background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(255, 102, 0, 0)), color-stop(100%, rgba(255, 102, 0, 1)));
	background-image: -webkit-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: -moz-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: -ms-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: -o-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: linear-gradient(to bottom, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	pointer-events: none;
	content: "";
}

#portfolio-grid .reading-pane h1,
#portfolio-grid .reading-pane h2,
#portfolio-grid .reading-pane h3,
#portfolio-grid .reading-pane h4,
#portfolio-grid .reading-pane h5,
#portfolio-grid .reading-pane h6 {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.2;
	margin-bottom: 1.5em;
	color: #ffd4b8;
}

#portfolio-grid .reading-pane blockquote { border-color: #ffd4b8 }

#portfolio-grid .reading-pane a:link,
#portfolio-grid .reading-pane a:visited {
	color: #ffede0;
	border-bottom: 1px dotted #ffede0;
}

#portfolio-grid .reading-pane a:hover,
#portfolio-grid .reading-pane a:focus,
#portfolio-grid .reading-pane a:active {
	color: #fff;
	border-bottom: 1px solid #fff;
}

#portfolio-grid .chat { padding: 0 }

#portfolio-grid .chat li {
	display: block;
	list-style-type: none;
}

#portfolio-grid .chat li span {
	display: inline-block;
	min-width: 15%;
	font-style: italic;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	filter: alpha(opacity=70);
	opacity: 0.7;
}

#portfolio-grid .content-medium .reading-pane { padding: 30px }

#portfolio-grid .content-medium .reading-pane .read-more-panel { padding: 30px }

#portfolio-grid .content-small .reading-pane { padding: 20px }

#portfolio-grid .content-small .reading-pane .read-more-panel { padding: 20px }

#portfolio-grid .content-tiny .reading-pane { padding: 20px }

#portfolio-grid .content-tiny .reading-pane .read-more-panel { padding: 20px }

/* ==================================================================
   @group Post Permalinks
   ================================================================== */

.post-detail * {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.post-detail.type-text,
.post-detail.type-quote,
.post-detail.type-link,
.post-detail.type-chat { max-width: 60em }

.post-detail.type-quote blockquote span {
	font-size: 2em;
	line-height: 1.2;
}

.post-detail.type-quote blockquote.long span { font-size: 1.5em }

.post-detail .chat { padding: 0 }

.post-detail .chat li {
	display: block;
	list-style-type: none;
}

.post-detail .chat li span {
	display: inline-block;
	min-width: 15%;
	font-weight: 400;
}

.post-media img {
	width: 100%;
	height: auto;
}

.post-detail.top_media .post-media,
.post-detail.top_media .post-content {
	width: 100%;
	clear: both;
	margin-bottom: 0;
}

.post-detail.left_media .post-media,
.post-detail.left_media .post-content {
	width: 100%;
	float: left;
}

.post-detail.right_media .post-media,
.post-detail.right_media .post-content {
	width: 100%;
	float: right;
}

.post-detail .description,
.post-detail .categories {
	font-size: 16px;
	font-weight: 300;
}

.post-detail .description a:link,
.post-detail .description a:visited { border-bottom: 1px dotted #4ebde9 }

.post-detail .description a:hover,
.post-detail .description a:focus,
.post-detail .description a:active { border-bottom: 1px solid #ebf2f4 }

.post-detail .project-title {
	position: relative;
	margin-bottom: 30px;
	padding-bottom: 30px;
	line-height: 1;
}

.post-detail .project-title a { border: none !important }

.post-detail .project-title:after {
	display: block;
	width: 80px;
	height: 2px;
	position: absolute;
	left: 0.0625em;
	bottom: 0;
	background-color: #898f94;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	opacity: 0.5;
	content: "";
}

.post-detail .description p:empty { display: none }

.post-detail .categories h4 {
	position: relative;
	font-size: 21px;
	font-weight: 300;
	line-height: 1.2;
	margin-bottom: 20px;
	padding-bottom: 20px;
	color: #898f94;
}

.post-detail .categories h4:after {
	display: block;
	width: 80px;
	height: 1px;
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: #6b7076;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	opacity: 0.5;
	content: "";
}

.post-detail .categories .tags { padding: 0 }

.post-detail .categories .tags li {
	display: inline-block;
	list-style-type: none;
}

.post-detail .categories .tags li:after {
	display: inline-block;
	margin-right: 0.2em;
	content: ', ';
}

.post-detail .categories .tags li:last-child:after { display: none }

.post-detail .categories .tags a {
	border: none !important;
	text-transform: capitalize;
}

.post-detail .btn-wrap {
	clear: both;
	margin-top: 50px;
}

.is-permalink-page #permalink { display: none }

.post-detail .spacer {
	float: none;
	clear: both;
	padding-top: 50px;
	margin-bottom: 50px;
}

.stacked-photoset img { margin-bottom: 20px }

/* ===[ Share Icons ]=== */

.post-detail .share-box {
	padding-top: 80px;
	clear: both;
}

.post-detail .categories .share-box,
.post-detail .categories .share-box p { font-size: 14px }

.post-detail .categories .share-box strong {
	font-size: 18px;
	font-weight: 400;
}

.post-detail .share-links {
	margin-bottom: 10px;
	padding: 0;
}

.post-detail .share-links li {
	display: inline-block;
	margin-right: 4px;
	list-style-type: none;
	vertical-align: top;
}

.post-detail .share-links li a {
	display: block;
	width: 30px;
	height: 30px;
	overflow: hidden;
	text-indent: 100%;
	background-image: url(http://static.tumblr.com/6nxvfxq/Drjmkwbu1/sharing-icons.png);
	background-repeat: no-repeat;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
	white-space: nowrap;
	opacity: 0.7;
}

.post-detail .share-links li a:hover { opacity: 1 }

.post-detail .share-links .facebook   { background-position: 0 0 }
.post-detail .share-links .twitter    { background-position: -30px 0 }
.post-detail .share-links .googleplus { background-position: -60px 0 }
.post-detail .share-links .pinterest  { background-position: -90px 0 }
.post-detail .share-links .reblog     { background-position: -120px 0 }

.post-detail .share-box .short-link span,
.post-detail .share-box .short-link input {
	display: inline-block;
	position: relative;
}

.post-detail .share-box .short-link input {
	width: 180px;
	max-width: 100%;
	padding: 5px;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 14px;
	border: none;
	color: #898f94;
	color: rgba(137, 143, 148, 0.7);
	background-color: rgba(0, 0, 0, 0.1);
}

/* Like button */
.post-detail .share-links .like_button {
	width: 30px;
	height: 30px;
	overflow: hidden;
	padding: 5px;
	opacity: 0.7;
	background-color: #cd1828;
	-webkit-transition: all 200ms ease;
	   -moz-transition: all 200ms ease;
	    -ms-transition: all 200ms ease;
	     -o-transition: all 200ms ease;
	        transition: all 200ms ease;
}

.post-detail .share-links .like_button:hover {
	opacity: 1;
	-webkit-transition-duration: 50ms;
	   -moz-transition-duration: 50ms;
	    -ms-transition-duration: 50ms;
	     -o-transition-duration: 50ms;
	        transition-duration: 50ms;
}

.post-detail .share-links .like_button.liked {
	background-color: #444647;
}

.post-detail .share-links .like_button iframe {
	width: 20px;
	height: 20px;
	overflow: hidden;
	vertical-align: top;
}

/* ===[ Audio Players ]=== */

.audio-player-container {
	background-color: #e4e4e4;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	-webkit-transform: translate3d(0, 0, 0);
}

.audio-player-container .album-art,
.audio-player-container .audio-player {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.audio-player-container .album-art img { display: block }

.tumblr_audio_player {
	width: 99%;
	height: 90px;
}

.soundcloud_audio_player {
	width: 100% !important;
	height: 166px !important;
}

.spotify_audio_player {
	width: 320px !important;
	height: 400px !important;
}

@media screen and (min-width: 500px) { 
	.audio-player-container .album-art,
	.audio-player-container .audio-player {
		width: 50%;
		float: left;
	}
}

@media screen and (min-width: 1000px) { 
	.audio-player-container .album-art { width: 34% }
	.audio-player-container .audio-player { width: 66% }
}

@media screen and (min-width: 1400px) { 
	.audio-player-container .album-art { width: 25% }
	.audio-player-container .audio-player { width: 75% }
}

/* ===[ Notes ]=== */

.post-notes {
	position: relative;
	padding: 50px 0;
}

.post-notes:before {
	display: block;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	border-top: 1px solid #6b7076;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	opacity: 0.5;
	content: "";
}

.notes {
	max-width: 60em;
	margin: 0 auto;
	padding: 0;
	font-size: 16px;
	font-weight: 300;
}

.notes li {
	display: block;
	min-height: 30px;
	position: relative;
	padding-left: 40px;
	margin-bottom: 10px;
}

.notes .avatar_frame {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	border: none !important;
}

.notes .avatar {
	display: block;
	width: 30px;
	height: auto;
}

.notes blockquote {
	display: inline-block;
	margin: 0.8em 0;
	padding: 0.2em 0.8em;
	background-color: rgba(0, 0, 0, 0.1);
	border: none;
}

.notes blockquote a {
	color: #898f94;
	color: rgba(137, 143, 148, 1);
	border: none !important;
}

.notes blockquote a:hover { color: #898f94 }

#disqus_thread {
	max-width: 60em;
	margin: 50px auto;
}

/* ===[ Permalink Pagination ]=== */
#permalink-pagination a { margin-right: 10px; }
.is-index-page #permalink-pagination { display: none; }

/* ===[ Responsive Permalinks ]=== */
@media screen and (min-width: 700px) { 
	.post-detail .categories h4 { font-size: 24px }
}

@media screen and (min-width: 800px) { 
	.post-detail.left_media .post-media,
	.post-detail.right_media .post-media { width: 64% }

	.post-detail.left_media .post-content,
	.post-detail.right_media .post-content {
		width: 36%;
		margin-top: 0;
		padding: 0 0 0 50px;
	}

	.post-detail.right_media .post-content { padding: 0 50px 0 0 }
}

@media screen and (min-width: 1200px) { 
	.post-detail .description,
	.post-detail .categories { font-size: 18px }

	.post-detail.top_media .description,
	.post-detail.top_media .post-notes {
		width: 64%;
		float: left;
	}

	.post-detail.top_media .categories {
		width: 36%;
		float: left;
		margin-top: 0;
		padding-left: 50px;
	}

	.post-detail .categories h4 { font-size: 27px }

	.post-detail.top_media .categories h4:after { width: 100% }

	.post-detail .categories .tags { font-size: 21px }
}

/* ==================================================================
   @group Widgets and Asides
   ================================================================== */

.widget {
	-webkit-transform: translate3d(0, 0, 0);
	   -moz-transform: translate3d(0, 0, 0);
	    -ms-transform: translate3d(0, 0, 0);
	     -o-transform: translate3d(0, 0, 0);
	        transform: translate3d(0, 0, 0);
}

.widget,
.widget * {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

/* ===[ Top Widgets ]=== */

#top-widget-area .widget {
	width: 320px;
	position: relative;
	float: left;
	margin: 40px 0 20px;
	padding-right: 40px;
}

#top-widget-area .widget-content {
	width: 280px;
	height: 210px;
	overflow: hidden;
}

.widget .widget-title {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.widget .widget-title h4 {
	margin: 0;
	padding: 0.30em 1.2em 0.4em .6em;
	font-size: 16px;
	font-style: normal;
	font-weight: 400 !important;
	color: #deeaed;
	background-color: #2c2f30;
}

.widget .widget-content {
	display: block;
	position: relative;
	z-index: 1;
}

/* ===[ Right Widgets ]=== */

#aside-right .widget {
	clear: both;
	width: 100%;
	max-width: 320px;
	margin-bottom: 30px;
}

#aside-right .widget-inner {
	position: relative;
	height: 0;
	padding-top: 75%;
}

#aside-right .widget-content {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

/* ===[ Widget Cyclers ]=== */

.widget .direction-nav {
	position: absolute;
	left: 0;
	bottom: 0;
	margin: 1px;
	z-index: 99;
}

.widget .direction-nav a {
	display: block;
	width: 30px;
	height: 30px;
	position: relative;
	float: left;
	margin-right: 1px;
	background-color: #2e2e2e;
	background-color: rgba(46, 46, 46, 0.8);
	border: none !important;
}

.widget .direction-nav a canvas {
	width: 14px;
	height: 20px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -9px 0 0 -7px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	filter: alpha(opacity=70);
	opacity: 0.7;
	-webkit-transition: opacity 200ms ease;
	   -moz-transition: opacity 200ms ease;
	    -ms-transition: opacity 200ms ease;
	     -o-transition: opacity 200ms ease;
	        transition: opacity 200ms ease;
}

.widget .direction-nav a:hover canvas {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
	-webkit-transition-duration: 50ms;
	   -moz-transition-duration: 50ms;
	    -ms-transition-duration: 50ms;
	     -o-transition-duration: 50ms;
	        transition-duration: 50ms;
}

.widget .direction-nav .prev canvas { margin-left: -8px }

.widget .direction-nav .next canvas { margin-left: -6px }

/* ===[ Twitter and Text Widget ]=== */

.widget-text .widget-content {
	padding: 20px;
	font-size: 13px;
	line-height: 1.4;
	color: #eee4dd;
	background-color: #f60;
}

.widget-text .widget-content p,
.widget-text .widget-content ul,
.widget-text .widget-content li {
	font-size: inherit;
	line-height: inherit;
}

.widget-text .widget-content:after {
	display: block;
	width: 100%;
	height: 20%;
	position: absolute;
	bottom: 0;
	left: 0;
	background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(255, 102, 0, 0)), color-stop(100%, rgba(255, 102, 0, 1)));
	background-image: -webkit-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: -moz-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: -ms-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: -o-linear-gradient(top, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	background-image: linear-gradient(to bottom, rgba(255, 102, 0, 0) 0%, rgba(255, 102, 0, 1) 100%);
	pointer-events: none;
	content: "";
}

.widget-text .widget-content h1,
.widget-text .widget-content h2,
.widget-text .widget-content h3,
.widget-text .widget-content h4,
.widget-text .widget-content h5,
.widget-text .widget-content h6 {
	font-size: 18px;
	line-height: 1.1666;
	margin-bottom: 0.5em;
	color: #ffd4b8;
}

.widget-text .widget-content a:link,
.widget-text .widget-content a:visited {
	color: #ffede0;
	border-bottom: 1px dotted #ffede0;
}

.widget-text .widget-content a:hover,
.widget-text .widget-content a:focus,
.widget-text .widget-content a:active {
	color: #fff;
	border-bottom: 1px solid #fff;
}

.widget-text .widget-content .label {
	display: inline-block;
	margin-right: 0.5em;
	color: #ffd4b8;
}

.widget-twitter .tweet-text,
.widget-twitter .tweet-time {
	display: block;
	clear: both;
	margin-bottom: 0.5em;
}

.widget-twitter .tweet-time {
	font-size: 90%;
	font-style: italic;
	font-weight: 600;
}

.widget-twitter .tweet-time:before {
	margin-right: 0.2em;
	content: '\2014';
}

.widget-twitter .twitter-bird {
	width: 48px;
	height: 40px;
	position: absolute;
	right: 20px;
	bottom: 20px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
	filter: alpha(opacity=40);
	opacity: 0.4;
	z-index: 3;
}

@media screen and (min-width: 30em) { 
	.widget-text .widget-content { font-size: 15px }
	.widget-text .widget-content h1,
	.widget-text .widget-content h2,
	.widget-text .widget-content h3,
	.widget-text .widget-content h4,
	.widget-text .widget-content h5,
	.widget-text .widget-content h6 { margin-bottom: 1.1666em }
}

/* ===[ Image Feeds ]=== */

.widget .image-feed {
	height: 100%;
	overflow: hidden;
}

.widget .image-feed li,
.widget .image-feed a {
	display: block;
	width: 100% !important;
	position: relative;
}

.widget .image-feed li {
	-webkit-transform: scale(1.05);
	   -moz-transform: scale(1.05);
	    -ms-transform: scale(1.05);
	     -o-transform: scale(1.05);
	        transform: scale(1.05);
}

.widget .instagram-feed li { margin-top: -12.5% }

.widget .image-feed img {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
}

/* ===[ Scrollbar ]=== */

.mCustomScrollBox .mCSB_scrollTools .mCSB_draggerRail {
	height: 6px;
	margin: 5px auto;
	background-color: #000;
	background-color: rgba(0, 0, 0, 0.25);
	filter: "alpha(opacity=30)";
	ms-filter: "alpha(opacity=30)";
}

.mCustomScrollBox .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	height: 6px;
	margin: 5px auto;
	background-color: #6b7076;
}

.mCustomScrollBox .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #4ebde9 }

.mCustomScrollBox .mCSB_scrollTools,
.mCustomScrollBox .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	-webkit-transition: all 200ms ease;
	   -moz-transition: all 200ms ease;
	    -ms-transition: all 200ms ease;
	     -o-transition: all 200ms ease;
	        transition: all 200ms ease;
}

.mCustomScrollBox .mCSB_scrollTools:hover,
.mCustomScrollBox .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	-webkit-transition-duration: 50ms;
	   -moz-transition-duration: 50ms;
	    -ms-transition-duration: 50ms;
	     -o-transition-duration: 50ms;
	        transition-duration: 50ms;
}

/* ===[ Aside Areas Widgets ]=== */

.page-aside .widget { width: 100% }

.widget ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

/* ===[ Navigation Widget ]=== */

.widget-navi li { display: block }

.widget-navi li ul { }

.widget-navi li ul li:last-child { border: none }

.widget-navi a {
	display: block;
	font-size: 16px;
	line-height: 20px;
	padding: 1em 1.5em;
	text-transform: capitalize;
}

.widget-navi li ul a { padding-left: 3em }

.widget-navi a:link,
.widget-navi a:visited {
	color: #6b7076;
	background-color: transparent;
	background-position: 0 -60px;
	background-repeat: no-repeat;
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.widget-navi a:hover,
.widget-navi a:focus,
.widget-navi a:active {
	color: #848a90;
	background-color: #222425;
	background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(230, 230, 230, 0.03)), color-stop(100%, rgba(230, 230, 230, 0)));
	background-image: -webkit-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -moz-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -ms-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: -o-linear-gradient(top, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-image: linear-gradient(to bottom, rgba(230, 230, 230, 0.03) 0%, rgba(230, 230, 230, 0) 80%);
	background-position: 0;
	box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.2);
}

/* ===[ Search Widget ]=== */

.widget-search form { margin: 1.5em }

.widget-search input[type="text"] {
	width: 100%;
	max-width: 300px;
	height: 40px;
	margin-right: 40px;
	padding: 0 15px;
	font-family: 'Source Sans Pro', sans-serif;
	border: none;
	color: #65707b;
	background-color: #292b2e;
	background-repeat: no-repeat;
	background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0%, rgba(0, 0, 0, 0.05)), color-stop(100%, rgba(0, 0, 0, 0)));
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 80%);
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 80%);
	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 80%);
	background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 80%);
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 80%);
	box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.15), 0 1px 0 rgba(230, 230, 230, 0.05);
	border-radius: 99em;
	-webkit-transition: box-shadow 200ms ease;
	   -moz-transition: box-shadow 200ms ease;
	    -ms-transition: box-shadow 200ms ease;
	     -o-transition: box-shadow 200ms ease;
	        transition: box-shadow 200ms ease;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.widget-search input[type="text"]:focus {
	outline: none;
	color: #ebf2f4;
	box-shadow: inset 0 0 0 4px #4ebde9;
}

/* ==================================================================
   @group Pagination
   ================================================================== */

#pagination {
	min-height: 60px;
	margin-bottom: 120px;
}

#pagination a { margin-right: 10px }

@media screen and (max-width: 500px) { 
	#pagination a {
		width: 100%;
		margin: 0;
		text-align: center;
	}

	#pagination a span { font-size: 90% }
}

/* ==================================================================
   @group Footer
   ================================================================== */

#page-footer { padding: 50px 0 }

#page-footer #credits,
#page-footer #social {
	position: relative;
	padding-top: 30px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#credits p {
	line-height: 1.5;
	margin: 0;
}

#social ul {
	margin: 0;
	padding: 0;
}

#social li {
	display: inline-block;
	list-style-type: none;
}

#social a {
	display: block;
	width: 40px;
	height: 40px;
	margin: 0 5px 5px 0;
	padding: 8px 0;
	font-size: 20px;
	line-height: 1;
	text-align: center;
	background: transparent;
	vertical-align: bottom;
	color: #6b7076;
	border: 2px solid #6b7076;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#social a:hover {
	border-width: 5px;
	padding: 5px 0;
}

#social .behance     a:hover { color: #2b9ad2; border-color: #2b9ad2; }
#social .blogger     a:hover { color: #ff6500; border-color: #ff6500; }
#social .deviantart  a:hover { color: #536659; border-color: #536659; }
#social .dribbble    a:hover { color: #f973a4; border-color: #f973a4; }
#social .facebook    a:hover { color: #3b5a9b; border-color: #3b5a9b; }
#social .flickr      a:hover { color: #ff0084; border-color: #ff0084; }
#social .forrst      a:hover { color: #2f713d; border-color: #2f713d; }
#social .googleplus  a:hover { color: #f63d26; border-color: #f63d26; }
#social .instagram   a:hover { color: #507ea4; border-color: #507ea4; }
#social .lastfm      a:hover { color: #da0019; border-color: #da0019; }
#social .linkedin    a:hover { color: #0072b2; border-color: #0072b2; }
#social .paypal      a:hover { color: #165c82; border-color: #165c82; }
#social .picasa      a:hover { color: #8a65a3; border-color: #8a65a3; }
#social .pinterest   a:hover { color: #cb2027; border-color: #cb2027; }
#social .skype       a:hover { color: #00aaf1; border-color: #00aaf1; }
#social .soundcloud  a:hover { color: #ff6900; border-color: #ff6900; }
#social .stumbleupon a:hover { color: #eb4823; border-color: #eb4823; }
#social .twitter     a:hover { color: #2baae1; border-color: #2baae1; }
#social .vimeo       a:hover { color: #40b2dc; border-color: #40b2dc; }
#social .youtube     a:hover { color: #ff3330; border-color: #ff3330; }

@media screen and (min-width: 1000px) { 
	#page-footer #credits,
	#page-footer #social {
		width: 50%;
		float: left;
	}

	#page-footer #credits:after,
	#page-footer #social:after {
		display: block;
		width: 140px;
		height: 1px;
		position: absolute;
		top: 0;
		left: 0;
		background-color: #898f94;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
		filter: alpha(opacity=50);
		opacity: 0.5;
		content: "";
	}

	#page-footer #social:after {
		left: auto;
		right: 0;
	}

	#social { text-align: right }
}

/* ==================================================================
   @group High DPI images
   ================================================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 13/10), only screen and (min-resolution: 120dpi) { 
	.post-detail .share-links li a {
		background-image: url(http://static.tumblr.com/6nxvfxq/p8kmkwbuz/sharing-icons_2x.png);
		background-size: 150px 30px;
	}
}

/* ==================================================================
   @group Helper classes
   ================================================================== */

/* ===[ Hide webfonts while page is loading ]=== */

/* ===[  Hide from both screenreaders and browsers ]=== */
.hidden {
	display: none !important;
	visibility: hidden;
}

/* ===[  Hide only visually, but have it available for screenreaders ]=== */
.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/* ===[  Hide visually and from screenreaders, but maintain layout ]=== */
.invisible { visibility: hidden }

/* ===[ Clearfix: contain floats ]=== */
.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after { clear: both }
.clearfix { *zoom: 1   }

/* ==================================================================
   @group Print styles
   ================================================================== */

@media print { 
	* { background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important; }
	a, a:visited { text-decoration: underline }
	a[href]:after { content: " (" attr(href) ")" }
	abbr[title]:after { content: " (" attr(title) ")" }
	.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: "" }
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
	thead { display: table-header-group }
	tr, img { page-break-inside: avoid }
	img { max-width: 100% !important }
}