/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */
* {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin:0;
	padding:0;
}
html {
	 color: #8e8e8e;
	 font-size: 1em;

	font-family: 'Lato', sans-serif;
	font-weight: 300;
	text-align: center;
}

::-moz-selection {
	 background: #b3d4fc;
	 text-shadow: none;
}

::selection {
	 background: #b3d4fc;
	 text-shadow: none;
}

hr {
	 display: block;
	 height: 1px;
	 border: 0;
	 border-top: 1px solid #ccc;
	 margin: 1em 0;
	 padding: 0;
}

audio,
canvas,
iframe,
img,
svg,
video {
	 vertical-align: middle;
}

fieldset {
	 border: 0;
	 margin: 0;
	 padding: 0;
}

textarea {
	 resize: vertical;
}

.browserupgrade {
	 margin: 0.2em 0;
	 background: #ccc;
	 color: #000;
	 padding: 0.2em 0;
}


/* ==========================================================================
	Author's custom styles
	========================================================================== */

body{
	background:#fff;
	font-size:15px;
	 line-height: 1;
}
.wrapper{
	padding:0 20px;
	max-width:1214px;
	margin:0 auto;
}

h1{
	/*font-size:36px;*/
	font-size:2.400em;
	font-weight: normal;
	text-transform: uppercase;

	line-height:34px;
	line-height:1em;
	color:#5b5b5b;
	margin:15% 0;
}
h1 span{
	letter-spacing: 0.21em;
	color:#898989;
	font-size:16px;
	font-size:0.444em;
	font-weight: 300;
}

.bio-wrapper{
	text-align: justify;
	max-width:815px;
	margin:0 auto;
	font-size:1em;
	line-height:23px;
	margin-bottom:10%;
	padding:0 20px;
}
.bio-wrapper h2{
	text-align: center;
	color:#5b5b5b;
	font-size:35px;
	font-size:2.333em;
	font-weight: normal;
	margin-bottom: 35px;

}
p a{
	color:inherit;
	text-decoration: none;
	border-bottom:1px solid transparent;
	transition: .3s;
	&:hover{
		border-bottom:1px solid;
	}
}
.mail{
	text-align: center;
	margin-top:30px;
}

.work-box{
	float: left;
	width:50%;
	padding:0 20px 80px 20px;
}
.work-wrapper {
	margin-bottom: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
}

.work-wrapper a{
	display:block;
	margin-bottom: 35px;
}
.work-wrapper h2{
	text-transform: uppercase;
	font-size:35px;
	font-size:2.333em;
	color:#5b5b5b;
	font-weight: normal;
	margin-bottom: 18px;
}
.work-wrapper h2 span{
	font-weight:300;
	font-size:19px;
	font-size:0.543em;
	display: block;
	color:#8e8e8e;
	text-transform: none;
	margin-top: 18px;
}
.work-wrapper p{
	font-size:19px;
	font-size:1.267em;
	line-height: 24px;
	color:#5b5b5b;
	padding: 0 20px;
	margin-bottom: 18px;
}
.work-wrapper h2+p{
	min-height: 42px;/*72px;*/
}
.work-wrapper p.footer{
	font-size:1em;
	color:#969696;
	line-height: 1.2em;
}
.work-wrapper p.footer span{
	font-size:0.867em;
	display: block;
}
.work-wrapper img{
	width:100%;
}








/* ==========================================================================
	Media Queries
	========================================================================== */

@media only screen and (max-width: 1279px) {
	.work-wrapper{
		font-size:12px;
	}
    .work-box{
        padding-bottom:60px;
    }
}

@media only screen and (max-width: 1023px) {
    .work-box{
        padding-bottom:0;
    }
	.work-wrapper p.footer{
		margin-bottom:0;
	}
	.work-box{
		float: none;
		clear: both;
		width:100%;
		margin-bottom:40px;
	}
	.work-box > a{
		width:50%;
		margin-bottom:0;
		display:inline-block;
		padding-right:40px;
		vertical-align: middle;
	}
	.work-wrapper h2+p{
		min-height:0;
	}
	.work-box > div{
		vertical-align: middle;
		width:50%;
		display: inline-block;
	}
	.work-wrapper p{
		padding:0;
	}
}
@media only screen and (max-width: 640px) {
	.bio-wrapper{
		font-size:14px;
		margin-bottom:20%;
	}
	.work-wrapper h2{
		font-size:2em;
	}
	.work-wrapper p{
		font-size:1.167em;
	}
}
@media only screen and (min-width: 560px) and (max-width: 639px) {
	.work-box > a{
		width:55%;
		padding-right:30px;
	}
	.work-box > div{
		width:45%;
	}
}
@media only screen and (max-width: 480px) {
	.work-wrapper{
		font-size:14px;
	}

	h1{
		margin:20% 0;
		font-size:1.65em;
	}
	.work-box > a{
		width:100%;
		margin-bottom:30px;
		padding-right:0;
	}
	.work-box > div{
		width:100%;
	}
}
@media print,
		 (-o-min-device-pixel-ratio: 5/4),
		 (-webkit-min-device-pixel-ratio: 1.25),
		 (min-resolution: 120dpi) {

}

/* ==========================================================================
	Helper classes
	========================================================================== */

.hidden {
	 display: none !important;
	 visibility: hidden;
}

.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;
}

.invisible {
	 visibility: hidden;
}

.clearfix:before,
.clearfix:after {
	 content: " ";
	 display: table;
}

.clearfix:after {
	 clear: both;
}

.clearfix {
	 *zoom: 1;
}

/* ==========================================================================
	Print styles
	========================================================================== */

@media print {
	 *,
	 *:before,
	 *:after {
		  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) ")";
	 }

	 a[href^="#"]:after,
	 a[href^="javascript:"]: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;
	 }

	 p,
	 h2,
	 h3 {
		  orphans: 3;
		  widows: 3;
	 }

	 h2,
	 h3 {
		  page-break-after: avoid;
	 }
}
