/* COLORS:
 *  White:     #fff;
 *  DarkGrey:  #393435;
 *  Orange:    #CFB000;
 #  Red:       #7D0303;
 #  LightGrey: #A1A1A1;
 #  DarkGrey2: #272727;
 #  LightBlue: #23CDF7;
 */




/*=================================================================*/
/* General Styles                                                  */
/*=================================================================*/
body {
   -moz-background-clip: border;
   -moz-background-inline-policy: continuous;
   -moz-background-origin: padding;


   /* Base Text */
   color: #A1A1A1;
   /* font-family: Arial, Helvetica,sans-serif; */
   font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
   font-size: 10px;

}

html, body {
   /* background: #393435 url(/images/body_bg.jpg) repeat-y scroll 0 -30px;
      */
    /* background: #393435 url(/content/NewMoon_background.jpg) no-repeat; */
     background: #393435 url(/content/bg_tile_650.png) repeat-x;

    margin: 0;
    padding: 0;
}

body {
    background: url(/content/background_genericv2.jpg) no-repeat; 
}

a {
    color: #fff;    
}

a:hover {
    color #CFB000;
}

h1, h2, h3 {
    margin: .8em 0 .2em 0;
    padding: 0;
    text-transform: uppercase;
}

#header-ctr {
    clear: both;
    float: left;
    /* background: #393435 url(/images/content_bg.gif) no-repeat 0 0;    */

    width: 100%;
    height: 38px; /* For Opera */
    padding-top: 93px;
}

#header {
/*     background: #000; */
}

#content {
    background: #000; 
    width: 100%;
    min-height: 424px;
}

#filmography_flow {
    width: 80%;
    background: #000;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

#copyright-ctr {
/*    background: #393435 url(/images/body_bg.jpg) repeat-y scroll 0 60px; */
    /*position: absolute;
    bottom: 0; */
    height:60px;
    width: 100%;
}

#copyright {
    /* center block */
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    width: 30%;
}

#shadow {
    background: transparent url(/images/shadow.png) repeat-x 0 0; 
    height:35px; 
    /* float:left; */
    width:100%;
    z-index: 2;
}

/* Hero Background Image */
#hero_bg {
    position: relative;
    top: -130px;
    align: right;
    background: transparent;
    float: right;
    z-index:0; 
}

/* Top Navigation Bar */
#logo {
    position: absolute;
    float: left;
    margin-top: -5px;
    margin-left: 15px;
    z-index: 2; 
}

#top_menu {
    position: relative;
    padding: 25px 0 0 130px;
    z-index: 2;
}

#top_menu li {
    display: inline;
    padding: 0 36px 0 0;
}

.navmenu {
    color: #FFF;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
}

.navmenu a {
    color: #FFF;
    text-decoration: none;
}

.navmenu a:hover {
    color: #CFB000;
}

.navmenu img {
    z-index: 2;
}

/* Main Content Area */
#content-ctr-frontpage {
/*    position: relative;    */
    height: 434px;
}


#content-ctr {
/*    position: relative;    */
    height: 580px;
}

#content-area {
/*    position: relative; */
    background: #000;
    min-height: 434px;
}

/* Footer Area */
#footer {
    position: relative; 
    clear: both;
}

/*bottom content div*/
/* Taken from old page -- TODOL: cleanup */
#bottom_content_bgfix { 
    
    /* FIXME: not sure why this is getting pushed down.. should be directly beneath shadow. */
    position:relative; 
    top: -130px; 
}

#bottom_content { 
    
    width:100%; float:left; 

    display:inline; 
    height:220px;
}

#bottom_content ul{
    float:left; 
    list-style:none; 
    background:url(/images/bottom_border.gif) no-repeat 0 0;  
    height:76px; 
    margin:0 0 0 40px; 
    display:inline; 
    padding:5px 21px 0 21px; 
    width: 88%; 
}

/* FIXME: Gets squashed on narrow resize */
#bottom_content ul li{float:left; padding:0 25px 0 0; width:15%;}
#bottom_content ul li a.more{float:right;font-size:10px;text-decoration:none;}
#bottom_content ul li a{text-decoration:none; color:#5b5b5b;}
#bottom_content ul li a:hover{color:#b3850a; text-decoration:none;}
#bottom_content ul li.separator{float:left; padding:12px 25px 0 0; width:5px;}

/* #bottom_content ul li.last{width:290px;} */
#bottom_content ul li.last{width:30%;} 

#bottom_content ul li h5{ font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; float:left; width:100%;cursor:pointer}
#bottom_content ul li h6{ font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#5b5b5b; float:left; width:100%;}
#bottom_content ul li h6 a{ font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#5b5b5b; float:left;cursor:pointer;}
#bottom_content ul li span{font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; color:#fff; float:left; padding:0 0 3px 0;}

/* #bottom_content ul li p{font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color:#999; float:left; 
line-height:14px; width:300px; height:42px;overflow:hidden}
*/

#bottom_content ul li span a{font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; color:#fff; padding:0 0 3px 0; text-decoration:none;}
#bottom_content ul li .white_links {list-style:none; float: none; width: 100%; background:none; padding:0px; margin:0px; width:150px;}
#bottom_content ul li .white_links li {padding: 0 10px0 0; float: none; width: auto; }
#bottom_content ul li .white_links li a { 
    font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; 
    color:#9e9e9e; text-decoration:none; margin:0 50px 0 0; 
    float:none; display:block; 
    line-height:14px;
    width: 100%;
}
#bottom_content ul li .white_links li a:hover{color:#c44915;}
.right_border{ background:url(/images/right_border.gif) no-repeat 0 0; float:left; width:6px; height:76px;}

#reel_links {
    overflow: hidden;
}

.demoreel-bg {
    width: 100%;
    background: #000;
    clear: both;
}
.demoreel {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.demoreel-ctr img {
    margin-left: 50px;
}

.demoreel-ctr h1 {
    font-family:Arial, Helvetica, sans-serif; 
    font-weight:bold; 
    font-size: 40px; color:#fff; 
    margin-right: 30%;

    text-transform: uppercase;
    color: #CFB000;
    float: right;
}

.article_text h1, .article_text h2, .article_text h3, .article_text h4, .article_text h5, .article_text h6  { 
    font-family:Arial, Helvetica, sans-serif; 
    color: #CFB000;
}

.article_text h1 {font-size:24px; font-weight:bold; }
.article_text h2 {font-size:18px; font-weight:bold; }
.article_text h3 {font-size:14px; font-weight:bold; }
.article_text h4 {font-size:12px; font-weight:bold; }
.article_text h5 {font-size:12px; }
.article_text h6 {font-size:10px; }

.article_text table
{
	font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
	font-size: 12px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
	border-collapse: collapse;
	text-align: left;
}
.article_text th
{
	font-size: 14px;
	font-weight: normal;
	color: #CFB800;
	padding: 10px 8px;
	border-bottom: 2px solid #7D0303;
}
.article_text td
{
	border-bottom: 1px solid #272727;
/*	color: #669; */
	padding: 6px 8px;
}
.article_text tbody tr:hover td
{
	color: #fff;
}

.article_text img {
    width: 90%;
    padding: 5px;
}

.article_text blockquote {
    margin: 15px;
    padding: 5px;
    background: #000;
    border-top: solid 1px #272727;
    border-bottom: solid 1px #272727;
}

.article_text li ul, .article_text li ol {
	margin:0 1.5em;
}
.article_text ul, .article_text ol {
	margin:0 1.5em 1.5em 1.5em;
}
.article_text ul, .article_text ul li {
	list-style-type:disc;
}
.article_text ol, .article_text ol li {
	list-style-type:decimal;
}


/* Posters -- VFX and Recent page */
.poster li {
    display: inline;
    
}

/* social networking link ctr */
.social  {
    float:right;
}

.social img {
   padding: 4px;
}

/* Styles for a 3-Column page with fixed width sidebars */

	.three-col {        
        padding: 26px 0 0 0;
        min-width: 1000px;
	}
    .three-col .colmid {
        float:left;
        width:200%;
        margin-left:-550px; 	/* Width of right column */
        position:relative;
        right:100%;
    }
    .three-col .colleft {
        float:left;
        width:100%;
        margin-left:-50%;
        position:relative;
        left:850px;         	/* Left column width + right column width */
    }
    .three-col .col1wrap {
        float:left;
	    width:50%;
	    position:relative;
	    right:300px;        	/* Width of left column */
	    padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
	}
	.three-col .col1 {
        margin: 0 565px 0 315px;     	/* Centre column side padding:
                            	Left padding = left column width + centre column left padding width
                            	Right padding = right column width + centre column right padding width */
        position:relative;
	    left:200%;
	    overflow:hidden;
	}
    .three-col .col2 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:270px;        	/* Width of left column content (left column width minus left and right padding) */
        position:relative;
        right:15px;         	/* Width of the left-had side padding on the left column */
    }
    .three-col .col3 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:520px;        	/* Width of right column content (right column width minus left and right padding) */
        margin-right:45px;  	/* Width of right column right-hand padding + left column left and right padding */
        position:relative;
        left:50%;
    }






/* Article/Show Detail Page */

#show_sidebar {
    text-align: right;

    color: #CFB000;
    font-family: "Trebuchet MS", "Helvetica", "sans-serif";
    font-size: 11px;
    text-decoration: none;
    text-transform: uppercase;
}

#show_sidebar img {
    clear: right;
    max-width: 290px;
    float: right;

}

#show_sidebar h1 {    
    clear: right;
    font-weight: bold;
    font-size: 24px;
}

#show_sidebar h3 {
    clear: right;
    font-size: 11px;
}

#show_sidebar h2 {
    clear: right;
    font-size: 10px;
}

#show_sidebar a {    
    color: #CFB000;
}

#show_sidebar a:hover {
    color: #fff;
}

#show_sidebar .attribution {
    text-transform: none;
    font-style: italic;
    color: #5b5b5b;
}

#show_sidebar .attribution a {
    color: #777;
    font-weight: bold;
}

#show_sidebar .attribution a:hover {
    color: #fff;
}

#show_vfx_article {
    padding-left: 12px; 
    border-left: 1px solid #7D0303;
    height: 250px;
    overflow: auto;
}

#show_vfx_article p {

    padding: 0 0 13px;
}

#show_article {
    padding-left: 12px; 
    border-left: 1px solid #7D0303;
    height: 400px;
    overflow: auto;
}

.article_text p {
    font-size: 12px;
    padding: 0 0 13px;
}

#show_production {
    height: 150px;
    overflow: auto;
}

#show_production p {
    
    color: #777777;
    font-family: Arial,Helvetica,sans-serif;
    text-align: justify;
    font-size: 10px;
    padding: 10px;
}

/* Article list -- Happenings page */

.article_ctr {
    margin: 10px 120px;
    
    height: 403px;
    min-width: 880px;
}

.article_ctr .feature-col {
   width: 48%;
   height: 100%;
   float:left;
   border-bottom: 1px solid #272727;
   border-top: 1px solid #272727;
   margin: 10px;
}

.article_ctr .studio-col {
   width: 31%;
   height: 100%;
   float:left;
   border-bottom: 1px solid #272727;
   border-top: 1px solid #272727;
   margin: 10px;
}

.article_ctr .column {
   width: 23%;
   height: 100%;
   float: left;
   margin: 1px;
   
   border-bottom: 1px solid #272727;
   border-top: 1px solid #272727;
}

.article_ctr .gallery_col {
   width: 23%;
   height: 100%;
   float: left;
   margin: 1%;
   overflow: hidden;
   margin: 0 30px 0px 20px;
}

.article_ctr .gallery_col .text {
    overflow: auto;
    height: 28%;    
}

.article_ctr .gallery_col img {
    margin: 10px 0 0 0;
    width: 100%;
    max-width: 215px;
}

.article_ctr .gallery_col h1 {
    color: #CFB000;
    text-align: right;
    margin: 0 0 10px 0;
}

.article_ctr .gallery_col h2 {
    float: none;
}

.article_ctr .gallery {
    float: left;
    width: 70%;
    height: 100%;
    border-left: 1px solid #a00;
    overflow: auto;
}

.article_ctr .gallery_icons {
    margin-left: auto;
    margin-right: auto;
    width:500px;
}



.article_ctr .gallery img {
    margin: 8px;
    border: solid 1px #272727;
}

.article_ctr .galleryimg {

    border-bottom: solid 1px #a00;
    width: 100%;
    height: 320px;
}

.article_ctr .gallerydetails {
   padding: 10px;
}

.article_ctr .gallerydetails h2 {
    width: 100%;
}

.article_ctr .gallerydetails .shortcolumn {
    float: left;
    width: 30%; 
    height: 70px;
    overflow: auto;
}

.article_ctr .gallerydetails .shortcolumn_right {
    float: left;
    width: 30%; 
    height: 70px;
    overflow: hidden;
    text-align: right;
    text-decoration:none;
}

.article_ctr .gallerydetails .shortcolumn_right {
   text-decoration:none;
}

.article_ctr .gallerydetails .shortcolumn_right a {
    text-decoration:none;
    text-transform: uppercase;
}

.article_ctr .gallerydetails .shortcolumn_right a:hover {
    color: #cfb800;
}


#navbutton-ctr
{
    text-align:right;
    font-size: 9px;
}

.navbuttons a:link {
    color: #23CDF7;
    text-transform: uppercase;
}

.navbuttons a:hover {
    color: #fff;
}

.navbuttons {
    width: 100%;
    margin: 0 0 20px 0;
    
}



.article_ctr .galleryimg img {
    margin-left: auto;
    margin-right: auto;
    display: block;
}


#rightcol {
    height: 400px;
    overflow: auto;
}


.article_ctr .feature-item {
    position: relative;
    width: 100%;
    height: 66%;
    border-bottom: 1px solid #272727;
    overflow: hidden;
}

.article_ctr .feature-item .last {
    border-bottom: none;;
}

.article_ctr .studio-item {
    position: relative;
    width: 100%;
    height: 25%;
    border-bottom: 1px solid #272727;
    overflow: hidden;
}

.article_ctr .studio-item .last {
    border-bottom: none;
}

.article_ctr .feature2-item {
    position: relative;
    width: 100%;
    height: 34%;
    overflow: hidden;
}

.article_ctr .middle-item {
    position: relative;
    width: 100%;
    height: 33%;
    border-bottom: 1px solid #272727;
    overflow: hidden;
}

.article_ctr .middle-item .last {
    border-bottom: none;
}

.article_ctr .middle-item-last {
    position: relative;
    width: 100%;
    height: 33%;
    border-bottom: 0px;
    overflow: hidden;
}

.article_ctr .right-item {
    position: relative;
    border-bottom: 1px solid #272727;
    width: 100%;
    height: 16.4%;
    overflow: hidden;
}

.article_ctr .last {
    position: relative;
    border-bottom: 0px;
}

.article_ctr h2 {
    color: #CFB000;
    font-family: "Trebuchet MS", "Helvetica", "sans-serif";
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
}

.news-headline {
    float: left;
    width: 74%;
}

.studio-item .icon {
    float: left;
    display: inline;
}

.studio-item .summary {
    float: left;
    width: 100%;
}

.studio-item h2 
{
/*    width: 100%; */
    font-size: 14px;
}

.middle-item h2 {
    width: 100%;
}

.article_ctr h1 {
    color: #fff;
    font-family: "Trebuchet MS", "Helvetica", "sans-serif";
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    margin-left: 10px;
    width: 100%;    
}

.article_ctr h3 {
    color: #fff;
    font-family: "Trebuchet MS", "Helvetica", "sans-serif";
    font-size: 9px;
    text-decoration: none;
    text-transform: uppercase;
    float: right;
}

.middle-item h3 {
    float:none;
}

.right-item h3 {
    float:none;
    padding: 0px;
    margin: 0px;
}

.right-item h2 {
    width: 100%;
    float:none;
    padding: 0px;
    font-size: 12px;
}


.article_ctr p {
    font-size: 13px;
    padding: 5px 5px 1em;
}

.middle-item p {
    font-size: 13px;
}

.right-item p {
    font-size: 10px;
    padding: 0 10px 0 0;
}

.article_ctr .morelink {
    color: #23CDF7;
    position: absolute;
    
    bottom: 2px;
    right: 15px;

    font-family: "Trebuchet MS", "Helvetica", "sans-serif";
    font-size: 20px;
    text-decoration: none;
}

.article_feature_img {
    width:100%;
}

.studio_feature_img {
    width:100%;
    padding: 10px;
}

.studio_thumbnail {
    padding: 5px;
    float: left;
}

.article_feature2_img {
    clear: both;
    float: left;
    margin: 0 10px 0 0;
}

.article_summary {
    clear: both;
}


/* Playlists */

.playlist {
    width: 440px;
}

.playlist-frame {
    width: 428px;
    padding: 5px;
}

.playlist-viewer {
    border: solid 1px #272727;
    width: 428px;
    height: 260px;
}

.playlist-items-scroll {
    width: 430px;
    overflow:auto;
    overflow: hidden;
}

.playlist-items {
    width: 800px;
    margin-top: 10px;
}

.playlist-caption {
    color: #fff;
    width: 100%;
    height: 25px;
    overflow: hidden;
}

.playlist-attribution {
    float: right;
    color: #fff;
    background: #444;
    font-size: 15px;
    font-style: italic;
    padding: 0px 10px;
}

.playlist-items {
    padding: 5px;
    height: 78px;
}

.playlist-items a {
    border: solid 1px #272727;
}

.playlist-items a:hover {
    border: solid 1px #cfb800;
}

.playlist-icon {
    width: 75px;
    height: 75px;
    float: left;
    margin: 0px 4px;
}


/*
.gallery_link {
    border-bottom: solid 1px #272727;
    border-top: solid 1px #272727;
    width: 30%;
    padding: 6px 3px;
    margin: 1%;
    float: left;
}

.gallery_link :hover {
    border-bottom: solid 1px #a00;
    border-top: solid 1px #a00;
}

.gallery_link img {
    float: left;
    margin: 0 10px 0 0;
}

.gallery_link h3 {
    color: #A1A1A1;
    width: auto;
    float: none;
    font-weight: bold;
    font-size: 12px;
    margin: 0;
}
*/

/* design gallery div*/
/*#design_gallery{
    height: 400px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    display: block;
/*
    float:left; 
    background:#0c0b0c 
    url(images/design_bg.jpg) no-repeat 0 0; 
    width:1024px; margin:110px 0 0 0; display:inline; padding-bottom:30px;
*/
/*}*/

#design_gallery h1{font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:15px; color:#fff; float:left; margin:25px 0 0 23px; display:inline; text-transform:uppercase; width:800px;}
#design_gallery .design_list{ height: 403px; width:900px; margin: auto; display:inline; text-align:center; }
#design_gallery .design_list .list {float:left; width:275px; margin:0 15px 0 0 !important; margin:0 10px 0 0; display:inline;}
#design_gallery .design_list .list a{float:left; width:275px;  border-bottom:1px solid #272727; border-top:1px solid #272727; padding:6px 3px 6px 3px; display:inline; text-decoration:none;}
#design_gallery .design_list .list a:hover {border-bottom:1px solid #810505; border-top:1px solid #810505; float:left; text-decoration:none;}
#design_gallery .design_list .list img{float:left; width:275px; border: solid 1px #272727;}
#design_gallery .design_list .list h3 {font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#9b9a9a; margin:0 0 0 7px; display:inline;}
#design_gallery .design_list .list h3 {font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#9b9a9a; text-decoration:none;}
#design_gallery .design_list .list a:hover h3 {font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#cfb000;}
#design_gallery .design_list .list a  p{font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#5b5b5b; width:180px; float:left;margin:0 0 0 7px; display:inline; text-decoration:none;}
#design_gallery .design_list .list a p {color:#5b5b5b; text-decoration:none; }
#design_gallery .gallery_desc { font-size:8px; font-family: Futura, Helvetica, sans-serif; color: #eee; text-align: right; }


/*
#show_media {
    height: 434px;
    overflow: auto;
} 
*/