/* 
	Tolknet specific video layout styling
	--------------------------------------------------
*/

/* ------------- Overall styles */

body.vidpopup{
	background: #ffffff;
	margin: 0px;
	padding-bottom: 24px;
}

/* ------------- Grid */

#vidwrapper{
	text-align: center;
}

#vidcontainer{
	width: auto;
	margin: 0 auto;
	background-color: #ffffff;
	text-align: left;
	width: 540px;
	padding-top: 2em;
}


/* ------------- Text */

#vidcontainer{
	font-size: 0.69em;
	color: #2b2e2f;
}

#vidwrapper{
	line-height: 1.33em;
}

#vidwrapper p{
	margin-bottom: 1em;
}

#vidcontainer abbr{
	border-bottom: 1px dotted #f7403a;
	cursor: help;
}

/* ------------- Links */

#vidcontainer a{
	color: #f7403a;
}

/* ------------- Headings */

#vidcontainer h1{
	font-size: 1.45em;
	font-weight: bold;
	color: #f7403a;
	margin-bottom: 0.69em;
}

#vidcontainer h2{
	font-size: 1.18em;
}


/* ------------- Video link markup */

#rightcol .videopreview{
	height: 110px;
	position: relative;
}

#videolist .videopreview, .homebox.rightbox .videopreview{
	position: relative;
	height: 100px;
}

 .homebox.rightbox .videopreview{
 	margin-bottom: 2em;
}

#rightcol .videobox img, #videolist .videopreview img, .homebox.rightbox .videopreview img{
	border: 1px solid #2b2e2f;
	position: absolute;
	z-index: 2;
	top: 0px;
	left: 0px;
}

#rightcol .videobox a.previewlink, #videolist .videopreview a.previewlink, .homebox.rightbox .videopreview a.previewlink{
	display: block;
	background: transparent url(../images/back_video_preview_play.png) left top no-repeat;
	position: absolute;
	top: 1px;
	left: 1px;
	z-index: 3;
	width: 150px;
	height: 100px;
}

#rightcol .videobox a.previewlink span, #videolist .videopreview a.previewlink span, .homebox.rightbox .videopreview a.previewlink span{
	display: none;
}

/* ------------- Video overview markup */

#videolist{
	position: relative;
	width: 100%;
	overflow: hidden;
}

#videolist .videowrap{
	width: 155px;
/*	border: 1px solid #999999;*/
	float: left;
	padding: 0px 10px 1em 0px;
}

#videolist .videorow{
	clear: left;
}

#videolist h3{
	margin-top: 0.5em;
}

#videolist h3 a{
	color: #2b2e2f;
	text-decoration: none;
}

#videolist h3 a:hover{
	color: #f7403a;
}

.videoopt{
	list-style: none;
	margin: 0em 0em !important;
	padding: 0px;
}

.videoopt li{
	display: inline;
	margin: 0px;
	padding: 0px;
}

.videoopt .ngtlink, .videoopt .ngtondlink, .videoopt .ondlink{
	display: block;
	width: 18px;
	height:18px;
	float: left;
	margin: 0.5em 5px 0.5em 0px;
}

.videoopt .ngtlink{
	background: url(../images/icon_ngt.png) top left no-repeat;
}

.videoopt .ngtondlink{
	background: url(../images/icon_ondngt.png) top left no-repeat;
}

.videoopt .ondlink{
	background: url(../images/icon_ond.png) top left no-repeat;
}

.videoopt .ngtlink span, .videoopt .ngtondlink span, .videoopt .ondlink span{
	display: none;
}

.videoopt .ngtlink span.optlegend, .videoopt .ngtondlink span.optlegend, .videoopt .ondlink span.optlegend{
	display: block;
	background-color: #FFFF99;
	border: 1px dotted #666666;
	position: absolute;
	margin-top: 18px;
	z-index: 30;
	color: #2b2e2f;
}

.vidpopup .videoopt span.optlegend{
	position: relative;
	width: 150px;
	right: 130px;
}

/* ------------- Video watch markup */

#vidwrapper h1 .activevidvariant{
	color: #2b2e2f;
	font-size: 0.69em;
	font-weight: normal;
	float: right;
}

#vidwrapper .videoopt{
	float: right;
	margin-top: 0em;
}

#vidwrapper .videoopt .ngtlink, #vidwrapper .videoopt .ngtondlink, #vidwrapper .videoopt .ondlink{
	margin-top: 0em;
}

#vidwrapper .videodescipt{
	line-height: 1.55em;
}