@import url(lib/reset.css);
@import url(jquery/ui-lightness/jquery-ui.css);

body {text-align: center; background: #fff url(/images/base.jpg) center top repeat; height:100%; width:100%; font-family: Georgia, arial, sans-serif; font-size: 10px;}

#container {}
#content {text-align: left; width: 1200px; margin: 0 auto;}
#header {text-align: left; height:110px; width:1200px; margin:0 auto; position: relative; z-index: 1000;}
#stage {text-align: left; z-index:10; width: 1200px; margin: 0 auto; overflow: hidden; }
#footer {text-align: left; position: relative; z-index:20; width:100%; margin:0 auto; margin-top:20px; padding:0px 0px 20px 0; background: #333 url(/images/base-noise.jpg) center top repeat; color: #fff;  }
#footer-container {text-align: left; background: url(/images/base-fray.jpg) center top repeat-x; padding-top: 50px;}
		
h1,h2,h3,h4,h5 { font-family: "league-gothic-1","league-gothic-2","Myriad Pro", Arial, Helvetica, sans-serif; }
h1.ja,h2.ja,h3.ja,h4.ja,h5.ja {font-family: arial, sans-serif;}
h1 {} /* website title "Ultra Super New" */
h2 { } /* page title - eg. top page catch line on image or name of page */
h3 {  font-size: 3.1em; line-height: 1.6em;} /* subsection titles */
h4 {}
h5 {}

a { color: #e40478;}
a:hover { color:#ff3ca1;}

.print {display: none;}

/* HEADER */
#header h1 { position:absolute; left:-0px; top:-23px; display: block; width:120px; height:120px;}
#header h1 a { background: url(/images/usn-logo-170.png) 0 0 no-repeat; height:170px; width:170px; display:block; text-indent: -9999px; overflow: hidden;  }
#header h1 a:hover { }

/* MENU */
#menu { position: absolute; right:40px; top:40px; line-height: 40px;  }
#menu li { display: block; float:left; padding:0 20px; font-family: "league-gothic-1","league-gothic-2",sans-serif; color: #000; font-size: 3.6em; border-left:1px solid #ababab;}
#menu li a {  color: #000;  /* letter-spacing: 0.03em; */  text-decoration: none;}
#menu li.active a,
#menu li a:hover { color: #e40478; }
#menu li.small { position: relative; width:120px; height:40px; border-right:1px solid #ababab;}
#menu li.small span { line-height:1em; }
#menu li.small span.subtitle { position:absolute; top:5px; left:24px; font-size: 10px; letter-spacing: 0.2em; padding:0; margin:0; }
#menu li.small span.links { font-size: 20px; position:absolute; bottom:5px; left:24px; display: inline;  }

.access #menu li#access a { color: #e40478; }
.jobs #menu li#jobs a { color: #e40478; }
.projects #menu li#projects a { color: #e40478; }
.apps #menu li#apps a { color: #e40478; }
.stuff #menu li#stuff a { color: #e40478; }

/* TOP */
#top-stage {width: 1200px; border-bottom:8px solid #000;}
#top-stage h2 {width: 1200px; height: 500px; position: relative; background-color: #000;}
#top-stage ul {list-style: none; width: 1200px; height: 500px;}
#top-stage li {width: 1200px; height: 500px; float: left;}
#top-stage li {position: relative;}
#top-stage li a { text-decoration: none; display: block;}
#top-stage li a span { color: #fff; position: absolute; top:150px; left:0; padding:0 40px; font-size:7.5em; line-height:0.9em; }
#top-stage li a img {display: block; }

#top-recent-projects { padding:27px 0 20px 0; height:318px; width: 1200px; margin-bottom: 10px; position: relative; z-index: 10; border-bottom: 1px solid #bbbdb7;}
#top-recent-projects h5 {position:absolute; left:32px; top:-18px; background-color: #000; padding:0 12px; color:#fff; line-height: 26px; height: 26px; font-family: georgia, serif; font-size: 12px; font-weight: bold; font-style: italic; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin:0;}
#top-recent-projects ul.project-thumbs {width:1216px; padding-left: 0; border-bottom: 0; height: 338px; overflow: hidden;}
#top-recent-projects ul.project-thumbs li {width:288px; height:169px; margin:0 16px 0 0;}
#top-recent-projects ul.project-thumbs li a.project-thumb { border:0; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; height: 120px;}
#top-recent-projects ul.project-thumbs li a.project-thumb img {line-height: 120px;}
#top-recent-projects ul.project-thumbs li a.project-thumb:hover {border: 0;}
#top-recent-projects ul.project-thumbs li.activeSlide a.project-thumb { height: 116px; border-bottom:4px solid #000; }
#top-recent-projects ul.project-thumbs li p.project-name { font-size:14px; line-height: 1.2em; margin-top:10px; padding:0 10px; margin-bottom: 0; }
#top-recent-projects ul.project-thumbs li span.client-name { font-style: italic; color: #e40478; }

#top-something { border-top:1px solid #ccc;  /*background-color: #999;*/ padding:10px 0;}
#top-something p { font-size:30px; margin-top:40px;} 

/* CAROUSEL */
a.carousel-previous,
a.carousel-next {display: none;}
div.carousel-pagination {position: absolute; bottom: 13px; right: 19px;}
div.carousel-pagination p {}
div.carousel-pagination p a {display: block; float: left; width: 26px; height: 16px; outline: none; text-indent: -9999px; background: transparent url(../images/carousel-pagination.png) 0 0 no-repeat; cursor: pointer;}
div.carousel-pagination p a.active {background-position: 0 -16px;}

/* PROJECTS */
#projects-projects ul.project-thumbs { padding-bottom:20px; }
#projects-projects ul.project-thumbs li img {width:244px; height:103px;}
#projects-projects h3 { clear:both; line-height:1em; padding: 7px 40px 11px 40px; margin:10px 0 20px 0;/*border-top:1px solid #ccc; */border-bottom:1px solid #4f5154; color: #000; }

/* PROJECT */
#project-stage {  position:relative; }
#project-stage h2 {margin-bottom: 37px; height: 500px; background-color: #ccc;}
#project-stage h2 a { text-decoration: none; }
#project-stage h2 a span { color: #fff; position: absolute; top:150px; left:0; padding:0 35px; font-size:7.5em; line-height:0.9em; }
#project-stage h2 a span em {color: #E40478; font-style: normal;}
#project-stage h2 a img {  border-bottom:7px solid #000;}

#project-stage-meta {border-bottom: 1px solid #000;}
#project-stage-meta .project-title {width: 392px; float: left; overflow: hidden;}
#project-stage-meta .project-title dl {border-bottom: 1px solid #9ba49e; padding-bottom: 8px;}
#project-stage-meta .project-title dl dt {color: #e40478; margin-right: 5px;}
#project-stage-meta .project-title dl dd {color: #666;}
#project-stage-meta .project-title dl dt,
#project-stage-meta .project-title dl dd {display: inline; font-family: "georgia", serif; font-style: italic;  font-size: 24px;}
#project-stage-meta .project-description {width: 712px; float: right;}
#project-stage-meta {margin-left: 40px; margin-right: 40px; margin-bottom: 0px;}
#project-stage-meta h3 {font-size: 57px; line-height: 0.9em; }
#project-stage-meta .description p { font-size:1.4em; line-height: 1.4em; padding-bottom:20px;}
#project-stage-meta .description.en { clear:both;}
#project-stage-meta .description.en p { }
#project-stage-meta .description.ja p {font-family: arial, sans-serif;}

#project-stage-social {margin-top: 15px; width: 392px; height: 70px; overflow: hidden; position: relative;}
#project-stage-social ul {list-style: none; width: 702px; height: 70px; overflow: hidden;}
#project-stage-social ul:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
#project-stage-social li {float: left; width: 45px; height: 45px; overflow: hidden; position: relative;}
#project-stage-social li#s-hatena div a,
#project-stage-social li#s-tumblr div a {text-decoration: none; cursor: pointer; display: block; width: 80px; height: 45px; margin-right: 0!important; top: 13px!important; left: 20px;}
#project-stage-social li#s-hatena div a img {position: relative; bottom: -3px;}
#project-stage-social li#s-tumblr div a img {position: relative; bottom: -2px;}
#project-stage-social li#s-hatena div a em,
#project-stage-social li#s-tumblr div a em {position: relative; left: 5px; top: -1px; font-size: 12px; font-family: georgia, serif; color: #333; font-style: italic; font-weight: bold;}
#project-stage-social li#s-hatena div a em {top: 2px;}
#project-stage-social li strong {text-indent: -9999px; display: block; width: 45px; height: 45px; background: transparent url(../images/icons-social.png) 0 0 no-repeat; position: relative; z-index: 2;}
#project-stage-social li div {display: none; position: absolute; top: 0; left: 0; height: 65px; width: 100px; padding-left: 45px; z-index: 0; background: #d2d4d3 url(../images/social-divider.png) 51px 5px no-repeat; float: left;}
#project-stage-social li.large small {width: 100px;}
#project-stage-social li.large div {width: 130px;}
#project-stage-social li.full div {width: 347px;}
#project-stage-social li#s-twitter div {background-image: none;}
#project-stage-social li#s-twitter p {width: 200px; position: absolute; bottom: 7px; left: 50px; font-size: 12px; font-family: georgia, serif; color: #333; font-style: italic; font-weight: bold;}
#project-stage-social li#s-twitter strong {background-position: 0 0;}
#project-stage-social li#s-twitter form {width: 335px; background-color: #f7f7f7; height: 33px; position: absolute; top: 6px; right: 6px;}
#project-stage-social li#s-twitter form input.text {font-size: 2em; -webkit-appearance: caret; position: relative; left: 5px; width: 260px; padding: 0; height: 33px; line-height: 33px; background-color: transparent; border: 0;}
#project-stage-social li#s-twitter form input.button {cursor: pointer; width: 60px; font-weight: bold; padding-top: 3px; padding-bottom: 3px; font-family: gerogia, serif; text-transform: uppercase; font-size: 1em; background-color: #727272; color: #fff; border:0;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; position: absolute; right: 5px; top: 7px;}
#project-stage-social li#s-twitter form input.button:hover {background-color: #000;}
#project-stage-social li#s-hatena strong {background-position: 0 -45px;}
#project-stage-social li#s-tumblr strong {background-position: 0 -90px;}
#project-stage-social li#s-mixi strong {background-position: 0 -133px;}
#project-stage-social li#s-mixi div img {position: relative; top: 8px; left: 25px;}
#project-stage-social li#s-facebook strong {background-position: 0 -180px;}
#project-stage-social li#s-facebook div iframe {position: relative; top: 12px; left: 25px;}

 
#project-social { display:none; }
#project-social td { vertical-align: middle; padding:10px; }
#project-social td h4 { font-size: 20px;   }
#project-social td h4 a { color: #000;  text-decoration: none;}
#project-social td h4 a:hover { color:#e40478;}
#project-social td h4 a img { vertical-align: baseline; }

/* JOBS */
#jobs-menu {margin-bottom: 45px;}
#job-show {margin: 0 40px; margin-bottom: 40px; border-bottom: 1px solid #B0ADAA;}
#job-show h4 { font-size: 50px; line-height: 1em;  margin-bottom: 15px;}
#job-show h4.ja { font-size: 40px; font-weight: bold;}
#job-show p { font-size:12px; line-height: 1.4em; margin: 0 0 20px 0;} 
#job-show ul {list-style: disc; padding-left: 15px;}
#job-show li {font-size: 12px; list-style: disc; line-height: 1.4em;}

#job-show .job {/* border-bottom: 1px solid #4d4f4d; */ /* padding-bottom: 40px; */margin-bottom: 20px; padding-bottom: 20px;}
#job-show .job .inner {width: 1120px; background: transparent url(../images/divider-vertical-b.gif) 50% 0 repeat-y; padding-bottom: 0;}
#job-show .job .inner:after {content: "."; display: block; height: 0; clear: both;visibility: hidden;}
#job-show .job#job-ja {font-family: arial, sans-serif; border-bottom: 1px solid #bbbdbc; }
#job-show .job .description {float: left; width:521px;  padding-right: 40px;}
#job-show .job .requirements {float:right; width:512px;}
#job-show .job .requirements dl dt {font-family: "Georgia", serif; font-size: 20px; text-decoration: underline; margin-bottom: 16px; font-style: italic; font-weight: 500; padding-top: 20px;}
#job-show .job .requirements dl dd {padding: 0px; margin: 0px;}

#jobs-menu h3 { clear:both; line-height:1.5em; margin:8px 0 10px 0; padding: 0 40px; font-size:30px; border-bottom:1px solid #4d4d4f; color: #000; }
#jobs-menu h3 span {color: #000;}
#jobs-links { color: #000; font-size: 24px; margin-left:10px; }
#jobs-links em {color:#e40478; font-style: normal;}

#jobs-links a { color:#000; text-decoration: none; margin:0 5px; }
#jobs-links a:hover { text-decoration: underline; }
#jobs-links a.active { color:#e40478; text-decoration: none; }

#job-apply {clear: both; margin-bottom: 20px; height: 40px; font-size: 1em;}
#job-apply:after {content: "."; display: block; height: 0; clear: both;visibility: hidden;}
#job-apply a,
#job-apply.ja a {cursor: pointer!important; color: #fff; background-color: #000; height: 40px; line-height: 40px; display: block; float: left; font-weight: 100; font-family: "league-gothic-2","league-gothic-1","Myriad Pro", Arial, Helvetica, sans-serif; padding:0 20px;  font-size: 24px; text-decoration: none;  }
#job-apply.ja a {font-size: 18px; font-weight: bold; font-family: arial, sans-serif;}
#job-apply a:hover { background-color: #e40478;}

#jobs-list li.job { padding:20px 0; clear:both; }
#jobs-list li.job .job-en { float:left; width:450px; }
#jobs-list li.job .job-ja { float:left; width:450px; }
#jobs-list li.job p { font-size:14px; line-height: 1.2em;}
#jobs-list .job-ja h4 { font-size:20px; font-weight:bold;}

/* STUFF */
#stuff-stage #page-intro {margin-bottom: 42px;}

#stuff-board {width: 1120px; height: 784px; position: relative; margin-left: 40px; margin-bottom: 40px;}
#stuff-board div.division-a {width: 714px; height: 510px; position: absolute; top: 0; left: 0;}
#stuff-board div.division-b {width: 391px; height: 510px; position: absolute; right: 0; top: 0;}
#stuff-board div.division-c {width: 1120px; border-top: 3px solid #19191a; height: 254px; position: absolute; bottom: 0; left: 0;}

#stuff-board dl {padding: 0; margin: 0; position: absolute;}
#stuff-board dl dt,
#stuff-board dl dd {position: absolute; font-family: "league-gothic-1","league-gothic-2",sans-serif; text-transform: uppercase; line-height: 1em; padding: 0; margin: 0;}
#stuff-board dl em {font-style: normal; display: block;}
#stuff-board dl strong {font-weight: normal; display: block;}

#stuff-board dl.tweets {top: 0; left: 0; width: 714px; height: 117px; border-top: 8px solid #19191a; border-bottom: 3px solid #19191a; }
#stuff-board dl.tweets dt {font-size:7.3em; width: 495px; border-right: 1px solid #19191a; height: 90px; line-height: 90px; left: 0; top: 15px; background: transparent url(../images/stuff-tweeter.gif) 401px no-repeat;}
#stuff-board dl.tweets dd {right: 0; height: 90px; line-height: 90px; top: 15px; font-size: 8.5em; color: #028def; width: 215px; text-align: center;}

#stuff-board dl.birthday {width: 234px; height: 365px; left: 0; top: 144px; background: transparent url(../images/stuff-birthday.gif) 0 0 no-repeat; border-bottom: 1px solid #aeacae;}
#stuff-board dl.birthday dd {top: 120px; width: 234px; text-align: center; color: #fff; font-size: 7.5em;}
#stuff-board dl.birthday dt {top: 223px; width: 234px; border-top: 1px solid #aeacae; height: 144px;}
#stuff-board dl.birthday dt em {margin-top: 13px; font-style: normal; display: block; font-size: 4.5em; text-align: center; line-height: 1.6em;}
#stuff-board dl.birthday dt strong {font-weight: normal; display: block; font-size: 5.6em; line-height: 0.3em; text-align: center; padding-bottom: 20px;}

#stuff-board dl.ping-pong {width: 438px; border-left: 1px solid #0c0c0c; height: 365px; right: 26px; top: 144px; background: transparent url(../images/stuff-ping-pong.gif) 100% 100% no-repeat;}
#stuff-board dl.ping-pong dt {width: 407px; top: 0; right: 0; text-align: center; line-height: 1em;}
#stuff-board dl.ping-pong dt em {display: block; font-size: 6.6em; text-align: center; font-style: normal; line-height: 1em;}
#stuff-board dl.ping-pong dt strong {display: block;  font-size: 6.8em; line-height: 0.6em; font-weight: normal; padding-bottom: 10px;}
#stuff-board dl.ping-pong dd {color: #fff; right: 45px; font-size: 11em; width: 150px; bottom: 90px; text-align: center;}

#stuff-board dl.red-bulls {height: 291px; width: 391px; top: -19px; background: transparent url(../images/stuff-red-bull.gif) 20px 0 no-repeat;}
#stuff-board dl.red-bulls dt {width: 231px; top: 19px; height: 256px; right: 0; border-top: 8px solid #19191a; border-bottom: 8px solid #19191a; text-align: center;}
#stuff-board dl.red-bulls dt em {font-size: 5em; line-height: 1em; margin-top: 10px;}
#stuff-board dl.red-bulls dt strong {font-size: 5.1em; line-height: 0.7em;}
#stuff-board dl.red-bulls dt span {display: block; font-size: 5.3em; line-height: 0.9em;}
#stuff-board dl.red-bulls dd {width: 190px; height: 115px; border-top: 1px solid #b1afaf; font-size: 11.5em; line-height: 115px; bottom: 0px; right: 20px; text-align: center; padding-top: 0px; color: #fe0000;}
	
#stuff-board dl.bicycles {bottom: 0; right: 0; width: 391px; height: 201px; background: transparent url(../images/stuff-bicycles.gif) 100% 100% no-repeat;}
#stuff-board dl.bicycles dt {width: 391px; font-size: 3.7em; border-bottom: 1px solid #b4b6ac; line-height: 1em; padding-bottom: 10px;}
#stuff-board dl.bicycles dd {font-size: 11em; color: #ff9000; width: 150px; text-align: center;bottom: 20px;}

#stuff-board dl.glasses {width: 714px; height: 117px; border-bottom: 1px solid #8e9691;  top: 7px; background: transparent url(../images/stuff-glasses.gif) 0 no-repeat;}
#stuff-board dl.glasses dt {left: 369px; height: 117px; line-height: 117px; font-size: 4.8em; width: 359px; border-right: 5px solid #19191a;}
#stuff-board dl.glasses dd {text-align: right; height: 117px; line-height: 117px; font-size: 10em; width: 348px; color: #848484;}

#stuff-board dl.pencils {width: 372px; height: 117px; top: 7px; right: 0; background: transparent url(../images/stuff-pencil.gif) 100% 60px no-repeat; border-bottom: 1px solid #b1a4a8;}
#stuff-board dl.pencils dt {width: 220px; height: 100px; right: 0; top: 20px;font-size: 2.5em; line-height: 0.9em;}
#stuff-board dl.pencils dd {width: 145px; height: 100px; text-align: center; color: #2a2929; font-size: 11em; height: 117px; line-height: 117px;}

#stuff-board dl.emails {bottom: 0; left: 0; width: 1120px; height: 108px; border-bottom: 1px solid #1a1a1a; background: transparent url(../images/stuff-emails.gif) 50% 15px no-repeat;}
#stuff-board dl.emails dt.received {width: 192px; height: 71px; border-right: 1px solid #8d8e8e;}
#stuff-board dl.emails dt.received strong {font-size: 5.5em; line-height: 0.8em;}
#stuff-board dl.emails dt.received em {font-size: 3.6em; line-height: 0.8em;}
#stuff-board dl.emails dd.received {width: 320px; left: 193px; text-align: center; color: #39b3e8; font-size: 9.5em; line-height: 0.8em;}

#stuff-board dl.emails dt.sent {width: 175px; height: 71px; right: 312px; border-right: 1px solid #8d8e8e;}
#stuff-board dl.emails dt.sent strong {font-size: 4.9em; line-height: 0.8em;}
#stuff-board dl.emails dt.sent em {font-size: 4.2em; line-height: 0.8em;}
#stuff-board dl.emails dd.sent {width: 300px; right: 0; text-align: center; color: #ff2e2e; font-size: 9.5em; line-height: 0.8em;}

/* ACCESS */
#access-stage {}
#access-stage #page-intro {margin-bottom: 42px;}
#access-stage .access-elements {width: 1120px; margin-left: 40px; margin-bottom: 40px;}
#access-stage .access-elements:after {content: "."; display: block; height: 0; clear: both;visibility: hidden;}
#access-stage .access-videos {width: 400px; float: left;}
#access-stage .access-videos h2 {font-size: 2.8em; height: 30px; line-height: 30px; text-transform: uppercase;}
#access-stage .access-videos h3 {font-size: 14px; height: 20px; line-height: 20px; margin-bottom: 10px; text-transform: none; font-family: "Georgia", serif; font-style: italic;}
#access-stage .access-videos .video {margin-bottom: 20px; height: 225px;}

/* TEMP */
/*
#access-stage .access-videos .video-a,
#access-stage .access-videos .video-b {display: none;} 
*/

#access-stage .access-map {width: 704px; height: 650px; float: right; overflow: hidden; position:relative; background: transparent;}
#access-stage .access-map #map_canvas {clear: both; width: 704px; height: 590px; background: url(../images/maps/USN-Map-Test-01.jpg) no-repeat;}
#access-stage .access-map #map_canvas.omotesando { background: url(../images/maps/USN-Map-Test-01.jpg) 100% 100% no-repeat; }
#access-stage .access-map #map_canvas.harajuku { background: url(../images/maps/USN-Map-Test-01.jpg) 0 0 no-repeat; }

#access-stage .access-map address {width: 550px; float: left; font-size: 1.3em; line-height: 1.3em;}
#access-stage .access-map address .ja {font-style: normal;}

#access-stage .access-map #print_link {height: 45px; width: 100px; float: right; overflow: hidden; padding-top: 15px;}
#access-stage .access-map #print_link a { display: block;  height: 20px; background: #e40379; color: #ffffff; 
    text-align: center; -moz-border-radius: 5px; border-radius: 5px; -webkit-border-radius: 5px; font-size: 1.2em;
    overflow: hidden; text-decoration: none; padding-top: 8px; font-family: georgia, times, serif; font-style: italic;}

#access-stage .access-map #gmap_link {display: none; height: 45px; width: 133px; float: right; overflow: hidden; padding-top: 15px;}
#access-stage .access-map #gmap_link a { display: block;  height: 20px; background: #e40379; color: #ffffff; 
    text-align: center; -moz-border-radius: 5px; border-radius: 5px;  -webkit-border-radius: 5px; font-size: 1.2em;
    overflow: hidden; text-decoration: none; padding-top: 8px; font-family: georgia, times, serif; font-style: italic;}

/* GENERAL - PROJECT THUMBS */
#projects-projects {padding-bottom: 15px;}
#page-intro { }
#page-intro h2 { font-size:9em; line-height:0.8em; padding:40px 40px 32px 40px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; /* text-align: justify; */}
#page-intro h2 span { color:#e40478;}

ul.project-thumbs { display: block; margin-left:0px; width:1200px; padding-left: 40px; /*border-bottom: 1px solid #b0adaa;*/}
ul.project-thumbs:after {content: "."; display: block; height: 0; clear: both;visibility: hidden;}
ul.project-thumbs li { display:block; float:left; width:248px; height:169px; margin:0 42px 0 0; }
ul.project-thumbs li a.project-thumb { border:2px solid #fff; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; height: 102px; display:block; margin-bottom: 2px; text-decoration:none; overflow: hidden;}
ul.project-thumbs li a.project-thumb img { display:block; width:288px; height:120px; background-color: #fff; color: #333; text-align: center; line-height: 100px; text-decoration:none; font-style: italic; }
ul.project-thumbs li a.project-thumb:hover {border:2px solid #e40478;}
ul.project-thumbs li p.project-name { font-size:14px; line-height: 1.2em; margin-top:10px; padding:0 10px; margin-bottom: 0; }
ul.project-thumbs li span.client-name { font-style: italic; color: #e40478; }

/* FOOTER */
#footer {clear:both;}
#footer .block { width:1200px; margin:0 auto; clear:left; padding-top:20px;}

#footer div.row {width: 1200px; margin: 0 auto; clear: both;}
#footer div.row:after {content: "."; display: block; height: 0; clear: both;visibility: hidden;}
#footer div.row.divider {background: transparent url(../images/divider-vertical.gif) 50% 0 repeat-y; margin-bottom: 40px;}

#footer h3 {line-height: 1em;}
#footer a { color: #f592c5; }
#footer a:hover { color: #f3b2d4; }

#footer-contact {float:left; width:510px; background: transparent url(../images/bg-contact-details.gif) 40px 0 no-repeat; color: #999; padding-left: 40px;}
#footer-contact p { font-size: 14px; margin-bottom: 15px; line-height: 1.3em; color: #999; }
#footer-contact p.adr.ja {}
#footer-contact div.address {height: 250px; width: 350px; margin-left: 200px; font-style: normal; display: block; padding-top: 0px; }
#footer-contact blockquote {margin-bottom: 8px; font-family: georgia, times, serif; color: #fefefe; font-style: italic; font-size: 16px; font-style: italic; line-height: 1.4em; text-transform: uppercase;}
#footer-contact blockquote.ja {border-top: 1px solid #323232; padding-top: 15px; font-family: arial, sans-serif; font-style: normal; font-size: 15px; line-height: 1.2em;}
#footer-contact ul.phone {list-style: none; border-top: 1px solid #515151; padding-top: 9px;}
#footer-contact ul.phone li {display: inline; margin-right: 5px; font-size: 11px; }
#footer-contact ul.phone li span.type {font-weight: bold;}
	
#footer-tweets { float:right; width:510px; padding-right: 40px;  }
#footer-sign { position:relative; width: 1200px; margin: 0 auto; clear:both; padding:0 0 50px 0; border-top:1px solid #494949;  }

#footer-tweets h3 {color: #646464; background: transparent url(../images/twitter-bird.gif) 23px -3px no-repeat; margin-bottom: 5px;}
#footer-tweets h3 span {position: relative; top: -4px; color: #434343;}
#footer-tweets h3 span.open {margin-right: 55px;}
#footer-tweets h3 span.close {margin-left: 10px;}
#footer-tweets h3 a { font-family: georgia, times, serif; color: #fff; font-size: 14px; font-style: italic; margin-left: 10px; text-decoration: none;}
#footer-tweets ul.twitter {}
#footer-tweets li.twitter-item {border-top: 1px solid #323232; font-size: 12px; position: relative;line-height: 1.3em; padding: 8px 0; color: #999;}
#footer-tweets li.twitter-item a {font-style: italic;}
#footer-tweets li.twitter-item img.twitter-profile { width:50px; height:50px; position:absolute; left:0; top:20px; background-color: #000; display:none; }
#footer-tweets li.twitter-item .twitter-timestamp { color: #fff; font-style: italic; display: block; font-size:0.7em; text-align: justify;  }

#footer-company-info {background: transparent url(../images/bg-company-info.png) 0 0 repeat; clear:both; margin:0 auto; width:1200px; border-bottom:1px solid #494949; padding-top: 30px; }
#footer-company-info div.profile {width: 320px; padding: 0 40px 20px 40px; float: left;}
#footer-company-info div.company-profile {width: 520px; padding: 0 40px; float: left;}
#footer-company-info h3 {font-size: 25px; letter-spacing: 1px; text-transform: uppercase; margin-left: 40px; margin-bottom: 25px; padding: 0; line-height: 1em;}
#footer-company-info h3.company-info {border-top: 1px solid #292828; padding-top: 35px;}
#footer-company-info h3 em {font-weight: bold; font-size: 22px; font-style: normal; font-family: arial, sans-serif;}
#footer-company-info div.profile h4 {margin-bottom: 2px; font-size: 12px; font-style: normal; }
#footer-company-info div.profile h4 span {padding: 0 8px;}
#footer-company-info div.profile h4.ja {margin-bottom: 3px;}
#footer-company-info div.profile h5 {margin-bottom: 2px; font-size: 12px; color: #fff;}
#footer-company-info div.profile h5.ja {background: transparent url(../images/divider-horizontal.gif) 0 100% repeat-x; margin-bottom: 8px; padding-bottom: 8px;}
#footer-company-info div.profile h4 strong,
#footer-company-info div.profile h5 strong {font-family: georgia, times, serif; line-height: 1.2em;}
#footer-company-info div.company-profile ul {list-style: none; margin-bottom: 0;}
#footer-company-info div.company-profile ul li {margin-bottom: 12px; line-height: 1.2em; font-family: georgia, times, serif; color: #909090; font-size: 12px;}
#footer-company-info div.company-profile ul li:last-child {margin-bottom: 0;}
#footer-company-info div.company-profile ul li strong {color: #fff; font-weight: bold;}
#footer-company-info div.company-profile.ja ul li {font-family: arial, sans-serif;}
#footer-company-info div.company-profile.ja ul li strong {font-style: normal; color: #fff; font-weight: bold;}
#footer-company-info p {color: #909090; font-size: 12px; line-height: 1.2em; margin-bottom: 20px;}

#footer-sign h5.copyright {margin-left: 40px; font-family: georgia, times, serif; font-size: 11px; color:#aaa; padding-top: 20px; margin-bottom: 0;}

#footer-tab { display: block; position:absolute; right:0; top:-2px;}
#footer-tab a { background: url(/images/pink-tab-base.png) left bottom repeat-x; margin-right:40px; display: block; width:100px; height:30px; text-align: center; color: #fff; text-decoration: none; line-height: 25px; font-family: georgia, serif; font-size: 12px; font-weight: bold; font-style: italic; }


/* THE GRID! */
.the-grid {width: 1136px; margin-left: 40px; padding-top: 20px;}
.the-grid:after {content: "."; display: block; height: 0; clear: both;visibility: hidden;}
.the-grid .element {margin-right: 15px; float: left; margin-bottom: 15px; overflow: hidden; position: relative;}
.the-grid .element img, .the-grid .element video, .the-grid .element embed {display: block;}
.the-grid .element .print-only {width: 0px; height: 0px; overflow: hidden;}
.the-grid .element .print-only img.print {display: block; visibility: hidden;}

/* NOTICE */
#notice {margin-bottom: 5px; padding-top: 20px; padding-left: 125px; padding-right: 60px; text-align: center; border-top: 1px solid #BBBDB7;}
	#notice p {font-size: 1.4em; line-height: 1.2em; margin-bottom: 15px; font-style: italic;}
	#notice p.ja {font-size: 1.3em; font-family: "Myriad Pro", Arial, Helvetica, sans-serif; font-style: normal;}
	
/* QUAKE PAGE */
#quake-page {border-top: 1px solid #ccc; padding-top: 50px;}
#quake-page .sidebar {width: 350px; float: left; margin-bottom: 30px;}
#quake-page .content-row {width: 1200px; margin-bottom: 20px; border-bottom: 1px solid #ccc; padding-bottom: 20px;}
#quake-page .content-row:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
#quake-page .content {width: 820px; float: right;}
#quake-page .content .inner {padding: 10px;}
#quake-page .content .english,
#quake-page .content .japanese {background-color: #fff;}
#quake-page .content .english {float: left; width: 400px;}
#quake-page .content .japanese {float: right; width: 400px;}
#quake-page p,
#quake-page dt,
#quake-page dd,
#quake-page li {font-size: 1.2em; line-height: 1.4em; margin-bottom: 20px;}
#quake-page dt {font-weight: bold; margin-bottom: 3px;}
#quake-page dd,
#quake-page li {margin-bottom: 10px;}
#quake-page .ja {font-family: arial, sans-serif;}
#quake-page h2 {font-size: 3.8em; text-transform: uppercase; border-bottom: 3px solid #ccc; padding-bottom: 20px; margin-bottom: 20px;}
#quake-page h2 .ja {font-size: 25px;}

#quake-page h3 {font-size: 3em; line-height: 1em;}
#quake-page h3 .ja {font-size: 16px; line-height: 14px; font-family: arial, sans-serif;}
	
/* ############################################################### */
/* 900px SIZE VARIATION */
/* ############################################################### */

body.s900 #content {width: 900px;}
body.s900 #header {width:900px;}
body.s900 #stage {width: 900px;}
body.s900 #footer-sign {width: 900px;}

/* GENERAL */
body.s900 ul.project-thumbs {width:900px;}
body.s900 #page-intro h2 {font-size: 6.7em;}

/* PROJECT */
body.s900 #project-stage h2 {height: 375px;}
body.s900 #project-stage h2 a span {font-size:5.5em; top: 100px;}
body.s900 #project-stage h2 a img { width: 900px;}
body.s900 #project-stage-meta .project-title {width: 820px; float: none;}
body.s900 #project-stage-meta .project-description {width: 820px; float: none;}
body.s900 #project-stage-social {margin-top: 10px; width: 820px;}
body.s900 #project-stage-social ul {width: 820px;}

/* THE GRID! */
body.s900 .the-grid {width: 836px; margin-left: 40px; overflow: hidden;}

/* TOP */
body.s900 #top-stage {width: 900px;}
body.s900 #top-stage h2 {width: 900px; height: 375px;}
body.s900 #top-stage ul {width: 900px; height: 375px; overflow: hidden;}
body.s900 #top-stage li {width: 900px; height: 375px;}
body.s900 #top-recent-projects {width: 900px;}
body.s900 #top-recent-projects ul.project-thumbs {width:916px;}
body.s900 #top-stage h2 a span { font-size: 5.5em; top:112px;}
body.s900 #top-stage h2 a img { width:900px; height:375px; }

/* ACCESS */
body.s900 #access-stage .access-videos h2 {font-size: 2.1em; height: 21px; line-height: 21px;}
body.s900 #access-stage .access-videos h3 {font-size: 1.2em; height: 14px; line-height: 14px; margin-bottom: 7px;}
body.s900 #access-stage .access-elements {width: 820px;}
body.s900 #access-stage .access-videos {width: 292px;}
body.s900 #access-stage .access-videos .video {height: 164px; margin-bottom: 14px;}

body.s900 #access-stage .access-map {width: 515px; height: 468px; position: relative; }
body.s900 #access-stage .access-map #map_canvas {width: 515px; height: 468px; background: url(../images/maps/USN-Map-Test-02.jpg) no-repeat;}
body.s900 #access-stage .access-map #map_canvas.omotesando { background: url(../images/maps/USN-Map-Test-02.jpg) 100% 100% no-repeat; }
body.s900 #access-stage .access-map #map_canvas.harajuku { background: url(../images/maps/USN-Map-Test-02.jpg) 0 0 no-repeat; }
body.s900 #access-stage .access-map #gmap_link,
body.s900 #access-stage .access-map #print_link {height: 37px; overflow: hidden; padding-top: 4px;}
body.s900 #access-stage .access-map address {width: 400px; float: left; font-size: 1.1em; line-height: 1.1em;}

/* JOBS */ 
body.s900 #job-show .job .inner {width: 820px;}
body.s900 #job-show .job .description {width:390px;}
body.s900 #job-show .job .requirements {width:390px;}

/* STUFF */
/* A lot of absolute positioning, all measurement values divided by 1.3658536 and rounded down. */
body.s900 #stuff-board {width: 820px; height: 574px;}
body.s900 #stuff-board div.division-a {width: 522px; height: 373px;}
body.s900 #stuff-board div.division-b {width: 286px; height: 373px;}
body.s900 #stuff-board div.division-c {width: 820px; border-top: 2px solid #19191a; height: 185px;}

body.s900 #stuff-board dl.tweets {width: 522px; height: 85px; border-top: 5px solid #19191a; border-bottom: 2px solid #19191a;}
body.s900 #stuff-board dl.tweets dt {font-size:5.3em; width: 362px; height: 65px; line-height: 65px; top: 10px; background: transparent url(../images/stuff-tweeter-s900.gif) 293px no-repeat;}
body.s900 #stuff-board dl.tweets dd {height: 65px; line-height: 65px; top: 10px; font-size: 6.2em; width: 157px;}

body.s900 #stuff-board dl.birthday {width: 171px; height: 267px; top: 105px; background: transparent url(../images/stuff-birthday-s900.gif) 0 0 no-repeat;}
body.s900 #stuff-board dl.birthday dd {top: 87px; width: 171px; font-size: 5.4em;}
body.s900 #stuff-board dl.birthday dt {top: 163px; width: 171px; height: 105px;}
body.s900 #stuff-board dl.birthday dt em {margin-top: 9px; font-size: 3.2em; line-height: 1.6em;}
body.s900 #stuff-board dl.birthday dt strong {font-size: 4.1em; line-height: 0.3em; padding-bottom: 14px;}

body.s900 #stuff-board dl.ping-pong {width: 320px; height: 267px; right: 19px; top: 105px; background: transparent url(../images/stuff-ping-pong-s900.gif) 100% 100% no-repeat;}
body.s900 #stuff-board dl.ping-pong dt {width: 297px;}
body.s900 #stuff-board dl.ping-pong dt em {font-size: 4.8em;}
body.s900 #stuff-board dl.ping-pong dt strong {font-size: 4.9em; padding-bottom: 7px;}
body.s900 #stuff-board dl.ping-pong dd {right: 32px; font-size: 8em; width: 109px; bottom: 65px;}

body.s900 #stuff-board dl.red-bulls {height: 213px; width: 286px; top: -13px; background: transparent url(../images/stuff-red-bull-s900.gif) 14px 0 no-repeat;}
body.s900 #stuff-board dl.red-bulls dt {width: 169px; top: 13px; height: 187px; border-top: 5px solid #19191a; border-bottom: 5px solid #19191a;}
body.s900 #stuff-board dl.red-bulls dt em {font-size: 3.6em; margin-top: 7px;}
body.s900 #stuff-board dl.red-bulls dt strong {font-size: 3.7em;}
body.s900 #stuff-board dl.red-bulls dt span {font-size: 3.8em;}
body.s900 #stuff-board dl.red-bulls dd {width: 139px; height: 84px; font-size: 8.4em; line-height: 84px; right: 14px;}
	
body.s900 #stuff-board dl.bicycles {width: 286px; height: 147px; background: transparent url(../images/stuff-bicycles-s900.gif) 100% 100% no-repeat;}
body.s900 #stuff-board dl.bicycles dt {width: 286px; font-size: 2.7em; padding-bottom: 7px;}
body.s900 #stuff-board dl.bicycles dd {font-size: 8em; width: 109px; bottom: 14px;}

body.s900 #stuff-board dl.glasses {width: 522px; height: 85px;  top: 5px; background: transparent url(../images/stuff-glasses-s900.gif) 0 no-repeat;}
body.s900 #stuff-board dl.glasses dt {left: 270px; height: 85px; line-height: 85px; font-size: 3.5em; width: 262px; border-right: 3px solid #19191a;}
body.s900 #stuff-board dl.glasses dd {height: 85px; line-height: 85px; font-size: 7em; width: 254px;}

body.s900 #stuff-board dl.pencils {width: 272px; height: 85px; top: 5px; background: transparent url(../images/stuff-pencil-s900.gif) 100% 43px no-repeat;}
body.s900 #stuff-board dl.pencils dt {width: 161px; height: 73px; top: 14px; font-size: 1.8em;}
body.s900 #stuff-board dl.pencils dd {width: 106px; height: 73px; font-size: 8em; height: 85px; line-height: 85px;}

body.s900 #stuff-board dl.emails {left: 0; width: 820px; height: 79px; background: transparent url(../images/stuff-emails-s900.gif) 50% 10px no-repeat;}
body.s900 #stuff-board dl.emails dt.received {width: 140px; height: 51px;}
body.s900 #stuff-board dl.emails dt.received strong {font-size: 4em;}
body.s900 #stuff-board dl.emails dt.received em {font-size: 2.6em;}
body.s900 #stuff-board dl.emails dd.received {width: 234px; left: 141px; font-size: 6.9em;}

body.s900 #stuff-board dl.emails dt.sent {width: 128px; height: 51px; right: 228px;}
body.s900 #stuff-board dl.emails dt.sent strong {font-size: 3.5em;}
body.s900 #stuff-board dl.emails dt.sent em {font-size: 3em;}
body.s900 #stuff-board dl.emails dd.sent {width: 219px; font-size: 6.9em;}

/* MENU */
body.s900 #menu li { font-size:3em; padding:0 15px;}
body.s900 #menu li.small span.subtitle {left: 19px;}
body.s900 #menu li.small span.links {left: 19px;}
	
/* FOOTER */
body.s900 #footer .block { width:900px;}
body.s900 #footer div.row {width: 900px;}
body.s900 #footer div.row.divider {background-image: none; margin-bottom: 40px;}

body.s900 #footer-tweets { float:none; width:820px; margin-bottom: 40px; margin-left: 40px;}
body.s900 #footer-contact {float:none; width:820px; height: 250px; margin-left: 40px; background-position: 0 0; padding-left: 0;}
body.s900 #footer-contact div.address {height: auto; width: auto; }
body.s900 #footer-contact ul.phone {margin-left: 200px;}

body.s900 #footer-company-info {width:900px;}
body.s900 #footer-company-info div.profile {width: 220px;}
body.s900 #footer-company-info div.company-profile {width: 370px;}
body.s900 #footer .block { width:900px;}

/* QUAKE PAGE */

body.s900 #quake-page .sidebar {width: 250px;}
body.s900 #quake-page .content-row {width: 900px;}
body.s900 #quake-page .content {width: 620px;}
body.s900 #quake-page .content .english {width: 300px;}
body.s900 #quake-page .content .japanese {width: 300px;}