* { margin:0; padding:0; }

body { -webkit-text-size-adjust:none; margin:0; padding:0; background-color:#7ca5b9; height:100%; min-height:460px; font-family:Arial, sans-serif; font-size:100%; font-size:16px; line-height:1.125em; font-weight:normal; }

.b1 { font-size:0.75em; color:#fefefe; line-height:1.59em; }
.b2 { font-size:0.75em; color:#fefefe; line-height:1.55em; }

.ntitle { font-size:1.19em; color:#fefefe; line-height:1.35em; font-weight:bold;}
.ndate { font-size: 0.75em; color:#fefefe; line-height:1.35em; display: block; padding-top: 8px;}

.showbox { outline: #fff dotted 1px; }

a { text-decoration:none; color:#fefefe; }
a:hover, active { text-decoration:underline; }

a.bio { text-decoration:underline; color:#ffffff; line-height:1.35em; font-weight:bold; }
a.bio:hover, active { text-decoration:none; }

ul { list-style:none; }


#preloading { position:absolute; width:38px; height:38px; left:50%; top:50%; vertical-align:middle; margin-left:-19px; margin-top:-19px; }
#sitebody { display:none; overflow:hidden; width:100%; height:100%; margin: 0; padding: 0;}

#masonry { position:absolute; top:263px; left:41px; z-index:999; }

#navgroup { position:absolute; top:99px; left:0; width:112px; height:135px; z-index:1200; }
#nav1, #nav2, #nav3, #nav4, #nav5, #nav6, #nav1rollovered, #nav2rollovered, #nav3rollovered, #nav4rollovered, #nav5rollovered, #nav6rollovered { position:relative; margin-bottom:5px; width:140px; height:23px; display:block; }

#nav1 { background:url("../img/shared/nav1.png") top left no-repeat; }
#nav1:hover, active { background:url("../img/shared/nav1.png") bottom left no-repeat; cursor:pointer; }
#nav1rollovered { background:url("../img/shared/nav1.png") bottom left no-repeat; }

#nav2 { background:url("../img/shared/nav2.png") top left no-repeat; }
#nav2:hover, active { background:url("../img/shared/nav2.png") bottom left no-repeat; cursor:pointer; }
#nav2rollovered { background:url("../img/shared/nav2.png") bottom left no-repeat; }

#nav3 { background:url("../img/shared/nav3.png") top left no-repeat; }
#nav3:hover, active { background:url("../img/shared/nav3.png") bottom left no-repeat; cursor:pointer; }
#nav3rollovered { background:url("../img/shared/nav3.png") bottom left no-repeat; }

#nav4 { background:url("../img/shared/nav4.png") top left no-repeat; }
#nav4:hover, active { background:url("../img/shared/nav4.png") bottom left no-repeat; cursor:pointer; }
#nav4rollovered { background:url("../img/shared/nav4.png") bottom left no-repeat; }

#nav5 { background:url("../img/shared/nav5.png") top left no-repeat; }
#nav5:hover, active { background:url("../img/shared/nav5.png") bottom left no-repeat; cursor:pointer; }
#nav5rollovered { background:url("../img/shared/nav5.png") bottom left no-repeat; }

#nav6 { background:url("../img/shared/nav6.png") top left no-repeat; }
#nav6:hover, active { background:url("../img/shared/nav6.png") bottom left no-repeat; cursor:pointer; }
#nav6rollovered { background:url("../img/shared/nav6.png") bottom left no-repeat; }

#breadcrumb { position:absolute; top:31px; margin-bottom:56px; width:183px; margin-right:40px; }

.readmore { position:relative; margin-left:-7px; width:90px; height:22px; display:block; background:url("../img/shared/readmore.png") top left no-repeat; }
.readmore:hover, active { background:url("../img/shared/readmore.png") bottom left no-repeat; cursor:pointer; }

#footercontainer { position:absolute; height:100%; width:100%; min-width:1024px; min-height:460px; z-index:500; }
#footer { position:absolute; z-index:999; bottom:30px; left:0px; display:block; }

#footer #downloadbrochure { position:relative; width:196px; height:23px; display:block; }
#downloadbrochure { background:url("../img/shared/download.png") top left no-repeat; }
#downloadbrochure:hover, active { background:url("../img/shared/download.png") bottom left no-repeat; cursor:pointer; }
#copyright { position:relative; width:196px; margin-top:22px; }
#soundloop { position:relative; float:left; width:22px; height:22px; margin-top:3px; display:block; }
#soundloop:hover { cursor:pointer; }

.loopon { background:url("../img/shared/sound.png") top left no-repeat; display:block; }
.loopoff { background:url("../img/shared/sound.png") bottom left no-repeat; display:block; }



#introduction   { position:absolute; top:0px; left:353px; z-index:1000; height: 100%; }
#introstone     { position:relative; width:320px; z-index:900; display:none; float:left; }
#introtext      { position:relative; width:200px; margin-left:20px; z-index:1300; display:none; float:left;}

.closebutton { position:relative; width:17px; height:17px; background:url("../img/closebutton.png") top left no-repeat; display:none; z-index:1010; float:left; }
.closebutton:hover, active { background:url("../img/closebutton.png") bottom left no-repeat; cursor:pointer; }


#content-container, #content-container2  { position:absolute; top:0px; left:353px; margin:0; padding:0; z-index:800; height:100%; width:840px; overflow: hidden; }
#content-area, #content-area2            { position:absolute; height:80%; width:840px; margin-top:105px; }


#content-container2 { z-index:850; }


#moreintro { position:fixed; top:0px; left:0px; z-index:900; display:none; }

.morebutton { position:absolute; top:503px; left:347px; width:84px; height:21px; background:url("../img/button.png") top left no-repeat; display:block; z-index:1010; }
.morebutton:hover, active { background:url("../img/button.png") bottom left no-repeat; cursor:pointer; }

#content { position:absolute; top:0px; left:353px; z-index:1000; height:100%; }
#pcontent { position:absolute;  z-index:1000; height:85%; }

#first-col { position:relative; width:222px; float:left; }
#second-col-header { position:absolute; margin-top:31px; margin-bottom:56px; width:183px;left:222px; }
#second-col { position:relative; width:222px; margin-left:20px; float:left;  }
#third-col { position:relative; width:222px; float:left;  }

#twocols { position:relative; float:left; width:444px; }
#thirdcol { position:relative; float:right; width:222px; }
#fullcol { position:relative; float:right; width:665px; }

.project-unit { float:left; width:180px; margin-right:10px; }

#snav1, #snav2, #snav3, #snav4, #snav5 { position:relative; margin-bottom:34px; margin-left:-9px; width:125px; height:52px; display:block; }
#snav1 { background:url("../img/services/nav1.png") top left no-repeat; }
#snav1:hover, active { background:url("../img/services/nav1.png") bottom left no-repeat; cursor:pointer; }

#snav2 { background:url("../img/services/nav2.png") top left no-repeat; }
#snav2:hover, active { background:url("../img/services/nav2.png") bottom left no-repeat; cursor:pointer; }

#snav3 { background:url("../img/services/nav3.png") top left no-repeat; }
#snav3:hover, active { background:url("../img/services/nav3.png") bottom left no-repeat; cursor:pointer; }

#snav4 { background:url("../img/services/nav4.png") top left no-repeat; }
#snav4:hover, active { background:url("../img/services/nav4.png") bottom left no-repeat; cursor:pointer; }

#snav5 { background:url("../img/services/nav5.png") top left no-repeat; }
#snav5:hover, active { background:url("../img/services/nav5.png") bottom left no-repeat; cursor:pointer; }

#serviceline { position:fixed; width:667px; height:666px; z-index:99999; top:211px; left:675px;}

#pureintro, #richintro { position:fixed; width:830px; height:777px; z-index:9999; }
#devoteintro { position:fixed; width:872px; height:777px; z-index:9999; }
#composeintro { position:fixed; width:908px; height:776px; z-index:9999; }
#edgeintro { position:fixed; width:839px; height:777px; z-index:9999; }

#pnav1, #pnav2, #pnav3, #pnav4, #pnav5, #pnav6, #pnav7, #pnav8, #pnav9 { position:relative; margin-bottom:8px; width:117px; height:117px; display:block; }
#pnav1 { background:url("../img/projects/project1.png") top left no-repeat; }
#pnav1:hover, active { background:url("../img/projects/project1.png") bottom left no-repeat; cursor:pointer; }

#pnav2 { background:url("../img/projects/project2.png") top left no-repeat; }
#pnav2:hover, active { background:url("../img/projects/project2.png") bottom left no-repeat; cursor:pointer; }

#pnav3 { background:url("../img/projects/project3.png") top left no-repeat; }
#pnav3:hover, active { background:url("../img/projects/project3.png") bottom left no-repeat; cursor:pointer; }

#pnav4 { background:url("../img/projects/project4.png") top left no-repeat; }
#pnav4:hover, active { background:url("../img/projects/project4.png") bottom left no-repeat; cursor:pointer; }

#pnav5 { background:url("../img/projects/project5.png") top left no-repeat; }
#pnav5:hover, active { background:url("../img/projects/project5.png") bottom left no-repeat; cursor:pointer; }

#pnav6 { background:url("../img/projects/project6.png") top left no-repeat; }
#pnav6:hover, active { background:url("../img/projects/project6.png") bottom left no-repeat; cursor:pointer; }

#pnav7 { background:url("../img/projects/project7.png") top left no-repeat; }
#pnav7:hover, active { background:url("../img/projects/project7.png") bottom left no-repeat; cursor:pointer; }

#pnav8 { background:url("../img/projects/project8.png") top left no-repeat; }
#pnav8:hover, active { background:url("../img/projects/project8.png") bottom left no-repeat; cursor:pointer; }

#pnav9 { background:url("../img/projects/project9.png") top left no-repeat; }
#pnav9:hover, active { background:url("../img/projects/project9.png") bottom left no-repeat; cursor:pointer; }

.projects-color { background-color:#ada89e; }
.news-color { background-color:#a5b8a2; }
.contact-color { background-color:#c0b592; }

#project-text { position:absolute; left:353px; margin-top:125px; display:none; z-index:999; }
#project-bg { position:absolute; top:141px; left:635px; z-index:900; display:none; }

#gallery { position:relative; width:390px; margin-top:130px; z-index:9000; float:left;}

#gallery ul {margin-top:10px; margin-bottom: 35px;}
#gallery li {display: inline; margin-right: 6px; margin-top: 10px;}
#gallery #main-img {}

#downloadbooks {display: none; }