@import url(http://fonts.googleapis.com/css?family=Lato:400,900);

@font-face {
	font-family: 'Lavanderia';
	src: url('../font/fonts/Lavanderia-Regular.eot');
	src: url('../font/Lavanderia-Regular.eot');
	src: url('../font/Lavanderia-Regular.eot?#iefix') format('embedded-opentype'),
		url('../font/Lavanderia-Regular.woff') format('woff'),
		url('../font/Lavanderia-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

html, body { height: 100%; }
body { background: #171717; color: #aaa; font: 87.5%/1.5em 'Lato', Arial, sans-serif; }
.clear { clear: both; }

a { color: #99cb35; }
a:hover, a:focus { color: #f1f1f1; }

#header { padding: 20px 0 40px; background: #f1f1f1; }
	#header .container { position: relative; height: 80px; }
#header h1 { float: left; margin: 0 0 10px; width: 260px; height: 68px; text-indent: -9000em; background: url(/images/l_elenacaron.png) no-repeat 0 0; }
	#header h1 a { display: block; width: 100%; height: 100%; }
	#header h2 { position: absolute; left: 38px; top: 58px; margin: 0; font-size: 0.786em; line-height: 1em; color: #777; font-weight: normal; text-transform: uppercase; }
	#main-nav { position: absolute; right: 0; bottom: 0; text-transform: uppercase; font-size: 0.857em; line-height: 1em; }
		#main-nav ul { margin: 0; }
		#main-nav a { color: #777; }
		#main-nav a:hover, #main-nav a:focus { color: #f1f1f1; background: #171717; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; }
	#header .btn-navbar { display: none; position: absolute; right: 0; top: 40px; }

#main { min-height: 100%; } /* sticky footer */
#content { clear: both; padding: 20px 0 100px; }
	.back-link { float: right; margin-top: 17px; }
		.back-link i { margin-right: 6px; }
	h2 { margin-bottom: 1em; text-transform: uppercase; font-size: 1.714em; font-weight: normal; color: #f1f1f1; }

#footer { position: relative; clear: both; margin-top: -80px; padding: 20px 0; text-align: center; color: #777; }
	.colophon-link { margin-left: 10px; font-size: 85%; color: #777; }
	.colophon-link:hover, .colophon-link:focus { color: #f1f1f1; }
	.behance-link a { opacity: 0.5; }
	.behance-link a:hover, .behance-link a:focus { opacity: 1; }

/* Home */
#series { position: relative; margin-top: 20px; }
#series h2 { margin-bottom: .15em; font-size: 2.571em; line-height: 1em; }
	#series h2 .breakpoint { display: block; }
	.ampersand { font-family: 'Lavanderia', 'Lato', Arial, sans-serif; }
.series-thumb img { -moz-box-shadow: 0 3px 15px #000; -webkit-box-shadow: 0 3px 15px #000; box-shadow: 0 3px 15px #000; }
.series-info { text-transform: uppercase; margin-bottom: 2em; }
	.series-info p { margin: 0; }
.series-location { font-size: 0.857em; }
/*.portfolio-link { position: absolute; bottom: 0; right: 0; margin: 0; }*/
.portfolio-link i { margin-left: 6px; }

/* Projects */
ul#projects, ul#projects li,
ul#works, ul#works li { margin: 0; padding: 0; list-style: none; }

#projects .col1 { clear: left; margin-left: 0; }
.project { margin-bottom: 20px; }
.project a { display: block; color: #777; text-decoration: none; }
	.project a:hover, .project a:focus { color: #f1f1f1; }
.project img { -moz-box-shadow: 0 3px 15px #000; -webkit-box-shadow: 0 3px 15px #000; box-shadow: 0 3px 15px #000; }
.project h3 { margin: 1em 0 0; font-size: 1em; line-height: 1.2em; font-weight: normal; text-transform: uppercase; }

.description { margin: 0 0 1.5em; }

#projector { position: relative; margin: 0 0 30px; border-bottom: 1px solid #272727; border-top: 1px solid #272727; }
	#projector-inner { padding: 20px 40px; }
	#projector .thumb { width: 100%; margin-bottom: 20px; text-align: center; }
	#projector .thumb img { width: auto; -moz-box-shadow: 0 3px 15px #000; -webkit-box-shadow: 0 3px 15px #000; box-shadow: 0 3px 15px #000; }
	#projector .card { position: relative; margin: 0 auto; color: #f1f1f1; background: #272727;
						width: 100%; max-width: 310px; text-align: center;
						-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
						-moz-box-shadow: 0 1px 6px #000; -webkit-box-shadow: 0 1px 6px #000; box-shadow: 0 1px 6px #000; }
		#projector .card-inner { padding: 10px 15px; }

		#projector .sold { position: absolute; right: 10px; bottom: 10px; display: block; width: 16px; height: 16px;
							-moz-border-radius: 16px; -webkit-border-radius: 16px; border-radius: 16px; text-indent: -9000em; background: #ff3a25; }

	#close-projector { position: absolute; right: 15px; top: 15px; font-size: 2em; cursor: pointer; color: #f1f1f1; opacity: 0.2; }
		#close-projector:hover { opacity: 1; }

	#projector .nav-arrow { position: absolute; left: 15px; top: 50%; margin-top: -24px; display: block;
								font-size: 48px; line-height: 1em; cursor: pointer; color: #f1f1f1; opacity: 0.2; }
		#projector #next { left: auto; right: 15px; }
		#projector .nav-arrow:hover { opacity: 1; }

		ul.social, ul.social li { margin: 0; padding: 0; list-style: none; }
		ul.social { margin: .5em 0 0; }
		ul.social li { display: inline; margin: 0 4px; font-size: 0.786em; text-transform: uppercase; }
		.social i { font-size: 14px; vertical-align: middle; }
		.social a { color: #777; text-decoration: none; }
		.social a:hover, .social a:focus { color: #f1f1f1; }

.gutter-sizer { width: 2.7624309392265194%; }
.work { position: relative; width: 14.3646408839779%; }
	.thumb img { width: 100%; height: auto; cursor: pointer; -moz-box-shadow: 0 1px 6px #000; -webkit-box-shadow: 0 1px 6px #000; box-shadow: 0 1px 6px #000; }
.work.w2 { width: 31.491712707182323%; }
	.work .card { display: none; }
	
	.glass { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

/* About */
.profile-thumb { float: left; margin: 1em 0 0 0; }
	.profile-thumb img { vertical-align: middle; line-height: 1em; -moz-box-shadow: 0 3px 15px #000; -webkit-box-shadow: 0 3px 15px #000; box-shadow: 0 3px 15px #000; }

/* Contact */


/* Responsive */
@media (max-width: 979px) {
	#header .container { height: auto; }
	#header .btn-navbar { display: block; }
	#main-nav { display: none; clear: both; position: relative; right: auto; bottom: auto; padding-top: 15px; }
	#main-nav ul { padding-top: 10px; border-top: 1px solid #ccc; }
	#main-nav li { float: none; }
}
@media (min-width: 768px) and (max-width: 979px) {
	.work {	width: 22.92817679558011%; }
	.work.w2 { width: 48.61878453038674%; }
}
@media (max-width: 767px) {
	body { padding: 0 !important; }
	.container {
		padding-left: 20px;
		padding-right: 20px;
	}
	#header h2 { left: 58px; }
	#header .btn-navbar { right: 20px; }
	.profile-thumb { margin-right: 20px; margin-bottom: 20px; }

	.work { width: 31.491712707182323%; }
	.work.w2 { width: 65.74585635359117%; }
	#projector .thumb { padding: 0; width: 100%; }
	#projector img { width: 100%; }
}
@media (max-width: 480px) {
	.work { width: 48.61878453038674%; }
	.work.w2 { width: 100%; }
	#projector .thumb { padding: 0; width: 100%; }
	#projector img { width: 100%; }
}