/*
Zoom (High Contrast Layout) CSS
Copyright (c) 2006-2007, Victoria Bailey
================================================

Colours
================================================
Background: #333
Text (Main): #FFF
Nav: #66FF66
Right Column Headings: #B9D8FF
Right Column Links: #66FF66
Right Column Text: #FFF
*/

/*STRUCTURE
---------------------*/
body {
  background-color: #333;
	background-image: none;
}

#wrapperContainer{
  width: 97%;
	margin-left: 10px; margin-right: 10px; margin-top: 10px;
}

#secondaryNavContainer{
  width: 100%;
	margin: 0;
	background-color: #333;
	background-image: none;
	border-right: 0;
	border-left: 0;
}

#styleSheetSwitcher {
	display: none;
}

#headerContainer{
  display: none;
}

#primaryNavContainer{
  width: 100%;
	margin: 0;
	background-color: #333;
  border-right: 0;
	border-left: 0;
}

#pageContainer {
  width: 100%;
	margin: 0;
	background-color: #333;
	border-right: 0;
	border-left: 0;
}

#contentContainer {
  width: 100%;
	margin-right: 0;
	float: left;
	background-color: #333;
}

#victoriaAvatar {
 display: none;
}

#introText {
  width: 100%;
	float: left;
}

#newsContainerL, linksContainerL {
  width: 100%;
	float: left;
}

#newsContainerR, linksContainerR {
  width: 100%;
	float: left;
}

#booksContainer {
  width: 100%;
	float: left;
}

#portfolioContainer {
  width: 100%;
	float: left;
	background-color: #333;
}

#footerContainer{
  width: 100%;
	margin: 0px;
	padding: 0 10px 10px 10px;
	background-color: #333;
	border-right: 0;
	border-bottom: 0;
	border-left: 0;
}

.clear {clear: both;}


/*STYLE
-----------*/
body {
  color: #FFF;
	font-size: 150%
}

#wrapperContainer{font-size: 62.5%;}

#secondaryNavContainer{font-size: 84%;}

#primaryNavContainer{font-size: 84%;}

#newsContainer {font-size: 84%;}

h1 {
  font-size: 1.8em;
	font-weight: bold;
	color: #FFFF8F;
	text-align: left;
	padding-left: 0px;
}

h2 {
  font-size: 1.6em;
	font-weight: bold;
	color: #FFFF8F;
	text-align: left;
}

h3 {
  font-size: 1.4em;
	font-weight: bold;
	color: #FFFF8F;
	text-align: left;
}

p {
  font-size: 1.2em;
	color: #FFF;
	text-align: justify;
}

li {
  font-size: 1.2em;
	color: #FFF;
	text-align: justify;
	list-style-type: square;
	margin: 0 0 0 1.5em;
}

dl {
  font-size: 1.2em;
	color: #FFF;
	text-align: justify;
	margin: 0 0 0 1.5em;
}

dd {
  margin-bottom: 1em;
}

#contentContainer  a {background-color: #333; color: #66FF66;}
#contentContainer  a:link {text-decoration: none;}
#contentContainer  a:visited {text-decoration: none;}
#contentContainer  a:hover {text-decoration: underline;}
#contentContainer  a:active {text-decoration: none;}

.blueBorder, .greenBorder, .pinkBorder, .orangeBorder, .turquoiseBorder {border: 0 solid #333;}

.blueText, .greenText, .pinkText,  .orangeText , .turquoiseText {color: #FFFF8F; font-weight: bold;}

/*STYLE -  SECONDARY NAVIGATION
------------------------------*/
ul.secondaryNav {
	margin: 9px 0 6px 0;
	padding: 0;
	float: left
}

ul.secondaryNav li {
	display: inline;
	margin: 0;
}

ul.secondaryNav li#switchHigh {display: none;}
ul.secondaryNav li#switchDefault {display: inline;}

ul.secondaryNav, ul.secondaryNav li a {
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}

ul.secondaryNav li a {
  margin: 0;
	font-size: 1.2em;
	color: #66FF66;
	font-weight: bold;
	text-decoration: none;
	text-transform: lowercase;
	}

ul.secondaryNav li a:hover {
	background-color: #66FF66;
	background-image: none;
	color: #000 !important;
	font-weight: bold;
	text-decoration: none;
	text-transform: lowercase;
}

body#home li.home a, body#home li.home a:hover,
body#accessibilityguide li.accessibilityguide a, body#accessibilityguide li.accessibilityguide a:hover,
body#highContrastLayout li.highContrastLayout a, body#highContrastLayout li.highContrastLayout a:hover,
body#sitemap li.sitemap a, body#sitemap li.sitemap a:hover,
body#contact li.contact a, body#contact li.contact a:hover {
	background-color: #66FF66;
	background-image: none;
	color: #000 !important;
	font-weight: bold;
	text-decoration: none;
	text-transform: lowercase;
}

/*STYLE -  PRIMARY NAVIGATION
------------------------------*/
ul.primaryNav {
	margin: 9px 0 6px 0;
	padding: 0;
	float: left;
}

ul.primaryNav li {
	display: inline;
	margin: 0;
}

ul.primaryNav, ul.primaryNav li a {
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}

ul.primaryNav li a {
  margin: 0;
	font-size: 1.7em;
	color: #66FF66;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	}

ul.primaryNav li a:hover {
	background-color: #66FF66;
	background-image: none;
	color: #000 !important;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
}


body#biography li.biography a, body#biography li.biography a:hover,
body#skillsAndExperience li.skillsAndExperience a, body#skillsAndExperience li.skillsAndExperience a:hover,
body#resources li.resources a, body#resources li.resources a:hover,
body#articles li.articles a, body#articles li.articles a:hover,
body#links li.links a, body#links li.links a:hover {
	background-color: #66FF66;
	background-image: none;
	color: #000 !important;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
}

/*STYLE - NEWS ARTICLES
--------------------------------------*/
.newsContainer ul {
  margin: 0;
	padding: 0;
}

.newsContainer ul li {
	margin: 0;
	display: inline;
	float: left;
}

#newsContainerL ul li a, #newsContainerR ul li a {
  width: 100%;
	margin: 0 0 10px 0;
	padding: 0px;
	background-color: #333;
	color: #66FF66;
	text-align: left;
	text-decoration: none;
	list-style-type: none;
}

#newsContainerL ul li a:hover, #newsContainerR ul li a:hover {
  background-color: #333;
	color: #66FF66;
	text-decoration: underline;
}

.newsContainer li.catHeaderContainer {
  width: 100%;
	margin: 0;
	padding: 0;
	background-color: #333;
	text-align: left;
	text-decoration: none;
	list-style-type: none;
	display: block;
}

.greenSpeechBubble, .orangeSpeechBubble, .pinkSpeechBubble, .turquoiseSpeechBubble {
  background-image: none;
}

.newsContainer .catHeader {
  font-size: 1.6em;
	font-weight: bold;
	margin: 0;
	padding-left: 0;
	text-align: left;
}

.newsContainer .newsHeader {
  font-size: 1.4em;
	font-weight: bold;
	color: #66FF66;
	text-align: left;
}

.newsContainer .newsText {
  font-size: 1.2em;
}

#newsContainer .noRightMargin {margin-right: 0;}

/*STYLE - BOOKS
-------------------------------*/
#booksContainer img {
  width: 64px;
	height: 83px;
}

#booksContainer a, #booksContainer a.noRightMargin{
  width: 64px;
	height: 83px;
	background-color: #000;
	display: inline;
	float: left;
	border: 2px solid #242424;
	text-align: center;
	margin-right: 10px;
	padding: 1px;
}

#booksContainer a.noRightMargin {margin-right: 0;}

#booksContainer a:hover, #booksContainer a.noRightMargin:hover{border: 2px solid #66FF66;}

/*STYLE - PORTFOLIO
-------------------------------*/
#portfolioContainer img {
  width: 54px;
	height: 54px;
}

#portfolioContainer a, #portfolioContainer a.noRightMargin{
  width: 54px;
	height: 54px;
	background-color: #000;
	display: inline;
	float: left;
	border: 2px solid #242424;
	text-align: center;
	margin-top: 10px;
	margin-right: 10px;
	padding: 1px;
}

#booksContainer .catHeader {
	font-weight: bold;
	color: #FFFF8F;
	padding-left: 0;
	text-align: left;
}

#portfolioContainer a.noRightMargin{	margin-right: 10px;}

#portfolioContainer a:hover, #portfolioContainer a.noRightMargin:hover{	border: 2px solid #FFFFFF;}

/*STYLE - FOOTER NAVIGATION
--------------------------------------------*/
#footerContainer ul.footerNav {margin: 2px 0 2px 0; }

#footerContainer ul.footerNav li {
  list-style-type: none;
	font-size: 1.2em;
	font-weight: bold;
  display: inline;
	margin: 0;
}

#footerContainer ul.footerNav li a {
  padding: 0 2px 0 2px;
	text-decoration: none;
}
	
#footerContainer ul.footerNav li a:link, #footerContainer ul.footerNav li a:visited {color: #66FF66;}

#footerContainer ul.footerNav li a:hover, #footerContainer ul.footerNav li a:active {color: #66FF66; text-decoration: underline;}

/*STYLE - COPYRIGHT / VALIDATION
---------------------------------------------------*/
#footerContainer ul.copyright {margin: 6px 0 2px 0; }

#footerContainer ul.copyright li {
  padding: 5px 2px 5px 2px;
  list-style-type: none;
	font-size: 1em;
	font-weight: bold;
  display: inline;
	margin: 0;
}

#footerContainer ul.copyright li a {text-decoration: none;}
	
#footerContainer ul.copyright li a:link, #footerContainer ul.copyright li a:visited {color: #66FF66;}

#footerContainer ul.copyright li a:hover, #footerContainer ul.copyright li a:active {color: 66FF66; text-decoration: underline;}

.xhtmlBadge, .cssBadge {
	display: none;
}

.badgePadding{padding-left: 0;}

.xhtmlBadge{background-image: none;}

.cssBadge{background-image: none;}

/*STYLE - FORM
----------------------*/
form { 
  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  margin: 0 0 0 50px;
  padding: 0;
  /*min-width: 500px;
  max-width: 600px;*/
  width: 440px; 
}

form fieldset {
  /* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  border-color: #000;
  border-width: 1px;
  border-style: solid;
  padding: 10px;        /* padding in fieldset support spotty in IE */
  margin: 0;
}

form fieldset legend {
   font-size: 1.1em;  /* bump up legend font size, not too large or it'll overwrite border on left */
	 font-weight: bold;
	 color: #FFF;  /* be careful with padding, it'll shift the nice offset on top of border  */
}

form label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 150px; 
	padding: 0; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right; 
}

form fieldset label:first-letter { /* use first-letter pseudo-class to underline accesskey, note that */
	text-decoration:underline;    /* Firefox 1.07 WIN and Explorer 5.2 Mac don't support first-letter */
                                    /* pseudo-class on legend elements, but do support it on label elements */
                                    /* we instead underline first letter on each label element and accesskey */
                                    /* each input. doing only legends would  lessens cognitive load */
                                   /* opera breaks after first letter underlined legends but not labels */
}

form input, form textarea {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
}

form input#reset {
	margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}

textarea { overflow: auto; }

form small {
	display: block;
	margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	font-size: 88%;
}

form .required{font-weight:bold;} /* uses class instead of div, more efficient */

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}