/* Styles
================================================== */
    #home 
    {
        background: url('../img/TheHobbit_home.jpg') center no-repeat;
        height: 400px;
    }
    #home h1,h2,h3,h4 { text-indent: -5000px; }
    
    #synopsis
    {
        padding-bottom: 0px;
        margin-bottom: 0px
    }
    #synopsis header
    {
        height:138px;
    }
	
	#map_p { margin-left: 98px;	
    margin-top: 348px;
	 width: 125px;
	 cursor:pointer;
	 }
	 
	 
	 #map_p_header { margin-left: 98px;	
    margin-top: 80px;
	 width: 125px;
	 cursor:pointer;
	 position: absolute;}
   
    #synopsis .synopsis_bg
    {
        background:url( "../img/synopsis_bg.jpg" ) top center no-repeat;
        margin-top: 0px;
        padding: 0 4px;
    }
    
   .trailer_bg {
    background: url("../img/synopsis_bg.jpg") no-repeat scroll center top #000000;
    margin: 10px 0 0 52px;
    padding: 0;
    text-align: center;
}
	
	#synopsis .downloads_bg
    {
        background: #020303 url( "../img/synopsis_bg.jpg" ) top center no-repeat;
        margin: 40px 0 0 0;
        padding: 15px 0px 0px 22px;
		
    }
		
    #synopsis p
    {
        font-size: 13px;
        line-height: 17px;
        padding: 0 5px 0 5px;
    }
	
    
    #photos { padding: 0; }
    #photos .close { border-bottom: 1px solid #595959; height: 20px; }
    #photos .close a, #photos .close a:link 
    { 
        width: 63px;
        height: 18px;
        margin-top: 1px;
        background: url("../img/close.jpg") top left no-repeat;
        display: block;
        text-indent: -5000px;
        float: right;
    }
    #photos .main-view { width: 320px; height: 215px; position: relative; }
	
	
	#sys_img{ text-align:center;width:320px; height:122px; margin-bottom:3px;}
	
    #vertical{	width:320px; border:red solid 0px; margin:0px auto;	}
	
	#nav_img{ padding:10px;width:30px;float:left; }
	
	#share_img{ padding:5px;float:right;  z-index:100; }
	
	#nav_button { margin:0px auto;border-bottom:1px solid #333333; position:fixed;background-color:#000000; z-index:100;}
	    
    
     
     .fb-like { float: left; width: 100px; margin-left:5px; overflow: hidden; }
     
     .share 
    { 
        
        float: left; 
        width: -1px;
       
   
    display:none;
    
    display:none;z-index:100; position:absolute;
    }
    .share ul,ul li { margin: 0; float: left; }
    .share ul.share-boxes li { float: none; margin-left: 1px; text-align:right;}
    .share ul.share-boxes li a,.share ul.share-boxes li a:link 
    {
        display: block;
        width: 23px;
        height: 23px;
        text-indent: -5000px;
    }
    #share ul li a.facebook { background: url('../img/facebook_share.png') top left no-repeat; }
    #share ul li a.twitter { background: url('../img/twitter.png') top left no-repeat; }
    
    
    
    #navigation { border-top: 1px solid #333333;display:none;z-index:100; position:absolute; }
    #navigation ul { margin: 0; }
    #navigation ul li
    {
        border-bottom: 1px solid #333333;
        margin: 0;
		background-color:#000000;
    }
    #navigation ul li a, #navigation ul li a:link 
    {
        display: block;
        width: 320px;
        height: 27px;
        text-indent: -5000px;
    }
   
   #share
   { margin-top:1px;display::none;z-index:100; position:absolute; background-color:#000000 ; right:0px; height:90px;padding:5px;}
    
#share ul li
{
  
        margin: 0;
		background-color: #000000; 
		width:80px;  
    
 }
#share ul li a,#share ul li a:link
{
    
    display: block;
              
     text-indent: -5000px;
    }
    
    .findus 
    { 
  
        float: left; 
        width: -1px;
     margin: -34px 5px 0 140px;
    padding-left: 62px;
    }
	
 .findus-boxes li { float: left; margin-left: 3px; }
    .findus-boxes li a,#footer ul.findus-boxes li a:link 
    {
        display: block;
        width: 23px;
        height: 23px;
        text-indent: -5000px;
    }
	
	
.facebook_findus { background: url('../img/facebook.jpg') top left no-repeat; }
.twitter_findus { background: url('../img/twitter.jpg') top left no-repeat; }
.gplus_findus { background: url('../img/google_plus.jpg') top left no-repeat; }
	
    
    
    
	 #navigation ul li a.trailer_apple {  background: url('../img/trailer_apple.jpg') center no-repeat; height:40px; }
	 #navigation ul li a.home { background: url('../img/home.jpg') center no-repeat; }
     #navigation ul li a.trailer { background: url('../img/trailer.jpg') center no-repeat; }
     #navigation ul li a.synopsis { background: url('../img/synopsis.jpg') center no-repeat; }
     #navigation ul li a.gallery { background: url('../img/gallery.jpg') center no-repeat; }
      
      
    
    #footer { padding: 5px 0 0 0; margin-bottom:4px; border-top:1px solid #333333; }
    #footer .fb-like { float: left; width: 100px; margin-left:5px; overflow: hidden; }
   #footer .share {
    background: url("../img/share.jpg") no-repeat scroll left bottom transparent;
    float: left;
    margin-left: 118px;
    margin-right: 5px;
    padding-left: 44px;
}
    #footer ul, #footer ul li { margin: 0; float: left; }
    #footer ul.share-boxes li { float: left; margin-left: 1px; }
    #footer ul.share-boxes li a,#footer ul.share-boxes li a:link 
    {
        display: block;
        width: 23px;
        height: 23px;
        text-indent: -5000px;
    }
    #footer ul li a.facebook { background: url('../img/facebook.png') top left no-repeat; }
    #footer ul li a.twitter { background: url('../img/twitter.png') top left no-repeat; }
    
	
	#footer .findus 
    { 
        background: url("../img/finduson.jpg") bottom left no-repeat;
        float: left; 
        width: -1px;
     margin: 2px 5px 0 92px;
    padding-left: 70px;
    }
	#footer ul, #footer ul li { margin: 0; float: left; }
    #footer ul.findus-boxes li { float: left; margin-left: 1px; }
    #footer ul.findus-boxes li a,#footer ul.findus-boxes li a:link 
    {
        display: block;
        width: 23px;
        height: 23px;
        text-indent: -5000px;
    }
	
	
	#footer ul li a.facebook_findus { background: url('../img/facebook.png') top left no-repeat; }
    #footer ul li a.twitter_findus { background: url('../img/twitter.png') top left no-repeat; }
	
	
	
	
    #footer p.copyright 
    { 
        font-size: 9px; 
        text-align: center; 
        color: #595959; 
        text-transform: uppercase;
        font-weight: bold;
        letter-spacing: 1px;
        margin: 0;
        padding: 0;
		line-height:13px;
    }
    #footer ul.legal li { /*float: left; width: 96px;*/ text-transform: uppercase; font-size: 10px; font-weight: bold; }
	
	#footer ul.legal li.credit { text-align: center; padding-right: 0px; border:#0000FF solid 0px; width:100px !important;}
    #footer ul.legal li.privacy { text-align: center; padding-right: 0px; border:#0000FF solid 0px; width:100px !important;}
    #footer ul.legal li.terms { text-align: center; padding-left: 5px; border:#0000FF solid 0px; width:100px !important;}
	
	.creditpopup{
		border:#FFF solid 1px;
		width:auto;
		height:96px;
		z-index:1000;
		top:-82px;
		/*margin-left:0px;*/
		position:absolute;
		margin:0 auto;
		
	}
	@media only screen and (orientation:landscape) {
		
		.creditpopup{
		
		margin:0px 50px 0px 0px;
		
	}
		
	}
/* Misc
===================================================*/
    .table { display: table; margin: 0 auto; }

/* #Media Queries
================================================== */
	/* Mobile/Browser */
	@media only screen and (max-width: 767px) {
	    #synopsis header h1 a, #synopsis header h1 a:link { width: 320px; }
        #photos .main-view { width:320px;}
        #navigation ul li a, #navigation ul li a:link { width: 320px; }
	   
        #footer .fb-like { float: left; width: 100px; }
        #footer ul.legal li { float: left; width: 150px; }
	}
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) 
	{
	  #home 	
    {
        background: url('../img/TheHobbit_landscape.jpg') center no-repeat;
        height: 333px;
    }
	
	#map_p { cursor: pointer;
    margin-left: 178px;
    margin-top: 281px;
    width: 125px;}
	
	 #map_p_header { margin-left: 178px;	
    margin-top: 80px;
	 width: 125px;
	 cursor:pointer;
	 position: absolute;}
	
	
	 #vertical{
	width:480px; border:red solid 0px; margin:0px auto;
	
	}
	
	 .findus 
    {  
        float: left; 
        width: -1px;
     margin: -34px 5px 0 300px ;
    padding-left: 62px;
    }
	
	#sys_img{
	text-align:center;
	width:480px;}
    
       
   /* #photos_header header h1 a, #photos_header header h1 a:link {
    background: url("../img/Godzilla_synopsis_header_landscape.jpg") no-repeat scroll center center transparent !important;
    border-bottom: 1px solid #595959;
    display: block;
    height: 150px;
    margin-bottom: 2px;
    text-indent: -5000px;
    width: 480px;
}*/
    .creditpopup{
		
		margin:0px 50px 0px 80px;
    }
    
	   #home { background-position: center; }
	   #synopsis header h1 a, #synopsis header h1 a:link { width: 480px; }
	   #photos .main-view { width:320x; margin:0 auto; }
	   #navigation ul li a, #navigation ul li a:link { width: 480px; }
	   #footer .fb-like { float: left; width: 260px; }
	   #footer ul.legal li { float: left; width: 230px; }

	 .trailer_bg {
    background: url("../img/synopsis_bg.jpg") no-repeat scroll center top #000000;
    padding: 0 0 0 77px !important;
}
	   
	   #synopsis .downloads_bg
    {
        background: #020303 url( "../img/synopsis_bg.jpg" ) top center no-repeat;
        margin: 40px 0 0 0;
        padding: 15px 0px 0px 99px;
    }
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/