.transparent{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-moz-opacity:0 !important;-khtml-opacity:0;opacity:0 !important;}

.box { 	
margin-bottom: 20px;
}

.box2 { 	
margin-bottom: 20px;
}

#close {
position: fixed;
width: 160px;
height: 290px;
left: 0;
}

.nav {
padding: 10px 0;
border-left-style: solid;
border-left: solid #595959;
pointer-events: none;
position: absolute;
top: 2%;
z-index: 7000;
width: 160px;
height: 270px;
background: rgba(255, 255, 255, 0.35);
-webkit-transition-duration: 1.6s;
-moz-transition-duration: 1.6s;
-ms-transition-duration: 1.6s;
-o-transition-duration: 1.6s;
transition-duration: 1.6s;
-moz-box-shadow: 7px 8px 18px 0px rgba(83, 83, 83, 0.6);
}

.nav2 {
opacity: 0;
border-left-style: solid;
border-left: solid #595959;
pointer-events: none;
top: 2%;
z-index: 6999;
}

a.boxclose {
float: right;
opacity: 0.3;
margin-top: 0px;
margin-right: -39px;
cursor: pointer;
pointer-events: auto;
color: rgba(0, 0, 0, 0.48);
padding: 0;
background: url('../img/menubutton.png') 0 0 no-repeat;
background-size: 37px 65px;
width: 37px;
height: 65px;
}

a.boxclose:hover ,a.boxclose2:hover {
opacity: 0.5;
}

a.boxclose2{
padding: 0;
background: url('../img/menubutton.png') 0 0 no-repeat;
background-size: 37px 65px;
width: 37px;
height: 65px;
visibility:hidden;
opacity: 0.3;
pointer-events: auto;
    float: right;
margin-top: 0px;
margin-right: -39px;
cursor: pointer;
}

.nav p {
margin-top: 10px;
font-family: 'festivo_lcinline', impact,georgia,sans-sarif;
text-align: center;
font-size: 34px;
line-height: 15px;
letter-spacing: 2px;
text-transform: uppercase;
color: #fff;
}

.nav2 p {
margin-top: 0;
font-family: 'festivo_lcinline', impact,georgia,sans-sarif;
text-align: center;
font-size: 34px;
line-height: 15px;
letter-spacing: 2px;
padding-top: 20px;
padding-bottom: 30px;
text-transform: uppercase;
color: #fff;
background: rgba(255, 255, 255, 0.35);
}

.nav p1 {
position: relative;
color: #fff;
text-align: center;
top: -9px;
font-size: 10px;
text-align: center;
letter-spacing: 1px;
}

.nav p2 {
position: relative;
color: #fff;
text-align: center;
top: -17px;
font-weight: bold;
font-size: 15px;
text-align: center;
letter-spacing: -1px;  
}


.nav2 p1 {
position: relative;
color: #fff;
top: 8px;
display: block;
font-size: 10px;
padding-top: 0;
padding-bottom: 20px;
text-align: center;
letter-spacing: 1px;
}

.video-list {
list-style: none;
padding: 1px 20px;
margin-top: -10px;
text-align: center;
pointer-events: auto;
-webkit-transition-duration: 0.1s;
-moz-transition-duration: 0.1s;
-ms-transition-duration: 0.1s;
-o-transition-duration: 0.1s;
transition-duration: 0.1s;
}

.video-list li {
margin-bottom: 7px;
opacity: 1;
}

.video-list a {
font-size: 17px;
text-shadow: none;
}

.video-list .playlist-btn {
display: block;
margin-left: -20px;
padding-top: 12px;
width: 160px;
color: #fff;
letter-spacing: 2px;
border-top: 1px solid rgba(0, 0, 0, 0.35);
}

.video-list .playlist-btn:hover {
	text-shadow: 2px 2px 8px #fff, -2px -2px 8px #fff, 0px 0px 8px #fff;
}
.video-list .currenttop{
	text-shadow: 2px 2px 8px #fff, -2px -2px 8px #fff, 0px 0px 8px #fff;
}


.video-list .playlist-fox {
	display:block;
	width:100%;
}

.video-list2 {
list-style: none;
padding: 0 20px;
margin-top: -51px;
text-align: center;
pointer-events: auto;
-webkit-transition-duration: 0.1s;
-moz-transition-duration: 0.1s;
-ms-transition-duration: 0.1s;
-o-transition-duration: 0.1s;
transition-duration: 0.1s;
}

.video-list2 li {
margin-bottom: 1px;
opacity: 1;
width: 100%;
}

.video-list2 a {
	font-size:17px;
text-shadow:none;
}

.video-list2 .playlist-btn {
display: block;
margin-left: -20px;
padding-top: 12px;
padding-bottom: 12px;
width: 160px;
color: #fff;
background: rgba(255, 255, 255, 0.35);
letter-spacing: 2px;
}

.video-list2 .playlist-btn:hover {
	text-shadow: 2px 2px 8px #fff, -2px -2px 8px #fff, 0px 0px 8px #fff;
}

.video-list2 .current a {
text-shadow: 2px 2px 8px #fff, -2px -2px 8px #fff, 0px 0px 8px #fff;
}

.video-list2 .playlist-fox {
	display:block;
	width:100%;
}

.playlist { 
	padding:0; 
	margin:0 auto;
}

.playlist-btn { 
	
text-decoration: none;
font-style: normal;
text-transform: uppercase;
font-size: 14px;
margin: 0 auto;
padding: 5px 0;
-webkit-transition-duration: 0.6s;
-moz-transition-duration: 0.6s;
-ms-transition-duration: 0.6s;
-o-transition-duration: 0.6s;
transition-duration: 0.6s;
}

.playlist-fox { 
	background:#363636; 
	text-decoration:none; 
	font-weight:normal; 
	font-style:normal; 
	text-transform:uppercase; 
	font-size:10px; 
	padding:5px 10px; 
	margin-right:10px;
	border-radius:5px; 
}

/*  IPHONE STYLINGS--------------------------------------------------------
     ----------------------------------------------------------------*/


@media only screen 
and (min-width : 320px) 
and (max-width : 568px) {

.nav2 {
opacity: 1;
left:-125px;
top:0;
padding: 10px 0;
width: 120px;
height: 255px;
background: rgba(0, 0, 0, 0.75);
}

#close{
position:fixed;
width: 120px;
height: 215px;
left:-125px;
}


a.boxclose {
opacity: 0.4;
margin-top: -8px;
margin-right: -39px;
background-size: 37px 55px;
height: 55px;
}

a.boxclose2 {
opacity: 0.4;
margin-top: -8px;
margin-right: -39px;
background-size: 37px 55px;
height: 55px;
}

.video-list2 {
padding: 1px 10px;
}

.nav2 p{
background: none;
padding-top: 0;
}

.video-list2 .playlist-btn {
margin-left: 0;
width: 100px;
border-top: 1px solid #C2BABA;
background: none;
padding-top: 6px;
padding-bottom: 6px;
}

}

/* IPAD STYLINGS --------------------------------------------------------*/

@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) {

.nav2 {
opacity: 1;
left:-125px;
top:0;
padding: 10px 0;
width: 120px;
height: 255px;
background: rgba(0, 0, 0, 0.75);
}

#close {
position: fixed;
width: 130px;
height: 265px;
left: -130px;
}

.nav2 p{
background: none;
padding-top: 0;
}

a.boxclose {
opacity: 0.4;
margin-top: -8px;
margin-right: -39px;
}

a.boxclose2 {
opacity: 0.4;
margin-top: -8px;
margin-right: -39px;
}

.video-list2 {
padding: 1px 15px;
}

.video-list2 .playlist-btn {
margin-left: 0;
width: 100px;
border-top: 1px solid #C2BABA;
background: none;
}


}