@charset "utf-8";
/* CSS Document */
/* You can use this on any page that needs video lists and one or more player boxes to display YouTube videos.
- This works on IE, Firefox, Chrome, Safari, and iOS.

- Add class videoPlayer to the TABLE.
- Add class videoList to the TD (cell) that the list of videos should appear.
- Add class playerArea to the TD (cell) where the player will be embedded.

- Use iFrame code from YouTube for the player.
- NOTE: The BG image (for glow) is based on player that is 500 wide by 350 tall.
- If using more than one iframe, give them different names and ids and be sure to use the right "target" parameter.
*/

table.videoPlayer { 
	width: 95%;
	margin: 20px auto 10px;
	background-color: #333;
	color: #FFF;
}

td.videoList {
	font: .8em;
	margin-right: 15px;
	line-height: 1.5em;
}
#MainHome td.videoList p {
	margin: 1em 1em 0 1em;
	padding: 0;
/* Overrides any other normal margins such as left indent*/
}

#MainHome td.videoList ol {
	margin: 2px 2px 25px 25px;
	padding-top: 0;
	text-align: left;
}

#MainHome table.videoPlayer a:link,
#MainHome table.videoPlayer a:visited { 
	color: #FFF;
}

#MainHome table.videoPlayer a:hover,
#MainHome table.videoPlayer a:active,
#MainHome table.videoPlayer a:focus {
	color: #999;
}

#MainHome td.playerArea {
	padding: 15px;
	/* background-image: url(../_images/bgVideoPlayer.jpg); */
	background-repeat: no-repeat;
	background-position: center center;
	vertical-align: top;
}

#MainHome td.playerArea iframe {
	border-top-width: 2px;
	border-right-width: 5px;
	border-bottom-width: 5px;
	border-left-width: 2px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #636;
	border-right-color: #636;
	border-bottom-color: #636;
	border-left-color: #636;
}



#vidIndexTable {
	width: 95%;
	border: none;
	margin: 15px auto;
}

#vidIndexTable th, 
#vidIndexTable td {
	margin: 0;
	padding: 0;
}

#vidIndexTable p, 
#vidIndexTable h3, 
#vidIndexTable a 
{
	margin: 5px 0 0 0;
	text-align: center;
}

#vidIndexTable h3 {
	color: #5A155A;
}

#vidIndexTable a img { 
	border: 2px solid #5A155A;
	padding: 2px;
	margin: 0;
}

#vidIndexTable a:hover img { 
	border: 2px solid #636;
	background-color: #636;
}

