/* CORE */

body {
	margin:0px;
	padding:0px;
	color:#CCC;
	font-size:13px;
	font-weight:600;
	background:#FFF;
	font-family:'Lato', sans-serif;
	text-rendering:optimizeLegibility;
	-moz-osx-font-smoothing:grayscale;
	-webkit-font-smoothing:antialiased;
}

@font-face {
	font-family:'Lato';
	font-style:normal;
	font-weight:300;
	src:local('Lato Light'), local('Lato-Light'), url(../fonts/latoLight300ext.woff2) format('woff2');
	unicode-range:U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family:'Lato';
	font-style:normal;
	font-weight:300;
	src:local('Lato Light'), local('Lato-Light'), url(../fonts/latoLight300.woff2) format('woff2');
	unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face {
	font-family:'Lato';
	font-style:normal;
	font-weight:700;
	src:local('Lato Bold'), local('Lato-Bold'), url(../fonts/latoBold700ext.woff2) format('woff2');
	unicode-range:U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family:'Lato';
	font-style:normal;
	font-weight:700;
	src:local('Lato Bold'), local('Lato-Bold'), url(../fonts/latoBold700.woff2) format('woff2');
	unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

a {
	color:#999;
	text-decoration:none;
	letter-spacing:0.025em;
	-webkit-transition: color 175ms ease-in-out 25ms;
	-moz-transition: color 175ms ease-in-out 25ms;
	-ms-transition: color 175ms ease-in-out 25ms;
	-o-transition: color 175ms ease-in-out 25ms;
	transition: color 175ms ease-in-out 25ms;
}

.instantLink {
	pointer-events:auto!important;
}

a:hover {
	color:#555;
}

a:active {
	color:#999;
}

.blackOverlay {
	z-index:5;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	position:fixed;
	pointer-events:auto;
	background:rgba(0,0,0,1);
}

.black {
	z-index:4;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	position:fixed;
	background:rgba(0,0,0,1);
	-webkit-transition: all 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	-moz-transition: all 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	-ms-transition: all 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	-o-transition: all 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	transition: all 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
}





/* HEADER */

.bar, .barStatic {
	z-index:6;
	top:0px;
	left:0px;
	right:0px;
	height:135px;
	background:#000;
	position:absolute;
}

.barShadow {
	z-index:6;
	opacity:0.5;
	top:135px;
	left:0px;
	right:0px;
	height:30px;
	position:absolute;
	background:url("images/barShadow.png") repeat-x;
	-webkit-transition: opacity 1500ms ease-in-out;
	-moz-transition: opacity 1500ms ease-in-out;
	-ms-transition: opacity 1500ms ease-in-out;
	-o-transition: opacity 1500ms ease-in-out;
	transition: opacity 1500ms ease-in-out;
}

.barShadowStatic {
	z-index:6;
	opacity:0.5;
	top:135px;
	left:0px;
	right:0px;
	height:30px;
	position:absolute;
	background:url("images/barShadow.png") repeat-x;
}

.bar div {
	opacity:1;
	top:50px;
	left:50%;
	width:210px;
	height:35px;
	margin-left:-105px;
	position:absolute;
	background:url('images/timsilva_2x_sprite.png');
	background-size:210px 6055px;
	-webkit-animation: logoPlay 2867ms steps(172) forwards 1750ms;
	-moz-animation: logoPlay 2867ms steps(172) forwards 1750ms;
	-o-animation: logoPlay 2867ms steps(172) forwards 1750ms;
	animation: logoPlay 2867ms steps(172) forwards 1750ms;
	-webkit-transition: top 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	-moz-transition: top 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	-ms-transition: top 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	-o-transition: top 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
	transition: top 1250ms cubic-bezier(0.975, 0.000, 0.250, 1.000);
}

.barStatic div {
	opacity:1;
	top:50px;
	left:50%;
	width:210px;
	height:35px;
	margin-left:-105px;
	position:absolute;
	background:url('images/timsilva_2x_sprite.png');
	background-size:210px 6055px;
	background-position:0px -6020px;
}

@-webkit-keyframes logoPlay {
    from { background-position: 0px 0px; }
    to { background-position: 0px -6020px; }
}
@-moz-keyframes logoPlay {
    from { background-position: 0px 0px; }
    to { background-position: 0px -6020px; }
}
@-o-keyframes logoPlay {
    from { background-position: 0px 0px; }
    to { background-position: 0px -6020px; }
}
@keyframes logoPlay {
    from { background-position: 0px 0px; }
    to { background-position: 0px -6020px; }
}





/* VITALS */

.portrait {
	opacity:1;
	top:180px;
	left:50%;
	width:102px;
	height:103px;
	margin-left:-105px;
	position:absolute;
	background-size:102px 103px;
	background-image:url("images/portrait_2x.png");
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.error404 {
	opacity:1;
	top:180px;
	left:50%;
	width:210px;
	height:103px;
	margin-left:-105px;
	position:absolute;
	background-size:210px 103px;
	background-image:url("images/404.png");
}

.archive {
	opacity:1;
	top:180px;
	left:50%;
	width:210px;
	height:103px;
	margin-left:-105px;
	position:absolute;
	background-size:210px 103px;
	background-image:url("images/archive.png");
}

.versions {
	opacity:1;
	top:180px;
	left:50%;
	width:210px;
	height:103px;
	margin-left:-105px;
	position:absolute;
	background-size:210px 103px;
	background-image:url("images/versions.png");
}

.wideButtons {
	top:180px;
	left:50%;
	width:102px;
	height:100px;
	margin-left:3px;
	position:absolute;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

.wideButtons a div, .wideButtons a div::after {
	width:102px;
	height:30px;
	position:relative;
	padding-bottom:6px;
	background-size:960px 540px;
	background-image:url("images/sprite_2x.png");
}

.wideButtons a div {
	opacity:1;
	-webkit-transition: opacity 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
	-moz-transition: opacity 300ms ease-in-out, -moz-transform 300ms ease-in-out;
	-ms-transition: opacity 300ms ease-in-out, -ms-transform 300ms ease-in-out;
	-o-transition: opacity 300ms ease-in-out, -o-transform 300ms ease-in-out;
	transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
}

.wideButtons a div::after {
	opacity:0;
	content:"";
	display:block;
	-webkit-transition: opacity 115ms ease-in-out 50ms;
	-moz-transition: opacity 115ms ease-in-out 50ms;
	-ms-transition: opacity 115ms ease-in-out 50ms;
	-o-transition: opacity 115ms ease-in-out 50ms;
	transition: opacity 115ms ease-in-out 50ms;
}

.no-touch .wideButtons a:hover div::after {
	opacity:1;
}
.no-touch .wideButtons a:active div {
	opacity:0.8!important;
	-webkit-transition: opacity 115ms ease-in-out 0ms!important;
	-moz-transition: opacity 115ms ease-in-out 0ms!important;
	-ms-transition: opacity 115ms ease-in-out 0ms!important;
	-o-transition: opacity 115ms ease-in-out 0ms!important;
	transition: opacity 115ms ease-in-out 0ms!important;
}

.wideButtons a:nth-child(1) div, .wideButtons a:nth-child(2) div, .wideButtons a:nth-child(3) div {
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-ms-transform:scale(1,1);
    transform:scale(1,1);
}

.wideButtons a:nth-child(1) div {
	top:0px;
	background-position:0px 0px;
}
.wideButtons a:nth-child(1) div::after {
	background-position:-108px 0px;
}
.wideButtons a:nth-child(1) div.about {
	background-position:0px -135px;
}
.wideButtons a:nth-child(1) div.about::after {
	background-position:-108px -135px;
}

.wideButtons a:nth-child(2) div {
	top:0px;
	background-position:0px -45px;
}
.wideButtons a:nth-child(2) div::after {
	background-position:-108px -45px;
}

.wideButtons a:nth-child(3) div {
	top:0px;
	padding-bottom:0px;
	background-position:0px -90px;
}
.wideButtons a:nth-child(3) div::after {
	padding-bottom:0px;
	background-position:-108px -90px;
}





/* CONTENT */

.content {
	top:322px;
	left:50%;
	width:210px;
	position:absolute;
	margin-left:-105px;
}
.content p.aboutText {
	top:0px;
	opacity:1;
	cursor:text;
	line-height:20px;
	text-align:center;
	position:relative;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
.content p.portfolioText {
	top:5px;
	opacity:0;
	cursor:text;
	line-height:20px;
	text-align:center;
	position:absolute;
	visibility:hidden;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
.archiveContent {
	color:#CCC;
	margin-bottom:40px;
	pointer-events:auto!important;
}
.archiveContent a {
	pointer-events:auto!important;
}


.introLineFull {
	z-index:1;
	opacity:1;
	top:320px;
	left:50%;
	width:210px;
	height:2px;
	overflow:hidden;
	position:absolute;
	margin-left:-105px;
	background:rgba(235,235,235,1);
	-webkit-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	-moz-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	-ms-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	-o-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
}
.introLineSmall {
	opacity:1;
	z-index:2;
	top:0px;
	left:0px;
	width:17px;
	height:2px;
	position:absolute;
	background:rgba(205,205,205,1);
	-webkit-transition: opacity 15ms ease-in-out, left 300ms ease-in-out, width 150ms ease-in-out 50ms;
	-moz-transition: opacity 15ms ease-in-out, left 300ms ease-in-out, width 150ms ease-in-out 50ms;
	-ms-transition: opacity 15ms ease-in-out, left 300ms ease-in-out, width 150ms ease-in-out 50ms;
	-o-transition: opacity 15ms ease-in-out, left 300ms ease-in-out, width 150ms ease-in-out 50ms;
	transition: opacity 15ms ease-in-out, left 300ms ease-in-out, width 150ms ease-in-out 50ms;
}





/* VERSIONS */

.entry {
	float:left;
	width:210px;
	line-height:30px;
	position:relative;
	margin-bottom:40px;
}

.entry a {
	display:block;
	pointer-events:auto;
}

.entry .preview {
	width:210px;
	height:160px;
	display:block;
	border-radius:4px;
	margin-bottom:10px;
	box-shadow:0px 1px 1px 0px rgba(0,0,0,0.2);
	-moz-box-shadow:0px 1px 1px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow:0px 1px 1px 0px rgba(0,0,0,0.2);
}

.entry .versionNumber {
	color:#CCC;
	float:left;
	cursor:default;
}

.entry .datePublished {
	color:#CCC;
	float:right;
	cursor:default;
}





/* SOCIAL */

.socialButtons {
	top:42px;
	left:50%;
	width:210px;
	margin-left:-105px;
	position:relative;
}

.socialButtons a div, .socialButtons a div::after {
	float:left;
	width:30px;
	height:30px;
	padding-right:6px;
	padding-bottom:6px;
	background-size:960px 540px;
	background-image:url("images/sprite_2x.png");
	-webkit-transition: opacity 350ms ease-in-out 100ms, -webkit-transform 450ms ease-in-out;
	-moz-transition: opacity 350ms ease-in-out 100ms, -moz-transform 450ms ease-in-out;
	-ms-transition: opacity 350ms ease-in-out 100ms, -ms-transform 450ms ease-in-out;
	-o-transition: opacity 350ms ease-in-out 100ms, -o-transform 450ms ease-in-out;
	transition: opacity 350ms ease-in-out 100ms, transform 450ms ease-in-out;
}

.socialButton a div {
	opacity:1;
}

.socialButtons a:nth-last-child(-n+6) div, .socialButtons a:nth-last-child(-n+6) div::after, .socialButtons a:nth-last-child(-n+6) div::before {
	padding-bottom:0px;
}

.socialButtons a div::before {
	opacity:0;
	content:"";
	display:block;
	background-size:960px 540px;
	background-image:url("images/sprite_2x.png");
	-webkit-transition: all 205ms cubic-bezier(0.87,0.00,0.13,1.00) 35ms;
	-moz-transition: all 205ms cubic-bezier(0.87,0.00,0.13,1.00) 35ms;
	-ms-transition: all 205ms cubic-bezier(0.87,0.00,0.13,1.00) 35ms;
	-o-transition: all 205ms cubic-bezier(0.87,0.00,0.13,1.00) 35ms;
	transition: all 205ms cubic-bezier(0.87,0.00,0.13,1.00) 35ms;
    -webkit-transform:scale(0.25,0.25);
	-moz-transform:scale(0.25,0.25);
	-ms-transform:scale(0.25,0.25);
    transform:scale(0.25,0.25);
	pointer-events:none;
}

.socialButtons a:nth-child(-n+6) div::before {
	top:-25px;
	height:35px;
	position:absolute;
}
.socialButtons a:nth-last-child(-n+6) div::before {
	top:20px;
	height:35px;
	position:absolute;
}

.socialButtons a:nth-child(6) div, .socialButtons a:nth-child(6) div::after, .socialButtons a:nth-child(12) div, .socialButtons a:nth-child(12) div::after {
	padding-right:0px;
}

.socialButtons a div::after {
	opacity:0;
	content:"";
	display:block;
	-webkit-transition: opacity 140ms ease-in-out 125ms;
	-moz-transition: opacity 140ms ease-in-out 125ms;
	-ms-transition: opacity 140ms ease-in-out 125ms;
	-o-transition: opacity 140ms ease-in-out 125ms;
	transition: opacity 140ms ease-in-out 125ms;
}

.socialButtons a:hover div::after {
	opacity:1;
}
.no-touch .socialButtons a:active div {
	opacity:0.75!important;
}

.socialButtons a:hover div::before {
	opacity:1;
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-ms-transform:scale(1,1);
    transform:scale(1,1);
}

.socialButtons a:nth-child(-n+6):hover div::before {
	top:-40px;
}
.socialButtons a:nth-last-child(-n+6):hover div::before {
	top:35px;
}

.socialButtons a:nth-child(1) div, .socialButtons a:nth-child(2) div, .socialButtons a:nth-child(3) div,
.socialButtons a:nth-child(4) div, .socialButtons a:nth-child(5) div, .socialButtons a:nth-child(6) div,
.socialButtons a:nth-child(7) div, .socialButtons a:nth-child(8) div, .socialButtons a:nth-child(9) div,
.socialButtons a:nth-child(10) div, .socialButtons a:nth-child(11) div, .socialButtons a:nth-child(12) div {
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-ms-transform:scale(1,1);
    transform:scale(1,1);
}

.behance {
	background-position:-216px 0px;
}
.behance::after {
	background-position:-216px -90px;
}
.behance::before {
	left:-19px;
	width:68px;
	background-position:-433px 0px;
}

.deviantart {
	background-position:-252px 0px;
}
.deviantart::after {
	background-position:-252px -90px;
}
.deviantart::before {
	left:-26px;
	width:82px;
	background-position:-513px 0px;
}

.dribbble {
	background-position:-288px 0px;
}
.dribbble::after {
	background-position:-288px -90px;
}
.dribbble::before {
	left:-19px;
	width:82px;
	background-position:-603px 0px;
    -webkit-transform-origin:42% 50%;
    -ms-transform-origin:42% 50%;
    transform-origin:42% 50%;
}

.facebook {
	background-position:-324px 0px;
}
.facebook::after {
	background-position:-324px -90px;
}
.facebook::before {
	left:-21px;
	width:72px;
	background-position:-433px -45px;
}

.googleplus {
	background-position:-360px 0px;
}
.googleplus::after {
	background-position:-360px -90px;
}
.googleplus::before {
	left:-18px;
	width:66px;
	background-position:-513px -45px;
}

.instagram {
	background-position:-396px 0px;
}
.instagram::after {
	background-position:-396px -90px;
}
.instagram::before {
	left:-22px;
	width:74px;
	background-position:-603px -45px;
}

.lastfm {
	background-position:-216px -45px;
}
.lastfm::after {
	background-position:-216px -135px;
}
.lastfm::before {
	left:-15px;
	width:60px;
	background-position:-433px -85px;
}

.linkedin {
	background-position:-252px -45px;
}
.linkedin::after {
	background-position:-252px -135px;
}
.linkedin::before {
	left:-18px;
	width:66px;
	background-position:-513px -85px;
}

.pinterest {
	background-position:-288px -45px;
}
.pinterest::after {
	background-position:-288px -135px;
}
.pinterest::before {
	left:-20px;
	width:70px;
	background-position:-603px -85px;
}

.twitter {
	background-position:-324px -45px;
}
.twitter::after {
	background-position:-324px -135px;
}
.twitter::before {
	left:-15px;
	width:70px;
	background-position:-433px -130px;
    -webkit-transform-origin:44% 50%;
    -ms-transform-origin:44% 50%;
    transform-origin:44% 50%;
}

.vimeo {
	background-position:-360px -45px;
}
.vimeo::after {
	background-position:-360px -135px;
}
.vimeo::before {
	left:-13px;
	width:70px;
	background-position:-513px -130px;
    -webkit-transform-origin:40% 50%;
    -ms-transform-origin:40% 50%;
    transform-origin:40% 50%;
}

.youtube {
	background-position:-396px -45px;
}
.youtube::after {
	background-position:-396px -135px;
}
.youtube::before {
	left:-19px;
	width:68px;
	background-position:-603px -130px;
}





/* SOCIAL (For Mobile) */

/* 599px and thinner! */
@media only screen
and (max-width:599px)
{

.socialButtons {
	top:12px;
}

.footerLineFull {
	top:80px!important;
	/*top:71px!important;*/
}

.footer {
	top:67px!important;
	/*top:58px!important;*/
}

.socialButtons a div, .socialButtons a div::after {
	width:102px;
	margin-right:6px;
	padding-right:0px;
	padding-bottom:6px;
}

.socialButtons a:nth-child(even) div {
	margin-right:0px;
	padding-right:0px;
}

.socialButtons a:nth-last-child(-n+6) div, .socialButtons a:nth-last-child(-n+6) div::after, .socialButtons a:nth-last-child(-n+6) div::before {
	padding-bottom:6px;
}

.behance {
	background-position: 0px -180px;
}

.socialButtons a div:hover::after, .socialButtons a div:active::after, .socialButtons a div:hover::before, .socialButtons a div:active::before {
	opacity:0!important;
}

.deviantart {
	background-position: -108px -180px;
}

.dribbble {
	background-position: -216px -180px;
}

.facebook {
	background-position: -324px -180px;
}

.googleplus {
	background-position: -433px -180px;
}

.instagram {
	background-position: -542px -180px;
}

.lastfm {
	background-position: 0px -225px;
}

.linkedin {
	background-position: -108px -225px;
}

.pinterest {
	background-position: -216px -225px;
}

.twitter {
	background-position: -324px -225px;
}

.vimeo {
	background-position: -433px -225px;
}

.youtube {
	background-position: -542px -225px;
}

}





/* FOOTER */

.footerLineFull {
	opacity:1;
	z-index:1;
	top:131px;
	height:2px;
	float:left;
	width:210px;
	overflow:hidden;
	position:relative;
	margin-left:-105px;
	background:rgba(235,235,235,1);
	/*-webkit-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	-moz-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	-ms-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	-o-transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;
	transition: opacity 10ms ease-in-out, width 300ms ease-in-out, margin-left 300ms ease-in-out;*/
}
.footerLineSmall {
	z-index:2;
	top:0px;
	left:0px;
	width:10px;
	height:2px;
	position:absolute;
	background:rgba(205,205,205,1);
	/*-webkit-transition: opacity 15ms ease-in-out, left 300ms ease-in-out;
	-moz-transition: opacity 15ms ease-in-out, left 300ms ease-in-out;
	-ms-transition: opacity 15ms ease-in-out, left 300ms ease-in-out;
	-o-transition: opacity 15ms ease-in-out, left 300ms ease-in-out;
	transition: opacity 15ms ease-in-out, left 300ms ease-in-out;*/
}
.footer {
	opacity:1;
	top:118px;
	float:left;
	clear:left;
	width:220px;
	cursor:default;
	text-align:left;
	position:relative;
	padding-bottom:42px;
	word-spacing:-0.6px;
	letter-spacing:0.05px;
	/*word-spacing:-0.9px;
	letter-spacing:0.1px;*/
	/*-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;*/
}