/* flatview specific styles */
#flatview {
}

#flatview .printHeader {
	display: none;
}

#flatview #contentContainer {
	height: auto;
}

/* box dimensions */
#flatview .box_grayOnTrans {
	width: 576px;
}
	#flatview .box_grayOnTrans .row .cornerMiddle {
		width: 549px;
	}
	#flatview .box_grayOnTrans .row, 
	#flatview .box_grayOnTrans .rowMiddle {
		width: 567px;
	}

#flatview .box_grayOnTrans .boxMargin {
	margin: -2px 7px;
}
#flatview .box_ssblackOnGray {
	width: 553px;
}
	#flatview .box_ssblackOnGray .row .cornerMiddle {
		width: 529px;
	}
	#flatview .box_ssblackOnGray .row, 
	#flatview .box_ssblackOnGray .rowMiddle {
		width: 553px;
	}

#flatview .box_grayOnSsblack {
	width: 513px;
}
	#flatview .box_grayOnSsblack .row .cornerMiddle {
		width: 499px;
	}
	#flatview .box_grayOnSsblack .row, 
	#flatview .box_grayOnSsblack .rowMiddle {
		width: 513px;
	}

#flatview .box_ssblackOnTrans {
	width: 196px;
}
	#flatview .box_ssblackOnTrans .row .cornerMiddle {
		width: 178px;
	}
	#flatview .box_ssblackOnTrans .row, 
	#flatview .box_ssblackOnTrans .rowMiddle {
		width: 196px;
	}
	#flatview .box_ssblackOnTrans .rowMiddle {
		padding: 0 0 3px 0;
	}
	* html #flatview .box_ssblackOnTrans .rowMiddle {
		width: 192px;
	}


/* content/gradient margins */
body .box .gradient {
	float: left;
	margin: 0 5px;
	padding: 0 15px;
	width: 513px;
}
* html body .box .gradient {
	margin: 0 3px;
	padding: 0 13px;
}

#flatview h1 {
	margin: 0px 5px 0;
	padding: 3px 15px 7px;
	color: #cccccc;
	font-size: 13px;
	font-weight: bold;
}

#flatview h1.tml, 
#flatview h1.cnx, 
#flatview h1.cnc, 
#flatview h1.ess, 

#flatview h1.doc, 
#flatview h1.img, 
#flatview h1.snd, 
#flatview h1.vid {
	background-repeat: no-repeat;
	padding-left: 35px;
}

#flatview h1.img {background-image: url(../images/chapter/icon_diagram.gif);
	background-position: 10px 1px;
}
#flatview h1.snd {background-image: url(../images/chapter/icon_speech.gif);
	background-position: 10px 0px;
}
#flatview h1.vid {background-image: url(../images/chapter/icon_commentary.gif);
	background-position: 10px 1px;
}
#flatview h1.doc {background-image: url(../images/chapter/icon_article.gif);
	background-position: 12px 2px;
}
#flatview h1.tml {background-image: url(../images/my_work/vg_controller.gif);
	background-position: 10px 1px;
}
#flatview h1.cnx {background-image: url(../images/my_work/vg_controller.gif);
	background-position: 10px 1px;
}
#flatview h1.cnc {background-image: url(../images/my_work/vg_controller.gif);
	background-position: 10px 1px;
}
#flatview h1.ess {background-image: url(../images/my_work/quill.gif);
	background-position: 10px 1px;
}


/* roundButtonsSC - section colored roundButtons */
#flatview .roundButtonsSC.rBh1 {
	margin: 3px 5px 0 5px;
	float: right;
}
#flatview .roundButtonsSC.rBrccs {
	position: absolute;
	right: 0px;
	bottom: -8px;
	clear: both;
}
* html #flatview .roundButtonsSC.rBrccs {
}
#flatview .roundButtonsSC .roundButton {
	float: left;
	display: block;
	clear: none;
	height: 15px;
}
#flatview .roundButtonsSC .roundButton a, 
#flatview .roundButtonsSC .roundButton a span {
	cursor: pointer;
}
#flatview .roundButtonsSC .roundButton.rbh1 {
	width: 113px;
}
#flatview .roundButtonsSC .roundButton.rbrccs {
	width: 98px;
}
#flatview .roundButtonsSC .roundButton .icon.pdf {
	float: left;
	display: block;
	width: 15px;
	height: 14px;
	background-position: 0px 2px;
	background-repeat: no-repeat;
	background-image: url(../images/flatview/icon_pdf.gif);
}
#flatview .roundButtonsSC .roundButton .left {
	float: left;
	display: block;
	background-position: left;
	width: 7px;
	height: 15px;
}
#flatview .roundButtonsSC .roundButton .right {
	float: left;
	display: block;
	background-position: right;
	width: 7px;
	height: 15px;
}
#flatview .roundButtonsSC .roundButton .center {
	margin: 0 0;
	padding: 0 0;
	float: left;
	height: 15px;
	width: 82px;
	border: none;
	text-align: left;
	line-height: 15px;
	font-size: 11px;
	font-weight: bold;
	font-family: 'Arial Narrow', Arial, Helvetica;
}

#flatview .roundButtonsSC .roundButton .icon.pdf span, 
#flatview .roundButtonsSC .roundButton .left span, 
#flatview .roundButtonsSC .roundButton .right span, 
#flatview .roundButtonsSC .roundButton .center span {
	display: none;
}

body#flatview .roundButtonsSC .roundButton, 
body#flatview .roundButtonsSC .roundButton a, 
body.d08#flatview .roundButtonsSC .roundButton, 
body.d08#flatview .roundButtonsSC .roundButton a, 
body.usg#flatview .roundButtonsSC .roundButton, 
body.usg#flatview .roundButtonsSC .roundButton a 		{ color: #08131C;}
body.ush#flatview .roundButtonsSC .roundButton, 
body.ush#flatview .roundButtonsSC .roundButton a 		{ color: #171307;}
body.eng#flatview .roundButtonsSC .roundButton, 
body.eng#flatview .roundButtonsSC .roundButton a 		{ color: #0C1A0A;}

body#flatview .roundButtonsSC .roundButton .left, 
body#flatview .roundButtonsSC .roundButton .right, 
body.d08#flatview .roundButtonsSC .roundButton .left, 
body.d08#flatview .roundButtonsSC .roundButton .right, 
body.usg#flatview .roundButtonsSC .roundButton .left, 
body.usg#flatview .roundButtonsSC .roundButton .right		{ background-image: url(../images/flatview/button15d08.gif);}
body.ush#flatview .roundButtonsSC .roundButton .left, 
body.ush#flatview .roundButtonsSC .roundButton .right		{ background-image: url(../images/flatview/button15ush.gif);}
body.eng#flatview .roundButtonsSC .roundButton .left, 
body.eng#flatview .roundButtonsSC .roundButton .right		{ background-image: url(../images/flatview/button15eng.gif);}

body#flatview .roundButtonsSC .roundButton .center, 
body.d08#flatview .roundButtonsSC .roundButton .center, 
body.usg#flatview .roundButtonsSC .roundButton .center		{ background-color: #A4CDF2;}
body.ush#flatview .roundButtonsSC .roundButton .center		{ background-color: #FFE5B5;}
body.eng#flatview .roundButtonsSC .roundButton .center		{ background-color: #E0F2DD;}



#flatview #cctv h2 {
	margin: 2px 0 0.4em;
	font-size: 12px;
	font-weight: bold;
}

body#flatview #cctv h2, 
body#flatview.d08 #cctv h2, 
body#flatview.usg #cctv h2 {
	color: #42a5d4;
}
body#flatview.ush #cctv h2 {
	color: #ffee33;
}
body#flatview.eng #cctv h2 {
	color: #36da25;
}

#flatview #cctv p {
	margin: 0 0 1.4em 0;
	font-size: 11px;
	font-weight: normal;
	color: #cccccc;
}
#flatview #cctv p.keywords a {
	color: #cccccc;
	text-decoration: none;
}
#flatview #cctv p.keywords a:hover {
	color: #cccccc;
	text-decoration: underline;
}

#flatview #cctv #transcript p {
	margin: 0 10px 1.4em;
	color: #000000;
}

#flatview #cctv .box_grayOnSsblack {
	margin: 0 0 7px;
}

#flatview #cctv .thumbnail {
	padding-left: 112px;
	position: relative;
}
#flatview #cctv .thumbnail a.playnow {
	position: absolute;
	top: 1.4em;
	left: 112px;
	width: 289px;
	height: 216px;
	background-image: url(../images/flatview/play_overlay.png);
	background-position: center;
	background-repeat: no-repeat;
}
#flatview #cctv .thumbnail a.playnow span {
	display: none;
}
/*
#flatview #cctv .thumbnail a.playnow:hover {
	background-image: url(../images/flatview/play_overlay-hover.png);
}
*/
* html #flatview #cctv .thumbnail a.playnow {
	left: 0px;
	background-image: url(../images/flatview/play_overlay.gif);
}
/*
* html #flatview #cctv .thumbnail a.playnow:hover {
	background-image: url(../images/flatview/play_overlay-hover.gif);
}
*/
#flatview #cctv .thumbnail img {
	margin: 1.4em 0;
}
#flatview #cctv .generalInfo table {
	margin: 0 0 1.4em;
	font-size: 11px;
	width: 100%;
}
#flatview #cctv .generalInfo table tr th {
	width: 20%;
	text-align: left;
	vertical-align: top;
	color: #ffffff;
}
#flatview #cctv .generalInfo table tr td {
	width: 30%;
	text-align: left;
	vertical-align: top;
	color: #cccccc;
}


#flatview #rccs h2 {
	margin: 0 5px;
	font-size: 12px;
	text-transform: uppercase;
	color: #ffffff;
}
body#flatview #rccs h2, 
body#flatview.d08 #rccs h2, 
body#flatview.usg #rccs h2 {
	border-bottom: 3px double #4F8CC4;
}
body#flatview.ush #rccs h2 {
	border-bottom: 3px double #DAAC56;
}
body#flatview.eng #rccs h2 {
	border-bottom: 3px double #98CC8E;
}

#flatview #rccs .scrollContainer {
	float: left;
	margin: 0 5px;
	height: 490px;
	position: relative;
	width: 186px;
}
* html #flatview #rccs .scrollContainer {
	width: 188px;
	margin: 0 2px;
}
body#flatview #rccs .scrollContainer, 
body#flatview.d08 #rccs .scrollContainer, 
body#flatview.usg #rccs .scrollContainer {
	border-bottom: 1px solid #183958;
}
body#flatview.ush #rccs .scrollContainer {
	border-bottom: 1px solid #523E19;
}
body#flatview.eng #rccs .scrollContainer {
	border-bottom: 1px solid #225219;
}

#flatview #rccs .viewThumbs .relatedItem {
	clear: both;
	float: left;
}


#flatview #rccs .viewThumbs .title {
	margin: 1em 10px 0.5em;
	font-size: 10px;
	line-height: 1.2em;
	height: 2.4em;
	width: 166px;
	overflow: hidden;
}
body#flatview #rccs .viewThumbs .title a, 
body#flatview.d08 #rccs .viewThumbs .title a, 
body#flatview.usg #rccs .viewThumbs .title a {
	color: #86ACCF;
}
body#flatview.ush #rccs .viewThumbs .title a {
	color: #DCCEB4;
}
body#flatview.eng #rccs .viewThumbs .title a {
	color: #98CC8E;
}
#flatview #rccs .viewThumbs .thumbnail {
	margin: 0 0 8px 50px;
	padding: 3px;
	float: left;
	width: 130px;
	height: 67px;
	background-repeat: no-repeat;
	}
* html #flatview #rccs .viewThumbs .thumbnail {
	margin: 0 0 8px 25px;
	}
#flatview #rccs .viewThumbs .thumbnail img {
	padding-top: 1px;
	}
#flatview #rccs .viewThumbs .Gray .thumbnail {background-image: url(../images/thumbs/border_gray_small.gif);}
#flatview #rccs .viewThumbs .Teal .thumbnail {background-image: url(../images/thumbs/border_teal_small.gif);}
#flatview #rccs .viewThumbs .Yellow .thumbnail {background-image: url(../images/thumbs/border_yellow_small.gif);}
#flatview #rccs .viewThumbs .Orange .thumbnail {background-image: url(../images/thumbs/border_orange_small.gif);}
#flatview #rccs .viewThumbs .Green .thumbnail {background-image: url(../images/thumbs/border_green_small.gif);}
#flatview #rccs .viewThumbs .Purple .thumbnail {background-image: url(../images/thumbs/border_purple_small.gif);}
#flatview #rccs .viewThumbs .Red .thumbnail {background-image: url(../images/thumbs/border_red_small.gif);}





