@charset "UTF-8";
/*- ### Main CSS Document ######## */
/*- CLEAR DEFAULT STYLES
--------------------------------------------------------------------------------------- */   
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	/*font-size:100%;
	vertical-align:baseline;*/
}
body { 
	/*background:url(../../shared/images/testing.jpg) 0 0 repeat-x;*/
	font:normal 11px Verdana,Arial,Helvetica,sans-serif;
	background-color:#768086; 
	background-position:center;
	color:#808080;
	margin:0;
	/*font-size:100%;*/
}
a:hover, a:active, a:focus, object, embed {
	outline:none;
}
.clear {
	clear:both;
	height:0;
}
.clearfloat {
	clear:both;
    height:0;
    font-size:1px;
    line-height:0px;
}
.nobr  {
	white-space:nowrap;
}
a {
	text-decoration:none;
	outline:none;
	color:#808080;
}
hr {
	color:#829cb9;
    height:1px;
}
/*- ### Apply pretty typography #######*/
/*h1, h2, h3, h4, h5, h6 {
	font-family: Arial, Helvetica, sans-serif;
	line-height: 130%;
	font-weight: bold;
	color:#453630;
	margin: 1.4em 0 .6em;
}*/
h1, h2, h3, h4, h5, h6 {
	margin:0;
	padding:0;
}
h1 {
	letter-spacing:-.04em;
}
h2 {
	letter-spacing:-.005em;
}
h3 {
	letter-spacing:-.005em;
}
h1.shadow, h2.shadow {
	text-shadow:0 0 0 #fcf9ee, 0 4px 0 rgba(0,0,0,0.15); /*was: 0 2 0...*/
}
h2.block {
	font-size:120%;
	margin:0.75em 0 .3em;
	letter-spacing:-.04em;
}
h3.block {
	font-size:140%;
	margin:2em 0 .3em;
	letter-spacing:-.04em;
}
h3.strand {
	font-family: Arial, Helvetica, sans-serif;
	line-height:130%;
	font-weight: bold;
	color:#453630;
	font-size:140%;
	margin:2em 0 .3em;
	letter-spacing:-.04em;
}
/*- Page structuring
--------------------------------------------------------------------------------------- */
/*- ### Global navigation utility ######## */
#wrapper {
	width:920px;
	margin:0 auto;
	background-color:#ffffff;
}
div#header-nav {
	width:920px;
	line-height:18px;
	background:#c3c3c4;
	color:#000000;
   	overflow:hidden;
   	zoom:1; /* lte IE6 work-around */
}
div#header-nav li.left {
	font:bold 10px/15px Arial,Helvetica,sans-serif;
	float:left;
	list-style:none;
	margin:0;
	white-space:nowrap;
	padding:2px 5px 0px 5px;
	border-right:1px solid #fff;
}   
div#header-nav li.right {
	font:bold 10px/15px Arial,Helvetica,sans-serif;
	float:right;
	list-style:none;
	/*color:#00f;*/
	margin:0;
	white-space:nowrap;
	padding:2px 5px 0px 1px;
	border-left:1px solid #fff;
} 
div#header-nav li a {
	width:auto;
	color:#333333;
	text-decoration:none;
	outline:none;
    display:inline;
}
div#header-nav li a:hover {
	width:auto;
	color:#000000;
	text-decoration:none;
	outline:none;
    display:inline;
}
#logoTouch {
	outline:none;
}
fieldset {
	width:auto;
	border:none;
	padding-left:330px;
	overflow:hidden;
	background:#e3e3e3;
}
table {
	text-align:right;
}
form.gs {
  	border:0 solid #dad9da;
  	/*padding:auto;*/
   	font-size:11px;
   	font-family: Arial,Helvetica,sans-serif;
   	color:#808080;
	background:#e8e8e8;
	margin:0;
}
form br  {
	display: none;
}
input.gs {
   	font-size:10px;
   	font-family:Arial,Helvetica,sans-serif;
   	color:#808080;
	width:100px;
	cursor:pointer;
}
input.gs::-moz-focus-inner {
	border:0;
} /* fix pre-FF4 input type image problem */
div#banner {
	clear:both;
	outline:none;
	border:none;
	overflow:hidden;
	background-color:#504c49;
}


/*- ### Font-sizer ######## */
#service-nav {
	float:right;
	margin-right:16px;
}
#service-nav li {
	display:block;
	float:right;
}
#service-nav li a {
	color:#fff;
	border-left:1px solid #696969;
	display:block;
	float:left;
	/*line-height:34px;*/
	margin:6px 0 5px;
	padding:0 10px;
}
#font-sizer li a.font-normal,
#font-sizer li a.font-large,
#font-sizer li a.font-xl {
	border-left:0 none;
}
#service-nav #font-sizer span {
	display:none;
}





/*- ### Secondary page structuring calls and local styling ########*/
map, area, img {
	outline:none;
	border:none;
}
.clear, .clearer {
	clear:both;
	height:0;
}
.clearfloat {
	clear:both;
    height:0;
    font-size:1px;
    line-height:0px;
}
.nobr  {
	white-space:nowrap;
}
img.viewHeaderTop {
	padding-top:0;
	padding-left:1px;
	padding-right:2px;
	padding-bottom:1px;
    vertical-align:middle;
	margin:0;
}
img.view {
	padding-top:0;
	padding-left:3px;
	padding-right:2px;
	padding-bottom:1px;
    /*vertical-align: middle; */
	margin-top: auto;
}
img.viewRSS {
	padding-top:10px;
	padding-left:3px;
	padding-right:3px;
	padding-bottom:5px;
}
.riser {
	vertical-align:text-top;
}
div.containerRSS {
	background: transparent url(../../shared/images/icon_feed.gif) no-repeat 0 0;
	line-height:14px;
	padding-top:0;
	padding-left:18px;
	padding-bottom:0px;
	vertical-align:middle;
	display:inline;
}
div.containerRSS a {
	text-decoration:none;
	outline:none;
}
div.containerRSS a:hover {
	text-decoration:underline;
	outline:none;
}
#rssValid {
	margin-top:10px;
	margin-bottom:10px;
	padding-top:5px;
	padding-bottom:5px;
	text-align:center;
}



/*- Page structuring : tab menu, also global
--------------------------------------------------------------------------------------- */
/*- ### Primary menu bar ######## */
#navBarTop {
	/*background:#c3c3c4;*/
	background:url(../../shared/images/gradient-b.gif) 0 0 repeat;
}
div#navBarTop ul.menu {
	list-style:none;
	height:24px;
	width:920px;
	margin-left:0;
	}
div#navBarTop ul.menu li {
	float:left;
	border-right:1px solid #504c49;
	}
div#navBarTop ul.menu li:hover ul {
	display:block;
}
div#navBarTop ul.menu li a {
	background:transparent url(../../shared/images/gradient-b.gif) 0 0 repeat;
	display:block;
	font:bold 11px/24px Arial,Verdana,sans-serif;
	width:-130px;
	height:24px;
	color:#333333;
	text-decoration:none;
	outline:none;
	margin-right:0;
	text-align:center;
	padding:0;
	overflow:hidden;
}
/*
div#navBarTop ul.menu li a:hover {
	/*background-image:url(../../shared/images/gradient-b.gif);
}
/*
div#navBarTop ul.menu li.active a {   
	background:transparent url(../../shared/images/gradient-b.gif) 0 0 no-repeat;
}
*/
/*- ### Secondary menu ######## */
div#navBarTop ul.menu li ul {
	display:none;
	position:absolute;
	list-style:none;
	cursor:pointer;
	/*background-color:handled by img*/
	color:#0f3658;
	margin:0px 0 0 1px; /*careful of splash img overlap and overhang; line up right sidelines*/
	padding:0px;
	width:-130px;
	z-index:1452;
	height:auto;
}
div#navBarTop ul.menu li ul li {
	float:none;
	height:auto;
}
div#navBarTop ul.menu li ul li a {
	text-align:left;
	/*background-image:blank;*/
	font:bold 11px Arial,Verdana,sans-serif;
	color:#504c49;
	text-decoration:none;
	outline:none;
	height:auto;
	width:auto;
	margin:0px;
	padding:5px 0 5px 10px;
	border-bottom:1px solid #504c49;
}
div#navBarTop ul.menu li ul li a:hover {
	color:#000;
	outline:none;
		width:-260px;
	/*background-color:#666666;*/
}
div#navBarTop ul.menu li.current a:hover {
	color:#ff0000;
	outline:none;
		width:-260px;
	/*background-color:#d0d0d0;*/
}
div#navBarTop ul.menu li.live a {
	color:#fff;
	outline:none;
		width:-260px;
	/*background-color:#d0d0d0;*/
}
div#navBarTop ul.menu li.live a:hover {
	color:#3399ff;
	outline:none;
		width:-260px;
	/*background-color:#d0d0d0;*/
}






/*- ### Staga area structuring #######*/
#stageWrapper {
	clear:both;
}
#stageL {
	width:700px;
	float:left;
}
#stageR {
	float:right;
	width:219px;
	height:274px;
	text-align:right;
	background-color:#504c49;
	border-left:1px solid #fff;
}
#stageR p.caption, #stageL p.caption {
	font:normal 10px Arial,Helvetica,sans-serif;
	color:#fff;
	padding:5px 5px 5px 10px;
	text-align:right;
}
#stageR p.captionLeftTop, p.captionRightTop {
	font:bold 20px Arial,Helvetica,sans-serif;
	letter-spacing:-0.005em;
	color:#fff;
	padding:30px 5px 15px 10px;
	text-align:left;
}
#stageR .stage-mask p.captionRightBottom {
	font:normal 14px/50px Arial,Helvetica,sans-serif;
	letter-spacing:-0.04em;
	color:#fff;
	line-height:50px /*tame Mozilla*/
	padding:5px 5px 5px 10px;
	background: url(../../shared/images/youtube24x24.gif) no-repeat 24px 12px;
	text-align:center;
}
/*- ### Splash and features area structuring #######*/
#feature-stage {
	position:relative;
	width:700px;
	height:274px;
}
#feature-strip {
	width:640px;
	height:50px;
	bottom:0;
	left:0;
	font:bold 14px Arial,Verdana,sans-serif;
	padding:0 30px 0 30px;
	position:absolute;
	overflow:hidden;
	background-image:url(../../shared/images/overlay-w-op60.png);
}
#feature-strip h3 {
	font-family:Arial,Helvetica,sans-serif;
	font-size:140%;
	line-height:50px;
	color:#fff;
	letter-spacing:-0.04em;
}
#feature-strip a {
	text-decoration:none;
	outline:none;
	float:right;
	font:bold 11px/50px Arial,Verdana,sans-serif;
	color:#fff;
	text-transform:uppercase;
}





/*- ### Stage in clutch area ########*/
#clutch-feature-stage { /*unused*/
	position:relative;
	width:700px;
	height:100px;
}
#clutchStageL {
	width:320px;
	float:left;
	height:100px;
	background-color:#504c49;
}
#clutchStageR {
	float:right;
	width:599px;
	height:100px;
	text-align:right;
	background-color:#504c49;
	border-left:1px solid #fff;
}
#clutchStageL p.captionLeftTopHeader {
	font:bold 20px Arial,Helvetica,sans-serif;
	letter-spacing:-0.04em;
	color:#fff;
	padding:20px 5px 15px 10px;
	text-align:left;
}
#clutchStageL p.captionLeftTop {
	font:bold 16px Arial,Helvetica,sans-serif;
	letter-spacing:-0.009em;
	color:#d0d0d0;
	padding:10px 5px 15px 10px;
	text-align:left;
}
#clutchStageR p.captionRightTopHeader {
	font:bold 20px Arial,Helvetica,sans-serif;
	letter-spacing:-0.04em;
	color:#fff;
	padding:20px 5px 15px 10px;
	text-align:left;
}
#clutchStageR p.captionRightTop {
	font:bold 16px Arial,Helvetica,sans-serif;
	letter-spacing:-0.04em;
	color:#d0d0d0;
	padding:10px 5px 15px 10px;
	text-align:left;
}
div#clutchStageR .clutch-stage-mask {
	overflow:hidden;
	background-image:url(../../shared/images/overlay-w-op60.png);
	width:600px;
	height:50px;
	bottom:0;
	left:0;
	position:absolute;
}
/*- Used on startpage */
div#stageR {
	position:relative;
	width:219px;
	height:274px;
}
div#stageR .stage-mask {
	overflow:hidden;
	background-image:url(../../shared/images/overlay-w-op60.png);
	width:219px;
	height:50px;
	bottom:0;
	left:0;
	position:absolute;
}
div#stageR .boxline {
 	font:normal 11px sans-serif,Verdana,Arial;
    /*background-color:#ffffff;*/
	color:#fff;
    text-align:left;
	padding:10px 10px;
}
/*- ### Textured class ####### */
div.outerbox {
  background-color:transparent;
  background-image:url(../../shared/images/overlay.png);
  background-repeat:repeat;
  margin: 30px 48px;
  width:60%;
  color:black;
  border:1px outset #999;
  max-width:45em;
}
div.innerbox {
  margin:1em;
  }
/*- ### Locale #######*/
#breadCrumbWrapper {
	width:920px;
	line-height:21px;
	clear:both;
}
#breadCrumbL {
	width:455px;
	float:left;
	font:bold 10px/19px Arial,Helvetica,sans-serif;
	padding-left:5px;
	color:#333333;
	background:#e3e3e3; /*was e3e3e3*/
}
#breadCrumbR {
	width:460px;
	float:right;
	font:bold 10px/19px Arial,Helvetica,sans-serif;
	padding-right:0px;
	color:#333333;
	/*background-color:#e8e8e8; controlled by fieldset at the moment*/
}
/*- ### Main content area #######*/
div#extrasWrapper {
	width:920px;
	clear:both;
}
div#extrasL {
	width:440px; /*920/2=460-5px times 2=440px*/
	float:left;
	font:normal 11px Arial,Helvetica,sans-serif;
	color:#333333;
	background:#fff;
	padding:5px 10px 10px 5px;
	margin:auto;
}
div#extrasR {
	width:440px; /*920/2=460-5px times 2=440px*/
	float:right;
	font:normal 11px Arial,Helvetica,sans-serif;
	color:#333333;
	background:#fff;
	padding:5px 10px 10px 5px;
	margin-right:auto;
}
ul.list-indent {
	text-align:left;
	text-indent:15px;
	padding-left:0px;
	margin:0 25px;
	list-style-type:square;
}
div#extrasR p,
div#extrasL p {
	padding:5px 5px 5px 10px;
}
/*- ### Teaser boxes in clutch and throttle areas ######## */
div#CTextrasWrapper {
	width:920px;
	clear:both;
}
div#CTextrasL {
	width:435px;
	float:left;
	font:normal 11px Arial,Helvetica,sans-serif;
	color:#333333;
	background:#fff;
	padding:5px 10px 10px 5px;
	margin-right:auto;
	border-right:1px dotted #ccc;
	border-bottom:1px dotted #ccc;
}
div#CTextrasR {
	width:435px;
	float:right;
	font:normal 11px Arial,Helvetica,sans-serif;
	color:#333333;
	background:#fff;
	padding:5px 10px 10px 5px;
	margin-left:auto;
	border-left:1px dotted #ccc;
	border-bottom:1px dotted #ccc;
}
div#CTextrasL h2,
div#CTextrasR h2 {
	color:#768086;
	padding:5px 0;
}
div#CTextrasL p,
div#CTextrasR p {
	padding:5px 10px;
}
div#CTextrasL a,
div#CTextrasR a {
	text-decoration:none;
}
div#CTextrasL a:hover,
div#CTextrasR a:hover {
	text-decoration:underline;
}


/*- ### Footer utilities ######## */
div#footer {
	width:920px;
	clear:both;
}
div#footerL {
	width:455px;
	float:left;
	font:bold 10px/18px Arial,Helvetica,sans-serif;
	color:#504c49;
	background:#e3e3e3;
	padding-left:5px;
}
div#footerR {
	width:455px;
	float:right;
	font:normal 8px/18px Verdana,Arial,Helvetica,sans-serif;
	color:#333;
	background:#e3e3e3;
	padding-right:5px;
	text-align:right;
}

/*- Various
--------------------------------------------------------------------------------------- */
abbr { 
	border-bottom: 1px dotted #333333;
	cursor:help;
}
del {
	text-decoration:line-through;
}
.logo-sup {
	font:bold 10px Arial,Verdana,sans-serif;
}
/*- ### Other ######## */
textarea { line-height: 1.25em; overflow: auto; }
select { border: 1px solid #453630; padding: 1px; }
option { padding: 0 3px; }
/*- ### Glossary terms ######## */
dl.termin {
  float:left;
  clear:left;
  background-color:transparent;
  background-image:url(../../shared/images/overlay-b.png);
  background-repeat:repeat;
  width:16em;
  font-family:Arial, Verdana, sans-serif;
  font-size:75%;
  margin:0 1em 0 0;
  padding:1em;
  color:#000;
  border:1px inset #999;
} 
dl.termin dd {
  margin-left: 1em;
  font-weight: normal;
}
dl.termin dt {
  font-weight: bold;
}
p.innerbox { 
  font-family:Arial,Helvetica,sans-serif;
  font-size:83%;
  line-height: 1.4;
  margin-bottom:1em;
  margin-top:0;
  padding:0;
  margin-left:0.5em;
}
pre {
  padding:0.5em;
  margin-left:0.5em;
  background-color:transparent;
  background-image:url(../../shared/images/overlay.png);
  background-repeat:repeat;
}
p.navigation { 
  text-align:center;
  background-color:transparent;
  background-image:url(../../shared/images/overlay-g.png);
  background-repeat:repeat;
  color:#000;
  margin:0;
  padding:0;
  border-bottom:1px groove #ddd;
}
/*old
a:link, a:visited { 
font-weight: bold;
color: #333;
text-decoration: underline;
background: transparent;
}
a:hover, a:active {
color: #666666;
background-color: transparent;
background-image: url(white.png);
background-repeat: repeat;  }

#c3c3c4; one of my favourites
#808080;
#cccccc; basic light grey
#ececec; nice light grey
#878c96;
#696969; medium dark grey
#cecece; also
#d8d8d8; same
#e3e3e3; e8e8e8;
#504c49; steel grey
#453630; brownish grey
#999999; medium grey
#a5acb2;
#dfdfdf;
#304251; 
#cc0000; (strong red, ff0000)
#000066; (strong blue)
#fcac00; 
#661a03; strong brown
#606033; brown with touch of green, good boundary

#96b3ce; (perwinkle) other b4c6d9
#0f3658;  #0f3658; (darker version of periwinkle, this pair my answer to others)
#768086; >> very nice
#ed0c0c; dark blue
#339933; green

#5d5d5d;
#386a9f;
#0d0d0d;
#173cb8;
#bdc9f3;
#e1e1e1;
#e0e0e0;

*/
/*- Debugging
--------------------------------------------------------------------------------------- */
.clue {
	display:block !important;
}
.ignorethis
       {
        font-family: Verdana, Helvetica, Arial, sans-serif;
        font-size:9pt;
        color:#000000;
}
/*- Noscript
--------------------------------------------------------------------------------------- */
div#att {
	background-color:#fffeb8;
	width:920px;
	border-bottom:0 solid #333333;
	height:2.5em;
	line-height:2.5em;
	position:relative;
	top:0;
}
div#att p {
	background:transparent url(../../shared/images/att.png) no-repeat 5px 52%;
	margin:0;
	display:inline;
	padding:6px 6px 6px 26px;
}