/* ---------------------------------------------------------------------- */
/*	Reset & Clearfix (http://meyerweb.com/eric/tools/css/reset/)
/* ---------------------------------------------------------------------- */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,input,textarea,select{background:transparent;border:0;font-size:100%;outline:0;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

/* Clearfix */
.clear{clear:both;display:block;height:0;overflow:hidden;visibility:hidden;width:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;height:0;line-height:0;visibility:hidden;width:0}* html .clearfix,:first-child+html .clearfix{zoom:1}

/* Some basic settings */
h1 { font-size: 45px; }
h2 { font-size: 24px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }
ol { list-style: decimal; }
ul { list-style: disc; }
li { margin-left: 25px; }
p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset,blockquote { margin-bottom: 10px; }
hr { background: #fff; clear: both; color: #fff; border: 0; height: 2px; margin: 0 0 40px; padding: 20px 0 0; }
/* Webkit Fix */ @media screen and (-webkit-min-device-pixel-ratio:0){hr {height: 1px;}}

/* ---------------------------------------------------------------------- */
/*	Custom Fonts
/* ---------------------------------------------------------------------- */

@font-face {
	font-family: 'HattoriHanzo';
	src: url('../fonts/Hattori_Hanzo-webfont.eot');
	src: url('../fonts/Hattori_Hanzo-webfont.eot?#iefix') format('embedded-opentype'),
	     url('../fonts/Hattori_Hanzo-webfont.woff') format('woff'),
	     url('../fonts/Hattori_Hanzo-webfont.ttf') format('truetype'),
	     url('../fonts/Hattori_Hanzo-webfont.svg#HattoriHanzoLight') format('svg');
}

/* ---------------------------------------------------------------------- */
/*	Basic Elements & Classes
/* ---------------------------------------------------------------------- */

body {
	background: #4c535c;
	color: #454545;
	font: 12px/1.7 'Helvetica Neue', Arial, Helvetica, sans-serif;
}

a {
	color: #2f6ab3;
	text-decoration: none;
}

a:hover {
	color: #2e4e69;
	text-decoration: underline;
}

h1, h2, h3 {
	font-family: 'HattoriHanzo', 'Helvetica Neue', Arial, Helvetica, sans-serif; 
	font-weight: 100;
	letter-spacing: -0.1px;
}

/* ---------------------------------------------------------------------- */
/*	Generic Classes
/* ---------------------------------------------------------------------- */

.hidden { display: none; }

.disabled { cursor: auto; }

.align-center { margin: 0 auto; text-align: center; }

.align-left { float: left; }

.align-right { float: right; }

/* ---------------------------------------------------------------------- */
/*	Wrap
/* ---------------------------------------------------------------------- */

#wrap {
	background: #fff;
	-webkit-box-shadow: 1px 1px 4px #283033;
	-moz-box-shadow:    1px 1px 4px #283033;
	box-shadow:         1px 1px 4px #283033;
	margin: 55px auto;
	position: relative;
}

	.container { width: 770px; }

	/* -------------------------------------------------- */
	/*	Header
	/* -------------------------------------------------- */

	header {
		border-bottom: 1px solid #ddd;
		position: relative;
		padding: 70px 35px 70px;
	}

	header:before {
		background: #eee;
		border: 1px solid #ddd;
		border-top: 0;
		content: '';
		display: block;
		height: 30px;
		left: 4.6%;
		margin: 0 auto;
		position: absolute;
		top: 0;
		width: 90.6%;
	}

	header:after {
		background: #f8f8f8;
		border-top: 1px solid #ddd;
		content: '';
		display: block;
		height: 15px;
		left: 0;
		position: absolute;
		bottom: 0;
		width: 100%;
	}

		header .avatar {
			border: 1px solid #ccc;
			display: inline-block;
			float: left;
			line-height: 0.8;
			margin: 0 20px 0 0;
			padding: 5px;
		}

		header h1 {
			color: #444;
			letter-spacing: -1px;
			margin: 0 0 -16px;
		}

		header h4 {
			color: #3279BB;
			font-weight: normal;
		}

		.social-links {
			float: right;
			list-style: none;
			margin: 10px 0 0;
		}

			.social-links li {
				background: url(../img/social-icons.png) no-repeat;
				float: left;
				margin: 0 0 0 5px;
				opacity: .8;
				-webkit-transition: opacity .25s ease;
				-moz-transition:    opacity .25s ease;
				-o-transition:      opacity .25s ease;
				-ms-transition:     opacity .25s ease;
				transition:         opacity .25s ease;
			}

				.social-links .email { background-position: 0 0; }
				.social-links .twitter { background-position: -32px 0; }
				.social-links .linkedin { background-position: -64px 0; }

				.social-links li:hover { opacity: 1; }

				.social-links a {
					display: block;
					height: 32px;
					text-indent: -9999px;
					width: 32px;
				}

	/* -------------------------------------------------- */
	/*	Content
	/* -------------------------------------------------- */

	#content {
		border-bottom: 1px solid #ddd;
		padding: 20px 35px 40px;
		position: relative;
	}

	#content:after {
		background: #f8f8f8;
		border-top: 1px solid #ddd;
		content: '';
		display: block;
		height: 15px;
		left: 0;
		position: absolute;
		bottom: 0;
		width: 100%;
	}

		#content .title {
			border-bottom: 1px solid #dbdee2;
			color: #2f6ab3;
			margin: 0 0 30px;
			text-transform: uppercase;
		}

		article { margin: 0 0 35px; }

			article .preview-image {
				border: 1px solid #e1e1e1;
				display: block;
				float: left;
				line-height: 0.8;
				overflow: hidden;
				position: relative;
				margin: 0 20px 10px 0;
			}

			article .preview-image:before {
				-webkit-box-shadow: inset 0 10px 0 #fff, inset -10px 0 0 #fff, inset 0 -10px 0 #fff, inset 10px 0 0 #fff;
				-moz-box-shadow:    inset 0 10px 0 #fff, inset -10px 0 0 #fff, inset 0 -10px 0 #fff, inset 10px 0 0 #fff;
				box-shadow:         inset 0 10px 0 #fff, inset -10px 0 0 #fff, inset 0 -10px 0 #fff, inset 10px 0 0 #fff;
				content: '';
				height: 100%;
				position: absolute;
				-webkit-transition: box-shadow .25s ease;
				-moz-transition:    box-shadow .25s ease;
				-o-transition:      box-shadow .25s ease;
				-ms-transition:     box-shadow .25s ease;
				transition:         box-shadow .25s ease;
				width: 100%;
			}

				article .preview-image:hover:before {
					-webkit-box-shadow: none;
					-moz-box-shadow:    none;
					box-shadow:         none;
				}

				article .preview-image img { border: 1px solid #fff; }

			article .info {
				float: right;
				width: 31.4%;
			}

				article h2 {
					line-height: 1.1;
					margin: 0 0 10px;
					padding: 15px 0 0;
				}

				article .read-more {
					background: #fdfdfd;
					border: 1px solid #e1e1e1;
					display: inline-block;
					padding: 5px 10px;
					text-decoration: none;
				}

	/* -------------------------------------------------- */
	/*	404 Not found
	/* -------------------------------------------------- */

	.not-found { background: #fff; }

		.not-found a {
			color: #454545;
			display: block;
			margin: -167px -183.5px 0 0;
			position: absolute;
			right: 50%;
			top: 50%;
			text-align: center;
		}

	/* -------------------------------------------------- */
	/*	Footer
	/* -------------------------------------------------- */

	footer {
		color: #666;
		padding: 29px 35px 19px;
	}

		footer a, footer a:hover {
			color: #666;
			text-decoration: none;
		}
	
/* ---------------------------------------------------------------------- */
/*	Media Queries
/* ---------------------------------------------------------------------- */

@media only screen and (min-width: 768px) and (max-width: 1024px) {

	.container { width: 700px; }

		article .preview-image img { width: 406px; }

		article .info { width: 31.7%; }
}

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

	.container {
		max-width: 530px;
		min-width: 300px;
		width: 91%;
	}

		header h1 { font-size: 39px; }

		header h4 {
			font-size: 16px;
			font-weight: bold;
		}

		article .preview-image {
			margin-right: 0; 
			max-width: 100%;
		}

		article .preview-image:before {
			-webkit-box-shadow: inset 0 5px 0 #fff, inset -5px 0 0 #fff, inset 0 -5px 0 #fff, inset 5px 0 0 #fff;
			-moz-box-shadow:    inset 0 5px 0 #fff, inset -5px 0 0 #fff, inset 0 -5px 0 #fff, inset 5px 0 0 #fff;
			box-shadow:         inset 0 5px 0 #fff, inset -5px 0 0 #fff, inset 0 -5px 0 #fff, inset 5px 0 0 #fff;
		}

			article .preview-image img { max-width: 100%; }

		article .info {
			float: none;
			width: auto;
		}
		
}

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

	h2 { font-size: 19px; }
	
	header { text-align: center; }

		header h1 { font-size: 37px; }

		header h4 { font-size: 15px; }

		header .avatar { display: none; }

}
	
/* ---------------------------------------------------------------------- */
/*	Fancybox
/* ---------------------------------------------------------------------- */

/*! fancyBox v2.0.6 fancyapps.com | fancyapps.com/fancybox/#license & Buttons helper 1.0.2 for fancyBox */
.fancybox-tmp iframe,.fancybox-tmp object{vertical-align:top;padding:0;margin:0}.fancybox-wrap{position:absolute;top:0;left:0;z-index:8020}.fancybox-skin{position:relative;padding:0;margin:0;background:#f9f9f9;color:#444;text-shadow:none;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.fancybox-opened{z-index:8030}.fancybox-opened .fancybox-skin{-webkit-box-shadow:0 10px 25px rgba(0,0,0,0.5);-moz-box-shadow:0 10px 25px rgba(0,0,0,0.5);box-shadow:0 10px 25px rgba(0,0,0,0.5)}.fancybox-outer,.fancybox-inner{padding:0;margin:0;position:relative;outline:0}.fancybox-inner{overflow:hidden}.fancybox-type-iframe .fancybox-inner{-webkit-overflow-scrolling:touch}.fancybox-error{color:#444;font:14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;margin:0;padding:10px}.fancybox-image,.fancybox-iframe{display:block;width:100%;height:100%;border:0;padding:0;margin:0;vertical-align:top}.fancybox-image{max-width:100%;max-height:100%}#fancybox-loading,.fancybox-close,.fancybox-prev span,.fancybox-next span{background-image:url(../img/fancybox_sprite.png)}#fancybox-loading{position:fixed;top:50%;left:50%;margin-top:-22px;margin-left:-22px;background-position:0 -108px;opacity:.8;cursor:pointer;z-index:8020}#fancybox-loading div{width:44px;height:44px;background:url(../img/fancybox_loading.gif) center center no-repeat}.fancybox-close{position:absolute;top:-18px;right:-18px;width:36px;height:36px;cursor:pointer;z-index:8040}.fancybox-nav{position:absolute;top:0;width:40%;height:100%;cursor:pointer;background:transparent url(../img/blank.gif);-webkit-tap-highlight-color:rgba(0,0,0,0);z-index:8040}.fancybox-prev{left:0}.fancybox-next{right:0}.fancybox-nav span{position:absolute;top:50%;width:36px;height:34px;margin-top:-18px;cursor:pointer;z-index:8040;visibility:hidden}.fancybox-prev span{left:20px;background-position:0 -36px}.fancybox-next span{right:20px;background-position:0 -72px}.fancybox-nav:hover span{visibility:visible}.fancybox-tmp{position:absolute;top:-9999px;left:-9999px;padding:0;overflow:visible;visibility:hidden}#fancybox-overlay{position:absolute;top:0;left:0;overflow:hidden;display:none;z-index:8010;background:#000}#fancybox-overlay.overlay-fixed{position:fixed;bottom:0;right:0}.fancybox-title{visibility:hidden;font:normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;position:relative;text-shadow:none;z-index:8050}.fancybox-opened .fancybox-title{visibility:visible}.fancybox-title-float-wrap{position:absolute;bottom:0;right:50%;margin-bottom:-35px;z-index:8030;text-align:center}.fancybox-title-float-wrap .child{display:inline-block;margin-right:-100%;padding:2px 20px;background:transparent;background:rgba(0,0,0,0.8);-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;text-shadow:0 1px 2px #222;color:#FFF;font-weight:bold;line-height:24px;white-space:nowrap}.fancybox-title-outside-wrap{position:relative;margin-top:10px;color:#fff}.fancybox-title-inside-wrap{margin-top:10px}.fancybox-title-over-wrap{position:absolute;bottom:0;left:0;color:#fff;padding:10px;background:#000;background:rgba(0,0,0,.8)}#fancybox-buttons{position:fixed;left:0;width:100%;z-index:8050}#fancybox-buttons.top{top:10px}#fancybox-buttons.bottom{bottom:10px}#fancybox-buttons ul{display:block;width:170px;height:30px;margin:0 auto;padding:0;list-style:none;background:#111;-webkit-box-shadow:0 1px 3px #000,0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.05);-moz-box-shadow:0 1px 3px #000,0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.05);background:#111 -webkit-gradient(linear,0% 0,0% 100%,from(rgba(255,255,255,.2)),color-stop(.5,rgba(255,255,255,.15)),color-stop(.5,rgba(255,255,255,.1)),to(rgba(255,255,255,.15)));background:#111 -moz-linear-gradient(top,rgba(255,255,255,.2) 0,rgba(255,255,255,.15) 50%,rgba(255,255,255,.1) 50%,rgba(255,255,255,.15) 100%);border-radius:3px}#fancybox-buttons ul li{float:left;margin:0;padding:0}#fancybox-buttons a{display:block;width:30px;height:30px;text-indent:-9999px;background-image:url(../img/fancybox_buttons.png);background-repeat:no-repeat;outline:0}#fancybox-buttons a.btnPrev{width:32px;background-position:6px 0}#fancybox-buttons a.btnNext{background-position:-33px 0;border-right:1px solid #3e3e3e}#fancybox-buttons a.btnPlay{background-position:0 -30px}#fancybox-buttons a.btnPlayOn{background-position:-30px -30px}#fancybox-buttons a.btnToggle{background-position:3px -60px;border-left:1px solid #111;border-right:1px solid #3e3e3e;width:35px}#fancybox-buttons a.btnToggleOn{background-position:-27px -60px}#fancybox-buttons a.btnClose{border-left:1px solid #111;width:38px;background-position:-57px 0}#fancybox-buttons a.btnDisabled{opacity:.5;cursor:default}