/* reset rule */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
  outline: 0;
}
body {
  line-height: 1;
  color: black;
  background: white;
}
ol, ul {
  list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: separate;
  border-spacing: 0;
}
caption, th, td {
  text-align: left;
  font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
}
blockquote, q {
  quotes: "" "";
}

/* main positional divs */
div#wrapper {
    width:1113px;
    height:785px;
    margin: 10px auto;
    position: relative;
    background-image: url(img/box-repeat.jpg);
    background-repeat:repeat-x;
}

div#main-content {
    width:620px;
    height:427px;
    position: absolute;
    left: 60px;
    top: 125px;
    margin: 0px;
    padding: 90px 190px;
    background-color: #252525;
    background-repeat:no-repeat;
}

div#footer {
    position:absolute;
    bottom: 5px;
    width: 699px;
    left:-350px;
    margin-left:50%;
    text-align:center;
    text-shadow:#000 0px 1px 10px;
    font-size:12px;
    line-height:14px;

}

/*  fonts and colours */
body { background-color:#000; color:#e0e0e0; font-size: 14px; font-family:Verdana, sans-serif; line-height:16px;}
a, a:visited { color: white; text-decoration:none;}
h1 { position:absolute; top:180px; left:0px;width:1113px; z-index:100;text-align:center;color:#000000;font-weight:bold;}
h2 { font-size:16px; margin:5px 0px 10px -15px; font-weight:700;}

label {
    width: 70px;
    float: left;
    text-align: right;
    margin-right: 5px;
    margin-bottom: 3px;
    display: block;
}

form { margin: 0px auto; width:340px;}

strong { font-weight:700; }


dt {font-weight:700; float:left; width:60px;}
dd { float:left; width:160px;}

#logo { position:absolute; top:10px; left:50px; }

ul#main-menu {position: absolute; top: 80px; right: 33px; z-index:100; padding:0px 3px; background-color:transparent; background-image: url(img/nav.png); width:508px; height:42px;
    background-repeat: no-repeat;}
ul#sub-menu {position: absolute; top: 125px; right: 100px; z-index:100; padding:0px 3px; height:30px;}

/* generic menu code */
ul.menu li  {float:left; padding:0px; margin:0px; }
ul.menu li a {display:block; padding:0px; margin:2px; text-align:center; color:#e9e9e9;}

ul#main-menu li a  {width:80px; height:38px; line-height:38px; }
ul#sub-menu li a  {padding-left:20px; width:95px; height:26px; line-height:26px; font-size:12px;text-align:left;}

div#main-content { line-height:17px; text-shadow:#000 0px 0px 10px;}
div#main-content p { margin-bottom: 10px; text-align:justify; text-indent:15px; }
div#main-content div.pwrapper p:first-child { text-indent:0px; }
div#main-content h3.headinline { float:left;font-weight:700; }


div.scroller {overflow:auto; margin-right:-188px;padding-right:188px; height:320px;}

ul#sitemap {list-style: circle;}
ul#sitemap a {color: white;}
ul#sitemap ul { margin-left:15px;list-style: circle;}

#threebill-logo, #faces-logo, #labs-logo { position: absolute; }
#projfaces, #projstay, #proj3bill, #projfran, #projbus { position:absolute; }

#threebill-logo { bottom:19px; left: 250px;}
#faces-logo { bottom:19px; left: 430px;}
#labs-logo { bottom:19px; left: 618px;}

#projfaces { top:150px; left: 200px;}
#proj3bill {top:150px; right:200px;}
#projstay { top:250px; left:450px;}
#projbus { top:400px; left:250px;}
#projfran { top:400px; right:250px;}

/**
 * page specific styles all lumped in here, not that big...
 */

/* homepage */
body.homepage div#main-content {background-image: url(img/Home-Page.jpg)}
body.contact div#main-content {background-image: url(img/Contact-Page.jpg)}
body.labs div#main-content {background-image: url(img/Labs-Page.jpg)}
body.staff div#main-content {background-image: url(img/Staff-Page.jpg)}
body.profile div#main-content {background-image: url(img/Profile-Page.jpg)}
body.projects div#main-content {background-image: url(img/Projects-Page.jpg)}


body.contact input, body.contact textarea { border: 1px solid #39B54A; margin-bottom: 3px; width:260px;}
body.contact input.formbutton { float:right; width:80px;}
body.contact div#contact-address { margin-top:15px; margin-left:80px; float:left;}
body.contact div#contact-electronic  {margin-top:15px;margin-left: 140px;float:left; width:220px;}


body.homepage h2, body.homepage h3, body.homepage a, body.homepage a:hover, body.homepage label { color:#2786E4;}
body.contact h2,body.contact h3, body.contact a, body.contact a:hover, body.contact label { color:#39B54A; }
body.labs h2,body.labs h3, body.labs a, body.labs a:hover, body.labs label { color:#C1272D; }
body.staff h2,body.staff h3, body.staff a, body.staff a:hover, body.staff label { color:#FCEE21; }
body.profile h2,body.profile h3, body.profile a, body.profile a:hover, body.profile label { color:#C792FF; }
