/***********************************
  SJP CSS v4
  Adrian Long 11/10/2008
***********************************/

body {
  font: 80%/1.6em "Trebuchet MS",verdana,kalimati,helvetica,arial,sans-serif;
  margin: 0;
  padding: 0;
  background: #ffffcc url(../images/bg/pagebg_yellow.png) repeat-x top left;
}

h1, h2, h3 {
  margin: 0;
  padding: 0;
}

#pagecontent {
  width: 760px;
  margin: 0 auto;
  padding: 0 0 0 0;
  background: #fff url(../images/bg/bodybg_greylines.png) top left no-repeat;
  clear: left;
  color: #333;
}

       
#primaryNavigation {
  width: 128px;
  float: left;
  margin: 0 8px 4px 15px;
  padding: 16px 0 0 0;
}
    #primaryNavigation h1 {
      width: 128px;    
      font-size: 1.25em;
      line-height: 1.4;
      letter-spacing: -1px;
      text-align: center;
      font-weight: bold;
    }
        #primaryNavigation h1 a img{
          border: 0;
        }    
    #primaryNavigation ul {
      margin: 8px 0 16px 0;
      padding: 0;
      list-style-type: none;
      height: 32px;
    }
        #primaryNavigation ul li {
          margin: 4px 0;
        }
            #primaryNavigation ul li a {
              font: 1.1em/1.6 "Comic Sans MS",gadget,TSCu_Comic;
              display: block;
              padding: 4px 8px;
              background: #ee0000;
              color: #fff;
              border: 4px solid #000;
              font-weight: bold;
              text-decoration: none;
            }
                #primaryNavigation ul li a:hover,
                #primaryNavigation ul li a:focus {
                  background-color: #ff0000;
                  color: #fff;
                }

#bodyContent {
  min-height: 400px;
  margin: 0 16px 32px 160px;
}
    #bodyContent h1, 
    #bodyContent h2 { 
      color: #a00;
    }
    #bodyContent h1 {
      font-size: 2.2em;
    }
    #bodyContent h2 {
      font-size: 1.4em;
      margin-top: 0.4em;
      padding-bottom: 0.1em;
      border-bottom: 1px solid #e3e3e3;
    }
    #bodyContent h3 {
      font-size: 1.2em;
      margin-top: 0.4em;
    }
    #bodyContent p {
      margin: 0.2em 0 1em 0;
    }
        #bodyContent p.more {
          text-align: right;
          padding-right: 1em;
          margin-top: -1em;
          padding-top: 0;
        }
    
#header {
  height: 96px;
  margin: 0 16px 16px 160px;
  padding: 16px 0 0 0;
}
    /* little hack to make header contain it's floated children */
  	#header:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
  	/* a bit more of the hack to make IE6 do it too */
    #header { display: inline-block; }
  	#header { display: block; }
    /* end of hack */
    
    #header .halfbox {
      margin: 0;
      padding: 8px 16px;
      width: 252px;
      height: 80px;
      float: left;
      background: url(../images/bg/headerboxbg.png) left top no-repeat;
    }
    #header .first {
      margin-right: 16px;
    }
    #header h3 {
      margin: 0;
      padding: 0;
    }
    #header p {
      margin: 0;
      padding: 0;
    }
        #header p.more {
          text-align: right;
        }

#footer {
  clear: both;
  background-color: #ffffcc;
  padding: 16px;
}

#header a, #bodyContent a { font-weight: bold; }
#header a:link, #bodyContent a:link { color: #a00; }
#header a:visited, #bodyContent a:visited { color: #800; }
#header a:hover, #bodyContent a:hover { color: #d00; }
#header a:focus, #bodyContent a:focus { color: #d00; background-color: #fcc;}
#header a:active, #bodyContent a:active { color: #da0; }
