/***************************************************************************
 * Global site styles for www.WorkDocx.org
 *
 * @Author - Fenwick Walker for Grafmix Limited [http://www.grafmix.co.uk]
 * @Date - 03.2009
 * @Copyright - (c) 2009 Workdocx Ltd
 ***************************************************************************/

* {
  margin: 0;
  padding: 0;
}

body, html {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
}

.wrapper {
  width: 975px;
  margin: 0 auto;
  overflow: hidden;
}

#content_column .wrapper {
  width: 625px;
}

  #masthead, #masthead .wrapper {
    background: #3e4648 url('../img/global/masthead_bg.jpg') bottom left repeat-x;
    position: relative;
  }
    #masthead h1 {
      font-size: .5em;
      color: #fff;
      width: 248px;
      height: 88px;
      float: left;
      margin-left: 15px;
    }
    #masthead h1 span {
      display: block;
      width: 248px;
      height: 88px;
      position: absolute;
      background: transparent url('../img/global/workdocx.jpg') top left no-repeat;
    }

  ul#masthead_nav {
    float: right;
    margin-right: 15px;
    list-style: none;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    right: 0;
  }
    ul#masthead_nav li {
      display: block;
      float: left;
      margin-left: 1px;
      background: #c0e871 url('../img/global/masthead_nav/left.gif') top left no-repeat;
    }
      ul#masthead_nav li a {
        display: block;
        padding: 8px 10px 8px 5px;
        margin-left: 5px;
        text-align: center;
        color: #555e6a;
        font-weight: bold;
        text-decoration: none;
        outline: none;
        background: transparent url('../img/global/masthead_nav/right.gif') top right no-repeat;
      }
      ul#masthead_nav li a:hover {
        color: #242424;
        cursor: pointer;
      }
        ul#masthead_nav li a span {
        }
    ul#masthead_nav li.current {
      background: #fff url('../img/global/masthead_nav/current_left.gif') top left no-repeat;
    }
      ul#masthead_nav li.current a {
        color: #242424;
        background: transparent url('../img/global/masthead_nav/current_right.gif') top right no-repeat;
      }
      ul#masthead_nav li.current a span {
        background: transparent;
      }
  #page_heading {
    padding: 1em 0 1em 0;
  }
    #page_heading h2, #page_heading h3 {
      margin: 0 0 0 15px;
    }
    
  
  #content {
    overflow: hidden;
    background: #fff url('../img/global/content_bg.jpg') top left repeat-x;
  }
  
  #content, #content_column .wrapper {
    
  }
  
  #content p, #content_fullspan h3 {
    margin: 15px;
  }
  
  #content p {
    font-size: 1.1em;
  }
  
  #content p.preamble {
    font-size: 1em;
    margin: 1.5em 0;
    line-height: 1.5em;
  }
  
  #content_column {
    width: 625px;
    float: left;
    margin: 0 0 0 15px;
  }
  
  #side_panel {
    width: 305px;
    float: right;
    margin: 0 15px 0 0;
  }
  
  #footer, #footer .wrapper {
    background: #fff url('../img/global/footer_bg.jpg') top left repeat-x;
    min-height: 100px;
  }
  #footer ul#foot_links {
    width: 250px;
    padding: 1.5em 0 1.5em;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
    list-style: none;
  }
    #footer ul#foot_links li#legal, #footer ul#foot_links li#privacy {
      display: inline;
    }
    #footer ul#foot_links li#privacy {
      margin-left: 0.5em;
    }
    #footer ul#foot_links li#grafmix {
      font-size: .5em;
      display: block;
      clear: both;
      overflow: hidden;
    }
    #footer ul#foot_links li#legal a, #footer ul#foot_links li#privacy a {
      color: #666;
      font-size: .8em;
      font-weight: bold;
    }
    #footer ul#foot_links li#legal a:hover, #footer ul#foot_links li#privacy a:hover {
      text-decoration: none;
    }
    #footer ul#foot_links li#grafmix a {
      display: block;
      width: 50px;
      height: 62px;
      margin: 2em auto 0;
      clear: both;
    }
    #footer ul#foot_links li#grafmix a span {
      display: block;
      width: 50px;
      height: 62px;
      position: absolute;
      background: #fff url('../img/global/grafmix.gif') top left no-repeat;
    }
    #footer ul#foot_links li#grafmix a span:hover {
      background: #fff url('../img/global/grafmix.gif') 0 -62px no-repeat;
    }