* { padding: 0; border: 0; margin: 0; outline: none; text-decoration: none }

/*webkit biz*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
html { overflow: auto }
body { position: fixed; top: 0; left: 0; bottom: 0; right: 0; overflow-y: auto; overflow-x: auto }
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment { display: block; height: 30px; }
::-webkit-scrollbar { width: 10px; height: 10px }
::-webkit-scrollbar-track { background: #222 }
::-webkit-scrollbar-thumb { background: #fff;
	border-radius: 10px 0 0 10px; -webkit-border-radius: 10px 0 0 10px; -moz-border-radius: 10px 0 0 10px; -o-border-radius: 10px 0 0 10px }
::-webkit-scrollbar-thumb:window-inactive { background: #333 }
}/*end webkit biz*/

body { background: #222; color: #444; padding: 30px 20px 30px 30px; font: 12px/1.5 "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; letter-spacing: 0.03em }
p { margin-bottom: 1em }
p, h2, iframe { margin-bottom: 16px }
a, .section-title { text-decoration: none; color: #999 }
a:hover, a:active { color: #666 }
ul { list-style: none }
h1, h2 { line-height: 1; font-weight: 600; text-transform: uppercase }
h2, .visualindex { font-size: 20px; letter-spacing: 1px; text-align: center }
h2 { background: #333; color: #fff; margin: 0 -40px 30px; padding: 10px 40px;
-webkit-box-shadow: 0 12px 3px -10px rgba(0, 0, 0, 0.25);
   -moz-box-shadow: 0 12px 3px -10px rgba(0, 0, 0, 0.25);
		box-shadow: 0 12px 3px -10px rgba(0, 0, 0, 0.25); }
strong, b { font-weight: 600 }
table { border-collapse: collapse; margin-bottom: 32px }
td { vertical-align: top }
img { margin-bottom: 8px }
em { font-style: italic }
p + h2, dl + h2, .nothumb + .nothumb { margin-top: 30px }
dl, dl + h2, dt { clear: left }
dt { float: left }
dd { padding-left: 50px }

.center { position: relative; width: 100%; max-width: 780px; margin: 0 auto }

.menu, .content { position: relative; background: #fff; padding: 30px 30px 0}

.menu { position: relative; display: block; text-align: center;
	border-radius: 30px 30px 0 0; -webkit-border-radius: 30px 30px 0 0; -moz-border-radius: 30px 30px 0 0; -o-border-radius: 30px 30px 0 0 }
.menu h1 a { width: 100% }
.nav { width: 100%; text-transform: uppercase }
.nav li { display: inline; margin: 0 3px }
body.Work .nav a.work,
body.Resume .nav a.resume,
body.Information .nav a.info,
body.Tumblr .nav a.blog,
body.Contact .nav a.contact { color: #222; cursor: default }
.menu h1 a,
body.sec4 .nav a.work { color: #222 }

.content { min-height: 250px }
.content img { max-width: 100%; max-height: 99% }
.content p:last-child { padding-bottom: 30px; margin-bottom: 0}

.widescreen {
	display: block;
	width: 100%;
	height: 1px;
	padding-bottom: 56.25%;
	position: relative;
	border-bottom: 30px solid #fff;
	}
.widescreen video {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	}
.widescreen:after {
	display: block;
	width: 1px;
	height: 30px;
	background: #fff;
	clear: both;
	content: "";
	}

/*auto-generated works landing page*/
.visualindex li { display: block; float: left }
.visualindex div { position: relative; display: block; width: 100%;
				background-position: center center; background-repeat: no-repeat;
				-moz-background-size: cover; -o-background-size: cover;
				-webkit-background-size: cover; background-size: cover }
.visualindex .x2006 div { background-position: 0 0 }
.visualindex a { text-transform: uppercase; font-weight: 600; color: #fff }
.visualindex span { position: absolute; bottom: 30px; left: 30px; right: 30px; display: block; text-align: center; text-shadow: 0 1px 2px rgba(0,0,0,1) }

/*colorbox thumbnail grid*/
.thumbnails { list-style: none; margin: 0 -2.5% }
.thumbnails li, .thumbnails a { display: block; float: left; height: 185px }
.thumbnails li { width: 20%; margin: 0 2.5% 2.5% }
.thumbnails a { width: 100%; opacity: .9;
			-moz-background-size: contain; -o-background-size: contain;
			-webkit-background-size: contain; background-size: contain;
			 background-position: center center; background-repeat: no-repeat }
.thumbnails a:hover { opacity: 1 }
body.x2006 .thumbnails li { width: 45% }
.thumbnails.single li:first-child { width: 100%; height: auto }
.thumbnails.single li:first-child a { width: 95%; height: auto; text-align: center }
.thumbnails.doofer li:first-child,
.thumbnails.doofer li:nth-child(2) { width: 45%; height: 215px }
.thumbnails.doofer li:first-child a,
.thumbnails.doofer li:nth-child(2) a { height: 215px; -moz-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover }

.infoimg { float: right; width: 25%; padding: 0 0 30px 2.5% }
.infoimg img { display: block; width: 100%; height: auto; margin-bottom: 30px }
body.xResume .infoimg:before { display: block; content: " "; width: 1px; height: 70px }
body.xResume .infoimg + h2 { padding-left: 27.5% }

.nothumb em.title { margin-right: .5em }

.footernav, .footer { text-transform: uppercase; font-size: 10px }

.footernav { padding: 15px 30px 30px; text-align:center }
.footernav ul { display: block }
.footernav li { display: inline }
.footernav a { margin: 0 2px }
.footernav #list3,
.footernav #list1,
.footernav li.section-title { display: none }
.footernav li.active a { font-weight: bold; color: #666 }

.footer { text-align: center; background: #333; color: #999; padding: 15px 30px;
border-radius: 0 0 30px 30px; -webkit-border-radius: 0 0 30px 30px; -moz-border-radius: 0 0 30px 30px; -o-border-radius: 0 0 30px 30px }
.footer > p, .footer > div { cursor: default; display: inline-block; margin: 0 5px; vertical-align: middle; line-height: 21px }

.footer .share { position: relative }
.footer .share .fb-like { position: absolute; top: -36px; left: -30px; background: #222; width: 85px; height: 21px; padding: 5px 10px; overflow: hidden;
	-webkit-border-radius: 8px;
	   -moz-border-radius: 8px;
			border-radius: 8px;
	-webkit-box-shadow: 0 0 7px #222;
	   -moz-box-shadow: 0 0 7px #222;
			box-shadow: 0 0 7px #222; }
body.sec1:not(.xMain):not(.xWork) .footer .share { display: none !important }

.footer .share .arrow { width: 70px; height: 16px; overflow: hidden; position: absolute; left: 50%; margin-left: -35px; top: -6px }
.footer .share .arrow:after { content: ""; position: absolute; left: 20px; top: -20px; width: 25px; height: 25px; background: #222;
  -webkit-box-shadow: 6px 5px 9px -9px #222,
                      5px 6px 9px -9px #222;
     -moz-box-shadow: 6px 5px 9px -9px #222,
                      5px 6px 9px -9px #222;
  		  box-shadow: 6px 5px 9px -9px #222,
  		              5px 6px 9px -9px #222;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg); }

.footer .share div { display: none }
.footer .share:hover div { display: block }


/*tumblr biz*/
.post { position: relative; margin: 60px 0 30px }
.post + .post { margin: 0 0 30px }
.post.photo, .post.video, .post.audio, .post.quote { text-align: center }
.caption a[title=permalink] { display: none }
.Tumblr .caption a[title=permalink] { display: inline-block; padding: 0 3px; background: #333; margin-top: 12px;
	border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px }
.Tumblr .caption p + a[title=permalink] { margin-top: 0 }
.notes ol { list-style: none; text-align: center; font-size: 10px }
.notes img { display: none }
.post.video .caption { margin-top: 8px }
.post.audio embed { display: block; width: 100%; height: 27px; background: transparent }
.photocols { display: block; margin-bottom: 30px }
.photocols a { display: block; width: 100%; text-indent: -9999px;
				background-position: center center; background-repeat: no-repeat;
				-moz-background-size: contain; -o-background-size: contain;
				-webkit-background-size: contain; background-size: contain }
.set.x2 .photocols a { height: 345px }
.set.x3 .photocols a { height: 220px }
.set.x4 .photocols a { height: 150px }

/*clear floats*/
.visualindex:after,
.thumbnails:after,
.infoimg:after,
.footer:before { content: "."; display: block; height: 0; clear: both; visibility: hidden }

.hidden { display: none }

@media (min-width: 850px) {
	.visualindex { margin: 0 -15px }
	.visualindex li { width: 345px; height: 375px; margin: 0 15px }
	.visualindex.vi4 li { width: 720px; height: 430px }
	.visualindex div { height: 345px }
	.visualindex.vi4 li div { height: 400px }
	.visualindex li.Golden.Light div { background-position: 50% 10%; }
}

@media (max-width: 850px) {
	.visualindex { margin: 0 -2.5%; width: 105.263158% }
	.visualindex li { width: 45%; height: 375px; margin: 0 2.5% }
	.visualindex li.Golden.Light { width: 95%; height: 375px }
	.visualindex div { height: 345px }
	.visualindex li.Golden.Light div { height: 345px; background-position: 50% 50%; }
}

@media (max-width: 720px) {
	h2, .visualindex { font-size: 16px; letter-spacing: .1ex }
	.visualindex li { height: 310px }
	.visualindex div { height: 280px }
	.thumbnails li, .thumbnails a { height: 160px }
	.set.x2 .photocols a { height: 300px }
	.set.x3 .photocols a { height: 200px }
	.set.x4 .photocols a { height: 150px }
}

@media (max-width: 600px) {
	body { /*padding: 0 10px 0 20px*/ }
	.visualindex { margin: 0; width: 100% }
	.visualindex li,
	.visualindex li.Golden.Light { width: 100%; height: 250px; margin: 0 }
	.visualindex div,
	.visualindex li.Golden.Light div { height: 220px }
	.thumbnails li, .thumbnails a { height: 250px }
	.thumbnails li { width: 45% }
	body.x2006 .thumbnails li { width: 95% }
	body.x2006 .thumbnails li, body.x2006 .thumbnails a { height: 250px }
	.footer { line-height: 1.2 }
	.footer p:last-child,
	.footernav ul { display: block }

}

@media (max-width: 540px) {
	.thumbnails li, .thumbnails a { height: 200px }
	body.x2006 .thumbnails li, body.x2006 .thumbnails a { height: 200px }
	.set.x2 .photocols a { height: 225px }
	.set.x3 .photocols a { height: 150px }
	.set.x4 .photocols a { height: 105px }
}

@media (max-width: 480px) {
	.thumbnails li, .thumbnails a { height: 160px }
	body.x2006 .thumbnails li, body.x2006 .thumbnails a { height: 180px }
}

/*mobile*/
@media handheld, only screen and (max-width: 768px) {
	body { position: relative; top: 0; left: 0; bottom: 0; right: 0; overflow-y: auto; overflow-x: hidden; padding: 0 }
	::-webkit-scrollbar-button:start:decrement,
	::-webkit-scrollbar-button:end:increment { display: none; height: auto; }
	::-webkit-scrollbar { width: 5px; height: 5px }
	::-webkit-scrollbar-track { background: #999 }
	::-webkit-scrollbar-thumb { background: #666;
		border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0 }
	::-webkit-scrollbar-thumb:window-inactive { background: #222 }
	.menu, .content, .footer { padding: 10px 20px; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0 }
	.menu { letter-spacing: 0}
	.footer .share { display: none }
	.visualindex li { height: 330px }
	.visualindex div { height: 300px }
	.thumbnails li, .thumbnails a { height: 150px }
}