@charset "UTF-8";
/*
 * Stylesheet for cnpg video system.
 * All Syles are contained in a single sheet to make
 * editing easier for client specific layouts.
 * Large comment blocks represent general sections.
 * Single line blocks represent page subsections.
 */


/*
===========================================
========== DEFAULTS =======================
=========================================== 
*/

* {
	margin:0;
}
img
{
border:0;
}
a:link {
	color: #000;
	text-decoration: none;
}
a:visited {
	color: #000;
	text-decoration: none;
}
a:hover, a:active {
	color: #000;
	text-decoration: underline;
}
body {
	margin: 0;
	padding: 0;
	text-align: center;
	font-size:10px;
}
p
{
color:#666;
}
h1
{
padding:4px 0;
}
h2
{
}
h3
{
}
span
{
}
/*
===========================================
========== END DEFAULTS ===================
=========================================== 
*/


/*
===========================================
========== MAIN LAYOUT ===================
=========================================== 
*/
#header {
	margin: 0;
	padding: 0;
	clear:both;
	overflow:hidden;
}
#container {
	width: 968px;
	margin: 10px auto;
	padding: 0;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.4em;
	background-color: #fff;
}
* div
{
overflow:hidden;
}
#mainWrapper {
	margin:10px 0px;
}
#footer {
	margin: 0;
	padding: 0;
	clear:both;
	overflow:hidden;
}

/*
===========================================
========== END MAIN LAYOUT ================
=========================================== 
*/

/*
===========================================
========== VIDEO LIST PAGE LAYOUT =========
=========================================== 
*/


/* =========== CENTER ============ */
#main {
	margin-top: 20px;
	float: left;
	width: 788px;
}

#center {
	float: right;
	width: 570px; /* 610 with padding */
	padding: 0 20px;
}

/* =========== SORT AND FILTERING ============ */

#sortMenu ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}
#sortMenu ul li {
	display: inline;
	margin-right: 0.4em;
}
/* user */
.filter{
padding:3px 0px;
}
.blurb
{
margin:5px 0px;
}
.filteredBy
{
color:#000;
font-size:1.2em;
}
.pageTitle
{
color:#000;
font-size:1.6em;
padding:0 0 5px 0;
}
.sortMenuSection {
	padding:5px 0px;
}
.sortMenuLink {
}
.sortMenuLinkSelected {
	font-weight:bold;
	background:url('bullet.gif') no-repeat;
	background-position:0px 4px;
	padding-left:7px;
}

/* =========== END SORT AND FILTERING ============ */

/* =========== VIDEO LIST SECTION ============ */
/* 
 * All Sections are user editable, but the layout can be broken without care. 
 */

#videos {
	width: 570px;
	margin: 0;
	border-top:solid 1px #cccccc;
}
.videosRow {
	border-bottom:1px solid #cccccc;
	clear:both;
}
.videosRowLeft {
	width:152px;
	float:left;
	margin:0px 0px 10px 0px;
	padding:0;
}
.videosRowRight {
	width:400px;
	float:left;
	margin:0px 0px 10px 10px;
}
.videoImage {
	background:#f3f3f3;
	border:solid 1px #cccccc;
	display:block;
}

/* User Editable (generally) */

.videoType {
	font-size:.9em;
	line-height:.9em;
	padding:0;
	margin:10px 0px 1px 0px;
}
.videoTitle {
	color:#3B3B3B;
	font-size:1.3em;
	text-decoration:none;
	line-height:1.3em;
	margin:0 0 5px 0;
}
.videoDate {
	float:right;
	margin:0 0 0 10px;
	width:135px;
	text-align:right;
}
.videoDesc {
	color:#7B7B7B;
	font-size:11px;
	line-height:16px;
	margin:0 0 10px 0;
}
.videoLink {
	width:150px;
	float:left;
	font-weight:bold;
}
.videoTagSection {
	width:250px;
	float:left;
	text-align:right;
}
.videoTagSet {
	margin:0;
	padding:0;
}
a.videoTag {
	color:#000000;
}
a.videoTag:hover {
	color:#000000;
	text-decoration:underline;
}
/* =========== END VIDEO LIST SECTION ============ */


/* =========== END CENTER ============ */





/* =========== LEFT NAV ============ */


#leftnav {
	float: left;
	width: 178px;
}
#leftnav ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
#leftnav ul p {
	padding: 4px 10px;
}
#leftnav ul ul {
	margin:5px 0 0 0;
	padding: 3px 10px;
	list-style-type: none;
}
#leftnav ul ul li {
	margin-bottom: 5px;
	margin-left: 10px;
}
/*user ediable*/
.leftNavSection {
	background: #f3f3f3;
}
.leftNavCategory {
	background: #666666;
	color: #fff;
	font-size: 1.2em;
	margin-top: 0;
	padding: 3px 10px;
}
a.leftNavFilter {
	color:#999999;
}
.instruct {
	margin:3px 0px;
}
.filterLink {
	line-height: 1.2em;
	text-decoration: underline;
}
/* =========== END LEFT NAV ============ */


/* =========== RIGHT COL ============ */


#rtcol {
	float: right;
	width: 180px;
	padding: 0;
}
/* user editable */

.rightColumnTitle {
	color: #666666;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 5px;
}


/* =========== SEARCH SECTION ============*/

#search {
	text-align: right;
	margin: 0 0 10px 0px;
	padding: 14px;
	text-align: right;
	background: #f3f3f3;
}
/* user editable */


.searchSection {
	border-top: 13px solid #666666;
	border-bottom: 13px solid #666666;
}
.searchInputField {
	width:150px;
	border:solid 1px #cccccc;
}
.searchInputHolder {
	padding:0 0 5px 0;
}
.searchButton {
	font-size:1.1em;
	background:#dddddd;
	color:#666666;
	border:solid 1px #cccccc;
}

/* =========== END SEARCH SECTION ============*/


/* =========== FEATURED VIDEO SECTION ============*/


#featured {
	margin: 0;
	padding: 14px 14px 0px 14px;
	background:#f3f3f3;
}
/* user editable */


.featuredVideoSection {
	border-top: 13px solid #666666;
	border-bottom: 13px solid #666666;
}
.featuredVideo {
	padding: 0 0 14px 0;
}
.featuredVideoImage {
	border:solid 1px #cccccc;
	margin:0 0 5px 0;
}
.featuredVideoLink1 {
line-height:1.2em;
padding-bottom:2px;
}
.featuredVideoLink2 {
}
/* =========== END FEATURED VIDEO SECTION ============*/


/* =========== END RIGHT COL ============ */


/*
===========================================
========== END VIDEO LIST PAGE LAYOUT =====
=========================================== 
*/

/*
===========================================
====== VIDEO PLAYER PAGE LAYOUT ===========
=========================================== 
*/


/* =========== GENERAL FORMATING ============ */
#videoPlayer {
	padding:0;
	width:480px;
	height:410px;
}
#videoPlayerWrapper {
	float: left;
	width: 480px;
	padding: 0px 0px 25px 25px;
}
#relatedItems {
	float:left;
	width:413px;
	padding: 0 25px 0 25px;
}
.crumb
{
padding:4px 0px 0px 4px;
display:block;
}

/* =========== END GENERAL FORMATING ============ */


/* =========== VIDEO PLAYER FORMATING ============ */

.videoPlayerTitle {
	padding:15px 0px 0px 0px;
	text-align:left;
	font-size:1.7em;
}
.videoPlayerSubTitle {
	padding:15px 0px 10px 0px;
	text-align:left;
	font-size:1.3em;
}

.videoPlayerDescription {
	padding:0px 0px 10px 0px;
}
.videoPlayerLinks {
	padding-top:5px;
}
.videoPlayerLinks ul {
	padding:0;
	list-style-type: none;
	width:100%;
	padding:0px;
}
.videoPlayerLinks ul a {
 	display: block;
	color: #333333;
	background:#dddddd;
	padding:5px 5px;
	margin:1px 0 0 0;
}
.videoPlayerLinks ul a:hover {
	background:#cccccc;
}

/* =========== END VIDEO PLAYER FORMATING ============ */

/* =========== RELATED VIDEO FORMATING ============ */

.relatedItemsHead {
	
	border-bottom:solid 1px #cccccc;
	padding:35px 0px 0px 0px;
}
.relatedItemsHead h2
{
font-size:1.5em;
}
.moreContentLink {
	float:right;
	font-size:11px;
}
#relatedVideos {
	width: 413px;
}
.relatedVideosRow {
	border-bottom:1px solid #cccccc;
	clear:both;
	padding:0 0 10px 0;
}
.relatedVideoType {
	font-size:.9em;
	line-height:.9em;
	margin:10px 0px 1px 0px;
}
.relatedVideosRow:hover {
	background:#fafafa;
}
.relatedVideosRowLeft {
	width:102px;
	float:left;
	padding:0;
}
.relatedVideosRowRight {
	width:306px;
	float:left;
	padding:0 0 0 5px;
}
.relatedVideoImage {
	float:left;
	width:100px;
	height:70px;
	background:#f3f3f3;
	border:solid 1px #cccccc;
	display:block;
}
.relatedVideoContent {
	padding: 0px 0px 5px 0px;
	color:#666666;
	font-size:1.1em;
	line-height:1.5em;
}
.relatedVideoTitle {
	padding: 0px 0px 5px 0px;
	color: #222222;
	font-size: 1.2em;
}
.relatedVideoLink
{
font-size:1.1em;
}
/* =========== END RELATED VIDEO FORMATING ============ */


/*
===========================================
====== END VIDEO PLAYER PAGE LAYOUT =======
=========================================== 
*/

/*
===========================================
====== REGISTRATION PAGE LAYOUT ===========
=========================================== 
*/

/* =========== GENERAL FORMATING ============ */
/*
 * The videoRegBlurb section will be used for the survey, 
 * registration and lead form pages.
 *
 */

#videoRegBlurb
{
padding:10px;
margin:10px 0 10px 0;
border:solid #ccc 1px;
background:#f8f8f8;
clear:both;
}
#registration
{
}
#registrationMessage
{
margin:5px 0 20px 0;
}
#submitRegistration
{
height:30px;
padding:10px 0px;
}
#newRegHolder
{
padding:15px 0;
margin: 0 0 15px 0;
border-top:solid 1px #ccc;
border-bottom:solid 1px #ccc;
}
#returningRegHolder
{
padding:15px 0;
margin: 0 0 15px 0;
border-top:solid 1px #ccc;
border-bottom:solid 1px #ccc;
}
/* =========== END GENERAL FORMATING ============ */
#registration h1
{
font-size:1.8em;
padding:0 0 5px 0;
}
#registration p
{
padding:0 0 8px 0;
font-size:1.1em;
}
#registration h2
{
font-size:1.3em;
padding:10px 0 2px 0;
}
#registration table
{
border-collapse:collapse;
width:100%;
}
.inputFieldDesc
{
width:160px;
text-align:left;
padding:0;
color:#666;
font-size:1.1em;
}
.inputFieldHolder
{
padding:5px;
}
#videoRegBlurbText
{
padding:0 0 0 10px;
}
.videoRegBlurbImage
{
	float:left;
	width:100px;
	height:70px;
	margin:0 10px 0 0;
	background:#f3f3f3;
	border:solid 1px #cccccc;
	display:block;
}
.requiredMessage
{
color:#990000;
}
.hidden
{
visibility:hidden;
}



/*
===========================================
====== END REGISTRATION PAGE LAYOUT  ======
=========================================== 
*/

/*
===========================================
========= SURVEY PAGE LAYOUT  =============
=========================================== 
*/
/* =========== GENERAL FORMATING ============ */
/*
 * The videoRegBlurb section will be used for the survey, 
 * registration and lead form pages.
 *
 */

#surveyTitleHolder
{
padding:10px 0px;
}
#surveyTitleHolder h2
{
font-size:1.6em;
}
#surveyQuestionsHolder
{
overflow:visible;
padding:5px 0px;
}
/* =========== END GENERAL FORMATING ============ */
.singleQuestionHolder
{
padding:10px 2%;
margin:10px 0;
border-top:solid 1px #cccccc;
border-bottom:solid 1px #cccccc;
}
#surveyQuestionsHolder td
{
padding:2px 0;
}
#surveyQuestionsHolder table
{
width:96%;
}
.surveyQuestion
{
font-size:1.2em;
padding:5px 0px;
}


/*
===========================================
====== END SURVEY PAGE LAYOUT  ============
=========================================== 
*/

/*
===========================================
====== INPUT FIELD STYLES  ================
=========================================== 
*/
.inputDropDown
{
background:#f3f3f3;
border:solid 1px #ccc;
padding:2px;
}
.inputCheckBox
{
}
.inputFieldBox
{
background:#f3f3f3;
border:solid 1px #ccc;
padding:2px;
}
.inputFieldButton
{
border:solid 1px #cccccc;
background:#f3f3f3;
}
.inputFieldRadioButton
{
}
.inputFieldLabel
{
}
/*
===========================================
====== END INPUT FIELD STYLES  ============
=========================================== 
*/


/* =========== UTILITIES ============= */
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
	content:".";
	visibility:hidden;
}

/*
=====================================================
=========== Dons updates for CNPG footer=============
=====================================================
*/

div#cnFooter
{
    background-color: #ccc;
    padding: 3px;
}

div#cnFooter div#cnCopyright
{
    float: left;    
}

div#cnFooter div#cnLinksContainer
{
    text-align: right;
}

div#cnFooter div#cnLinksContainer a
{
    padding-right: 3px;
}

div#cnFooter div#cnLinksContainer a:hover
{
    padding-right: 3px;
    text-decoration: underline;
}
div#search
{
	text-align: left;
}