html * {
    margin: 0;
    padding: 0;
}
html {
    overflow-y: scroll;
}

body {
    background: #000 url(../images/home-bg.jpg) 50% -260px no-repeat;
    margin: 0 0 40px 0;
}

body#home {
    background-position: 50% -90px;
}


/*-- Global ---------- */

body, textarea {
    font: 11pt/14pt Helvetica, Arial, Verdana, Tahoma, sans-serif;
    color: #fff;
}

a {
    color: #fff;
    font-weight: normal;
    outline: none;
}
a:hover {
    color: #7ACCF5;
}

img, fieldset { border: 0; }

select option { padding: 0 10px 0 0; }

h1 { font-size: 36px; line-height: 36px; padding-top: 18px; padding-bottom: 18px; }
h2 { font-size: 28px; line-height: 36px; padding-top: 9px; padding-bottom: 9px; }
h3 { font-size: 18px; line-height: 18px; padding-bottom: 9px; }
h4 { font-size: 14px; line-height: 18px; padding-top: 9px; padding-bottom: 9px; }
h5 { font-size: 12px; line-height: 18px; padding-top: 9px; padding-bottom: 9px; }
h6 { font-size: 10px; line-height: 18px; padding-top: 9px; padding-bottom: 9px; }
h2, h3 { text-transform: uppercase; }

p { padding: 0 0 18px 0; }


blockquote {
    padding: 18px;
    background: #eee;
    margin: 0px 36px 18px 18px;
}

ul, ol {
    margin: 0px 36px 18px 18px;
}

ul li,
ol li {
    margin: 9px 0 9px 0;
}


/*-- Clearing Styles & Container --*/
.block {
    width: 750px;
    margin: 0 auto;
    display: block;
}

.clearfix { display: inline-block; }

.block:after,
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}


.column {
    float: left;
    width: 240px;
}

#container { position: relative; }

/*-- Logo --*/
.logo {
    padding: 0 0 0 28px;
}

.logo a {
    display: block;
    text-decoration: none;
    text-indent: -999em;
    background: url(../images/home-logo.png) 0% 100% no-repeat;
    width: 513px;
    height: 150px;
}

#home .logo { padding: 157px 0 0 28px; }
#home .logo a { width: 513px; height: 203px;  }
#home .logo a#welcome {
    background: url(../images/home-welcome.png) 0% 100% no-repeat;
    width: 149px;
    height: 40px;
}

#home-news ul, #home-news ul li {
    margin: 0;
    list-style: none;
    font-size: 11px;
}

#home-news ul li span.date { margin: 0 4px 0 0; }
#home-news ul li h4, #home-news ul li h4 a { font-size: 11px; padding: 0; display: inline; }



/*-- Main --*/
#main {
    position: relative;
    width: 560px;
}

#home-content, #home-news, .sub-content { padding: 0 19px 0 28px; }

h2.persontitle { font-size: 46px; }
h2.persontitle a { text-decoration: none; }
h2.persontitle span.title { font-size: 41px; margin: 0 0 0 4px; }

.persontitle.albert_kodagolian { display: block; text-indent: -999em; padding: 0; height: 27px;}
.persontitle.albert_kodagolian.name { background: url(../images/albert_kodagolian.png) no-repeat scroll 0px 0px; width: 322px; }
.persontitle.albert_kodagolian.title { background: url(../images/albert_kodagolian.png) no-repeat scroll 0px -25px; width: 108px; }

.persontitle.john_hardwick { display: block; text-indent: -999em; padding: 0; height: 27px;}
.persontitle.john_hardwick.name { background: url(../images/john_hardwick.png) no-repeat scroll 0px 0px; width: 322px; }
.persontitle.john_hardwick.title { background: url(../images/john_hardwick.png) no-repeat scroll 0px -25px; width: 108px; }

.persontitle.ian_kammer { display: block; text-indent: -999em; padding: 0; height: 27px;}
.persontitle.ian_kammer.name { background: url(../images/ian_kammer.png) no-repeat scroll 0px 0px; width: 322px; }
.persontitle.ian_kammer.title { background: url(../images/ian_kammer.png) no-repeat scroll 0px -25px; width: 108px; }


.persontitle.pete_figel { display: block; background: url(../images/pete_figel.png); height: 12px; text-indent: -999em; }
.persontitle.pete_figel.name { width: 170px; background-position: 0 0px; }
.persontitle.pete_figel.title { width: 155px; background-position: 0 -28px; }
.persontitle.pete_figel.phone { width: 116px; background-position: 0 -57px; }
.persontitle.pete_figel.email { width: 197px; background-position: 0 -85px; }

.persontitle.nicholas_reynolds { display: block; text-indent: -999em; padding: 0; height: 27px;}
.persontitle.nicholas_reynolds.name { background: url(../images/nicholas_reynolds.png) no-repeat scroll 0px 0px; width: 311px; }

ul.tabs {
    list-style: none;
    margin: 0px 0px 40px 0px;
}
ul.tabs li {
    display: inline;
}
ul.tabs li.selected {
    filter:alpha(opacity=35);
    opacity:0.35;
}
ul.tabs li a {
    display: inline-block;
    height: 23px;
    padding-right: 10px;
    text-indent: -999em;
    background: transparent url("../images/subnavigation.png") no-repeat scroll 0 0;
}
ul.tabs li.commercials-music-videos a {
    background-position: 0px -671px;
    width: 195px;
}
ul.tabs li.commercials a {
    background-position: 0px -700px;
    width: 92px;
}
ul.tabs li.music-video a {
    background-position: 0px -725px;
    width: 87px;
}
ul.tabs li.short-film a {
    background-position: 0px -750px;
    width: 31px;
}
ul.tabs li.archive a {
    background-position: 0px -774px;
    width: 61px;
}

h1.albert-kodagolian,
h1.john-hardwick,
h1.ian-kammer,
h1.nicholas-reynolds {
    position: relative;
    top: 123px;
    padding-top: 8px;
    padding-bottom: 0px;
}
h1.ian-kammer a,
h1.albert-kodagolian a,
h1.john-hardwick a,
h1.nicholas-reynolds a {
    background: transparent url('../images/albert_kodagolian-h1.png') no-repeat scroll 0px 0px;
    display: block;
    padding: 0px;
    width: 358px;
    height: 29px;
    text-indent: -999em;
}
h1.john-hardwick a {
    background: transparent url('../images/john_hardwick-h1.png') no-repeat scroll top left;
    width: 288px;
}
h1.nicholas-reynolds a {
    background: transparent url('../images/nicholas_reynolds-h1.png') no-repeat scroll top left;
    width: 369px;
}
h1.ian-kammer a {
    background: transparent url('../images/ian_kammer-h1.png') no-repeat scroll top left;
    width: 369px;
}

h1.ian-kammer a:hover,
h1.albert-kodagolian a:hover,
h1.john-hardwick a:hover,
h1.nicholas-reynolds a:hover {
    background-position: bottom left;
}

.sub-content-content {
    float:left;
    margin-left:20px;
    width:340px;
}
#commercials { padding-top: 30px; }
#commercials .persontitle.title {
    margin-bottom:  27px;
}
#mission .sub-content { text-align: center; }

#news            { padding-top: 122px; }
#mission         { padding-top: 122px; }
#branded_content { padding-top: 37px; }

#branded_content .persontitle.email,
#branded_content .persontitle.title {
    margin-bottom:  27px;
}
.hideme { display: none; }

.filelink { color: #CCCCCC; }
.filelink a { color: #CCCCCC; text-decoration: none }
.filelink a:hover { color: #CCCCCC; text-decoration: underline }

.sub-content h2.persontitle { font-size: 32px; font-weight: 900; }
.sub-content h2.persontitle.wide { font-size: 27px; height: 15px; font-weight: 900; }
.sub-content h2.persontitle span.title { font-size: 36px; padding: 0; line-height: 36px; }
#home-content p.address {

    text-transform: uppercase;
    font-size: 18px;
    font-weight: normal;
    padding: 12px 0 6px 0;

}

h3.contenttitle { padding: 45px 0 9px 0; font-size: 22px; }

h4.newstitle { padding: 52px 0 9px 0; font-size: 18px; }

#sidebar-nav {
    width: 150px;
    padding: 0 0 9px 0;
}


.sidebar-element {
    padding: 0 0 9px 0;
    font: 11px/15px Helvetica, Arial, Verdana, Tahoma, sans-serif;
}

.sidebar-element ul { padding-bottom: 15px; }
.sidebar-element ul, .sidebar-element ul li {
    list-style: none;
    margin: 0;
}

.sidebar-element ul li a { text-decoration: none; }
.sidebar-element ul li a span {
    display: block;
    font-weight: normal;
    font-weight: bold;
}
.sidebar-element ul li { position: relative; }
.sidebar-element ul li span.filelink.pdf { position: absolute; left: -25px; top: 3px; }
.sidebar-element ul li span.filelink.pdf+span.filelink.pdf { left: -50px; }
.sidebar-element ul li span.filelink.pdf+span.filelink.pdf+span.filelink.pdf { left: -75px; }

#sub-content-content {

    width: 350px;
    padding: 0 0 0 13px;

}

#sub-content-contact {

    padding: 45px 19px 0 28px;

}

.contact-column { width: 150px; padding: 0 5px 0 0; float: left; }
.contact-column span { display: block; }
.contact-column span.contact-name { padding: 10px 0 0 0; }

/*-- Navigation --*/

#navigation {
    width: 179px;
    padding: 0px 0 0 11px;
}
#navigation .sub-nav ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}
div.current-page, div.other-pages {
    text-align: right;
}

#navigation .sub-nav { height: 115px; padding-top: 74px; }
/* For BuenoThin */
/*
#navigation .sub-nav { height: 95px; padding-top: 101px; }
div.current-page { font-size: 45px; text-transform: uppercase; }
div.other-pages { font-size: 40px; }
div.other-pages li { height: 14px; }
*/

/* For BuenoBold */
/*
#navigation .sub-nav { height: 71px; padding-top: 125px; }
div.current-page { font-size: 32px; text-transform: uppercase; }
div.other-pages li { height: 12px; }
*/

ul.nav, ul.nav li, ul.subnav, ul.subnav li {
    margin: 0;
    list-style: none;
}


ul.nav li {
    width: 180px;
    float: left;
    padding: 0 0 6px 0;
}

ul.nav li a {
    width: 177px;
    display: block;
    float: left;
    text-decoration: none;
    text-indent: -999em;
}

ul.nav li a { background: url(../images/navigation.png); width: 180px; }
ul.nav li.nav-directors a { height: 58px; background-position: 0px 0px }
ul.nav li.nav-directors a:hover { background-position: -180px 0px }
/*
ul.nav li.nav-commercials a { height: 40px; background-position: 0px 0px }
ul.nav li.nav-commercials a:hover { background-position: -180px 0px }
*/
ul.nav li.nav-branded_content a { height: 33px; background-position: 0 -64px; }
ul.nav li.nav-branded_content a:hover { height: 33px; background-position: -180px -64px; }
ul.nav li.nav-mission a { height: 33px; background-position: 0 -104px; }
ul.nav li.nav-mission a:hover { height: 33px; background-position: -180px -104px; }
ul.nav li.nav-good_news a { height: 40px; background-position: 0 -142px; }
ul.nav li.nav-good_news a:hover  { height: 40px; background-position: -180px -142px; }
ul.nav li.nav-contact a { height: 28px; background-position: 0 -187px; }
ul.nav li.nav-contact a:hover  { height: 28px; background-position: -180px -187px; }
ul.nav li.nav-date {
  background: none;
  width: 178px;
  position: relative;
  padding-bottom: 82px; /* 74px tall + 8px padding top */
}
ul.nav li.nav-date img {
  position: absolute;
  left: -15px;
  top: 8px;
}

#current_page_directors { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -569px; height: 55px; }
#current_page_commercials { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -2px; }
#current_page_short_film  { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -53px; }
#current_page_music_video { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -106px; }
#current_page_archives    { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -159px; }
#current_page_branded_content   { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -203px; }
#current_page_mission      { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -245px; }
#current_page_news         { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -296px; }
#current_page_contact      { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -338px; }
#current_page_news_archive { background: url(../images/subnavigation.png); width: 180px; height:42px; background-position: 0 -387px; }

.other-pages ul li { padding: 4px 0px 0px 0px; margin: 0;}
.other-pages ul li.selected {
    filter:alpha(opacity=35);
    opacity:0.35;
}
.other-pages ul li a {
    position: relative;
    display: block;
    background: url(../images/subnavigation.png);
    background-repeat: no-repeat;
    width: 180px;
    height: 22px;
}

.other-pages ul li a span { display: none; }

.other-pages ul .commercials a { background-position: 0 -446px; }
.other-pages ul .music-video a { background-position: 0 -505px; }
.other-pages ul .short-film a { background-position: 0 -476px; }
.other-pages ul .archive a { background-position: 0 -533px; height: 22px; }

.other-pages ul .albert-kodagolian a { background-position: -1px -805px; }
.other-pages ul .john-hardwick a { background-position: -1px -834px; }
.other-pages ul .nicholas-reynolds a { background-position: -1px -863px; }
/*JF: HERE */
.other-pages ul .ian-kammer a { background-position: -1px -890px; }



.scrollcontainer { overflow:hidden; }
.sub-content .scrollcontainer { height: 386px; }
.sub-content-content .scrollcontainer { height: 336px; }
#news .scrollcontainer { height: 336px; }
#commercials .scrollcontainer { height: 344px; }
.sub-content .scrollcontainer .scrollbuttons {
    position: absolute;
    bottom: 0px;
    background: transparent url(../images/black-bottom-border.png) 0 0 repeat-x;
    padding-top: 23px;
    min-height: 32px;
    z-index: 50;
    text-align: right;
}
.sub-content .scrollcontainer .scrollbuttons { width: 520px; }
.sub-content-content .scrollcontainer .scrollbuttons { width: 350px; }
.sub-content .scrollcontainer .scrollbuttons .up:hover { background-position: 0 -24px; }
.sub-content .scrollcontainer .scrollbuttons .up {
    display: block;
    float: right;
    margin-right: 5px;
    background-image: url(/images/up.png);
    background-position: 0 0;
    height: 24px;
    width: 19px;
}
.sub-content .scrollcontainer .scrollbuttons .dn:hover { background-position: 0 -24px; }
.sub-content .scrollcontainer .scrollbuttons .dn {
    display: block;
    float: right;
    background-image: url(/images/down.png);
    background-position: 0 0;
    height: 24px;
    width: 19px;
}

.sub-content .content {
    position: relative;
    z-index: 1;
    top: 0;
}


/*
ul.subnav { width: 513px; height: 30px; }

ul.subnav li { float: left; height: 30px;}

a.subnavlink {
    font-size: 24px;
    padding: 0;
    text-transform: uppercase;
    text-decoration: none;
}

a.subnavlink:hover, a.subnavlink.active { color: #7ACCF5; }

ul.subnav li a.last { padding: 0; }
*/



/*-- Videoslist --*/

.videoslist ul, .videoslist ul li {

    width: 513px;
    list-style: none;
    margin: 0;

}

.videoslist ul li { padding: 10px 0; }

.videoslist ul li.col1, .videoslist ul li.col2 {
    float: left;
    width: 224px;
    padding: 10px 32px 10px 0;
}

.videoslist ul li.col2 {
    padding: 10px 0 10px 32px;
}

.thumbnail a {
    display: block;
    width: 224px;
    height: 135px;
    position: relative;
    color: #7ACCF5;
    visibility: hidden;
}

.thumbnail {
    position: relative;
    height: 135px;
}

.thumbnail img {
    margin: 2px 0 0 0;
    width: 221px;
    height: 130px;
    text-indent: -999em;
}

.thumbframe {
    position: absolute;
    left: 0;
    top: 0;
    background: url(../images/sm-thumb-border.png) no-repeat;
    width: 224px;
    height: 135px;

}



.thumbframe a {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-size: 18px;
    text-transform: uppercase;
    text-decoration: none;
    font-family: Helvetica, Arial, Verdana, Tahoma, sans-serif !important;
}
.thumbframe a span {
    display: block;
    font-size: 22px;
    font-weight: bold;
}

* html .thumbframe { background: none; border: solid 2px #fff; width: 217px; height: 126px;}
* html .thumbframe img { width: 217px; height: 126px; }

.large .thumbframe {
    background: url(../images/lg-thumb-border.png) no-repeat;
    width: 507px;
    height: 198px;
}
.large
{
  width: 507px;
  height: 198px;
}

.large img {
    margin: 1px 0 0 4px;
    width: 498px;
    height: 193px;
    position: relative;
}

.large .thumbframe a { line-height: 198px; }

.large a {
    display: block;
    width: 498px;
    height: 193px;
    position: relative;
}

/*-- Contact --*/

.contact-name { font-weight: bold; }


/*-- News --*/

.newslist {
    padding: 45px 0 9px 0;
    margin: 0;
    list-style: none;
}

.newslist li {
    margin: 0;
    list-style: none;
    padding: 0 0 9px 0;
}

.newslist li p.date { font-weight: bold; padding: 0; }

.newslist li h4,
.newslist li h4 a {
    font-weight: normal;
    padding: 0;
    font-size: 11px;
}