/* CSS Document */
html { height: 100%; min-height: 800px; }
body { margin: 0; padding: 0; color: #666666; height:100%; background-color:#1f1b1d; }
h3, h4 { margin:0 0 5px 0; }
p { font-family:Georgia, "Times New Roman", Times, serif; font-size:12px; }
p a { color:inherit; }
a { outline: none; overflow: hidden; } 
.projects ul { padding-left:10px; list-style-type:none; margin-top:3px; }
.projects ul li { line-height:21px; }
.projects ul li a { color:#666; background:url(../images/pointer.png) no-repeat 0 4px; padding-left:30px; }
#menu ul li a { background:none; }
.projects ul li a:hover { color:#000; }
p a:hover { color:#000; }
#wrapper { background: url("../images/ts_background.jpg") no-repeat center top; height:100%; padding-top:60px; }
#book { margin:auto; height:732px; width:983px; left:28px; position: relative; z-index:1; }
#book.preface { background:url(../images/book-preface.jpg) no-repeat 0 0; }
#book.co-op { background:url(../images/book-co-op.jpg) no-repeat 0 0; }
#book.projects { background:url(../images/book-projects.jpg) no-repeat 0 0; }
#book.misc { background:url(../images/book-misc.jpg) no-repeat 0 0; }
#book.coo-ee { background:url(../images/book-coo-ee.jpg) no-repeat 0 0; }
#book.home { margin:auto; height:746px; width:620px; left:35px; background:url(../images/book-closed.jpg) no-repeat 0 0; position: relative; z-index:1; }

/*
#moluv {  position: relative; z-index:2; background:url(../images/xtra-page.jpg) no-repeat 0 0; height:496px; width:367px; left:-135px; top:268px;  }
*/
#moluv { display:none; }

#book img.moluv { float:left; left:26px; top:37px; position:relative; }

/*
#blog-link { float:left; left:-135px; top:0; position:relative; z-index:2; }
*/
#blog-link { display:none; }

/* Pages */
#pages { height:685px; float:left; margin-left:58px; }
.page { float:left; width:420px; height:685px; }

#homepage { background: url("../images/book-open.png") no-repeat 0 0; }
#pages .page01 {  }
#pages .page01 .intro { margin:80px 0 0 30px; }
#pages .page02 {  }
#pages .page03 { background: url("../images/page-04.png") no-repeat 0 0; }
#pages .page04 { background: url("../images/page-05.png") no-repeat 0 0; }
#pages .page05 { background: url("../images/page-06.png") no-repeat 0 0; }
#pages .page06 { background: url("../images/page-07.png") no-repeat 0 0; }
#pages .page07 { background: url("../images/page-08.png") no-repeat 0 0; }
#pages .page08 { background: url("../images/page-09.png") no-repeat 0 0; }

/* Menu */
#menu {
/*background:url('../images/menu-tabs.png') no-repeat;*/
width:110px;
height:690px;
left:865px;
overflow:hidden;
position: absolute; z-index:20;
top:25px;
/*display:none;*/
}
#menu.left-menu { left:0; }
#nav, #nav-left {
float:left;
width: 110px;
height: 690px;
margin:0; padding:0;
}
#nav li {margin: 0; padding: 0; list-style: none; position: absolute; width:110px; }
#nav li, #nav a {height: 130px;display: block; border: none; text-indent: -1999px; }
#nav li.hidden { display:none; }
#nav li#preface { top: 0px; height: 130px; background:  url('../images/menu/tab_preface.png') no-repeat 1px 0; }
#nav li#co-op { top: 135px; height: 138px; background: url('../images/menu/tab_co-op.png') no-repeat 1px 0; }
#nav li#projects { top: 275px; height: 135px; background: url('../images/menu/tab_projects.png') no-repeat 1px -1px; }
#nav li#misc { top: 412px; height: 135px; background: url('../images/menu/tab_misc.png') no-repeat 1px 1px; }
#nav li#coo-ee {top: 548px; height: 135px; background: url('../images/menu/tab_coo-ee.png') no-repeat 1px 0; }

#nav li#preface.selected { background:  url('../images/menu/tab_preface.png') no-repeat -109px 0; }
#nav li#co-op.selected { background: url('../images/menu/tab_co-op.png') no-repeat -109px 0; }
#nav li#projects.selected { background: url('../images/menu/tab_projects.png') no-repeat -109px 0; }
#nav li#misc.selected { background: url('../images/menu/tab_misc.png') no-repeat -109px 0; }
#nav li#coo-ee.selected { background: url('../images/menu/tab_coo-ee.png') no-repeat -109px 0; }

/* Left Menu */
#nav li#preface.left, #nav li#preface.left a:hover { top: 0px; height: 135px; background:  url('../images/menu/tab-back_preface.png') no-repeat 1px 0; }
#nav li#co-op.left, #nav li#co-op.left a:hover { top: 135px; left:4px; height: 135px; background: url('../images/menu/tab-back_co-op.png') no-repeat 1px 0; }
#nav li#projects.left, #nav li#projects.left a:hover { top: 273px; left:9px; height: 135px; background: url('../images/menu/tab-back_projects.png') no-repeat 1px -1px; }
#nav li#misc.left, #nav li#misc.left a:hover { top: 408px; left:14px; height: 135px; background: url('../images/menu/tab-back_misc.png') no-repeat 1px 1px; }
/* Left Menu Misc page */
#nav li#projects.misc { left:22px; }#nav li#co-op.misc { left:15px; }#nav li#preface.misc { left:10px; }
/* Left Menu Projects page */
#nav li#co-op.proj { left:12px; }#nav li#preface.proj { left:5px; }
/* Left Menu Co-Op page */
#nav li#preface.co-op { left:5px; }
/* Homepage menu */
#menu.home {
/*background:url('../images/menu-tabs-home.png') no-repeat;*/
width:110px;
height:690px;
left:442px;
overflow:hidden;
position: absolute; z-index:20;
top:25px;
}

/* Content */
#content { float:left; width:345px; }
#content.preface { padding:170px 0 0 45px; line-height:17px; }
#bios, #clients { float:left; width:350px; height:680px; margin-left:40px; margin-top:20px; }
.projects img.base { position: relative; z-index:30; margin:60px 0 0 45px; }
#clients {  position: absolute; z-index:40; }
#clients .kellrigby { left:196px; top:470px; }
#clients .green { left:1px; top:454px; }
#clients .aioa { left:2px; top:263px; }
#clients .myplates { left:20px; top:207px; }
#clients .woodsbagot { left:184px; top:52px; }
#clients .thinc { left:14px; top:53px; }

#bios .photo, #clients .client-name { float:left; position:absolute; }
a.client-name img, a.photo img { border:none; }
#bios .nicole { left:106px; top:39px; }
#bios .christopher { left:238px; top:39px; }
#bios .stu { left:370px; top:39px; }
#bios .chris { left:238px; top:282px; }
#bios .david { left:118px; top:315px; }
#bios .karen { left:246px; top:157px; }
#bios .paul { left:357px; top:146px; }
#bios .suze { left:357px; top:268px; }
#bios .steve { left:267px; top:288px; }
#bios .emma { left:115px; top:385px; }
#bios .dan { left:258px; top:405px; }
#bios .susan { left:352px; top:388px; }
#bios .jeff { left:127px; top:475px; }
#bios .monica { left:254px; top:540px; }
#bios .neil { left:361px; top:522px; }
#bios-container { width:380px; height:530px; float:left; overflow:hidden; margin:60px 0 0 30px; }
#clients-container { width:380px; height:508px; float:left; overflow:hidden; margin:60px 0 0 30px; }
#content.bios .bio {  width:325px; height:600px; padding:30px 20px 0 15px; background:url("../images/sub-co-op.png") top right no-repeat; }
#content.client .info {  width:325px; height:600px; padding:70px 20px 0 15px; background:url("../images/sub-projects.png") top right no-repeat; }
.bio p { line-height:16px; }
.info p { line-height:17px; }
#bio-intro img, #info-intro img { margin-left:38px; }
#content.bios #bio-intro.bio, #content.client #info-intro.info { background-image:none; padding-top:0; }

#contact { float:left; margin:555px 0 0 218px; font-size:12px; letter-spacing:1px; color:#333; }
#contact a { color:inherit; };
#contact a:hover { color:#000; }
#contact h4.upperc {text-transform:uppercase; margin:0 0 5px 0; font-size:14px; }
#footer { margin:auto; padding:0; width:250px; }
#footer.home { width:320px; position: relative; z-index:5; }

/*animation*/
#animation { width:348px; height:480px; margin:130px 0 0 38px; }
video { border:#eeece2 1px solid; }

/*misc*/
p.lead { position:absolute; left:120px; top:30px; }
#misc-item { float:left; position:absolute; }
#misc-item p { margin:2px 0 0 20px; font-size:11px; }
#misc-item.item01 { left:120px; top:90px; }
#misc-item.item02 { left:275px; top:50px; }
#misc-item.item03 { left:105px; top:265px; }
#misc-item.item04 { left:290px; top:230px; }
#misc-item.item05 { left:88px; top:460px; }
#misc-item.item06 { left:305px; top:495px; }
#misc-item.item02 p { margin-left:40px; }
#misc-item.item04 p { margin-top:-10px; }
#misc-item.item05 p { margin-top:-18px; margin-left:35px; }

#misc-item.item07 { left:130px; top:110px; }
#misc-item.item08 { left:310px; top:110px; }
#misc-item.item09 { left:135px; top:420px; }
#misc-item.item10 { left:310px; top:330px; }

#book.misc .page01 { float:left; padding-left:50px; padding-top:90px; width:390px; }
#book.misc .page02 { float:right; padding-left:0; padding-top:90px; position:absolute; left:380px; }


/* iPad media Queries */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
  #wrapper { -webkit-background-size: 2390px 1870px; width:1100px; height:1500px; }
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
  #wrapper { -webkit-background-size: 2390px 1870px; width:1500px; height:870px; }
}