html, body {
/*padding: 0;*/

/*margin-bottom: 12px;*/
margin:0px;
font-family: helvetica;
}



video {
position: absolute;
background: black;
}



#playerDiv {
position: relative;
width: 640px;
height: 480px;
padding: 12px 64px 84px 64px;
overflow: hidden;
background-position: left;
background-repeat: repeat;
background-color: black;
}

#embedDiv {
width: 100%;
height: 100%;
}



#releaseListDiv {
position: relative;
width: 768px;
height: 246px;
overflow: hidden;
    background: #383838;
}



#relatedItemsDiv {
position: relative;
width: 100%;
height: 20%;
text-align: left;
bottom: 0;
overflow: hidden;
}



#clipInfoDiv {
position: relative;
width: 768px;
height: 126px;
overflow: hidden;
background: #333333;
/*padding: 0 0 20px 0;*/

}



.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}



.overlay img {
position: absolute;
bottom: 10px;
right: 10px;
}



a.overlayPlayButton {
width: 100px;
height: 100px;
font-size: 72px;
text-decoration: none;
color: white;
background: url('../images/playOverlay.png');
}



.loadingIndicator {
width: 98px;
height: 20px;
margin-left: -50px;
margin-top: -10px;
border: 1px solid white;
color: white;
font-size: 10px;
line-height: 18px;
background: black;
font-family: helvetica;
text-align: center;
}



.error {
width: 100%;
height: 100%;
background-color: red;
opacity: 0.25;
}



.clipInfo {
	
/*	padding:5px 5px 5px 5px;*/

	overflow:hidden;
	height: 110px;
	line-height:15px;
}



.clipInfoTitle {
color: white;
margin-left: 1px;
margin-right: 1px;
margin-top: 1px;
margin-bottom: 5px;
font-family: helvetica;
font-weight: 800;
font-size: 15px;
text-align: left;
}

.clipInfoCopyright{
	
	color: white;
	margin-left: 1px;
	margin-right: 1px;
	margin-top: 1px;
	margin-bottom: 1px;

	font-size:11px;

	position:absolute;
	bottom: 0px;
	
}



.clipInfoDescription {
color: white;
margin-left: 1px;
margin-right: 1px;
margin-top:0px;
margin-bottom:1px;
font-family: helvetica;
font-size: 13px;
}



.cardOvelay {
text-align: center;
float: left;
}



.releaseList {
	width: 50%;
	height: 100%;
	/*width: 100%;
height: 100%;*/
/*background: black;*/
background-color: #383838;
z-index: 2500;
}


.releaseList:after {
clear: both;
}

.releaseListPlay {
	
	_border: 0 solid #FFFFFF;
/*	background-image: url('images/playOverlay.png');
	background-repeat:no-repeat;*/
	position:absolute;
	
/*	display:inline;*/
	
	right:10px;
	bottom:4px;	
	
	height:25px;
	width:25px;
	
}

/*.releaseListPlayImage{
	background-image:url('images/playOverlay.png');
	border-color:#383838;
	filter: color()"
}*/

.releaseListItem a:hover .releaseListPlay{
	border-color:#383838;
/*	filter: color()"*/
}

.releaseListItem a:hover .releaseListPlayImage{

/*	border-color:#383838;*/
/*	filter: color()"*/
}

.releaseListPlaySelected {
	
	border: 1px solid #383838;
	position:relative;
	
	right:20px;
	bottom:20px;	
	
	height:20px;
	width:20px;
	
}

.releaseListThumb {
	float:left;
	position:relative;
	
/*	display:inline-block;*/
/*	position:static;*/
	height:100%;
	overflow:hidden;

/*	width:100%;*/

}

.releaseListThumbImage {
	float:left;
	position:relative;
/*display: table-cell; vertical-align: middle; */
}



.releaseListItem {
/*width: 372px;
height: 110px;*/
/*border: 0px;*/
float: left;
margin: 0px;
margin-top: 0px;
font-size: 13px;
font-family: "Myriad Pro", arial;
overflow: hidden;
margin: 5px;
background-color: #383838;

}

.releaseListItemSelected {
/*width: 372px;
height: 110px;*/
/*border: 0px;*/
float: left;
margin: 0px;
margin-top: 0px;
font-size: 13px;
font-family: "Myriad Pro", arial;
overflow: hidden;
margin: 5px;
background-color: #383838;
}



.releaseListItem .releaseListThumbImage {
margin: 0px;
padding: 0px;
border: 0px;
float: left;
/*width: 144px;
height: 108px;*/


/*border-right: 1px solid #383838;*/
}

.releaseListItem .releaseListThumbDiv {
	margin-right: 5px;
	border-right: 1px solid #383838;	
}



.releaseListItemSelected a {
	text-decoration: none;
	color: white;
	height:100%;
	width:100%;
/*	height: 108px;
	width: 370px;*/
	display: block;
	border: 1px solid #FFFFFF;
	line-height:13px;
	overflow:hidden;
}

.releaseListItemSelected .releaseListThumbImage{
	margin: 0px;
	padding: 0px;
	border: 0px;
	float: left;
/*	width: 144px;
	height: 108px;*/

}

.releaseListItemSelected .releaseListThumbDiv {
	margin-right: 5px;
	border-right: 1px solid #FFFFFF;	
}

.releaseListLength {
	font-size:12px;

}

.releaseListDescription {
	font-size:12px;
	white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-all;
	margin-top:5px;
}

.releaseListItem a {
text-decoration: none;
color: white;
height:100%;
width:100%;
/*height: 108px;
width: 370px;*/
display: block;
border: 1px solid #383838;
line-height:13px;
overflow:hidden;

}

.releaseListItem a:hover {
	border: 1px solid #00CCFF;
}

.releaseListItem a:hover .releaseListThumbDiv{
	border-right: 1px solid #00CCFF;
}

.releaseListThumbDiv {
	/*this doesn't seem to work for IE*/
	background-color:#242424;
	display:table-cell;
/*	height:100%;*/
	vertical-align:middle;
}

.releaseListItemHolder {
	float:left;
}


.releaseListTitle {

}

.releaseListTextHolder {
	position:relative;
	height:90%;
/*	width:;*/
	padding: 0 0 0 5px;

	margin-top: 3px;
	margin-bottom:3px;
	margin-left:3px;
	margin-right:3px;
	overflow:hidden;
}

.releaseListText {
/*	margin: 5px;*/
/*	white-space: nowrap;*/
	white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-all;

	margin-top: 3px;

	position:relative;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;	/* required for Opera */
	-ms-text-overflow: ellipsis;	/* required for IE8, allegedly */
/*	-moz-binding: url('ellipsis.xml#ellipsis'); */
	padding: 0px 0px 5px 0px;

/*	margin-bottom:3px;*/
	
	
}



/* This is because safari/quicktime on windows sticks in next/back buttons */

audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button {
-webkit-appearance: media-seek-back-button;
position: absolute;
top: 0;
right: 16px;
width: 17px;
height: 16px;
display: none;
}





audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button {
-webkit-appearance: media-seek-forward-button;
position: absolute;
top: 0;
right: 0;
width: 17px;
height: 16px;
display: none;
}









.relatedItems {
width: 100%;
height: 20%;
overflow: hidden;
margin: 0 auto;
text-align: center;
}



.relatedItemsContainer {
margin: 0 auto;
text-align: center;
}



.relatedItemsInnerDiv {
overflow: hidden;
margin: 0 auto;
text-align: center;
float: left;
}



.relatedItemsList {
width: 100%;
overflow: hidden;
list-style-type: none;





    /*display:inline;*/

    

   /*float:left;*/

    text-align:center;
margin: 2px auto;
padding: 0 4px 0 0;



    /*float:left;*/
}







.relatedItemsList li {
display: inline-block;

    /*display:inline-block;*/

    /*margin:0 0 0 0;*/

    padding:2px;
text-align: center;
border: none;
}



.relatedItemWrap {
display: inline-block;
text-align: center;
border: 1px solid transparent;
position: relative;
}



.relatedItemsHoverLabel {
position: relative;
}



.relatedItemThumb {
border: none;
}



.relatedItemThumbHover {
border: 2px;
}





.relatedItemsHeader {
position: relative;

    margin-top=4px;
}





.relatedItemsButtonContainer {
float: left;
position: absolute;

    /*height:100%;*/

    top:13px;
}



.relatedItemsRightHeaderSpan {
float: right;
}



.relatedItem {
bottom: 0;
display: inline-block;
}



.relatedItemPreviousButton {
display: inline;

    /*position:relative;*/

    padding:2px;
text-align: center;
height: auto;
width: auto;
margin: 0 0 0 0;
border: none;
}



img {
border-style: none;
}



.relatedItemNextButton {
display: inline;

    /*position:relative;*/
       height:auto;
width: auto;
border: none;
margin: 0 0 0 0;
}
