/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.clearfix:after{
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix {
  zoom: 1;
}



/* HTML5 Boilerplate  */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }


img { border: 0; -ms-interpolation-mode: bicubic; }


table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }

.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; }



body {
	font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
	font-size:18px;
	line-height:28px;
	color:#8b8d90;
	background:#fff;
	font-weight:400 !important;
	-webkit-text-size-adjust: none;	  /* Prevent font scaling in landscape */
	-webkit-font-smoothing: antialiased;
	text-align:center;
}


a, a:visited {text-decoration:none;color:#FDC03B; } /* mustard */
a:hover, a:active {color:#F1A502;} /* light mustard */

hr {
    border: 0;
    height: 0;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #e8e8e8;
}
h1 {
	font-weight:300 !important;
	margin:0;
}
h2, h3 {
	text-transform:uppercase;
	margin-top:0;
}
h2 {
	color:#FDC03B;
	font-size:32px;
	letter-spacing:.05em;	
	font-weight:300 !important;
	line-height:40px;
}
h3 {
	font-size:16px;
	font-weight:400 !important;
	letter-spacing:.05em;	
	
}

ul {
	padding:0;
}

li {
	text-transform:uppercase;
	font-weight:400 !important;
	list-style-type:none;
	font-size:16px;
	letter-spacing:.05em;	
	line-height:25px;
}
header {
	text-align:left;
	padding:10px 0 0;
	margin:0 auto !important;
}
#name {
	width:60%;
	float:left;
}


#name h2{ 
	margin:0;
	color:#8b8d90;
	font-size:26px;
}

#intro {
	height:200px;
	/*background:#2c2c2c url("../images/header.jpg") 20% 35% no-repeat;*/
	background:#2c2c2c url("../images/header.png") 20% 35% no-repeat;
	background-size:cover;
	color:#fff;
}
#intro h1 {
	padding-top:110px;
	text-shadow: 0 0 10px rgba(0,0,0, .4);
	margin-left:50%;
	text-align:left;
	line-height:1.1;
}
#name h2 span, #intro h1 span {
	color:#FDC03B; 
}

@media (max-width: 585px) {
	#intro h1 {
		padding-top:120px;
		margin-left:55%;
		font-size:30px;
	}
}


@media (max-width: 485px) {
	#intro {
		background-position:40% top;
	}
	#intro h1 {
		padding-top:110px;
		margin-left:55%;
		font-size:25px;
	}
}

@media (max-width: 399px) {
	#name h2 {
		font-size:22px;
	}
}


section {
	margin-top:40px;
}

article {
	text-align:left;
	padding-bottom:20px;
}

.full {
	max-width:90%;
	margin:30px auto;
	height:auto;
}

aside {
	border-top: 1px solid #e8e8e8;
    border-bottom: 1px solid #e8e8e8;
	background:#f9f9f9;
	padding-top:20px;
	margin-top:20px;
	overflow:hidden;
}

aside .full {
	margin:0 auto;
	display:table;
}

aside .full a {
	line-height:0;
	display:table-cell;
	font-size:0;
	width:auto;
	text-align:center;
	vertical-align:bottom;
}

aside .full a img {
	max-width:90%;
	width:100%;
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
	filter: gray; /* IE6-9 */
	-webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
	-webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
	-webkit-backface-visibility: hidden; /* Fix for transition flickering */
	filter: grayscale(100%); 
	transition: all .6s ease; 
	backface-visibility: hidden; 
	opacity:.3;
	position:relative;
	top:20px;
	
}
aside .full a:hover img {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
	opacity:1;
	top:0px;
}


footer {
	background:#cacbcc;
	color:#fff;
	text-transform:uppercase;
	font-size:13px;
	letter-spacing:.05em;
	margin-top:80px;
	padding:20px 0 60px;
	font-weight:400;
}

footer a {
	color:#fff !important;
}

/*div > a > i { margin:1%;}*/
.lazy {
    display: none;
}
@media (max-width: 999px) {}

	





