@media screen {

/** sprite: fixedSprite; sprite-image: url('../images/sprites/fixedSprite_4.png'); sprite-layout: horizontal*/
/** sprite: fixedSprite2; sprite-image: url('../images/sprites/fixedSprite2_4.png'); sprite-layout: horizontal*/
/** sprite: longSprite; sprite-image: url('../images/sprites/longSprite_4.png'); sprite-layout: vertical */
/** sprite: tallSprite; sprite-image: url('../images/sprites/tallSprite_4.png'); sprite-layout: horizontal */

p,ul,ol,dl,li,dt,dd,h1,h2,h3,q,code,div,body,html,img { 						/* Global Reset */
	font-size: 100%;
 	line-height: 1;
	margin: 0;
	padding: 0;
	border: 0;
}
.clear {
	clear: both;
}
	div#contentCentring div#table .CL {
		clear: left;
	}
	div#contentCentring div#table .CR {
		clear: right;
	}
.FL {
	float: left;
}
.FR {
	float: right;
}
body {
	font-family: Verdana, Geneva, Arial, sans-serif;
	color: #000;
	background-color: #b7d3fd;
	background-repeat: repeat-x;
	background-image: url(../images/bgGradient3.png);		/** sprite-ref: longSprite; sprite-alignment: repeat */
}
abbr {
	cursor: help;
	border-bottom: 1px dotted;
}
code {
	font-family: "Lucida console", monospace;
	font-size: 100%;
	border: 1px solid;
	padding: 0.3em 0.2em 0.1em 0.2em;
	color: #000;
	background: #ddd;
}
p,li,dd,dt {
	line-height: 1.5;
}
p {
	padding: 0 0 1em 0;
	max-width: 47em;
}
div#content ul, div#content ol {
	margin-bottom: 2em;
}
div#content ul {
	list-style: none;
}
p+p, p+.hidden+p {
	padding-top: 0.5em;
}
h2+p, .h2Sub+p, h3+p,h3+.hidden+p,h3+noscript+.hidden+p {
	padding-top: 0;
}
div#contentCentring div#content .lead+h2, div#contentCentring div#content .lead+.hidden+h2  {
	margin-top: -1em;
}
strong {
	font-weight: bold;
}
a:link, div#pageNav a:link, div#content div.lead a:link {
	color: #00f;
	background-color: inherit;
}
a:visited, div#pageNav a:visited, div#content div.lead a:visited {
	color: purple;
	background-color: inherit;
}

a span.accessLink {     /* Intended for "learn more..." links. Gives more context to screen-readers */
    position: absolute;
    width: 1px;
    height: 1px;
    top: -1000px;
    overflow: hidden;
}


div#content li {
	margin: 0 0 0 3em;
}
div#content ul li:before {
	content: "\2022";
	color: #265AA7;
	padding:  0 0.5em 0 0;
	font-size: 120%;
	margin-left: -1em;
	background-color: inherit;
}
div#content .tip ul li:before {
	color: #265AA7;
	background-color: inherit;
}
h1,h2,h3 {
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif;
	clear: both;
}
h1, div#logoBG strong {
	font-size: 220%;
	padding: 0.5em 0 0 0;
	line-height: 1.4;
	clear: none;
	color: #265AA7;
	background: inherit;
}
div#h1BG h1 {
	z-index: 2;
	position: relative;
}
	div#logo h1, div#logoBG strong {
		padding: 0;
		margin: 0;
		font-size: 100%;
		font-weight: normal;
	}
	div#logoBG strong {
		text-decoration: underline;
	}
		div#logoBG a {
			text-decoration: none;
		}
	div#h1BG,div#crumbsBG {
		background: #fff;
		color: #000;
		overflow: hidden;
	}
	div#h1BG {
		background: #fff;
		color: #000;
	}
div#subscribe {
	background: #e3ecff;
	background: #ffd;
	margin-top: 0.3em;
	border: 2px solid #ddb;
	width: 100%;
	bottom: 3px;
	right: 0;
}
	div#subscribe p {
		margin: 0;
		padding: 0.3em 0.5em;
		font-size: 90%;
		text-align: center;
	}
	div#subscribe a {
		text-decoration: underline;
	}
div#headerRight {
	float: right;
	width: 21em;
}
	div#h1Centring {
		position: relative;
	}
	p#level {
		position: absolute;
		top: 0.5em;
		right: 0;
	}
	p#level, p#level a, p#level img {
		padding: 0;
		margin: 0;
		line-height: 1;
	}

h2 {
	font-size: 200%;
	padding: 50px 0 3px 95px;
	color: #265AA7;
	background-color: #fff;
	border-bottom: 2px solid #265AA7;
	position: relative;
}
	body.degradeStyle div#table div#content h2 {
		margin-bottom: 1em;
		margin-top: 0;
		padding-top: 50px;
	}
	body.degradeStyle div#table div#content .lead+h2 {
		padding-top: 36px;
	}
	h2 span.h2bg {
		position: absolute;
		bottom: 0;
		left: 0;
		background-repeat: no-repeat;
		background-image: url("../images/h2_small1.png");			/** sprite-ref: fixedSprite; */
		width: 91px;
		height: 59px;
		display: block;
	}
	.h2Sub {
		width: 91px;
		height: 15px;
		background-repeat: no-repeat;
		background-image: url("../images/h2_small2.png");			/** sprite-ref: fixedSprite; */
		margin: 0 0 1em 0;
	}

h3 {
	font-size: 150%;
	padding: 0;
	color: #265AA7;
	background: inherit;
	line-height: 1.2;
	margin: 2em 0 1em 0;
	clear: none;
		font-size: 160%;
}
h2+h3, .h2Sub+h3, h2+.hidden+h3, .h2Sub+.hidden+h3 {
	margin-top: 0;
}
h2+ul, .h2Sub+ul {
	margin-top: 1.5em;
}
dd {
	padding: 0 0 1em 2em;
}
li.here {
	color: #d00;
	background-color: inherit;
}
h2+.lead, .h2Sub+.lead {
	margin-top: -1em;
}

body.degradeStyle .lead {
	color: #000;
	background: #ffd;
	border: 2px solid #ffa500;
	padding: 1em 2em 0 1.5em;
	margin: 0.65em 0 2em 0;
}


.lead {		/* non-table wrapper for getting max-length to work */
	max-width: 50em;
	min-width: 150px;
	position: relative;
	margin: 0 -12px 2em -8px;
}
.table {
	display: table;
	width: 100%;
	border-collapse: separate;
}
.tr {
	display: table-row;
}
.td {
	display: table-cell;
}
.lead .topRow {
	height: 11px;
}
.lead .bottomRow {
	height: 16px;
}
.lead .left {
	width: 10px;
	background-repeat: repeat-y;
	background-image: url("../images/leadLeft.png");		/** sprite-ref: tallSprite; sprite-alignment: repeat */
}
.lead .right {
	width: 14px;
	background-repeat: repeat-y;
	background-image: url("../images/leadRight.png");		/** sprite-ref: tallSprite; sprite-alignment: repeat */
}
.lead .topRow .td {
	background-repeat: repeat-x;
	background-image: url("../images/leadTop.png");		/** sprite-ref: longSprite; sprite-alignment: repeat */
}
.lead .bottomRow .td {
	background-repeat: repeat-x;
	background-image: url("../images/leadBottom.png");		/** sprite-ref: longSprite; sprite-alignment: repeat */
}

	.lead .content {
		padding: 1em 1.5em 0 1.5em;
		background: #ffd;
		color: #000;
	}

	.lead .BR {
		background-image: url("../images/leadCornerBR.png");		/** sprite-ref: fixedSprite */
		width: 39px;
		height: 40px;
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.lead .TR {
		background-image: url("../images/leadCornerTR.png");		/** sprite-ref: fixedSprite */
		width: 21px;
		height: 23px;
		position: absolute;
		right: 0;
	}
	.lead .TL {
		background-image: url("../images/leadCornerTL.png");		/** sprite-ref: fixedSprite */
		width: 18px;
		height: 20px;
		position: absolute;
	}
	.lead .BL {
		background-image: url("../images/leadCornerBL.png");		/** sprite-ref: fixedSprite */
		width: 26px;
		height: 22px;
		position: absolute;
		bottom: 0;
	}





.tip {		/* non-table wrapper for getting max-length to work */
	max-width: 40em;
	min-width: 150px;
	position: relative;
	margin: 1em 0 2.5em 2em;
}
.tip .topRow {
	height: 9px;
}
.tip .bottomRow {
	height: 14px;
}
.tip .left {
	width: 8px;
	background-repeat: repeat-y;
	background-image: url("../images/tipLeft.png");		/** sprite-ref: tallSprite; sprite-alignment: repeat */
}
.tip .right {
	width: 12px;
	background-repeat: repeat-y;
	background-image: url("../images/tipRight.png");		/** sprite-ref: tallSprite; sprite-alignment: repeat */
}
.tip .topRow .td {
	background-repeat: repeat-x;
	background-image: url("../images/tipTop.png");		/** sprite-ref: longSprite; sprite-alignment: repeat */
}
.tip .bottomRow .td {
	background-repeat: repeat-x;
	background-image: url("../images/tipBottom.png");		/** sprite-ref: longSprite; sprite-alignment: repeat */
}

	.tip .content {
		background: #F1F7FF;
		color: #000;
	}
	.tip .gradient {
		height: 41px;
		width: 100%;
		margin-top: -41px;
		color: #000;
		background-color: #F1F7FF;
		background-repeat: repeat-x;
		background-image: url("../images/tipGradient.png");		/** sprite-ref: longSprite; sprite-alignment: repeat */
	}
		.tip.picture .gradient {		/* We don't want the gradient interfering with picture-links on the home page */
			display: none;
		}

	.tip .BR {
		background-image: url("../images/tipCornerBR_1.png");		/** sprite-ref: fixedSprite */
		width: 26px;
		height: 26px;
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.tip .TR {
		background-image: url("../images/tipCornerTR_1.png");		/** sprite-ref: fixedSprite */
		width: 21px;
		height: 23px;
		position: absolute;
		right: 0;
	}
	.tip .TL {
		background-image: url("../images/tipCornerTL_1.png");		/** sprite-ref: fixedSprite */
		width: 18px;
		height: 20px;
		position: absolute;
	}
	.tip .BL {
		background-image: url("../images/tipCornerBL_1.png");		/** sprite-ref: fixedSprite */
		width: 26px;
		height: 22px;
		position: absolute;
		bottom: 0;
	}
.tip dt {
	color: #265aa7;
	font-size: 130%;
	padding: 0.5em 0 0.2em 1.15em;
	font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif;
	background: #F1F7FF;
}
.tip dd {
	color: #000;
	padding: 0 1.5em 0.5em 1.5em;
	background-color: inherit;
}


	body.degradeStyle dl.tip {
		border: 2px solid #7e9db9;
		max-width: 40em;
		margin: 1em 0 2.5em 2em;
		background: #F1F7FF url("../images/tipGradient.png") bottom repeat-x;
		color: #000;
	}

	div#content .tip dd ul {
		padding: 0 0 1em 1.5em;
		margin: 0;
	}
	div#content .tip dd li {
		margin: 0;
	}
div#crumbs {
	color: #000;
	background: #ffd;
	margin: -0.7em 0 1em 0;
	border-top: 1px solid #ddb;
	border-bottom: 1px solid #ddb;
}
	div#crumbsBorderL {
		background: url("../images/borderL.png") repeat-y;
		margin: 0 0 0 -44px;
		padding: 0 0 0 44px;
	}
	div#crumbsBorderR {
		background: url("../images/borderR2.png") right repeat-y;
		margin: 0 -43px 0 0;
		padding: 0 43px 0 0;
		position: relative;
	}

div#crumbs p {
	margin: 0;
	max-width: none;
	font-size: 90%;
	padding: 0.3em 1em;
}
	div#crumbs a {
		padding: 0 0.3em;
	}
	div#crumbs a.first {
		padding-left: 0;
	}
	div#crumbs .here {
		padding-left: 0.3em;
	}
	div#crumbs .noCrumbs {
		display: block;
		height: 1.5em;
		width: 1em;
	}
div#h1BG ul#quickNav {
	list-style: none;
	width: 24em;
	margin: 0 0 0 2.67em;
	font-size: 90%;
}
ul#quickNav li {
	float: right;
	margin: 0.2em 0 0.2em 0;
}
	ul#quickNav li.prev {
		float: left;
		margin: 0.2em 2em 0.2em 0;
	}
	ul#quickNav.nextOnly li {
		float: left;
	}
	div#content ul#quickNav li:before {
		content: "";
		padding: 0;
		margin: 0;
	}
	ul#quickNav a {
		line-height: 2;
		display: block;
		float: left;
	}
		ul#quickNav a span.pn_bg {	/* ss hack -- 50% vertical */
			display: block;
			float: right;
			width: 35px;
			min-height: 24px;
			height: 2em;
			margin: 0 0 0 5px;
			background-repeat: no-repeat;
			background-image: url("../images/arrowH1R_3.png");		/** sprite-ref: fixedSprite2; */
		}
		ul#quickNav li.prev a span.pn_bg {	/* ss hack -- 50% vertical */
			float: left;
			margin: 0 5px 0 0;
			background-image: url("../images/arrowH1L_3.png");		/** sprite-ref: fixedSprite2; */
		}
		ul#quickNav a:hover span.pn_bg, ul#quickNav a:active span.pn_bg {	/* ss hack  -- 50% vertical */
			background-image: url("../images/arrowH1Rhover_3.png");		/** sprite-ref: fixedSprite2; */
		}
		ul#quickNav li.prev a:hover span.pn_bg, ul#quickNav li.prev a:active span.pn_bg {	/* ss hack -- 50% vertical */
			float: left;
			margin: 0 5px 0 0;
			background-image: url("../images/arrowH1Lhover_3.png");		/** sprite-ref: fixedSprite2; */
		}

div#pageNav {
	max-width: 40em;
}
div.tip.pageNav {
	margin: 0.5em 0 0 2em;
}
	div.tip.pageNav .content{
		background-color: #ffd;
		color: #000;
		border-left: 4px solid #ffa500;
	}
	div.tip.pageNav .gradient {
		background: #ffd;
		color: #000;
	}
	div.tip.pageNav .TL {
		background-image: url("../images/pnCornerTL.png");		/** sprite-ref: fixedSprite */
	}
	div.tip.pageNav .BL {
		background-image: url("../images/pnCornerBL.png");		/** sprite-ref: fixedSprite */
	}

div#pageNav ul {
	list-style: none;
	padding: 1em 1em 0 1em;
	background: #ffd;
	color: #000;
	margin: 0;
}
	div#pageNav li {
		padding: 0 0 1em 0;
		margin: 0;
		overflow: hidden;
	}
	body div#pageNav li:before {
		content: "";
		padding: 0;
		margin: 0;
	}
	div#pageNav a {
		line-height: 1.8;
		float: left;
	}
		div#pageNav a span.pn_bg {	/* ss hack -- 50% vertical */
			display: block;
			float: left;
			height: 2em;
			min-height: 24px;
			width: 35px;
			margin: 0 15px 0 0;
			background-repeat: no-repeat;
			background-position: 0 50%;
			background-image: url("../images/arrowPNR_3.png");		/** sprite-ref: fixedSprite2; */
		}
		div#pageNav a.prevLink span.pn_bg{		/* ss hack -- 50% vertical  */
			background-image: url("../images/arrowPNL_3.png");		/** sprite-ref: fixedSprite2; */
		}
		div#pageNav a:hover span.pn_bg, div#pageNav a:active span.pn_bg {		/* ss hack -- 50% vertical  */
			background-image: url("../images/arrowPNRhover_3.png");		/** sprite-ref: fixedSprite2; */
		}
		div#pageNav a.prevLink:hover span.pn_bg, div#pageNav a#prevLink:active span.pn_bg {		/* ss hack -- 50% vertical */
			background-image: url("../images/arrowPNLhover_3.png");		/** sprite-ref: fixedSprite2; */
		}

div#sources {
	margin: 1em 0 0 0;
}
	div#sources input#hideSources {
		margin-top: 0.5em;
		margin-bottom: 1em;
	}
div#sourcesContent {
	max-width: 45em;
}
div#sourcesMargin {
	height: 2em;
}
	body div#sourcesHeading h2 {
		font-size: 160%;
	}
	div#content h2#topicsHeading {
		margin: 2em 0 0 0;
	}
	#topics dt {
		list-style: disc;
		padding: 0.8em 0 0.5em 0;
		color: black;
		background: inherit;
		max-width: 35em;
	}
	#topics dd {
		padding-left: 0;
		max-width: 35em;
		margin-bottom: 0.5em;
	}

	div#footerContent h2, h2#topicsHeading {
		font-size: 160%;
		color: #265AA7;
		background: #e3ecff;
		line-height: 1.2;
		margin: 1.5em 0 0.5em 0;
		padding: 0;
		border-bottom: 0;
	}
		h2#topicsHeading {
			background: #fff;
		}

ul#footerNav {
	padding: 1em 3em;
}
div#footer ul#footerNav li {
	display: inline;
	padding: 0;
	margin: 0 0.6em 0 0;
}
	div#footer ul#footerNav li.last {
		margin: 0;
	}
div#footer ul#footerNav li:before {
	content: "|";
	padding: 0;
	margin: 0 1em 0 0;
}
	div#footer ul#footerNav li.first:before {
		content: "";
		margin: 0;
	}
	#footerNav .first {
		padding: 0;
		margin: 0;
	}
div#articleInfo {
	padding-top: 1em;
	clear: both;
}
	div#sources+div#articleInfo {
		padding-top: 0;
	}

.limitedOffer {
    background: #efe;
    border: 2px solid #393;
    padding: 1em 2em 0 2em;
    width: 80%;
    margin: 0 auto;
}
    .smallH2 {
        background: none;
        margin: 0;
        padding: 0 0 1em 0;
        border: 0;
        font-size: 160%;
    }


div.salesBox {
	width: 13em;
	background: #ffd;
	border: 2px solid #eec;
	margin: 0 0 1em 1em;
	padding: 0.5em;
	font-size: 120%;
	text-align: center;
}
	div.salesBox p {
		padding-bottom: 0.3em;
	}
	div.salesBox p.action {
		padding-bottom: 0;
		font-weight: bold;
	}
	div.salesBox a:visited {
		color: blue;
		background: inherit;
	}

/*====================
				Hidden elements
=====================*/
.noCSS, .print, .IE6 {
	display: none;
}
ul.skipLinks {
	position: absolute;
	top: -10em;
	margin: 0;
	padding: 0;
	width: 40em;
	z-index: 1000;
}
ul.skipLinks a:focus {
	position: absolute;
	top: 5.5em;
	color: black;
	background: yellow;
	border: 5px solid red;
	font-size: 200%;
	padding: 0.5em;
	line-height: 1.5;
	outline: 0;
}
/*==========================
				Table of contents, Site map
===========================*/
div#toc ol {
	list-style: none;
	padding: 0.4em 0 0 0;
}
div#toc ol ol {
	padding: 0 0 1em 1em;
}
div#toc li {
	margin: 0.9em 0 0 0;
	font-weight: bold;
}
div#toc li li {
	margin: 0 0 0 0.5em;
	padding: 0;
	font-weight: normal;
}
div#toc li.here span{
	color: black;
	border-bottom: 2px solid #ffa500;
	background: #ffd;
	display: block;
	padding: 0.3em;
}
div#content ol ol {
	margin-left: -1em;
}
div#content ol li {
	padding-bottom: 0.5em;
}
div#toc a {
	line-height: 1.5;
	text-decoration: none;
	display: block;
	padding: 0.3em;
	border-top: 1px dotted transparent;
	border-bottom: 1px dotted transparent;
}
	div#toc li li a {
		border-bottom-color: #000;
		border-left-color: #000;
		border-right-color: #000;
		border-top-color: transparent;
	}
	div#toc a:hover {
		background:#ffd;
		border-color: #000;
		color: #000;
	}
		div#toc li li a:hover {
			border-top-color: transparent;
		}
		div#toc li.here li:first-child a:hover {
			border-top-color: transparent;
		}
		div#toc li li:first-child a:hover {
			border-top-color: #000;
		}
div#toc li li.lastEntry a, body.skill2 div#toc li li.lastIntermediateEntry a, body.skill1 div#toc li li.lastBeginnerEntry a {
		border-bottom-color: transparent;
	}
	div#toc li li.lastEntry a:hover, body.skill1 div#toc li li.lastBeginnerEntry a:hover, body.skill2 div#toc li li.lastIntermediateEntry a:hover {
		border-bottom-color: #000;
	}

/*====================
				Image formatting
=====================*/
div#content .picture {
	margin-top: -9px;
	margin-bottom: 1em;
	clear: none;
	width: auto;
}
p+.picture, .picture+.picture {
	margin-top: 0.5em;
}
div.centre {
	margin: 0 auto;
}
div.w225 {
	max-width: 522px;
}
div.w250 {
	max-width: 572px;
}
	div.centre+p {
		padding-top: 2em;
		clear: left;
	}
	div.centre+h3 {
		padding-top: 1em;
		clear: left;
	}
	div.centre+h2 {
		padding-top: 3em;
	}
div#content .picture.FL {
	margin: 0 8px;
}
div#content .picture.FR, div#content .FR .picture {
	margin-right: -12px;
}
.picture div div div div div div div div, .tabs div div div div div div div div, .picture dd, .tabs dd {
	padding: 0;
}
div#content .picture dt, div#content .tabs dt, div#content .video dt {
	font-size: 100%;
	font-family: Verdana, Geneva, Arial, sans-serif;
	padding: 0.5em 0.1em;
	text-align: center;
	background: #cdddfd;
	color: #265aa7;
	border-bottom: 2px solid #265aa7;
}
.picture img, .tabs img {
	display: block;
}

/* Tabbed boxes */

div#content div.tabs {
	padding: 0;
	margin: 0 auto;
}
div#content .gripPhotos {
	max-width: 470px;
}
div.tabs dd,div.helpTabs {
	clear: left;
}
.tabs dd img {
	float: left;
}
.tabList, .tabListHelp {
	margin: 0 auto;
	max-width: 470px;
	position: relative;
	top: 10px;
	clear: both;
	z-index: 2;
}
.tabs dt, .helpTabs dt {
	border-top: 1px solid #5e83b9;
}
div#content .tabList ul, div#content .tabListHelp ul {
	list-style: none;
	float: left;
	margin: 0;
	padding: 0 12px 0 8px;
}
div#content .tabList li, div#content .tabListHelp li  {
	float: left;
	padding: 0 0 0 1em;
	margin: 0;
}
.tabList li.showAll {
	float: right;
	padding-right: 1em;
}
div#content .tabList li:before, div#content .tabListHelp li:before {
	content: "";
	padding: 0;
	margin: 0;
}
.tabList a, .tabListHelp a {
	display: block;
	border-width: 1px 1px 0 1px;
	border-style: solid;
	border-color: #b7d3fd;
	background: #e3ecff bottom repeat-x;
	padding: 0.05em 0.3em;
	color: blue;
	text-decoration: none;
	position: relative;
	top: 0.3em;
	outline: none;
}
.tabList li.here a, .tabListHelp li.here a {
	border-color: #5e83b9;
	border-bottom: 1px solid transparent;
	background:	#cdddfd;
	font-weight: bold;
	color: #000;
	padding: 0.2em 0.5em;
	top: 0;
}
.tabListHelp {
	margin: 1em 0 2.5em 2em;
	max-width: 40em;
}
	.tabListHelp li.here a {
		background:	#f1f7ff;
	}
/*======================
				Top nav formatting
=======================*/
div#topNavBG {
	background: #cdddfd;
	color: #fff;
	border-top: 2px solid #b7d3fd;
	border-bottom: 2px solid #b7d3fd;
	clear: both;
}
ul#topNav {
	list-style: none;
	color: #fff;
	background: inherit;
	font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif;
	clear: both;
	overflow: hidden;
}
ul#topNav li {
	display: inline;
	float: left;
	padding: 0;
	margin: 0;
	background: #265aa7;
	color: #fff;
}
ul#topNav a {
	color: #fff;
	background-color: #e3ecff;
	float: left;
	width: auto;
	padding: 0em 1em;
	text-decoration: none;
	border-left: 2px solid #b7d3fd;
	font-size: 100%;
}
ul#topNav li.last a {
	border-right: 2px solid #b7d3fd;
}
	ul#topNav a:link,ul#topNav a:visited {
		color: #265aa7;
		background-color: #e3ecff;
	}
		body ul#topNav a.here {
			color: #000;
			background-color: inherit;
		}
	ul#topNav a:hover {
		color: #FF5D05;
		background: #fffff0;
	}

/*====================
				Sidebar formatting
=====================*/

div#sideBarWrapper h2, div#sourcesHeading h2 {
	font-size: 178%;
	padding: 0.3em 0;
	background: #fff;
	color: #265aa7;
	border-top: 1px dotted #265aa7;
	border-bottom: 1px dotted #265aa7;
	text-align: center;
	margin: 0;
    *position: static; /* IE6 and IE7. Fixes video z-index bug */
}
	div#options div.margin {
		height: 1em;
	}
	div#options div.tocMargin {
		height: 3em;
	}
div#sources input#hideSources {
	margin-top: 0.5em;
}
div#options ul {
	padding: 0;
	list-style: none;
}
div#options h2 {
	margin-bottom: 0.5em;
}
div#options h3 {
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-weight: bold;
	margin: 2em 0 0.5em 0;
	font-size: 100%;
}
	div#options h3.first {
		margin-top: 1em;
	}
div#options li {
	padding: 0 0 0 2em;
	margin: 0.3em 0 0 0;
}
	ul#langList li {
		position: relative;
		left: -2px;
		cursor: pointer;
		line-height: 1;
		min-height: 24px;
		height: 1em;
		clear: left;
	}

	ul#langList a {
		display: block;
		min-height: 24px;
	}

	ul#langList a span.langName {
		display: block;
		height: 1em;
		padding-top: 0.5em;
	}

	ul#langList a span.flag {
		display: block;
		width: 24px;
		float: left;
		margin-right: 1em;
		height: 2em;
		min-height: 24px;
		background-repeat: no-repeat;
        *position: static; /* IE6 and IE7. Fixes video z-index bug */
        *margin-top: 5px; /* IE6 and IE7. Counteract previous hack */
        _margin-top: 0; /* IE6 only */
	}
		li.en span.flag {		/* ss hack -- 50% vertical */
			background-image: url("../images/flag_en.png");		/** sprite-ref: fixedSprite2; */
		}
		li.de span.flag {		/* ss hack -- 50% vertical */
			background-image: url("../images/flag_de.png");		/** sprite-ref: fixedSprite2; */
		}
		li.sv span.flag {		/* ss hack -- 50% vertical */
			background-image: url("../images/flag_sv.png");		/** sprite-ref: fixedSprite2; */
		}
		li.fr span.flag {		/* ss hack -- 50% vertical */
			background-image: url("../images/flag_fr.png");		/** sprite-ref: fixedSprite2; */
		}


div#options h2+p {
	margin-top: 1em;
}
	label {
		cursor: pointer;
	}
	div#options input {
		margin: 0 0.5em 0 0;
		cursor: pointer;
	}
div#skillHelp {
	background: #ffd;
	color: #000;
	display: none;
}
	div.helpContent {
		background: #ffd;
		color: black;
		border: 2px solid #ffa500;
	}
	div.helpPadding {
		width: 15em;
		margin: 0.8em auto 0.3em auto;		/* fake padding hack, to prevent jerky animation */
	}
	div#skillHelp div.helpMargin {		/* preventing jerkiness */
		height: 1em;
		background: #E3ECFF;
		color: black;
	}
#closeSkillHelp {
	cursor: pointer;
	font-size: 120%;
}
	div#options li#skillHelpControl {
		margin-top: 1em;
		margin-bottom: 0.5em;
	}
	div#options li#skillHelpControl a {
		cursor: help;
	}
	div#options #closeSkillHelp {
		margin-bottom: 0.5em;
	}
div#handFallback {
	margin: 3em 0 1em 0;
}

/*================
				Main Layout
=================*/
div#logoCentring,div#topNavCentring,div#h1Centring,div#crumbsCentring,div#contentCentring {
	margin: 0 auto;
	width: 56em;
}
div#logoBG {
	background: #fff;
	color: #000;
	width: 100%;
	min-height: 42px;
	height: 50px;
	margin: 6px 0 2px 0;
	position: relative;
}
#logo {		/* Gilder/Levin accessible image replacement */
	position: relative;
	float: left;
	background: #fff;
	color: #000;
	width: 424px;
	height: 42px;
	font-size: 150%;
	line-height: 1.5;
	overflow: hidden;
	margin-top: 7px;
}
#logo span {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 424px;
	height: 42px;
	background-repeat: repeat;
	background-image: url("../images/logo12.png");		/** sprite-ref: fixedSprite; */
}
div#contentBG {
	background-color: #b7d3fd;
	background-repeat: repeat-x;
	background-image: url("../images/bgGradient3.png");
	color: #000;
	padding-bottom: 3em;
}
div#content {
	display: table-cell;
	background: #e3ecff;
	color: black;
	vertical-align: top;
	font-size: 80%;
    width: 60em;
}
	div#contentWrapper {
		float: left;
		margin: 0 0 0 -44px;
		padding: 0 0 0 44px;
	}
	div#contentBorderL {
		background-repeat: repeat-y;
		background-image: url("../images/borderL.png");			/** sprite-ref: tallSprite; sprite-alignment: repeat */
		margin: 0 0 0 -44px;
		padding: 0 0 0 44px;
		float: left;
	}
	div#contentBorderR {			/* ss hack -- background-position: right (remove the line below); */
        background-position: right;
        background-repeat: repeat-y;
		background-image: url("../images/borderR2.png");			/** sprite-ref: tallSprite; sprite-alignment: repeat */
		margin: 0 -43px 0 0;
		padding: 0 43px 0 0;
		float: left;
	}
	div#contentBorderB {
		background-repeat: repeat-x;
		background-image: url("../images/borderB2.png");
		margin: 0 0 -50px 0;
		padding: 0 0 50px 0;
		position: relative;
		float: left;
		background-position: bottom;
	}
	div#cornerBL {
		background-position: bottom left;
		background-repeat: no-repeat;
		background-image: url("../images/cornerBL2.png");		/** sprite-ref: fixedSprite; */
		position: absolute;
		width: 60px;
		height: 66px;
		bottom: -50px;
		left: -44px;
	}
	div#cornerBR {
		background-position: bottom right;
		background-repeat: no-repeat;
		background-image: url("../images/cornerBR2.png");			/** sprite-ref: fixedSprite; */
		position: absolute;
		width: 66px;
		height: 72px;
		bottom: -50px;
		right: -43px;
	}

div#contentBorderT {
	background-position: top;
	background-repeat: repeat-x;
	background-image: url("../images/contentBorderT.png");		/** sprite-ref: longSprite; sprite-alignment: repeat */
	padding-top: 14px;
	position: relative;
}

	div#cornerTL {
			background-image: url("../images/cornerTL4.png");		/** sprite-ref: fixedSprite; */
			width: 44px;
			height: 51px;
			position: absolute;
			left: -44px;
			top: 0px;

		}
		div#cornerTR {
			background-image: url("../images/cornerTR4.png");		/** sprite-ref: fixedSprite; */
			width: 43px;
			height: 36px;
			position: absolute;
			right: -43px;
			top: 0px;
		}

div#table {
	display: table;
	border-collapse: separate;
	table-layout: fixed;

}
div#tableRow {
	display: table-row;
}
	div#contentPage {
		background: #fff;
		color: #000;
		padding: 1em 3em;
		margin: 0;
		border-right: 2px solid #CDDDFD;
		border-bottom: 2px solid #CDDDFD;
		position: relative;
        min-height: 250px;
	}
	div#contentBR {
		background-color: #fff;
		background-position: bottom right;
		background-repeat: no-repeat;
		background-image: url("../images/contentCornerBR2.png");			/** sprite-ref: fixedSprite; sprite-margin-left: -2px */
		color: #000;
		width: 23px;
		height: 24px;
		position: absolute;
		bottom: -2px;
		right: -2px;
	}
div#sideBarWrapper {
	min-width: 16em;
	width: 16em;
	background: #E3ECFF;
	color: #000;
	display: table-cell;
	font-size: 90%;
}
div#options {
	background: #E3ECFF;
	color: #000;
	padding: 2em 1em 1em 1em;
	font-size: 80%;
	position: relative;
	margin-top: -1px;
    *position: static; /* IE6 and IE7. Fixes video z-index bug */
}
div#account  {
	padding: 2em 1em 1em 1em;
	font-size: 80%;
}
	div#account h2 {
		margin-bottom: 0.5em;
	}
div#toc {
	color: black;
	background: #E3ECFF;
	padding: 0 1em 1em 1em;
	font-size: 80%;
}
	div#toc.tocFirst h2 {
		padding-top: 0.5em;
	}
div#footer {
	position: relative;
	width: 100%;
	float: left;
	font-size: 80%;
	background: #ffd;
	color: #000;
	border-top: 2px solid #CDDDFD;
}
div#footerContent {
	background: #E3ECFF;
	color: #000;
	padding: 0.1em 3em;
}
div#homePage {
	height: 1.5em;
	display: none;
}
div#translator {
	background: #ffd;
	color: #000;
	border: 2px solid #eec;
	padding: 1em 1em 0.5em 1em;
	margin: 1em 0;
}
div#account ul {
    margin-left: 1.7em;
}

.date-space {   /* design hack to fill space previously occupied by the date */
    height: 15px;
}

.siteinfo {
	width: 60%;
	float: left;
}
.siteinfo p {
	margin-right: 11px;
}

.elevator-pitch {
	margin-bottom: 2em;
	margin: -0.5em 0 1.5em -8px;
	max-width: 8000em !important;
	float: left;
}

.elevator-pitch p {
    font-size: 135%;
	margin-right: 0;
}
.elevator-pitch h1 {
	padding-top: 0;
	padding-bottom: 0.5em;
	line-height: 1;
	background: transparent;
}

.latest {
	float: right;
	width: 27em;
}

.learn {
	display: block;
	font-size: 135%;
	padding: 0;
	text-align: center;
	width: 189px;
}

.learn a {
	padding: 0;
}

.signup {
	display: block;
	height: 54px;
	width: 189px;
	background: url("../images/button13.png"); /* Put the background image on this container too so that you don't get that horrible flicker in IE */
	text-align: center;
}
	.articleCTA .signup {
		background: url("../images/button14.png");
	}

.signup a {
	display: block;
	height: 35px;
	width: 189px;
	position: relative;

    /* IE6 */
    _position: static;
    _font-size: 160%;
    _background: #cfc;
    _border: 2px solid #0d0;
    _padding: 5px 0;
}
    .articleCTA .signup a {
        /* IE6 */
        _background: #ddf;
        _border: 2px solid #00d;
    }


.signup a:hover {
	visibility: visible; /* This needs to be in place so that the images return to their non-hover state in IE */
}

.signup a span {
	background: url("../images/button13.png");
	position: absolute;
	display: block;
	height: 54px;
	width: 189px;
	cursor: hand; /* This is so that the cursor still changes to a hand when you hover over the link in IE */

    /* IE6 */
    _position: static;
    _display: inline;
}
    #content .signup {
        _background: none; /* IE6 */
    }


	.articleCTA .signup a span {
		background: url("../images/button14.png");
	}

.signup a:hover span  {
	background: url("../images/button13.png");
}
	.articleCTA .signup a:hover span {
		background: url("../images/button14.png");
	}

.signup, .signup a span {
	background-position: 0px 0px;
}

.signup a:hover span, .articleCTA .signup a:hover span {
	background-position: 0px 54px;
}

.latest ul {
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
}
.latest li {
	margin: 0 -9px !important;		/* make this 1 greater than padding */
	padding: 8px;
	border: 1px solid #fff;
	overflow: auto;
	clear: both;
}
.latest ul li:before {
	content: "" !important;
}
.latest li img {
	float: left;
	clear: left;
}
.latest li div {
	float: left;
	width: 235px;
	padding: 0 0 0 10px;
}
.latest li p {
	padding: 0;
}

.latest h4 {
	padding: 0;
	margin: 0;
	line-height: 1.3;
}
.latest h2, .siteinfo h2 {
	border: none;
	padding: 0;
}

.siteinfo h2 {
	padding-top: 2em;
}

.siteinfo h3 {
	margin: 0 !important;
	padding: .7em 0 0;
}
ul.moreInfo {
	margin-bottom: 0.7em !important;
}

.cta {
	width: 80%;
	margin: 0 auto;
}
.cta p {
	width: 45%;
	float: left;
	padding: 0;
}
.cta .articleCTA {
	float: right;
}

#tabLatest {
	padding-top: 10px !important;
	overflow: auto;
	z-index: 20;
	position: relative;
	bottom: -1px;
}

#tabLatest li {
	float: left;
	display: inline;
	clear: none;
	margin: 0 0 0 1em !important;
	padding: 0em 0.5em !important;
	border: 1px solid #555;
	overflow: auto;
	position: relative;
	background: #eee;
}

#videoList, #articleList {
	border-top: 1px solid #555;
	padding-top: 10px !important;
}

#articleList h4{
	padding: 0 0 0 0px !important;
	margin: 0 !important;
	line-height: 1 !important;
	display: inline !important;
}


#tabLatest a:link, #tabLatest a:visited  {
	color: black !important;
	text-decoration: none !important;
}

#tabLatest h3 {
	font-size: 135%;
    font-family: Verdana, Geneva, Arial, sans-serif;
	display: inline;
	padding: 0 8px 0 16px!important;
	margin: 0 !important;
}

#tabLatest li.active {
	background: #fff;
	padding: 0em 0.5em !important;
	border-bottom: 1px solid #fff;
}



/*==============
		Skill styles
===============*/

/* Default = advanced */
.beginner, .intermediate, .beginnerInline, .intermediateInline {
	display: none;
}
.advanced {
	display: block;
}
span.advanced {
	display: inline;
}

/* Beginner */
body.skill1 .intermediate, body.skill1 .advanced, body.skill1 .intermediateInline, body.skill1 .advancedInline {
	display: none;
}
body.skill1 .beginner {
	display: block;
}
body.skill1 span.beginner {
	display: inline;
}

/* Intermediate */
body.skill2 .beginner, body.skill2 .advanced, body.skill2 .beginnerInline, body.skill2 .advancedInline {
	display: none;
}
body.skill2 .intermediate {
	display: block;
}
body.skill2 span.intermediate {
	display: inline;
}
dl#skillNotice input {
	font-size: 130%;
	width: 15em;
}
	p#skillButton {
		width: 19.5em;
		margin: 0 auto;
	}


div#googleSearch {
	float: right;
	overflow: hidden;
}

/*==================
		Google CSE styles
===================*/

.cse-branding-bottom,
.cse-branding-right {
margin:0;
padding:0
}
.cse-branding-bottom:after,
.cse-branding-right:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden
}
.cse-branding-text {
font: 10px Arial,sans-serif;
}
.cse-branding-form form {
margin-bottom: 0;
padding-bottom: 0;
}
/* Bottom-specific selectors */
.cse-branding-bottom .cse-branding-logo,
.cse-branding-bottom .cse-branding-text {
display: block;
float: left
}
.cse-branding-bottom .cse-branding-form {
margin-bottom: 3px;
}
.cse-branding-bottom .cse-branding-logo {
padding: 0
}
.cse-branding-bottom .cse-branding-text {
padding-top: 4px
}
.cse-branding-right .cse-branding-form {
float: left;
}

div.cse-branding-form {
	clear: both;
}


/* Flowplayer styles */

.video {
    width: 586px;
    height: 272px;
    position: relative;
    z-index: 6000;
    margin: 10px 0 20px 0;
}
.videoLoginPrompt {
    position: absolute;
    height: 272px;
    width: 586px;
    z-index: 7000;
    background: transparent;
    cursor: pointer;
        /* IE8 and lower */
        background: black\9;
        filter: alpha(opacity=1)\9;
}
.vlp_inner {
    display: none;
    background: #e3ecff;
    border: 2px solid #b7d3fd;
    height: 268px;
    width: 582px;
    z-index: 8000;
    position: absolute;
}
.vlp_inner p {
    font-size: 180%;
    width: 65%;
    margin: 0 auto;
    font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif;
}
    .vlp_inner p.first {
        margin-top: 2em;
    }

    p.vlp_dismiss {
        font-family: Verdana, Geneva, Arial, sans-serif;
        font-size: 100%;
        position: absolute;
        bottom: 0;
        right: 0;
        background: #fff;
        cursor: pointer;
        border-left: 2px solid #b7d3fd;
        border-top: 2px solid #b7d3fd;
        margin: 0;
        width: auto;
        padding: 1em 2em;
    }
    p.vlp_dismiss a:visited {
        color: blue;
    }


.videoContainer object {     /* IE6 and IE7 */
    *width: 340px !important;
    *margin-left: 0 !important;
}
    .videoContainer.Medium object {     /* IE6 and IE7 */
        *width: 520px !important;
    }
    .videoContainer.Large object {     /* IE6 and IE7 */
        *width: 780px !important;
    }


.videoContainer {
    color: #000;
    background: #b7d3fd;
    width: 586px;
    position: absolute;
}
    .videoContainer.Medium, .videoContainer.Large {
        width: 766px;
        z-index: 4;
        padding: 15px;
        border: 2px solid #265aa7;
    }
    .videoContainer.Large {
        width: 1034px;
        left: -50px;
    }
.playlistContainer {
    float: left;
    width: 246px;
}
    .videoContainer.Large .playlistContainer, .videoContainer.Medium .playlistContainer {
        position: relative;
        left: 8px;
    }
.playerContainer {
    float:left;
    width: 340px;
}
    .videoContainer.Medium .playerContainer {
        width: 520px;
    }
    .videoContainer.Large .playerContainer {
        width: 788px;
    }
.player {
	display:block;
	background:bottom url(../images/flowplayer_bar2.png) no-repeat;
	width:340px;
	height:272px; /* 248 + 24 player bar */
	text-align:center;
	color:#fff;
	text-decoration:none;
	cursor:pointer;
    position: relative;
}
    .videoContainer.Medium .player {
        width: 520px;
        height: 404px; /* 380 + 24 player bar */
        background:bottom url(../images/flowplayer_bar_medium2.png) no-repeat;
    }
    .videoContainer.Large .player {
        width: 788px;
        height: 600px; /* 576 + 24 player bar */
        background:bottom url(../images/flowplayer_bar_high2.png) no-repeat;
    }
.play1 {
    position: absolute;
    top: 114px;
    left:118px;
}
    .videoContainer.Medium .play1 {
        top: 180px;
        left: 208px;
    }
    .videoContainer.Large .play1 {
        top: 278px;
        left: 342px;
    }

.videoTitle {
    font-size: 160%;
    color: #265AA7;
    background: #ffd;
    font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif;
    padding: 0.2em;
    line-height: 1.2;
    text-align: center;
    border-bottom: 2px solid #265AA7;
    border-top: 2px solid #265AA7;
}
    .videoContainer.Medium .videoTitle, .videoContainer.Large .videoTitle {
        margin: 0 0.625em 1em 0.625em;
    }
    .videoTitle.noPlaylist {
        margin-bottom: 1em;
    }

.closeVideo {
    border: 2px solid #265AA7;
    color: #000;
    background: #fff;
    margin: 10em 1em 0 1em;
    padding: 0.5em;
    text-align: center;
    cursor: pointer;
}


.clips {
    margin-bottom: 2em;
    display: none;
}
.videoSize,.p-videoSize,.play1 {
    display: none;
}


.videoContainer noscript div {
    color: #000;
    background: #fcc;
    border: 4px solid #d00;
    font-size: 120%;
    width: 332px;
    position: absolute;
    top: 100px;
    left: 127px;
}
    .videoContainer noscript p {
        padding: 0.5em;
        margin: 0;
    }


div.clips a {
	display:block;
    margin: 0.8em 1em;
    padding: 0.5em;
    font-size: 100%;
    color: #000;
    background: #e3ecff;
    border-bottom: 2px solid #265AA7;
    text-decoration: none;
}

div.clips a.playing, div.clips a.paused, div.clips a.progress {
    background: #ffd;
}

div.clips a:hover {
	background-color:#fff;
}

.playlistTime {
    display: block;
    float: right;
    *margin-top: -22px;  /* IE6 and IE7 */
    _margin-top: -13px;   /* IE6 only */
    *margin-right: 5px;  /* IE6 and IE7 */
}

.videoSize {
    margin: 0 !important;
    float: left;
    width: 14.5em;
}
.p-videoSize {
    padding: 0.2em 0 0.2em 1em;
    float:left;
    width: 3em;
}

.videoSize li {
    display: inline;
    float: left;
    list-style-type: none;
    margin: 0 0.3em !important;
    color: #000;
    background: #e3ecff;
    border-bottom: 2px solid #265AA7;
}

.videoSize li:before {
    content: "" !important;
    padding: 0 !important;
    margin: 0 !important;
}
.videoSize .active {
    background: #ffd;
    color: #000;
}
.videoSize a {
    display:block;
    float: left;
    color: #000;
    text-decoration: none;
    padding: 0.2em 0.5em;
}
div#fadeOut {
    width: 100%;
    height: 100%;
    position: fixed;
    opacity: 0.75;
    background: #fff;
    z-index: 3;
    top: 0;
    left: 0;
    *display: none; /* IE6 and IE7 */
}

/* Table styles */

td,th {
  border: 1px solid #265aa7;
  padding: 0.5em 1em;
  text-align: center;
}
th {
    background: #e3ecff;
    font-weight: normal;
}


table {
     border-collapse: collapse;
     border-style: hidden;
     border: 1px hidden #265aa7;
     margin: 1em auto 3em auto;
}
caption {
    text-align: center;
    padding: 0.5em;
    font-weight: bold;
}

.error_messages, .success_messages {   /* phplogin errors */
    color: #000;
    background: #fdd;
    border: 2px solid #d00;
    padding: 1em 1em 0 1em !important;
}
    .success_messages h3, .error_messages h3 {
        padding: 0 0 0.5em 0;
        margin: 0;
    }
    .success_messages {
        background: #efe;
        border: 2px solid #393;
    }

.copyright {
    margin-top: 4em;
    font-style: italic;
}
.copyright p {
    padding: 0 !important;
    font-size: 85%;

}
.copyright .notice {
    font-weight: bold;
}

.homepage_login {
    font-size: 135%;
    clear: both;
    padding-top: 3em;
}


}	/* End screen media */

@media print {

div#googleSearch, #quickNav, #pageNav, #crumbs, .skipLinks, #topNav, #bookmark, #sideBarWrapper, #footerNav, #level, #sourcesToggle, .skillNotice, #topicsHeading, #topics, .notPrint {
	display: none;
}
body {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 8pt;
	line-height: 1.4;
}
h1,h2,h3 {
	color: #265aa7;
	background: #fff;
	line-height: 1.4;
}
h1 {
	font-size: 16pt;
}
h2 {
	font-size: 12pt;
	margin: 2em 0 0 0;
}
h3 {
	font-size: 10pt;
	margin: 2em 0 0 0;
	font-style: italic;
}
h1+h2, h2+h3 {
	margin: 1em 0 0 0;
}
a img {
	border: 0;
}
div#logoCentring, p#pageDate {
	border: 1px solid #ffa500;
	background: #ffd;
	color: #000;
	padding: 0.5em;
	width: 99%;
	line-height: 1;
	text-align: center;
}
div#logoCentring a {
	text-decoration: none;
	color: #000;
	background: #ffd;
}
p#pageDate {
	margin-top: 3em;
	line-height: 1;
}
div#logoCentring h1 {
	margin: 0;
	background: #ffd;
	color: #000;
}
div#logoCentring p {
	padding: 0.5em 0 0 0;
	line-height: 1;
	margin: 0;
}

}		/* End print media */
