﻿/*

css/uc.css

USER CENTRIC VIDEO LAUNCH PAGE SYSTEM - USER CENTRIC BRANDED CSS
Version: 1.0
Date: 3/31/2008

This CSS file is intended to be referenced by client 
area video pages.  It styles them with User Centric 
branding and a page format that coordinates with the 
User Centric public Web site.

Do not modify this CSS file to make changes that are
specific to another company or brand.  Instead, create 
a duplicate copy of this CSS file for the modifications.
Then, override the CSS URL in data files for projects
to be branded for the other organization.

*/


/*
IMPORT GENERAL / NON-BRANDED STYLES
*/
@import "_global.css";





/*
GENERAL ELEMENT STYLES
*/

h1,h2,h3,h4,h5,h6,h7 {
	font-weight:bold;
	color:#5c5c5a;
	margin-bottom:1em;
}

h1 {
	font-size:135%;
}

h2 {
	font-size:108%;
}

h3 {
	font-size:118%;
}

a {
	color:#376600;
}

a:hover, a:active {
	color:#589116;
}

button, #Login_Submit {
	background:url('uxa_images/button_bg.png') repeat-x left 50%;
	color:#fff;
	font:95% arial;
	font-weight:bold;
	border:0;
	cursor:pointer; 
	cursor:hand;
	height:1.55em;
}





/*
DIV CONTAINING ENTIRE PAGE
*/





body {
	text-align:center;
}






#Page_Wrapper {
	margin:0 2em;
	text-align:left;
	min-width:743px;
	background:url('uxa_images/page_top.png') repeat-x left top;
}







/*
HEADER AT TOP OF PAGE
*/

#Header {
	clear:both;
	width:100%;
}




	/*
	THE LOGO SRC IS A TRANSPARENT IMAGE. CSS CAN
	BE USE TO RE-SIZE IT AND APPLY A BACKGROUND IMAGE
	CONTAINING THE ACTUAL LOGO, TO BRAND THE PAGE.
	*/

	#Logo {
		float:left;
	}

		#Logo a {

		}

		#Logo img {
			background:url('uxa_images/logo.png') no-repeat;
			width:391px;
			height:116px;
			margin-top:7px;
		}




	/*
	THE TAGLINE SRC IS A TRANSPARENT IMAGE. CSS CAN
	BE USE TO RE-SIZE IT AND APPLY A BACKGROUND IMAGE
	CONTAINING THE ACTUAL TAGLINE, TO BRAND THE PAGE.
	*/
	#Tagline {
		float:right;
	}

		#Tagline img {
			margin-top:31px;
			background:url('uxa_images/tagline.png') no-repeat;
			width:245px;
			height:21px;
		}







	/*
	MAIN NAVIGATION MENU AT THE TOP OF THE PAGE,
	BELOW THE LOGO AND TAGLINE.
	*/

	#Main_Navigation {
		display:block;
		clear:both;
		height:1.8em;
		text-align:right;
		font-size:105%;
		vertical-align:bottom;
		position:relative;
		top:-45px; /* ALLOWS NAV MENU TO OVERLAP LOGO A BIT */
	}

		div.Tabs {
			float:right;
			height:1.8em;
			vertical-align:bottom;
		}

			ul.Tabs {
				float:left;
				display: inline;
				line-height:1.8em;
				list-style-type: none;
				vertical-align:bottom;
			}

				/* ALL TABS */

				ul.Tabs li {
					display:block;
					height:1.8em;
					float:left;
					list-style: none;
					margin:0 0 0 .8em;
					vertical-align:bottom;
				}

					/* ANCHORS WITHIN ALL TABS */
					ul.Tabs li a:link, ul.Tabs li a:visited, ul.Tabs li a:hover, ul.Tabs li a:active {
						color:#5c5c5a;
						display:block;
						height:1.8em;
						text-decoration:none;
						background:url('uxa_images/corner_tab_default.png') repeat-x left 50%;
						vertical-align:bottom;
					}

						/* SPANS WITHIN TABS */
						ul.Tabs li span {
							display:block;
							line-height:1.8em;
							padding-left:1em;
							padding-right:1em;
							vertical-align:bottom;
						}


				/* HOVER STATE FOR NORMAL TABS */
				ul.Tabs li:hover a {
					color:#000000;
					background:#e3e3e3 url('uxa_images/corner_tab_hover.png') repeat-x left 50% !important;
					text-decoration:underline !important;
				}


				/* TAB FOR CURRENT PAGE */
				ul.Tabs li.Tab_Current {
					background:#002277 url('uxa_images/corner_tab_current.png') repeat-x left 50%;
				}

					ul.Tabs li.Tab_Current span {
						color:#fff;
						font-weight:bold;
					}


/*
MAIN CONTENT (LEFT AND RIGHT COLUMNS) CONTAINER
*/

#Main_Content {
	float:left;
	width:100%;
}

/* COMPENSATE FOR RELATIVE POSITIONING OF Main_Navigation IN HEADER ABOVE */
#Main_Content {
	margin-top:-25px;
}

/* MORE MARGIN ON LOGIN PAGE, WHICH CONTAINS NO HEADER */
body#LoginPage #Main_Content {
	margin-top:3em; 
}

	#Left_Column {
		left:0;
		margin-top:.5em;
		margin-bottom:2em;
		margin-right: 20.50em;
		voice-family: "\"}\"";
		voice-family: inherit;
		margin-right:20.50em;
		min-width:552px;
		padding-left:1em;
	}

	html>body #Left_Column {
		margin-right:20.50em;
		margin-left:0;
	}

		#Page_Title {
			margin-bottom:.2em;
			margin-left:.9em;
			color:#98cb00;
		}

			#Page_Title_Client {
			}

			#Page_Title_Project {

			}

		#Page_Subtitle {
			margin-bottom:.7em;
			margin-left:1.2em;
		}

			#Page_Subtitle_Video_Title {

			}

		/* BOX CONTAINING VIDEO AND VIDEO CONTROLS */

		/* TOP LEFT CORNER OF BOX */

		#Video_Wrapper {
			text-align:center;
			background:#dee9a3 url('uxa_images/corner_lightgreenonwhite_TL.png') no-repeat left top;
		}


			/* TOP RIGHT CORNER OF BOX */
			#Video_Controls {
				padding:1em;
				background:url('uxa_images/corner_lightgreenonwhite_TR.png') no-repeat right top;
			}


					#Video_Controls button {
						width:7em;
						vertical-align:top;
					}

					#Video_Controls button#Video_Controls_Previous {
						margin-right:.4em;
					}

						#Video_Controls button#Video_Controls_Previous span {
							padding-left:10px;
							background:url('uxa_images/button_arrow_left.png') no-repeat left 50%;
						}

					#Video_Controls_Select_Video {
						margin:0;
					}

					#Video_Controls button#Video_Controls_Next {
						margin-left:.7em;
					}

						#Video_Controls button#Video_Controls_Next span {
							padding-right:10px;
							background:url('uxa_images/button_arrow_right.png') no-repeat right 50%;
						}

						/* Button when given the disabled class name */
						#Video_Controls button.Video_Control_Disabled, #Video_Controls button.Video_Control_Disabled span {
							background:#c5d08c !important;
							cursor:arrow !important;
							padding-left:0 !important;
							padding-right:0 !important;
							color:#c5d08c;
						}

			#Video_Container {
			}

			#Video_Container img, #Video_Container object, #Video_Container embed {
				border:2px solid #969696 !important;
			}

			/* BOTTOM LEFT CORNER OF BOX */
			#Video_Options {
				background:url('uxa_images/corner_lightgreenonwhite_BL.png') no-repeat left bottom;
			}

			/* BOTTOM RIGHT CORNER OF BOX */
			#Video_Download {
				padding:.5em;
				background:url('uxa_images/corner_lightgreenonwhite_BR.png') no-repeat right bottom;
			}



	#Right_Column {
		position:absolute;
		right:2.25em;
		top:194px;;
		width:17em;
		margin:0 0 2em 0;
		padding:0;
		overflow:hidden;
	}

		#Right_Column div {
			font-size:90%;
			margin-bottom:2.5em;
		}

			#Right_Column div h3 {

			}


			#Right_Column div h4 {
				margin-left:1em;
			}

			#Right_Column div p {
				margin:0 1em 1.5em 1em;
			}

			#Right_Column div p a {
				display:block;
			}

		/*
		SPECIAL STYLES FOR THE SUPPORT CONTACT INFO
		*/

		#Right_Column div#Support p {
			background:#dee9a3;
			text-align:center;
			padding:.5em 1em .7em 1em;
		}

		#Right_Column div#Support p span {
			display:block;
			color:#366500;
		}

		#Right_Column div#Support a:link, #Right_Column div#Support a:visited {
			color:#366500;
		}

		#Right_Column div#Support a:hover, #Right_Column div#Support a:active {
			color:#589116;
		}

/*
COPYRIGHT AND UXA INFO ACROSS BOTTOM OF PAGE
*/

#Footer {
	border-bottom:1em solid #fff;
	padding:0 1em;
	background:#dee9a3;
	display:block;
	clear:both;
	height:2em;
	font-size:85%;
}

	#Copyright {
		float:left;
		line-height:2em;
		color:#5c5c5a;
	}

	#UXA_Membership_Link {
		float:right;
		height:2em;
	}

		#UXA_Membership_Link a {
			display:block;
			line-height:2em;
			color:#366500;
		}

		#UXA_Membership_Link a:hover, #UXA_Membership_Link a:active {
			color:#589116;
		}

