/* The NAV elements are used for the left hand navigation area on all pages. It is probably best that you don't changes this file as all pages in the site will be affected*/

#navcontainer{
background: #000000;
width: 75px;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
text-align: center;
}

ul#navlist{
text-align: center;
vertical-align: middle;
list-style: none;
padding: 0px;
margin: 0px auto;
}

ul#navlist li{
display: block;
width: 100%;
margin-top: 5px;
margin-bottom: 5px;
}

ul#navlist li a{
display: block;
border: 1px solid #666666;
color: #EEEEEE;
font-weight: bold;
font-size: .70em;
text-decoration: none;
background: #333333;
width: 100%;
line-height: 57px;
}

ul#navlist li#active {
background: #EEEEEE;
font-weight: bold;
font-size: .70em;
color: #333333;
border: 1px solid #666666;
width: 100%;
line-height: 57px;
}

ul#navlist li a:hover, ul#navlist li#active a:hover{
color: #333333;
background: #96D0DC;
line-height: 57px;
}

ul#navlist li#empty {
width: 100%; 
background-color: #333333; 
border: 1px solid #666666;
line-height: 57px;
}

ul#navlist li#byline a{
display: block;
border: 1px solid #666666;
background: #333333;
width: 100%;
height: 57px;
text-decoration: none;
color: #999999;
font-size: .65em;
line-height: 1.3em;
font-weight: normal;
text-align: center;
vertical-align: middle;
}

ul#navlist li#byline a:hover, ul#navlist li#byline a:active{
color: #96D0DC;
}


/* The movieNav elements are only used on the movies page. This navigation shows thumbnails of the moIve and launches a new movie in an iFrame.*/
#movieNavContainer{
width: 200px;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: .70em;
text-align: center;
}
ul#movieNav {
text-align: center;
vertical-align: middle;
list-style: none;
padding: 0px;
margin: 0px auto;
}
ul#movieNav li{
display: block;
width: 100%;
text-decoration: none;
margin-top: 5px;
margin-bottom: 5px;
}
ul#movieNavActive li{
display: block;
width: 100%;
text-decoration: none;
background-color: #FFFFFF;
border: 1px solid #00A5D3;
color:#00A5D3;
margin-top: 5px;
margin-bottom: 5px;
}

ul#movieNav li a{
display: block;
border: 1px solid #7FD2F3;
color: #000000;
text-decoration: none;
width: 100%;
}
ul#movieNav li a:hover, ul#navlist li#active a:hover{
color: #00A5D3;
background: #FFFFFF;
border: 1px solid #00A5D3;
outline: none;
}