/* -----------------------------------------------
IMPORTS
----------------------------------------------- */
@import url("base.css");

/* -----------------------------------------------
STYLES
----------------------------------------------- */
body { color: #000; background: #fff; font-family: Helvetica, Arial, sans-serif; font-size: 10px; }
body.home.loading, body.about.loading, body.contact.loading { background: url(../img/website/spinner.gif) center 200px no-repeat; }
body.home.loading div#Container, body.about.loading div#Container, body.contact.loading div#Container { position: absolute; width: 1px; height: 1px; overflow: hidden; }
/* -----------------------------------------------
STRUCTURE
----------------------------------------------- */

div#SideBar { width: 205px; position: fixed; top: 25px; left: 20px; min-height: 590px;  }
/* Sprite */
div#SideBar h1, 
div#SideBar #Nav a,
div#SideBar p.legal,
div#SideBar p.credit a { background: url(../img/website/sidebar_sprite.png) no-repeat; }
/* ------ */
div#SideBar h1 { height: 65px; }
div#SideBar h1 a { display: block; height: 65px; }
div#SideBar ul#Nav { position: absolute; bottom: 0; }
div#SideBar ul#Nav li { margin: 0 0 3px 0; }
div#SideBar ul#Nav li a { display: block; height: 10px; width: 60px; }
div#SideBar ul#Nav li.work a { background-position: 0 -65px; }
div#SideBar ul#Nav li.work a.selected,
div#SideBar ul#Nav li.work a:hover { background-position: 0 -75px; }
div#SideBar ul#Nav li.contact a { background-position: 0 -105px; width: 60px; }
div#SideBar ul#Nav li.contact a.selected,
div#SideBar ul#Nav li.contact a:hover { background-position: 0 -115px; }
div#SideBar ul#Nav li.press a { background-position: 0 -85px; width: 78px; }
div#SideBar ul#Nav li.press a.selected,
div#SideBar ul#Nav li.press a:hover { background-position: 0 -95px; }
div#SideBar ul#Nav li.rss a { background-position: 0 -145px; width: 20px; margin-top: 20px; }
div#SideBar ul#Nav li.rss a.selected,
div#SideBar ul#Nav li.rss a:hover { background-position: 0 -155px; }

/* -----------------------------------------------
HOMEPAGE
----------------------------------------------- */
body.home { overflow-x: hidden; }
body.home div#Container { width: 1200px; }
body.home div#Main { width: 750px; position: absolute; top: 150px; left: 495px; padding-bottom: 25px; }
body.home div#Main h2 { font-size: 3.3em; letter-spacing: -.05em; }
body.home div#Main li { font-size: 3.3em; letter-spacing: -.05em; font-style: italic; position: relative; float: left; clear: left; margin: 0; background: transparent; }
body.home div#Main li:hover { }
body.home div#Main li div.strike { background: #000; height: 2px; width: 100%; position: absolute; top: 50%; left: 0; margin-top: 2px; }
body.home div#Main li a { color: #000; text-decoration: none; background: transparent;}

/* -----------------------------------------------
News
----------------------------------------------- */
body.news div#SideBar { position: relative; width: auto; left: 0; top: 0; margin: 25px 0 0 20px; }
body.news div#SideBar h1 { width: 205px; }
body.news div#Main { width: 960px; margin-top: 25px; }
body.news div#Main div#News { float: left; width: 460px; }
body.news div#Main div#Awards { float: right; width: 460px; }
body.news div#Main h2 { text-transform: uppercase; font-weight: bold; font-size: 1.1em; margin: 0 0 3px 0; }
body.news div#Main ul li { padding: 0 0 2px 0; position: relative; float: left; clear: left; margin: 0; background: transparent; font-size: 1.1em; font-weight: bold; position: relative; }
body.news div#Main ul li a { color: #000; text-decoration: none; padding: 0; cursor: pointer; }
body.news div#Main ul li a:hover { cursor: pointer !important; }
body.news div#Main ul li div.strike { background: #000; height: 1px; width: 100%; position: absolute; top: 50%; left: 0; margin-top: -1px;  }

/* -----------------------------------------------
CONTACT
----------------------------------------------- */
body.contact { overflow-x: hidden; }
body.contact div#Container { width: 1200px; }
body.contact div#Main { width: 750px; position: absolute; top: 150px; left: 495px; padding-bottom: 25px; }
body.contact div#Main h2 { font-size: 3.3em; letter-spacing: -.05em; }
body.contact div#Main p { font-size: 3.3em; letter-spacing: -.05em; font-style: italic; margin: 0 0 25px 0;  }
body.contact div#Main em { font-size: .7em; }
body.contact div#Main a { color: #000; text-decoration: none; position: relative; }
body.contact div#Main a div.strike { background: #000; height: 2px; width: 100%; position: absolute; top: 50%; left: 0; margin-top: 3px; }
body.contact div#Form p { font-size: 1.2em; font-style: normal; font-weight: bold; margin: 0 0 15px 0; }
body.contact div#Form label { display: block; font-size: 1.2em; font-style: normal; font-weight: bold; margin: 0 0 3px 0; }
body.contact div#Form div.input { margin: 0 0 8px 0; }
body.contact div#Form div.input input { border: 1px solid #abaaaa; padding: 5px; width: 270px; }
body.contact div#Form div.error { padding: 5px 0 ; }
/* -----------------------------------------------
PROJECTS
----------------------------------------------- */
body.projects {  }
body.projects div#SideBar ul#ProjectNav { margin: 25px 0 0 0;  }
body.projects div#SideBar ul#ProjectNav li { margin: 0 0 2px 0; }
body.projects div#SideBar ul#ProjectNav li a { color: #999; text-decoration: none; padding: 0; cursor: pointer; font-size: 1.1em; font-weight: bold; position: relative; }
body.projects div#SideBar ul#ProjectNav li a.type-2 { color: #000; }
body.projects div#SideBar ul#ProjectNav li a:hover { cursor: pointer !important; }
body.projects div#SideBar ul#ProjectNav li a div.strike { background: #000; height: 1px; width: 100%; position: absolute; top: 50%; left: 0; }
body.projects div#SideBar ul#ProjectNav li a strong { color: #f21212; }
body.projects div#Projects { padding: 0 0 0 20px; z-index: 0; margin-left: 250px; }
body.projects div#Projects div#ProjectWrapper { width: 8000px; }
body.projects div#Projects div.item { float: left; margin: 0 0 30px 0; }
body.projects div#Projects div.item-first { margin-left: 250px; }
body.projects div#Projects div.item div.text { float: left; margin: 10px 0 0 0; }
body.projects div#Projects div.item div.text h2 { color: #999; margin: 0 0 2px 0; }
body.projects div#Projects div.item div.text p { color: #999; line-height: 1.3em; font-size: 1.1em; }
body.projects div#Preload { width: 1px; height: 1px; position: absolute; bottom: 0; left: 0; }
body.projects div.item-loading { background: url(../img/website/spinner.gif) center center no-repeat;  }
body.projects div.item-loading div.wrapper { visibility: hidden; }
body.projects div.credit p { color: #999; font-size: .9em; margin: 200px 0 25px 0; }
body.projects div.credit p a { color: #999; margin-left: 10px; text-decoration: none; }