
ul {
  	margin: 0;
  	padding: 0;
  	list-style: none;
	background-image: url(images/content-bkgnd.gif);
}

input[type=radio] {
  display: none;
}

.a-container {
  	width: 100%;
  	border: 1px solid #424528;
}

.a-container label {
  display: block;
  position: relative;
  cursor: pointer;
  padding: 10px;
  color: #F0EDC9;
  opacity: 0.9; 

  
  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
  
  
	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0%, #424528),
	color-stop(40%, #62663C),
	color-stop(60%, #62663C),
	color-stop(100%, #424528)
	);
	background-image: -o-linear-gradient(bottom,#424528 0%, #62663C 40%, #62663C 60%, #424528 100%);
	background-image: -moz-linear-gradient(bottom, #424528 0%, #62663C 40%, #62663C 60%, #424528 100%);
	background-image: -webkit-linear-gradient(bottom, #424528 0%, #62663C 40%, #62663C 60%, #424528 100%);
	background-image: -ms-linear-gradient(bottom, #424528 0%, #62663C 40%, #62663C 60%, #424528 100%);
	background-image: linear-gradient(to bottom, #424528 0%, #62663C 40%, #62663C 60%, #424528 100%);
}



.a-container input:checked + label,
.a-container label:hover {
  	background-color: #424528;
  	opacity: 0.75; 
  	color: #F0EDC9;
	text-shadow: #000 1px 1px 2px;
}



.a-content {
	background-image: url(../images/content-bkgnd.gif);
  	display: none;
}

.a-container input:checked ~ .a-content {
  display: block;
}



.mediaHead{
	font-variant: small-caps;
/* 	height: 20px; */
/* 	color: #F0EDC9; */
	width: 100%;
	line-height: 20px;
	text-align: center;
}


.mediaNavLinks{
	width: 100%;
	height:674px;
	padding-top:10px;
	border-right: 1px solid #424528;
	border-left: 1px solid #424528;
	overflow-y: auto;
}


.mediaNavRow{
	height: 30px;
 	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 100%;
/* 	padding:2px; */
}


.mediaNavLeft{
	width: 30px;
	position: relative;
	top: 0px;
	left: 0px;
}

.mediaNavRight{
	width: 160px;
	left: 32px;
	padding-left:5px;
}


.libImage {
	width: 640px;
	height: 282px;
	position: absolute;
	top: 0px;
	left: 20px;
}

.videoDetailWrap {
	width: 640px;
	height: 388px;
	position: absolute;
	left: 20px;
	top: 284px;
	}

.videoDetailContent  {
	width: 638px;
	height: 386px;
	border: 1px solid #F0EDC9;
	background-image: url(../images/content-bkgnd.png);
}



.videoWrap {
	width: 678px;
	height: 688px;
	position: absolute;
	left: 20px;
	top: 20px;
}

.videoContent {
	width: 678px;
	height: 688px;
	border: 1px solid #F0EDC9;
	background-image: url(../images/content-bkgnd.png);
}

.videoContainer {
	width: 640px;
	height: 360px;
	position: absolute;
	border: 1px solid #424528;
	background-color: black;
	margin: 17px;
}

.videoHeader {
	width: 630px;
	height: 26px;
	position: absolute;
	top: 400px;
	left: 21px;
	padding: 5px;
	background-color: #F0EDC9;
}

.videoHeaderText {
	font-size: 14px;
	color: #F0EDC9;
	line-height: 26px;
	text-align: center;
	text-shadow: #000 1px 1px 2px;
}

.videoDescription {
	width: 640px;
	height: 200px;
	background-color: rgba(240, 237, 201, 0.5);
	position: absolute;
	top: 436px;
	right: 17px;
	margin: 17px;
    box-sizing: border-box;
  padding-top: 20px;
  padding-right: 40px;
  padding-bottom: 20px;
  padding-left: 40px;
    overflow-y:auto; 
    
    
}

.videoCredits {
	width: 630px;
	height: 24px;
	line-height: 24px;
	position: absolute;
	top: 636px;
	left: 21px;
	padding: 5px;
	background-color: #F0EDC9;
}

.videoDate {
	width: 170px;
	height: 20px;
	position: relative;
	left: 21px;
}

.videoSource {
	width: 380px;
	height: 20px;
	position: relative;
	left: 230px;
	top: -18px;
}



.videoText {
	font-size: 11px;
	word-spacing: 3px;
	line-height: 18px;
  	text-align: justify;
  	margin: 0 auto;
  	padding: 0px, 20px, 20px, 20px;
}