/** 
 *   (http://www.ContentedDesigns.org) An open source xhtml/css website
 *   template. Free to modify and use for any purpose without cost or
 *   obligation.
 *
 *   created by: G. D. LaBossiere, Xview Solutions Inc.
 *   last modified: 2011-07-09
 *   stylesheet name: CleanBlue.css
 *
 * **/

/**  Fonts created with @font-face Generator from Font Squirrel (http://www.fontsquirrel.com) 
 *   See also http://nicewebtype.com/notes/2009/10/30/how-to-use-css-font-face/
 * **/

@font-face {
/* for Internet Explorer */
  font-family: "LiberationSans";
    src: url("../fonts/liberationsans-regular-webfont.eot");
}

@font-face {
/* all other browsers */
  font-family: "LiberationSans";
    src: url(//:/fonts/) format('no404'),
      url("../fonts/liberationsans-regular-webfont.woff") format("woff"), 
      url("../fonts/liberationsans-regular-webfont.ttf") format("truetype"), 
      url("../fonts/liberationsans-regular-webfont.svg#LiberationSansRegular") format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
/* for Internet Explorer */
  font-family: "LiberationSans";
    src: url("../fonts/liberationsans-bold-webfont.eot");
}

@font-face {
/* all other browsers */
  font-family: "LiberationSans";
    src: url(//:/fonts/) format('no404'),
      url("../fonts/liberationsans-bold-webfont.woff") format("woff"), 
      url("../fonts/liberationsans-bold-webfont.ttf") format("truetype"), 
      url("../fonts/liberationsans-bold-webfont.svg#LiberationSansBold") format("svg");
  font-weight: bold;
  font-style: normal;
}

@font-face {
/* for Internet Explorer */
  font-family: "LiberationSans";
    src: url("../fonts/liberationsans-bolditalic-webfont.eot");
}

@font-face {
/* all other browsers */
  font-family: "LiberationSans";
    src: url(//:/fonts/) format('no404'),
      url("../fonts/liberationsans-bolditalic-webfont.woff") format("woff"), 
      url("../fonts/liberationsans-bolditalic-webfont.ttf") format("truetype"), 
      url("../fonts/liberationsans-bolditalic-webfont.svg#LiberationSansBoldItalic") format("svg");
  font-weight: bold;
  font-style: italic;
}

@font-face {
/* for Internet Explorer */
  font-family: "LiberationSans";
    src: url("../fonts/liberationsans-italic-webfont.eot");
}

@font-face {
/* all other browsers */
  font-family: "LiberationSans";
    src: url(//:/fonts/) format('no404'),
      url("../fonts/liberationsans-italic-webfont.woff") format("woff"), 
      url("../fonts/liberationsans-italic-webfont.ttf") format("truetype"), 
      url("../fonts/liberationsans-italic-webfont.svg#LiberationSansItalic") format("svg");
  font-weight: normal;
  font-style: italic;
}

/**************** default element styles *****************/

* {
  padding: 0;
  margin: 0;
}

body {
  width: 776px;
  margin: 0 auto;
  color: #333333;
  background-color: #d2d8df;
  text-align: justify;
  font-family: "LiberationSans", Arial, Helvetica, sans-serif; 
  font-size: 0.8em; /** 10pt; **/   
}

p, li {line-height: 1.5em;}

p, pre, blockquote, label, ul, ol, dl, address { margin: 1em 0; }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0.5em; 
  font-weight: bold;
} 

h1, h2, h3, h4, h5, h6, fieldset, textarea { text-align: left; }

b, strong { font-weight: bold; }

i, em { font-style: italic; }

h1 { font-size: 160%; } 

h2 { font-size: 140%; }

h3 { font-size: 120%; }

h4 { font-size: 100%; }

h5 { font-size: 85%; }

h6 { font-size: 75%; }

li, dd { margin: 0 2em; } 

fieldset, textarea { padding: 10px; }

legend { padding: 0 5px; }

fieldset, input, textarea { border: 1px solid #3366CC; } 

fieldset {
  margin-top: 1em;
  color: #3366CC; 
}  

form, input { font-size: 100%; } 

input { padding: 2px; }

/** Internet Explorer < 7 doesn"t understand the input[type=...] syntax **/
input[type=submit], input[type=button], input[type=reset] {
  font-weight: bold;
  color: #3366CC;
}

a:link, a:visited {
  color: #0055CC; 
  background-color: White;   
  text-decoration: none;
}

a:hover, a:active {
  color: #0055CC; 
  background-color: White;   
  text-decoration: underline;
}

/** make ShowHide.js link text color same as body text 
a.showhide { color: #333333; } **/


/**************** id and class styles *****************/

#container {
  background-color: White; 
  width: 100%;
  height: 100%;
  padding: 0 15px;
}

#header {
  position: relative;
  min-height: 63px;
  height: auto;
  clear: both;
  color: White;
  background: #3366CC url("../images/XviewLogo3366CC-94x60.png") no-repeat 5px 5px; 
  padding: 0 0 7px 0; 
  margin: 0 -15px;
}

#title {
  position: absolute;
  float: left;
  z-index: 1;
  width: auto;
  color: White;
  text-align: left;
  font-weight: bold;
  font-size: 167%; 
  padding: 0;
  margin: 15px 0 0 110px;
}

#title_shadow {
  position: absolute;
  float: left;
  left: -2px;
  top: 2px;
  width: auto;
  color: #888888;
  text-align: left;
  font-weight: bold;
  font-size: 167%; 
  padding: 0;
  margin: 15px 0 0 110px;
}

#pagename {
  color: White;
  text-align: right;
  font-weight: bold;
  font-size: 120%; 
  padding: 20px 15px 0 50%;
  margin: 0;
  min-height: 30px;
  height: auto;
}

#headercontact {
  float: right;
  margin: -4px 7px 0 0;
  text-align: right;
}

#navbar {
  float: left;
  margin: -4px 0 0 110px;
  text-align: left;
}

#navbar, #headercontact {
  padding: 4px;
  font-size: 83%;
  display: inline;
}

#navbar a, #headercontact a {
  margin: 4px;
  padding: 2px; 
  text-decoration: none;
  color: White;  
  background-color: #3366CC;
  border: 1px solid #3366CC;
}

#navbar a:hover, #headercontact a:hover { 
  border: 1px solid White;
}

#navbar a:active, #headercontact a:active { 
  color: #3366CC;  
  background-color: White; 
  border: 1px solid #3366CC;
}

#navbar a#selected, #headercontact a#selected { 
  border: 1px solid White;
}

#path {
  clear: both;
  text-align: right;
  font-size: 83%;
  padding: 2px 5px 0px 0px;
  margin: 0; 
}

#rightsidebar {
  background-color: White;  
  color: #666666;
  font-size: 83%;
  width: 210px;   
  padding: 0 0 10px 0;
  float: right;
  clear: right;
  margin: 10px 0 0 20px;
}

#leftsidebar {
  background-color: White;  
  color: #666666;
  font-size: 83%;
  width: 210px; 
  padding: 0 0 10px 0;
  float: left;
  clear: left;
  margin: 10px 30px 0 0;  
}

#rightsidebar a, #leftsidebar a {
  color: #0055CC; 
  background-color:White;   
}

#rightsidebar h3, #leftsidebar h3 { 
  margin: 0;
  padding: 2px 0px 2px 5px;
  color: White;   
  background-color: #999999;
}

#rightsidebar ul, #leftsidebar ul { 
  margin: 0.25em;
  text-align: left;
}

#rightsidebar ul li, #leftsidebar ul li {
  list-style-position: outside;
}

ul.check, li.check {
  list-style-image: url("../images/check-12x18.png");
}

ul.cross, li.cross {
  list-style-image: url("../images/cross-12x18.png");
}

a.showhide:link , a.showhide:visited, a.showhide:hover, a.showhide:active, a.showhide img { 
  display: inline;
  border: 0;
  text-decoration: none; 
  vertical-align: bottom;
}

.shout, a.shout:link, a.shout:visited, .shout a:active, .shout a:hover {
  font-weight: bold;
  font-style: italic; 
}

.box {
  margin: 0 1px;
  padding: 0 10px;
}

.border999 {
  border: #999999 solid 1px;
}

.border36c {
  border: #3366CC solid 1px;
}

.border69f {
  border: #6699FF solid 1px;
}

.border69c {
  border: #6699CC solid 1px;
}

.boxtitle {
  margin: 0;
  padding: 2px 0 2px 5px;
  color: White; 
}

.bg999 {
  background-color: #999999;
}

.bg36c {
  background-color: #3366CC;
}

.bg69f {
  background-color: #6699FF;
}

.bg69c {
  background-color: #6699CC;
}

.boxbody {
  margin: 0;
  padding: 5px;
}

#footer {
  height: 30px;
  background-color: White;   
  border-top: 3px solid #3366CC; 
  font-size: 83%;
  color: #888888;
  line-height: 1.5em;
  clear: both;
  margin-top: 20px;
}

#footer a { text-decoration: none; }

#footer a:hover, #footer a:active { text-decoration: underline; }

#leftfoot {
  padding: 5px 20px 5px 0px;
  float: left;
}

#leftfoot a, #leftfoot a:hover, #leftfoot a:visited  {
  color: #888888; 
  background-color: White; 
}

#rightfoot {
  padding: 5px 0px 5px 0px;
  float: right;
}

#rightfoot a, #rightfoot a:hover, #rightfoot a:visited {
  color: #0055CC; 
  background-color: White; 
}

.paragraph_right {
  float: right;
  margin: 1em 0 1em 2em;
  clear: right;
}

.paragraph_left {
  float: left;
  margin: 1em 2em 1em 0;
}

img.rightbox {
  float: right;
  margin-top: 10px;
  margin-left: 10px;
  margin-bottom: 10px;
}

img.leftbox {
  float: left;
  margin-top: 10px;
  margin-right: 10px;
  margin-bottom: 10px;
}

img#rightsidebar, img#leftsidebar {
  margin-bottom: 5px;
}