/* 
BLUEMOON BRANDING STYLE SHEET: MAIN SCREEN STYLES
Style sheet by Rupert Sliwa at Bluemoon
[ www.bluemoonbranding.com ]
----------------------------------------------- */

html, body {height:100%}
body {margin:0; color:#333; margin:0; text-align:center; font-family:"Lucida Grande", Calibri, Verdana, Arial, Helvetica, sans-serif; overflow-x:hidden; background:#1d1d1d url(../images/bg_gradient.jpg) top repeat-x}
ul {list-style-type:square; padding-left:8px; margin:0 0 10px 8px}
ol {list-style-type:decimal; padding-left:8px; margin:0 0 10px 8px}
table, tr, td {margin:0; padding:0; border:0}
img {border:0}
p {font-size:11px; line-height:16px; margin:0 0 15px 0; padding:0; display:block; color:#fff}


/* General links
----------------------------------------------- */

a, a:link, a:visited {color:#e4b128; text-decoration:none; font-weight:normal}
a:hover, a:active {color:#e4b128; text-decoration:underline; font-weight:normal}


/* Headings
----------------------------------------------- */

#home h1 {display:none}
h1 {font-size:14px; text-transform:uppercase; color:#fff; margin:0 0 15px 0; padding:0; font-weight:normal}
h2 {font-size:13px; text-transform:uppercase; color:#e4b128; margin:0 0 10px 0; padding:0; font-weight:normal}

#home #heading {width:192px; height:40px; background:transparent url(../images/h1_home.png) top left no-repeat; margin-bottom:10px}

.thin {font-weight:normal; color:#fff; text-transform:none}


/* Top Navigation
----------------------------------------------- */

#topNav {margin-top:60px; padding:18px 0 16px 30px; background:transparent url(../images/bg_nav.png) top left no-repeat}

#topNav ul, #subNav ul {list-style-type:none; margin:0; padding:0}

#topNav ul li, #subNav ul li {float:left; width:auto}

#topNav ul li a, #topNav ul li a:link, #topNav ul li a:visited {display:block; float:left; white-space:nowrap; font-size:12px; text-decoration:none; text-transform:uppercase; margin-right:50px; color:#fff}

#topNav ul li:hover a {color:#e4b128; text-decoration:none}

#topNav ul li a.selected, #subNav ul li a.selected {color:#e4b128; text-decoration:none}

#subNav {padding:10px 30px 10px 30px; background:transparent url(../images/bg_subnav.png); color:#fff; position:relative; z-index:30; display:none; width:900px}
#subNav ul li a, #subNav ul li a:link, #subNav ul li a:visited {display:block; float:left; white-space:nowrap; font-size:10px; text-decoration:none; text-transform:uppercase; margin-right:25px; color:#fff}

#subNav ul li:hover a {color:#e4b128; text-decoration:none}

#subNav p, #navigate p {font-size:10px; line-height:14px; margin:0; padding:0; display:block; color:#ccc; float:right}


/* Backgrounds
----------------------------------------------- */

#slideshow {position:absolute; top:109px; left:50%; margin-left:-480px; width:960px; height:442px; z-index:20}

#home #bgImg {position:absolute; background-repeat:no-repeat; top:0; left:50%; margin-left:-700px; height:717px; width:1400px; background-image:url(../images/bg_home_london_millennium.jpg); z-index:-1}

#work #bgImg {position:absolute; background-repeat:no-repeat; top:0; left:50%; margin-left:-550px; height:717px; width:1100px; background-image:url(../images/bg_blank.jpg); z-index:-1}

#clients #bgImg, #contact #bgImg, #people #bgImg {position:absolute; background-repeat:no-repeat; top:0; left:50%; margin-left:-700px; height:717px; width:1400px; background-image:url(../images/bg_clients_outer.jpg); z-index:-1}

#clients #slideshow {background:#000 url(../images/bg_contact.jpg) top left no-repeat}

#contact #slideshow {background:#000 url(../images/bg_contact.jpg) top left no-repeat}

#people #slideshow {background:#000 url(../images/bg_people.jpg) top left no-repeat}


/* Page layouts
----------------------------------------------- */

#content {position:absolute; top:350px; left:50%; margin-left:-480px; width:265px; z-index:23}

#home #content, #people #content {position:absolute; top:350px; left:50%; margin-left:-480px; width:223px; z-index:23}
#home #content .pad {padding:20px 0 0 28px}
#home #promo {position:absolute; top:440px; left:50%; margin-left:310px; width:140px; z-index:23}
#home #promo p {margin-top:10px}

#content .pad {padding:10px 0 0 28px}

#work #workLogo {position:absolute; top:568px; left:50%; margin-left:-458px; width:120px; z-index:40}
#work #content {display:none}
#work #navigate {position:absolute; top:120px; left:50%; margin-left:360px; width:90px; z-index:40; background: transparent url(../images/bg_black_70pc.png); padding:10px; text-align:center; display:none}
#work #fadeSlide {background:#000 url(../images/work_enbd_02.png) top left no-repeat}

#contact #formholder {position:absolute; top:180px; left:50%; margin-left:-200px; width:540px; z-index:23}
#contact form p {margin-bottom:10px}

#info {position:absolute; top:160px; left:50%; margin-left:-200px; width:640px; z-index:23}
#info .colOne {margin-bottom:15px; margin-right:40px; width:300px; float:left}
#info .colTwo {margin-bottom:15px; width:300px; float:left}

#thumbs {position:absolute; top:490px; left:50%; margin-left:-180px; height:60px; width:630px; z-index:30}
#thumbs a {display:block; margin-left:20px; float:right}

#clientGrid {position:absolute; top:175px; left:50%; margin-left:-200px; width:664px; z-index:30}

#map {position:absolute; top:140px; left:50%; margin-left:-210px; width:660px; height:380px; z-index:50; display:none}

#lineOne {position:absolute; top:109px; left:50%; margin-left:-696px; height:1px; width:1392px; background-image:url(../images/line.png); background-repeat:no-repeat; z-index:21}
#lineTwo {position:absolute; top:550px; left:50%; margin-left:-696px; height:1px; width:1392px; background-image:url(../images/line.png); background-repeat:no-repeat; z-index:22}


/* Main styles
----------------------------------------------- */

#container {margin:0 auto; width:960px}
.contentArea {text-align:left}

#headings {text-align:left; margin-left:20px}

.floatLeft {float:left}
.floatRight {float:right}
.clearboth {clear:both; height:0px; overflow:hidden; font-size:1px; line-height:0px}

.nomargin {margin:0}

#next {position:absolute; top:71px; left:50%; margin-left:420px; z-index:10}
#prev {position:absolute; top:71px; left:50%; margin-left:380px; z-index:10}


/* Forms
----------------------------------------------- */

form {margin:0}

label {font-size:13px; margin:0 10px 0 0; width:60px; display:block; float:left; text-align:right; color:#ccc; padding:5px}
.fieldHolder {padding-top:3px; float:left; font-size:13px}
.formField {background:#bebeb7; font-size:13px; width:320px; display:block; color:#333; border:0; padding:3px}
.formSend {margin-top:8px}


/* Footer
----------------------------------------------- */

#footer {width:900px; height:32px; padding:18px 30px 0 30px; background:transparent url(../images/bg_footer.png) bottom left no-repeat;}
#footer p.right {font-size:10px; color:#999; text-align:right; float:right; margin:0}
#footer p.left {font-size:10px; color:#999; text-align:left; float:left; margin:0}

#footer a, #footer a:link, #footer a:visited {color:#ccc}
#footer a:hover {color:#e4b128; text-decoration:none}

#footer {position:absolute; top:550px; left:50%; margin-left:-480px; z-index:30}