@charset "UTF-8";
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin: 0; padding: 0; }

table { border-collapse: collapse; border-spacing: 0; }

fieldset, img { border: 0; }

address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }

ol, ul { list-style: none; }

caption, th { text-align: left; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; }

q:before, q:after { content: ''; }

header, footer, article, section, footer, aside, nav { display: block; }

.portfolio-list > li { clear: both; float: left; width: 100%; }

.portfolio-list-section { background: #111; width: 100%; line-height: 20px; font-weight: bold; color: #FFF; text-indent: 5px; height: 20px; }

.portfolio-list-items { float: left; width: 100%; clear: both; }

.portfolio-list-item { position: relative; float: left; margin-right: 10px; margin-bottom: 10px; height: 230px; }

.portfolio-list-item a { text-decoration: none; }

.portfolio-list-item img { float: left; height: 100%; }

.portfolio-list-item:hover .overlay { display: block; }

.portfolio-list-item .overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.6); color: #FFF; text-decoration: none; text-align: left; font-weight: bold; display: none; line-height: 16px; }

.portfolio-list-item .overlay > span { position: absolute; top: auto; right: 10px; bottom: 10px; left: 10px; }

.portfolio-list-item .overlay strong { text-transform: uppercase; display: block; margin-bottom: 5px; }

.portfolio-list-item .portfolio-deeplink { margin-top: 20px; display: block; text-decoration: underline; }

.portfolio-content { position: absolute; top: 0; right: 0; bottom: auto; left: auto; width: 300px; }

.image-area { position: absolute; top: 0; right: 315px; bottom: auto; left: 0; height: 480px; overflow: hidden; }

.image-slider { width: 100%; height: 100%; position: relative; font-size: 0; white-space: nowrap; -webkit-transition: margin-left 350ms ease-out; }

.image-slide { display: inline-block; zoom: 1; *display: inline; _height: 30px; letter-spacing: normal; word-spacing: normal; background: #CCC; text-align: center; width: 100%; height: 100%; position: relative; overflow: hidden; }

.image-slide img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.image-slide .slide-title { position: absolute; top: auto; right: auto; bottom: 0; left: 0; width: 100%; height: 20px; text-align: center; color: #FFF; font-weight: bold; line-height: 20px; background: #111; }

.page-control { position: absolute; top: auto; right: 0; bottom: 20px; left: 0; letter-spacing: normal; word-spacing: normal; text-align: center; }

.page-control .page-control-page { display: inline-block; zoom: 1; *display: inline; _height: 30px; width: 15px; height: 20px; text-indent: -999em; cursor: pointer; line-height: 20px; position: relative; }

.page-control .page-control-page a { position: absolute; top: 6px; right: auto; bottom: auto; left: 6px; display: block; width: 8px; height: 8px; –webkit-transition: background-color 200ms easeout; border-radius: 8px; background-color: #7E7E7E; }

.page-control .page-control-page.current a, .page-control .page-control-page:hover a { background-color: #111; }

.portfolio-pager-items, .portfolio-iphone-pager-items { position: absolute; top: auto; right: 10px; bottom: 25px; left: 10px; text-align: center; }

.portfolio-iphone-pager { margin-bottom: 10px; }

.portfolio-pager-item { display: inline-block; zoom: 1; *display: inline; _height: 30px; padding: 0 20px; }

.portfolio-pager-item a { text-decoration: none; text-transform: uppercase; color: #898C93; font-weight: bold; }

.portfolio-pager-item .inactive { opacity: 0.3; filter: alpha(opacity=30); text-decoration: none; text-transform: uppercase; color: #898C93; font-weight: bold; }

.portfolio-iphone-pager { display: none; }

.column-page { position: absolute; top: 0; right: 0; bottom: auto; left: 0; }

.content-column { position: absolute; top: 0; right: 320px; bottom: auto; left: 0; }

.image-column { position: absolute; top: 0; right: 0; bottom: auto; left: auto; width: 300px; }

.image-list-item { position: relative; margin-bottom: 10px; }

.image-list-title { position: absolute; top: auto; right: 0; bottom: 0; left: 0; line-height: 20px; color: #FFF; padding-left: 4px; background: #111; font-weight: bold; }

@media (max-width: 650px) { body .content { position: relative; top: 0; left: 0; width: 100%; box-sizing: border-box; padding: 0 10px 0 10px; }
  body #All { width: 100%; position: relative; }
  body .content { overflow: hidden; }
  body .site-hd { right: auto; left: 10px; }
  body .site-nav { top: 50px; }
  body .portfolio-list-items { width: 300px; }
  body .portfolio-list-item { width: 300px; height: auto; }
  body .portfolio-list-item img { min-width: 300px; height: auto; }
  body .portfolio-content { top: 330px; width: 100%; box-sizing: border-box; padding: 0 10px; }
  body .portfolio-pager-items { position: relative; width: 100%; }
  body .image-area { top: 90px; width: 100%; height: 220px; right: auto; }
  body .portfolio-iphone-pager { display: block; }
  body .portfolio-iphone-pager .portfolio-pager-items { margin-top: 35px; right: 0; left: 0; bottom: auto; }
  body .portfolio-iphone-pager .portfolio-pager-items .portfolio-pager-item { padding: 0 19px; }
  body .portfolio-iphone-pager .portfolio-pager-items .portfolio-pager-item:first-child { padding-left: 0; }
  body .portfolio-iphone-pager .portfolio-pager-items .portfolio-pager-item:last-child { padding-right: 0; }
  body .portfolio-pager { display: none; }
  body .image-column { display: none; }
  body .content { padding-top: 90px; }
  body .column-page, body .content-column { position: static; }
  body .content.full { overflow: visible; } }

body { font: normal 12px/20px "Helvetica Neue", Helvetica, Geneva, Arial, sans-serif; }

body { overflow-x: hidden; overflow-y: scroll; }

.flash #wrap { width: 100%; overflow: hidden; }

.flash .overlay { display: block; position: fixed; bottom: 0; left: 0; right: 0; background: #FFF; }

.script-content { display: none; }

strong { font-weight: bold; }

a { color: #111; }

.site-hd { text-indent: 100%; white-space: nowrap; overflow: hidden; display: block; width: 300px; height: 21px; background: no-repeat url(../images/site-hd.png) left top; position: absolute; top: 10px; right: 10px; bottom: auto; left: auto; }

.site-hd a { display: block; width: 100%; height: 100%; }

.site-hd:hover { background-position: 0 -30px; }

.site-footer { position: absolute; top: 33px; right: auto; bottom: auto; left: 10px; }

.site-footer a { color: #999; text-decoration: none; }

.content { position: absolute; top: 60px; right: 10px; bottom: auto; left: 10px; min-height: 550px; }

.site-nav { position: absolute; top: 10px; right: auto; bottom: auto; left: 10px; z-index: 1; }

.site-nav li { display: inline; margin-right: 5px; }

.site-nav li a { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; font-size: 22px; color: #898c93; text-transform: uppercase; text-decoration: none; }

.site-nav li.current a, .site-nav li:hover a { color: #111; }

p { margin-bottom: 20px; }

.major-hd { text-transform: uppercase; font-size: 18px; line-height: 22px; margin-bottom: 20px; }

.content-column h1, .content-column h2 { text-transform: uppercase; font-size: 18px; line-height: 22px; margin-bottom: 10px; }

.major-hd, .content-column h1, .content-column h2 { font-weight: normal; }