/* BASIC STYLING ***************************************************/
body {
	margin: 0;
	padding: 0;
	font-size: small;
	font-family: 'Lucida Grande', Arial, Helvetica, sans-serif;
	background: #3c526e url(../images/elements/body_bg.jpg) repeat-x top left;
}

/* BASIC ELEMENTS *************************************************/
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	letter-spacing: -1px;
}

a {
	text-decoration: none;
}

ul, li {
	margin: 0;
	padding: 0;
	list-style: none;
}

p {
	margin: 0;
	padding: 0;
	font-weight: normal;
	color: #636363;
}

img {
	border: none;
}

span {
	display: none;
}

/*For single digits*/
span.number {
	margin: 0;
	padding: 11px 12px 11px 10px;
	display: inline !important;
	color: #fff;
	font-size: 100%;
	background: url(../images/elements/icon_step-number.png) no-repeat left center;
}

/*For double digits*/
span.dd-number {
	margin: 0;
	padding: 11px 8px 11px 4px;
	display: inline !important;
	color: #fff;
	font-size: 100%;
	background: url(../images/elements/icon_step-number.png) no-repeat left center;
}

.clear {
	clear: both;
}

.clickable {
	cursor: pointer;
}

.line {
	clear: both;
	margin: 10px 0 20px 0;
	padding: 0;
	height: 3px;
	background: url(../images/elements/line.gif) repeat-x left center;
}
.darkline {
	clear: both;
	margin: 10px 0 20px 0;
	padding: 0;
	height: 5px;
	background: url(../images/elements/dark_line.gif) repeat-x left center;
}

.darker {
	color:#313131;
}
.centered {
	text-align: center;
	padding: 4px 0 10px 0;
}

.centered p {
	font-weight: bold;
	color: #2F3038;
	padding: 0 0 2px 0 !important;
}
.clearfix:after {
	display:block;
	visibility:hidden;
	clear:both;
	height:0;
	content:".";
}
.clearfix {display:inline-block;}

.wikilink {
	padding:0 18px 0 0;
	background: url(../images/elements/wiki-link.gif) no-repeat right 5px;
}

/* WRAP ***********************************************************/
#wrap {
	margin: 0 auto;
	padding: 0;
	width: 800px;
	background: #fff url(../images/elements/wrap_bg.gif) repeat-y top left;
}

/* HEADER - GLOBAL ************************************************/
#header {
	float: left;
	margin: 0;
	padding: 5px 20px 20px 20px;
	background: #11141b;
	width: 760px;
}

#headerdesc {
	float: left;
	margin: 0 15px 0 0;
	padding: 0;
	width: 455px;
}

#headerdesc h1.pagetitle {
	margin: 30px 0 15px 0;
	color: #F3CF43;
	font-weight: normal;
	font-size: 180%;
	padding: 0;
	height: 25px;
}

#headerdesc p {
	margin: 0 0 15px 0;
	padding: 0;
	line-height: 1.5em;
	color: #fff;
	font-size: 135%;
}

#headerdesc p a {
	color: #fff;
	text-decoration: underline;
}

#headerdesc p a:hover {
	text-decoration: none;
}

#video {
	float: right;
	margin: 30px 0 0 0;
	padding: 0;
	width: 290px;
}

#video img {
	margin: 0 0 10px 0;
	padding: 0;
}

#video h3 {
	margin: 0 0 5px 0;
	padding: 0;
	font-size: 100%;
	color: #fff;
	font-weight: normal;
	letter-spacing: 0px;
}

#video p {
	width: 270px;
	color: #aeaeae;
	font-size: 95%;
	line-height: 1.6em;
}

#video a {
	color: #AEAEAE;
	text-decoration: underline;
}

#video a.more {
	float: right;
	margin: 5px 0 0 0;
	font-size: 90%;
	padding: 0;
	color: #64ccff;
	text-decoration: none;
}

#video a.more:hover {
	text-decoration: none;
}

#video a.embed {
	float: right;
	margin: 5px 0 0 0;
	font-size: 90%;
	padding: 0;
	color: #64ccff;
	text-decoration: none;
}

#video a.embed:hover {
	text-decoration: none;
}

#video #moreinfo {
	clear: both;
	float: left;
	position: relative;
	margin: 10px 0;
	padding: 10px;
	width: 255px;
	background: #151923;
}

#video #moreinfo p {
	margin: 0 0 4px 0;
	padding: 0;
}

#video #moreinfo a {
	color: #64ccff;
}

#video #moreinfo p span.highlight {
	color: #fff;
	display: inline;
}

#video #moreinfo a.close {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 1px 6px 3px 6px;
	color: #fff;
	background: red;
}

#player1 {
	padding-bottom: 15px;
}

/* NAV - GLOBAL *****************************************************/
ul#nav {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	background: #ededed url(../images/elements/nav_bg.gif) repeat-x top left;
	border-bottom: 1px solid #fff;
	height: 73px;
	width: 800px;
	color: #303030;
}

ul#nav img {
	position: relative;
	top: 4px;
	padding-right: 8px;
}

ul#nav li {
	display: block;
	float: left;
	margin:0;
	padding: 10px 0 9px 0;
	text-transform: uppercase;
	cursor: default;
}

ul#nav li.sep {
	border-right: 1px solid #e0dfdf;
	border-left: 1px solid #a3a2a2;
}

ul#nav li.seplast {
  border-left: 1px solid #a3a2a2;
  width: 138px;
 }

ul#nav li.on {
  color: #fff;
  background: url(../images/elements/nav_active.gif) repeat-x top left;
}
    
ul#nav li.off {
  background: none;
}
    
ul#nav li.off:hover, ul#nav li.off.sfhover {
  background: url(../images/elements/nav_hover.gif) no-repeat 55% 100%;
}

ul#nav li a.top {
  	display: block;
  	text-align: center;
  	width: 114px;
  	color: #000;
	padding:2px 0;
	margin-left:16px;
}

ul#nav li ul {
  position: absolute;
  top: 39px;
  left: 0;
  margin: 0 0 0 20px;
  padding: 0;
  width: 780px;
  display: none;
  background: #ededed;
}
    
ul#nav li.on ul {
  display: block;
}

/* 
 * We used to use this to show the nav lists when you hovered over a topic,
 * but now we don't
ul#nav li:hover ul, ul#nav li.sfhover ul {
  z-index: 2;
  display: block;
}
*/
    
ul#nav li ul li {
 	float: left;
  margin: 0 25px 0 0;
  padding: 9px 0;
  background: none!important;
}
 
ul#nav li ul li a {
  color: #808080;
}
      
ul#nav li ul li a.on,
ul#nav li ul li a:hover {
	color: #303030;
  text-decoration: underline;
}
ul#nav li a.one {
	background: url(../images/elements/ch1.gif) no-repeat 11px 0;
}
ul#nav li a.two {
	background: url(../images/elements/ch2.gif) no-repeat 7px 0;
}
ul#nav li a.three {
	background: url(../images/elements/ch3.gif) no-repeat 14px 0;
}
ul#nav li a.four {
	background: url(../images/elements/ch4.gif) no-repeat 4px 0;
}
ul#nav li a.five {
	background: url(../images/elements/ch5.gif) no-repeat 4px 0;
}
ul#nav li a.six {
	margin-left:20px;
	background: url(../images/elements/ch6.gif) no-repeat 0 0;
}

/* CONTENT - GLOBAL *************************************************/
#content {
	float: left;
	margin: 0;
	padding: 0;
	width: 800px;
}

#primary {
	float: left;
	margin: 0;
	padding: 10px 0;
	width: 515px;
	background: url(../images/elements/content_bg.jpg) repeat-x top left;
	/* _background: #fff;  <--what's this? ie hack? */
}

#primary a {
	color: #2F3038;
	text-decoration: underline;
}

#primary .interior {
	margin: 0;
	padding: 0px 15px 0px 15px;
}

#primary .interior h1 {
	margin: 12px 0 20px 0;
	padding: 0;
	color: #2F3039;
	font-weight: bold;
	font-size: 180%;
}

#primary .interior h2 {
	margin: 10px 0 9px 4px;
	padding: 0;
	color: #2F3039;
	font-weight: bold;
	font-size: 150%;
}


img.title {
	margin: 10px 0 10px 5px;
}


img.border {
	border:3px solid #C3C2C2;
}


.details {
	clear: both;
	margin: 0px 0 10px 0;
	padding: 0 10px;
}
.detailz {
	margin: 0px 0 10px 0;
	padding: 0 10px;
}

.interior .details h2, .interior .detailz h2 {
	margin: 10px 0 9px 0;
	padding: 0;
	color: #2F3039;
	font-weight: bold;
	font-size: 150%;
}

.details h3, .detailz h3 {
	margin: 0 0 10px 0;
	padding: 0;
	color: #34393f;
}

.details p, .detailz p {
	margin: 0;
	padding: 0 0 15px 0;
	line-height: 1.5em;
}

.scast {
	text-align: center;
	top: 4px;
	color: #2f3039;
	position: relative;
	font-size: 1.7em;
	font-weight: bold;
}

.scast-sub {
	text-align: center;
	top: -12px;
	left: 11%;
	position: relative;
}

.scast-alt {
	position: relative;
	float: right;
	top: -11px;
	left: -15px;
	z-index: 10;
}

.scast-alt a {
	color:#A9A9A9 !important;
	text-decoration: none !important;
}

#primary a.arw  {
	color:#151923;
	text-decoration:underline;
}
#primary a.arw:visited {
	color:#1F2533;
}
#primary a.arw:hover, a.arw:focus {
	color:#aeaeae;
}

.arw {
	padding:0 16px 0 0;
	background: url(../images/elements/arw.gif) no-repeat center right;
}

.go {
	float:right;
	margin:0 20px 0 0;
}
.go a {
	display:block;	
	background: url(../images/elements/go_arrow.png) no-repeat center right;
	padding:8px 14px 8px 0;
	text-decoration: none !important;
}
.go h4 {
	padding:2px 8px 2px 0;	
	background: url(../images/elements/go_grad.png) repeat-y top left;
	color:#555;
}
.go h4 em {
	color:#151923;
}
.choose {
	float:right;
	margin:0 20px 0 0;
}
.choose a {
	display:block;	
	background: url(../images/elements/choose_arrow.png) no-repeat center right;
	padding:8px 14px 8px 0;
	text-decoration: none !important;

}
.choose h4 {
	padding:2px 8px 2px 0;	
	background: url(../images/elements/choose_grad.png) repeat-y top left;
	color:#555;
}
.choose h4 em {
	color:#151923;
}


/* CONTENT - MATRIX - GLOBAL ***************************************/

.matrix {
	float: left;
	margin: 15px 0 30px 0;
	padding: 0;
	width: 477px;
	background: url(../images/elements/matrix_bg.gif) no-repeat bottom left;
}

.matrix .inmatrix {
	float: left;
	margin: 0;
	padding: 20px;
	width: 437px;
	background: url(../images/elements/matrix_top.gif) no-repeat top left;
}

.matrix .inmatrix img {
	margin: 0 0 5px 0;
	padding: 0;
	border: 2px solid #393e47;
}

.matrix .inmatrix h2 {
	margin: 20px 0;
	padding: 0;
	color: #fff !important;
	font-weight: normal;
	font-size: 120%;
}

.matrix .inmatrix h3 {
	margin: 0;
	padding: 8px 0 0 0;
	display: block;
	background: #323741 url(../images/elements/matrix_titlebg.gif) repeat-x top left;
	color: #fbd122;
	text-transform: uppercase;
	font-size: 95%;
	font-weight: normal;
	border-top: 1px solid #393e47;
	border-bottom: 1px solid #393e47;
	height: 22px;
	letter-spacing: 0;
}

.matrix .inmatrix ul {
	margin: 15px 0 20px 0;
	padding: 0;
}

.matrix .inmatrix ul li {
	margin: 0 0 5px 0;
	padding: 0;
	color: #fff;
	font-size: 95%;
}

.matrix .inmatrix .left {
	float: left;
	margin: 0;
	padding: 0;
	width: 218px;
	text-align: center;
	border-right: 1px solid #393e47;
}

.matrix .inmatrix .right {
	float: right;
	margin: 0;
	padding: 0;
	width: 218px;
	text-align: center;
}

/* CONTENT - STEPS - GLOBAL ***************************************/

img.steps {
	margin: 15px 0;
	padding: 0;
	border: 3px solid #c3c2c2;
}

.steps {
	margin: 25px 0;
	padding: 0;
}

.steps h2 {
	margin: 10px 0 8px 0;
	padding: 0;
	color: #2c9eff;
	font-weight: normal;
	font-size: 150%;
}

.steps p {
	margin: 0 0 10px 0;
	padding: 0;
	color: #5a626e;
}
/* CONTENT - CALLOUTS - GLOBAL ***************************************/

.ajaxcallout {
	float: left;
	margin: 0 0 20px 0;
	padding: 0 0 15px 0;
	background: #d8f2fd;
	width: 515px;
}

.ajaxcallout p {
	color: #303030 !important;
}

.ajaxcallout p a {
	color: #303030 !important;
	text-decoration: none !important;
}

.ajaxcallout a.icon_box {
	margin: 0;
	padding: 20px 0 20px 65px;
	font-size: 125%;
	background: #d8f2fd url(../images/elements/icon_expert_tip.gif) no-repeat 10px 6px;
	display: block;
	color: #303030;
	text-decoration: none !important;
}

.ajaxcallout p {
	margin: 0;
	padding: 0 15px 0 20px;
	color: #606060;
}

.ajaxcallout #callbox {
	float: left;
	margin: 0;
	padding: 15px 15px 0 15px;
}

.ajaxcallout #callbox a {
	color: #2F3038;
	font-weight: bold;
	text-decoration: underline !important;
}

.ajaxcallout #callbox a:hover {
	text-decoration: none !important;
}

.ajaxcallout #callbox h2 {
	margin: 0 0 8px 0;
	padding: 0;
	font-size: 115%;
}

.ajaxcallout #callbox p.below-header {
	margin: 5px 0 15px 5px; 
	padding: 0;
	color: #606060 !important;
}

.ajaxcallout #callbox p {
	margin: 15px 0 30px 5px; 
	padding: 0;
	color: #606060 !important;
}

.ajaxcallout #callbox img.co {
	float: right;
	margin: 0 0 0 25px;
	padding: 0;
	height: 100%;
}

.callout {
	margin: 0;
	padding: 15px 15px 15px 75px;
	margin: 5px 0 25px 0;
}


.expert {
		background: #d8f2fd url(../images/elements/icon_expert_tip.gif) no-repeat 15px 15px;
}

.important {
		background: #d8f2fd url(../images/elements/icon_important_tip.gif) no-repeat 15px 15px;
}

.callout h2 {
	margin: 0 0 8px 0;
	padding: 0;
	font-size: 115%;
}

.callout h3 {
	margin: 0 0 4px 0;
	padding: 0;
	font-size: 115%;
}

.callout p {
	margin: 0 0 15px 0; 
	padding: 0;
	color: #606060;
}


/* Images
---------------------------------------------------------------*/
img.left {
	float: left;
	margin: 0 10px 0 0;
	padding: 0;
}

img.right {
	float: right;
	margin: 0 0 0 10px;
	padding: 0;
	
}

.callout img.co {
	float:right;
	padding:0;
	margin:5px 0 0 10px
}
.twopic {
	width: 80px;
	float:right;
	margin:-5px 0 0 10px;
}
.twopic img {
	margin:0 10px 5px 0;
	border:2px solid #414757;
}
img.lined {
	border:#414757 2px solid;
}
img.illus {
	border:#374554 2px solid;
}
img.hands {
	margin:-30px 10px 15px 0px;
}


/* HOME ***************************************/
#primary h1.homechapter {
	margin: 0 0 15px 20px;
	padding: 0;
	color: #427e9f;
	font-weight: normal;
	font-size: 155%;
	letter-spacing: -1px;
}

#primary .chapter {
	float: left;
	margin: 0 0 5px 0;
	padding: 8px 0 8px 20px;
	width: 495px;
}

#primary .chapter:hover {
	background: #b2e7fc;
}

#primary .chapter img {
	float: left;
	margin: 0 10px 0 0;
	padding: 0;
}

#primary .chapter .info {
	float: right;
	margin: 0;
	padding: 0;
	width: 420px;
}

#primary .chapter .info h1 {
	margin: 7px 0 0 0;
	padding: 1px 0 2px 38px;
	color: #292e35;
	font-weight: normal;
	font-size: 170%;
	letter-spacing: -1px;
}

#primary .chapter .info p.desc {
	margin: 0 0 0 0;
	padding: 0 0 0 38px;
	color: #7c96ba;
	font-size: 125%;
}

#primary .chapter h1.chapter1 {
	background: url(../images/home/icon_chapter1.png) no-repeat;
}

#primary .chapter h1.chapter2 {
	background: url(../images/home/icon_chapter2.png) no-repeat;
}

#primary .chapter h1.chapter3 {
	background: url(../images/home/icon_chapter3.png) no-repeat;
}

#primary .chapter h1.chapter4 {
	background: url(../images/home/icon_chapter4.png) no-repeat;
}

#primary .chapter h1.chapter5 {
	background: url(../images/home/icon_chapter5.png) no-repeat;
}

#primary .chapter h1.chapter6 {
	background: url(../images/home/icon_chapter6.png) no-repeat;
}

#primary .chapter h1.chapter7 {
	background: url(../images/home/icon_chapter7.png) no-repeat;
}

#improve {
	margin: 25px 0 0 0;
	padding: 3px 0 7px 57px;
	background: url(../images/elements/icon_improve.gif) no-repeat top left;
}

#improve p {
	color: #303030;
	font-size: 115%;
}

#improve p a {
	font-weight: normal;
	color: #a6a6a6;
	text-decoration: underline;
}

#improve p a:hover {
	text-decoration: none;
}

#overwhelmed {
	margin: 0 0 8px 0;
	padding:10px 0 0 0;
	font-family: Georgia;
	font-style: italic;
	color: #626379;
	font-size: 1.8em;
	line-height: 1.2em;
}

#overwhelmed a {
	text-decoration: none !important;
}

/* CONTENT - SECONDARY - GLOBAL **********************************/
#secondary {
	float: right;
	margin: 0;
	padding: 12px 0 0 0;
	width: 285px;
}

/* CONTENT - SECONDARY - SIDEBOX - GLOBAL *************************/
#secondary #sidebox {
	margin: 15px;
	padding: 0;
	width: 255px;
	background: #f5f5f5 url(../images/elements/sidebox_bg.gif) no-repeat bottom left;
}

#secondary #sidebox a {
	margin: 0;
	padding: 0;
	text-decoration: underline;
	color: #707070;
}

#secondary #sidebox a:hover {
	text-decoration: none;
}

#secondary #sidebox a.wikibutton {
	text-align: center;
	margin: 0;
	padding: 14px 0 0 20px;
	color: #fbd122;
	background: url(../images/elements/button_wikibg.gif) no-repeat;
	height: 52px;
	display: block;
	font-size: 150%;
	text-decoration: none;
}

#secondary #sidebox #inside {
	margin: 0;
	padding: 15px;
	background: url(../images/elements/sidebox_top.gif) no-repeat top left;
}

#secondary #sidebox #inside p.wiki {
	margin: 0 0 18px 0;
	padding: 0;
	color: #5a626e;
	line-height: 1.5em;
}

#secondary #sidebox #inside p.note {
	margin: 0;
	padding: 0 0 10px 0;
	color: #c0c0c0;
	font-size: 85%;
	font-style: italic;
	line-height: 1.5em;
}

#secondary #sidebox #inside a img {
	margin: 0 0 12px 0;
	padding: 0;
}

/* Quotes 
--------------------------------------------------------------------------------*/

#quote {
	padding:20px;
	margin:15px 0 0 0;
}

#quote p {
	margin: 0 0 12px 0;
	padding:15px 0 0 0;
	font-family: Georgia;
	font-style: italic;
	color: #252D36;
	font-size: 1.4em;
	line-height: 1.2em;
	background: url(../images/elements/sidenav_border.gif) repeat-x top left;

}

#quote p.author {
	font-size:1.2em;
	text-align: right;
	font-family: Georgia;
	font-style: italic;
	color: #414751;
	line-height: 1.5em;
	background: url(../images/elements/sidenav_border.gif) repeat-x bottom left;
	padding-bottom:15px;
}
#quote p.author a {
	text-align: right;
	font-family: Georgia;
	font-style: italic;
	color: #414751;
	line-height: 1.5em;
	background: none;
	padding-bottom:10px;
	text-decoration:underline;
}

/* Sidenav 
-------------------------------------------------------------------------------*/
#sidenav {
	margin:0 15px; 
	padding: 0;
	width: 255px;
	background: #f5f5f5 url(../images/elements/sidebox_bg.gif) no-repeat bottom left;
}

#insidenav {
	margin: 0;
	padding: 10px;
	background: url(../images/elements/sidebox_top.gif) no-repeat top left;
}

.sidenav-title {
    background:none;
    height: 24px;
    padding: 4px 0px 8px 15px;
    color: #7C96BA;
    font-weight: bold;
}

li.sidenav {
    background:none;
    font-size: 18px;
    margin: 2px 0 0 21px;
}

li.sidenav a {
    /*display: block;*/
    color: #7a8390;
	font-weight:bold;
}
li.sidenav a:hover {
	color:#3c526e;
	text-decoration:underline;
}


li.sidenav-expanded {
    background: none; 
}

li.sidenav-expanded a {
    font-weight:bold;
    color: #32373e;
}

li.subsidenav {
    margin-left: 21px;
}

li.subsidenav a {
	font-weight:normal;
}

li.subsidenav a {
    font-weight:normal;
    color:#7a8390;
    text-decoration: none;
}
li.subsidenav a:hover {
	color:#3c526e;
	text-decoration:underline;
}

li.sidenav-current {
    background:  url(../images/elements/arrow_active.gif) no-repeat left center;
	margin-left:10px;
	padding-left:11px;
}
li.sidenav-current.sidenav-expanded {
	background: url(../images/elements/arrow_active.gif) no-repeat left 5px;
	margin-left:10px;
	padding-left:11px;
}

li.sidenav-current a {
	color:#151923;
}


#secondary a.next {
	font-size:18px;
	margin: 10px 5px 0 10px;
	padding: 5px 0 5px 26px;
	display: block;
	color: #7C96BA;
	background: url(../images/elements/next_arrow.gif) no-repeat left center;
}

#secondary a.next:hover {
	color:#3c526e;
	text-decoration:underline;
	background: url(../images/elements/next_arrow_hover.gif) no-repeat left center;
}

#help {
	text-align:center;
	margin:30px 0;
}

/* FOOTER *********************************************************/
#footer {
	margin: 0;
	padding: 20px;
	background: #161b20;
	color: #4e5b67;
	border-top: 2px solid #252d36;
}

#footer ul {
	margin: 0;
	padding: 0;
	line-height: 1.4em;
}

#footer ul li.cc {
	margin: 0 0 25px 0;
	padding: 0 0 0 45px;
	background: url(../images/elements/footer_cc.gif) no-repeat left center;
}

#footer ul li.cc a {
	font-size: smaller;
	color: #4e5b67;
	text-decoration: underline;
}

#footer ul li.cc a:hover {
	text-decoration: none;
}

#footer ul li.pcf {
	margin: 0;
	padding: 0 0 0 45px;
	background: url(../images/elements/footer_miro.gif) no-repeat left center;

}

#footer ul li.kf {
	margin: 0 0 20px 0;
	padding: 0 0 0 45px;
	background: url(../images/elements/footer_kf.gif) no-repeat left center;
}

#footer ul li.fortyfive {
	margin: 0 0 18px 0;
	padding: 9px 0 0 45px;
	background: url(../images/elements/footer_45.gif) no-repeat left center;
	height: 27px;
}

#footer ul li a {
	color: #4e5b67;
	text-decoration: underline;
}

#footer ul li a:hover {
	text-decoration: none;
}