/* DEFAULTS */
* {margin:0px;padding:0px;}
html, body {margin:0; padding:0; border:none; text-align:center; background-color:#e6e4e1; font-family: HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, sans-serif; font-weight:300;}
body {overflow-y:scroll;}
ul,dl,dd,dt,li,ol {list-style:none;}
h1, h2, h3, h4, p, a, input, textarea {font-family: HelveticaNeue-Light, Helvetica Neue Light, Helvetica, Arial, sans-serif; font-weight: 300;}
/* NAVIGATION*/
#nav {height:23px; width:200px; margin-left:auto; margin-right:auto; padding-top:20px; opacity:0; position:relative; left:10px;}
a.nav-about {background:url(../images/nav-about.png) no-repeat top; height:23px; width:49px; display:block; float:left; margin-right:17px;}
a.nav-about-on {background:url(../images/nav-about.png) no-repeat top; height:23px; width:49px; display:block; float:left; margin-right:17px; background-position:0px -23px;}
a.nav-work {background:url(../images/nav-work.png) no-repeat top; height:23px; width:46px; display:block; float:left; margin-right:17px;}
a.nav-work-on {background:url(../images/nav-work.png) no-repeat top; height:23px; width:46px; display:block; float:left; margin-right:17px; background-position:0px -23px;}
a.nav-clients {background:url(../images/nav-clients.png) no-repeat top; height:23px; width:54px; display:block; float:left; margin-right:17px;}
a.nav-clients-on {background:url(../images/nav-clients.png) no-repeat top; height:23px; width:54px; display:block; float:left; margin-right:17px; background-position:0px -23px;}
a.nav-contact {background:url(../images/nav-contact.png) no-repeat top; height:23px; width:62px; display:block; float:left;}
a.nav-contact-on {background:url(../images/nav-contact.png) no-repeat top; height:23px; width:62px; display:block; float:left; background-position:0px -23px;}
a.nav-about:hover, a.nav-work:hover, a.nav-clients:hover, a.nav-contact:hover {background-position:0px -23px;}
#nav-intro {height:25px; width:280px; margin-left:auto; margin-right:auto; padding-top:20px; position:relative; left:10px;}
a.nav-intro-about {background:url(../images/nav-intro-about.png) no-repeat top; height:25px; width:56px; display:block; float:left; margin-right:42px; margin-left:12px;}
a.nav-intro-work {background:url(../images/nav-intro-work.png) no-repeat top; height:25px; width:52px; display:block; float:left; margin-right:42px;}
a.nav-intro-clients {background:url(../images/nav-intro-clients.png) no-repeat top; height:25px; width:63px; display:block; float:left; margin-right:42px;}
a.nav-intro-contact {background:url(../images/nav-intro-contact.png) no-repeat top; height:25px; width:71px; display:block; float:left;}
a.nav-intro-about:hover, a.nav-intro-work:hover, a.nav-intro-clients:hover, a.nav-intro-contact:hover {background-position:0 -25px;}
/* BUTTONS */
#up {height:39px; width:100%; position:absolute; top:0; z-index:2;}
#up a {background-image:url(../images/nav-elevator-up.png); width:79px; height:39px; display:block; margin-left:auto; margin-right:auto;}
#up a:hover, #up a:active {background-position:0 39px;}
#down {height:39px; width:100%; position:absolute; top:0; z-index:1; opacity:0;}
#down a {background-image:url(../images/nav-elevator-down.png); width:79px; height:39px; display:block; margin-left:auto; margin-right:auto;}
#down a:hover {background-position:0 39px;}
/* CONTENT CONTAINERS */
#elevator {width:100%; position:absolute; top:620px;}
#welcome-container {width:100%; position:absolute; top:0;}
#top-container {width:100%; height:39px; position:absolute; top:0; background:url(../images/bg-contents-top.png) repeat-x bottom center;}
#nav-container {width:100%; height:43px; position:absolute; top:0px; background-color:#e6e4e1; display:none;}
#content-container {width:100%; position:absolute; top:39px; background-color:#e6e4e1; display:none; min-height:620px;}
#about-container {width:100%; position:absolute; top:43px; background-color:#e6e4e1; display:none;}
#work-container {width:100%; position:absolute; top:43px; background-color:#e6e4e1; display:none;}
#clients-container {width:100%; position:absolute; top:43px; background-color:#e6e4e1; display:none;}
#contact-container {width:100%; position:absolute; top:43px; background-color:#e6e4e1; display:none;}
/* PAGES */
#welcome {margin-left:auto; margin-right:auto; height:658px; background:url(../images/bg-dots.gif) repeat top center, url(../images/bg-intro.png) no-repeat top center; background-color:#191a1e;}
#intro {height:619px;}
#intro img {padding-top:50px; padding-bottom:30px; height:479px; width:481px;}
#about {height:603px; width:738px; margin-left:auto; margin-right:auto; margin-bottom:10px; margin-top:30px; background:url(../images/about.png) no-repeat top center; text-align:left; opacity:0; z-index:99;}
#work {width:740px; height:232px; margin-left:auto; margin-right:auto; background:url(../images/projects.png) no-repeat top center; text-align:left; opacity:0; z-index:99;}
#clients {height:591px; width:738px; margin-left:auto; margin-right:auto; margin-bottom:10px; margin-top:30px; background:url(../images/clients.png) no-repeat top center; text-align:left; opacity:0; z-index:99;}
#contact {height:591px; width:738px; margin-left:auto; margin-right:auto; margin-bottom:10px; margin-top:30px; background:url(../images/contact.png) no-repeat top center; text-align:left; opacity:0; z-index:99;}
#name, #email {width:400px; height:28px; background-color:#FFFFFF; margin:0; padding:0; padding-left:15px; padding-right:15px; border:0; outline:0; margin-bottom:2px; font-size:11px;}
#name {margin-top:25px;}
#comment {width:400px; height:200px; background-color:#FFFFFF; margin:0; padding-left:15px; padding-right:15px; padding-top:8px; border:0; outline:0; margin-bottom:2px; font-size:11px; line-height:14px;}
#submit {width:430px; height:28px; background-color:#000000; margin:0; padding:0; border:0; outline:0; margin-bottom:2px; font-size:14px; color:#0099FF;}
/* PROJECTS */
#projects {width:740px; margin-left:auto; margin-right:auto; margin-top:30px; margin-bottom:30px; opacity:0; z-index:99;}
a.pinkonvinyl {background:url(../images/pinkonvinyl.png) no-repeat top; width:157px; height:19px; display:block; position:relative; top:176px; left:241px;}
a.pinkonvinyl:hover {background-position:0px -19px;}
#project-close {width:100%; height:39px; margin-left:auto; margin-right:auto; margin-top:-39px; z-index:2; position:relative;}
#project-close a {background-image:url(../images/nav-elevator-up.png); background-repeat:no-repeat; height:39px; width:79px; display:block; margin-left:auto; margin-right:auto;}
#project-close a:hover { background-position:0px -39px;}
/* FOOTER */
#footer {width:100%; margin-left:auto; margin-right:auto; margin-top:30px; margin-bottom:30px; position:absolute; top:39px; z-index:9;}
#footer p {font-size:10px; color:#474747; margin-left:auto; margin-right:auto;}
#footer-2 {width:512px; margin-left:auto; margin-right:auto; margin-top:30px; margin-bottom:30px;}
#footer-2 p {font-size:10px; color:#474747; margin-left:auto; margin-right:auto;}