/* Horizontal Nav with Graphic main nav. CSS
-------------------------------------------------------- */

/* Connect nav */

div#connect {
	float: left;
	width: 230px;
	margin: 0;
	padding: 20px 0 0 0;
	height: 98px;
	}
	
div#connect ul {
	margin: 0px;
	height: 22px;
	padding: 0;
	text-align: left;
	}

div#connect ul li { 
	float: left;
	list-style: none;
	}

	div#connect ul li, 
	div#connect ul a { 
		height: 22px; 
		display: block;
		padding: 0;
		outline: none; 
		}

	div#connect ul li a { 
		text-indent: -9999px; 
		padding: 0;
		text-decoration: none;
		}

	div#connect ul li, 
	div#connect ul a {
		height: 22px; 
		padding: 0;
		display: block;
		}
		
#connectwithus {
	width: 159px; 
   display: block;
	background: transparent url(/images/connectwithus.png) bottom left no-repeat; 
   }
   
#facebook,
#facebook a:hover{
	width: 21px; margin-right: 5px;
   display: block;
	background: transparent url(/images/facebook.png) bottom left no-repeat; 
   }
   
#twitter,
#twitter a:hover{
	width: 21px; 
   display: block;
	background: transparent url(/images/twitter.png) bottom left no-repeat; 
   }

/* Primary Navigation */

div#nav {
	float: left;
   background: #fff url(/images/nav/nav-bg.gif) top left repeat-x;
   width: 500px;
   height: 98px; 
   margin: 0;
   padding: 0;
   }

div#nav ul#menu {
   margin: 0px;
   height: 98px;
   padding: 0 12px 0 11px;
   text-align: left;
   }

   div#nav ul#menu li { 
      float: left;
      list-style: none;
      }

      div#nav ul#menu li, 
      ul#menu a { 
         height: 98px; 
         display: block;
         padding: 0;
         outline: none; 
         }

      div#nav ul#menu li a { 
         text-indent: -9999px; 
         padding: 0;
         text-decoration: none;
         }

      div#nav ul#menu li, 
      ul#menu a {
         height: 98px; 
         padding: 0;
         display: block;
         }



#synopsismenu {
   width: 114px; margin-right: 7px;
   display: block;
	background: transparent url(/images/nav/synopsis.gif) bottom left no-repeat; 
   }

   #synopsismenu a:hover { 
		background: transparent url(/images/nav/synopsis.gif) center left no-repeat; 
      }

         body.synopsis #synopsismenu a {
			background: transparent url(/images/nav/synopsis.gif) top left no-repeat; 
         }
         

#gallerymenu {
   width: 115px; 
   margin-right: 7px;
   display: block;
	background: url(/images/nav/gallery.gif) bottom left no-repeat; 
   }

   #gallerymenu a:hover { 
      background: url(/images/nav/gallery.gif) center left no-repeat; 
      }

         body.gallery #gallerymenu a {
         background: url(/images/nav/gallery.gif) top left no-repeat; 
         }
         
         
#aboutthefilmmenu {
   width: 114px;
   margin-right: 5px;
   display: block;
	background: url(/images/nav/aboutthefilm.gif) bottom left no-repeat; 
   }

   #aboutthefilmmenu a:hover { 
      background: url(/images/nav/aboutthefilm.gif) center left no-repeat; 
      }

         body.aboutthefilm #aboutthefilmmenu a {
         background: url(/images/nav/aboutthefilm.gif) top left no-repeat; 
         }
         
#trailermenu {
   width: 114px;
   margin-right: 0px;
   display: block;
	background: url(/images/nav/trailer.gif) bottom left no-repeat; 
   }

   #trailermenu a:hover { 
      background: url(/images/nav/trailer.gif) center left no-repeat; 
      }

         body.trailer #trailermenu a {
         background: url(/images/nav/trailer.gif) top left no-repeat; 
         }