/* 
Description:
Site Standard Styles for An Eye For Ink.
---	
Author: 
Nathan Kelly (nathan@infiniteeye.com.au)
Infinite Eye Web Development Studio (info@infiniteeye.com.au)
---		
Version: 
0.6/05-10-06
Copyright An Eye For Ink (c) 2006, . All rights reseved.
------------------------------------------------------------------------------*/
body {
margin:0;
padding:0;
color:#999;
overflow:hidden;
text-align:center;
font:86%/1.5 TrebuchetMS, Tahoma, Verdana, Arial sans-serif;
background:#000 url(../images/body-background.png) repeat-x top center;
}

hr {
display:none;
}

.clear {
clear:both;
}

img {
border:0;
}

a {
outline:none;
}

h1, h2 {
margin:0;
text-align:center;
}

h1 {
padding:45px 0 0 0;
}

h2 {
bottom:0;
width:185px;
padding:20px 0;
position:absolute;
}

a {
text-decoration:none;
}

/* Splash Page */
#splash {
top:50%;
left:50%;
margin:0;
padding:0;
width:500px;
height:190px;
position:absolute;
margin-top:-95px;
margin-left:-250px;
}

#splash h1,
#splash h2 {
top:0;
left:0;
margin:0;
padding:0;
width:500px;
height:190px;
position:absolute;
}

#splash #preload-1,
#splash #preload-2 {
left:-1000em;
position:absolute;
}

/* end splash */

#container {
z-index:10;
top:50%;
left:50%;
width:760px;
height:512px;
text-align:left;
position:absolute;
margin-top:-256px;
margin-left:-380px;
border:1px solid #292929;
background:#000 url(../images/container-background.png) repeat-x top left;
}

#main-nav {
float:left;
width:185px;
height:500px;
position:relative;
}

#main-nav ul {
left:0;
padding:0;
bottom:90px;
width:178px;
text-align:right;
position:absolute;
margin:0 0 30px 5px;
}

#main-nav ul li {
margin-top:6px;
font-size:1em;
letter-spacing:1px;
list-style-type:none;
text-transform:uppercase;
font-family:'Lucida Sans Unicode', 'Lucida Grande', Arial, sans-serif;
}

#main-nav ul li a {
color:#999;
display:block;
text-decoration:none;
padding:4px 50px 4px 0;
}

#main-nav ul li a:hover,
#main-nav ul li a.current {
color:#fff;
background-color:#2a2a2a;
}

#content {
width:550px;
height:470px;
float:right;
overflow:hidden;
position:relative;
margin:20px 20px 0 0;
border:1px solid #292929;
background-color:#000;
}

#loading {
top:135px;
left:230px;
z-index:50;
position:absolute;
}

#content .viewport-1 {
width:510px;
height:345px;
overflow:hidden;
position:relative;
margin:20px 20px 5px 20px;
background-color:#000;
}

#content #folio-viewport {
height:370px;
}

#clients-viewport {
text-transform:uppercase;
}

#clients-viewport h3 {
left:-1000em;
position:absolute;
}

#clients-viewport ul {
width:250px;
float:left;
margin:0;
padding:0;
font-size:.8em;
letter-spacing:.05em;
}

#clients-viewport ul.col-2 {
margin-left:10px;
}

#clients-viewport li {
line-height:1.6em;
list-style-type:none;
}

#clients-viewport li span,
#contact-viewport p.numbers {
color:#666;
}

#contact-viewport p.numbers {
margin-top:110px;
}

#contact-viewport p {
font-size:1.2em;
margin:20px 0 ;
text-align:center;
}

#content .viewport-2 {
height:80px;
width:510px;
margin:0 20px;
overflow:hidden;
position:relative;
}

#content div#rota-quota {
left:0;
bottom:20px;
position:absolute;
background-color:#2a2a2a;
}

#content div#rota-quota p {
right:0;
position:absolute;
background-color:#2a2a2a;
}

#content .viewport-2 ul li h4 {
width:200px;
left:-1000em;
position:absolute;
}

#content .viewport-2 p {
width:480px;
font-size:small;
text-align:right;
margin:10px 20px;
}

#content .viewport-2 p span {
color:#666;
display:block;
}

#content #folio-nav .viewport-2 {
background-color:transparent;
}

#content .viewport-2 h3 {
float:left;
width:340px;
color:#000;
margin:5px 0 0 0;
padding:5px 10px 0 10px;
height:45px;
font-size:1.1em;
text-align:right;
letter-spacing:1px;
font-weight:normal;
position:relative;
text-transform:uppercase;
background-color:#666;
font-family:'Lucida Sans Unicode', 'Lucida Grande', Arial, sans-serif;
}

#content .viewport-2 h3 span {
top:5px;
right:10px;
width:340px;
height:45px;
display:block;
position:absolute;
background-color:#666;
}

#content .viewport-2 ul {
width:145px;
margin:0;
padding:0;
float:right;
}

#content .viewport-2 ul li {
float:left;
list-style-type:none;
}

#content .viewport-2 ul li a {
width:20px;
height:20px;
display:block;
outline:none;
background-color:#2a2a2a;
border:5px solid #000;
}

#content .viewport-2 ul li.last a {
border-right:0;
}

#content .viewport-2 ul li a:active,
#content .viewport-2 ul li a:hover,
#content .viewport-2 ul li a.current {
background-color:#666;
}

#content .viewport-2 ul li a span {
width:20px;
height:20px;
display:block;
cursor:pointer;
text-indent:-1000em;
}

#lightbox {
width:510px;
height:370px;
line-height:0px;
text-align:left;
position:relative;
}

#lightbox-wrapper {
width:510px;
height:370px;
z-index:100;
position:relative;
background-color:transparent;
}

#lightbox-image-container {
top:0;
left:0;
width:510px;
height:340px;
position:absolute;
}


/* Loading Screen.
------------------------------------------------------------------------------*/
#lightbox-loading {
top:135px;
left:230px;
width:50px;
z-index:50;
height:50px;
line-height:0px;
position:absolute;
text-align:center;
}

/* Lightbox Footer.
------------------------------------------------------------------------------*/
#lightbox-footer {
bottom:0;
width:510px;
z-index:150;
text-align:left;
position:absolute;
line-height:1.4em;
background-color:#000;
}

#lightbox-details {
float:left;
font-size:x-small;
padding-bottom:2px;
}

/* Bottom Navigation, Prev, Next and Close links.
------------------------------------------------------------------------------*/
#lightbox-nav {
width:60px;
float:right;
padding-top:10px;
}

#lightbox-nav a {
width:15px;
height:18px;
float:right;
outline:none;
display:block;
text-indent:-1000em;
text-decoration:none;
background-repeat:no-repeat;
background-position:top left;
}

#lightbox-nav #next-link {
margin-left:5px;
background-image:url(../images/next.png);
}

#lightbox-nav #prev-link {
background-image:url(../images/previous.png);
}

#lightbox-nav #restart-link  {
margin-left:5px;
background-image:url(../images/first.png);
}

#lightbox-nav a:hover {
background-position:bottom left;
}

#footer {
z-index:0;
left:50%;
bottom:10px;
color:#666;
width:760px;
line-height:1em;
text-align:right;
position:absolute;
margin-left:-380px;
font-size:xx-small;
text-transform:lowercase;
}

#footer span {
margin-right:25px;
font-variant:small-caps;
}

#footer a {
color:#444;
text-decoration:none;
}

#footer a:hover {
color:#777;
}