html, body, #wrap {height: 100%;}
html { font-size: 16px; }

body {  
  background-color: white;
  font-family: Arial, Helvetica, sans-serif;
  color: black;
  font-size: 62.5%; 
  line-height: 1.8em;
  background-color: #ddd;
}


/*
--------------------------------------------
GENERAL HTML STYLES
--------------------------------------------
*/


h1 { font-size: 1.6em; font-weight: bold; color: #D70000; padding: 12px 0px 18px 0px; }
h2 { font-size: 2.2em; font-weight: bold; color: #D70000; padding: 10px 0px 12px 0px; line-height: 1.2em; }
h3 { font-size: 1.1em; font-weight: bold; color: #D70000; padding: 6px 0px 8px 0px; }
h4 { font-size: 1.0em; font-weight: bold; color: #D70000; padding: 6px 0px 8px 0px; } 
h5 {}
h6 {}

p {
  padding-bottom: 8px;
}

ul {margin-bottom: 8px; }
li { padding-bottom: 4px; padding-left: 18px;  }

a { color: #D70000; }
a:hover { color: #000000; }

blockquote { padding-left: 18px; padding-bottom: 6px;}

strong { font-weight: bold; }
em { font-style: italic; }

img { padding: 0; margin: 0; }

/*
--------------------------------------------
COMMON STYLES
--------------------------------------------
*/

.hidden { visibility: hidden; }
h2 .hidden { display: none; }

.introduction { font-weight: bold; }
.clear { clear: both; font-size: 1px; overflow: hidden; height: 1px; }
.indent { padding-left: 18px; }
.error { background: #ffd; border: 1px solid #cb9; margin: 12px; padding: 6px 12px 6px 12px; }
.jumptocontent { display: none; }
.contentanchor { display: none; }

/*
--------------------------------------------
PAGE STRUCTURE STYLES
--------------------------------------------
*/

#container { width: 950px; margin: 12px auto 24px auto;  font-size: 1.2em; background-color: white; }

#pageHeader { clear: both; background-color: #79B2F7; }
#pageHeader .nav { float: left; width: 204px;  }
#pageHeader .banner { float: left; width: 728px; height: 336px; overflow: hidden; }

#pageMain { clear: both; }

#pageMainLeft {float: left; width: 222px; padding-top: 12px; }

#pageMainRight {float: right; width: 140px; padding-top: 12px; }

#pageMainContent { margin-left: 222px; margin-right: 140px; padding: 12px; color: black; }
#pageMainContentFull { margin-left: 222px; padding: 12px; color: black; }


/*
---------------------------------------------------------
ADDITIONAL STYLES
---------------------------------------------------------
*/
#pageHeader h1 { padding: 0; margin: 0; }

.rss { padding-top: 42px; width: 202px; margin-left: 18px; border: 1px solid #F97103; margin-bottom: 4px; padding-bottom: 6px; }
.rss ul, .rss ul li{ padding: 0; margin: 0; }
.rss ul li { background: black url(../styles/rss_pointer.gif) 8px 4px no-repeat; line-height: 16px; padding-left: 20px;  }
.rss ul li a { color: orange; text-decoration: none; font-size: 0.9em; line-height: 16px;}

#rssEveningpost { border-color: #F97103; background: #000000 url(../images/eveningpost.gif) top left no-repeat; }
#rssEveningpost a { color: #F97103;  }
#rssEveningpost a:hover { text-decoration: underline; }

#rssBBCwales { border-color: #D70000; background: #000000 url(../images/bbcwales.gif) top left no-repeat; }
#rssBBCwales ul li { background-image: url(../styles/rss_pointer2.gif); }
#rssBBCwales a { color: #D70000;  }
#rssBBCwales a:hover { text-decoration: underline; }

.leftbuttons { margin-left: 18px; }

.rightbuttons, .rightbuttons li { padding: 0; margin: 0; width: 138px; }
.rightbuttons li { margin-bottom: 4px; }
.rightbuttons li a { padding: 0; margin: 0; text-decoration: none; display: block; height: 47px; width: 138px; background-color: #eee; }

#btnYoutube a { background-image: url(../images/btnYoutube.gif); }
#btnFacebook a { background-image: url(../images/btnFacebook.gif); }
#btnLabour a { background-image: url(../images/btnLabour.gif); }
#btnRegister a { background-image: url(../images/btnRegister.gif); }
#btnSurgery a { background-image: url(../images/btnSurgery.gif); }
#btnNewsletter a { background-image: url(../images/btnNewsletter.gif); }
#btnExpenses a { background-image: url(../images/btnExpenses.gif); }

.rightbuttons li a:hover { background-position: 0px -47px; }


/*
---------------------------------------------------------
NAVIGATION STYLES
---------------------------------------------------------
*/

.nav, .nav li { padding: 0; margin: 0; }
.nav { padding-top: 24px; padding-bottom: 13px; background-color: #D70000; border-left: 18px solid #79B2F7; }
.nav li { display: block; height: 23px; width: 204px; }
.nav li a { background: transparent url(navMenu.gif) 0px 0px no-repeat; display: block; height: 23px; 
  padding: 0px 13px; text-decoration: none;  color: white; line-height: 23px; text-align: left; font-weight: bold; }
.nav li a span { visibility: visible; margin-right: 13px; }

.nav li a:hover, .nav li.selected a, .nav li.selected a:hover { background-position: 0px -23px; text-decoration: none; color: #fcc; }

/*
---------------------------------------------------------
FOOTER STYLES
---------------------------------------------------------
*/

#pageFooter { clear: both; background-color: #D70000; color: white; 
  line-height: 20px; height: 20px; text-align: center; font-size: 0.95em; padding: 0 12px 0 12px} 
#pageFooter a { color: white; text-decoration: none; }
#pageFooter a:hover { color: #ddd; text-decoration: underline; }


/*
---------------------------------------------------------
QUESTIONNAIRE STYLES
---------------------------------------------------------
*/

form fieldset { margin-left: 12px; }
form div { 
  width: 50%;
  background-color: #fee;
  padding: 8px 12px;
  margin: 0px 0px 8px 12px;
  /* the following add curved corners in modern browsers and CSS3 */
  -moz-border-radius: 0.5em;
  -webkit-border-radius: 0.5em;
  border-radius: 0.5em;
}
form input.option { margin-bottom: 10px; }
form label { margin-left: 12px; }
form input.btn { margin: 0 0 0 24px; width: 50px; }

.graph { padding: 0px; margin: 0px 0px 24px 0px; position: relative; 
        width: 600px; border: 0px solid #0066FF; padding: 2px;   
        font-size: 0.9em;
        list-style: none;
    }
.graph .barCaption { 
      float: left;
      font-size: 0.85em; font-weight: bold;
      position: relative; 
      background: white; 
      text-align: right; 
      color: #333; 
      height: 2em; 
      line-height: 2em; 
      border: 2px solid white; 
      width: 300px;
}
.graph .bar { 
      display: block; 
      padding: 0px 2px;
      position: relative; 
      background: #99CCFF;
      text-align: left; 
      color: #333; 
      height: 2em; 
      line-height: 2em; 
      border: 2px solid white; }
.graph .bar span { position: absolute; left: 1em; }
.graph .list { margin-left: 60px; font-size: 0.85em; list-style: decimal; }
.sub { padding-left: 4px; border: 2px dashed #ccc; }

/*
---------------------------------------------------------
COMMENT STYLES
---------------------------------------------------------
*/

.comments, .comments li { padding: 0; margin: 0; list-style: none; }
.comments { padding-left: 12px; }
.comments li .comments { padding-top: 16px; border-left: 1px dashed black; margin: 6px 0 0 46px; }
.comments li { padding: 0px 0 0px 0; margin-bottom: 24px;}
.comments li blockquote { padding: 2px 0 0 32px; margin: 0; background: url(/~wwwandr/styles/quote_wh.gif) top left no-repeat; }
.comments li blockquote p:before { content: open-quote; }
.comments li blockquote p:after { content: close-quote; }
.comments li blockquote cite { font-weight: bold; }
.comments li .datetime { padding: 0 12px 0 32px; font-size: 0.9em; }
.comments li .respond { font-size: 0.9em; padding-right: 12px; }
.comments li .delete { font-size: 0.9em; padding-right: 12px; }

.comments li form { margin: 6px 0 0 32px; padding: 4px; }
.comments li form textarea { width: 296px; margin-bottom: 2px; }
.comments li form input {font-size: 0.9em; padding: 1px 6px; }

#newcomment { padding: 8px 12px 0px 12px; background: #eee; border: 1px solid red; margin: 0 200px 12px 12px;}
#newcomment a { text-decoration: none; }
#newcomment a:hover { text-decoration: underline; }

#registered-user-form {
  float: right;
width: 150px;
border: 1px solid red;
padding: 3px 5px 4px 5px;
}
#registerform { margin-left: 16px; }
#registerform td { padding: 6px 0 0 0;}
#registerform label { padding: 0; margin: 0; font-weight: bold; }