* {
    margin: 0;
}
html, body {
    height: 100%;
}
* html body {
    text-align: center;
}
object, embed {
    outline: medium none !important;
}
.outerWrapper {
    height: auto !important;
    margin: 0 auto -100px;
    min-height: 100%;
}
.innerWrapper {
    background-color: transparent;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
    width: 1024px;
}
.mem .innerWrapper {
    overflow: visible;
    position: relative;
    text-align: left;
}
.lights {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/overlay_black.png") repeat scroll 0 0;
    display: none;
    height: 576px;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}
.lights2 {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/gradient.png") repeat-x scroll 0 0;
    display: none;
    height: 0;
    pointer-events: none;
    position: absolute;
    top: 607px;
    width: 100%;
    z-index: 1000;
}
#videoPlayer {
    display: block;
    height: 576px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    width: 1024px;
    z-index: 0;
}
.brand {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand.png") no-repeat scroll center top;
    height: 230px;
    left: -58px;
    padding: 8px 0 0 50px;
    position: absolute;
    top: 0;
    width: 140px;
    z-index: 99;
}
.brand span {
    display: block;
}
.brand span:hover {
    cursor: pointer;
}
.brand .active span:hover {
    cursor: default;
}
.brand .espnFilms span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand_sprite.jpg") no-repeat scroll 0 0;
    height: 24px;
    margin-top: 2px;
    width: 89px;
}
.brand .espnFilms span:hover {
    background-position: -89px 0;
}
.brand .thirty4thirty span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand_sprite.jpg") no-repeat scroll 0 -24px;
    height: 35px;
    margin: 8px 0 0;
    width: 89px;
}
.brand .thirty4thirty span:hover, .brand .thirty4thirty.active span {
    background-position: -89px -24px;
}
.brand .buick span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand_sprite.jpg") no-repeat scroll 0 -59px;
    height: 27px;
    margin: 2px 0 0;
    width: 89px;
}
.brand .buick span:hover {
    background-position: -89px -59px;
}
.brand .volume1 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand_sprite2.jpg") no-repeat scroll 0 -86px;
    height: 15px;
    margin-top: 6px;
    width: 89px;
}
.brand .volume1 span:hover, .brand .volume1.active span {
    background-position: -89px -86px;
}
.brand .volume2 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand_sprite2.jpg") no-repeat scroll 0 -100px;
    height: 16px;
    margin-top: 5px;
    width: 89px;
}
.brand .volume2 span:hover, .brand .volume2.active span {
    background-position: -89px -100px;
}
.brand .volume3 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand_sprite2.jpg") no-repeat scroll 0 -116px;
    height: 15px;
    margin-top: 7px;
    width: 89px;
}
.brand .volume3 span:hover, .brand .volume3.active span {
    background-position: -89px -116px;
}

.brand .shorts span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/brand_sprite2.jpg") no-repeat scroll 0 -131px;
    height: 15px;
    margin-top: 7px;
    width: 89px;
}

.brand .shorts span:hover, .brand .shorts.active span {
    background-position: -89px -131px;
}

.brand-presby {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/presby_bg.png") no-repeat scroll 0 0;
    height: 45px;
    left: 25px;
    margin-bottom: 5px;
    padding: 5px 0 0 22px;
    position: absolute;
    top: 209px;
    width: 120px;
}
.nav {
    background: transparent url("/30for30/prod/assets/overlay_none.png") repeat scroll 0 0;
    height: 125px;
    left: 102px;
    position: absolute;
    top: 0;
    z-index: 100;
}
.nav .wrap {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/item_repeat.png") repeat-x scroll 0 0;
    cursor: pointer;
    height: 107px;
    margin: 0;
    padding: 0;
    position: relative;
    top: -88px;
    width: 100%;
}
* html .wrap {
    padding: 0;
}
.item {
    background-color: #c2bfb6;
    float: left;
    height: 97px;
    margin: 0 0 0 2px;
    position: relative;
    width: 130px;
}
.item:first-child {
    margin-left: 0;
}
.item h4 {
    padding: 5px;
}
.item a img {
    border: medium none;
    display: block;
    position: relative;
    z-index: 100;
}
.item.active {
    background-color: #a9342d;
}
.item.active a img {
    opacity: 0.4;
}
.item a:hover .overlay_item {
    display: block;
}
.item.active a:hover .overlay_item {
    display: none;
}
.item .overlay_item {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/overlay_black.png") repeat scroll 0 0;
    display: none;
    height: 90px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 110;
}
.gradient {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/gradient_reverse.png") repeat scroll 0 0;
    bottom: 35px;
    cursor: pointer;
    display: none;
    height: 540px;
    position: absolute;
    width: 1024px;
    z-index: 40;
}
.headline {
    bottom: 50px;
    overflow: hidden;
    padding: 20px 10px 20px 20px;
    position: absolute;
    text-align: left;
    width: 43%;
    z-index: 50;
}
.headline h1 {
    margin: 0;
    padding: 0;
}
.headline h2, .headline h4 {
    margin-left: 2px;
}
.headline h4 {
    padding-bottom: 8px;
}
.headline p {
    border-top: 1px solid #c2bfb6;
    margin-left: 2px;
    margin-top: 8px;
    padding-top: 5px;
}
.tonight {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/tonight_repeat.jpg") repeat-x scroll 0 0;
    height: 40px;
    overflow: hidden;
}
.tonight .innerWrapper {
    background-color: #c2bfb6;
    height: 20px;
    margin: 0 auto;
    padding: 5px 0 0;
    text-align: center;
    text-transform: uppercase;
    width: 1200px;
}
.tonight h5 {
    display: inline;
    margin: 0 20px 0 0;
}
.tonight span {
    border-style: none;
    display: inline-block;
    margin: 3px 0 0 5px;
    vertical-align: middle;
}
.tonight span.espn {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 0;
    height: 20px;
    width: 55px;
}
.tonight span.espn:hover {
    background-position: -63px 0;
    cursor: pointer;
}
.tonight span.espn2 {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 -35px;
    height: 20px;
    width: 55px;
}
.tonight span.espn2:hover {
    background-position: -63px -35px;
    cursor: pointer;
}
.tonight span.espn3 {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 -70px;
    height: 20px;
    width: 55px;
}
.tonight span.espn3:hover {
    background-position: -63px -70px;
    cursor: pointer;
}
.tonight span.espnNews {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 -105px;
    height: 20px;
    width: 63px;
}
.tonight span.espnNews:hover {
    background-position: -63px -105px;
    cursor: pointer;
}
.tonight span.classic {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 -139px;
    height: 20px;
    width: 50px;
}
.tonight span.classic:hover {
    background-position: -63px -139px;
    cursor: pointer;
}
.tonight span.watch {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 -175px;
    height: 20px;
    width: 63px;
}
.tonight span.watch:hover {
    background-position: -63px -175px;
    cursor: pointer;
}
.tonight span.espnU {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 -210px;
    height: 20px;
    width: 20px;
}
.tonight span.espnU:hover {
    background-position: -63px -210px;
    cursor: pointer;
}
.tonight span.abc {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/channel_sprite.png") no-repeat scroll 0 -245px;
    height: 20px;
    width: 20px;
}
.tonight span.abc:hover {
    background-position: -63px -245px;
    cursor: pointer;
}
.content {
    background-color: #fff;
    height: auto !important;
    margin: 0 auto;
    min-height: 100%;
}
.content .innerWrapper {
    background-color: #fff;
    overflow: visible;
    text-align: center;
}
.banner {
    margin: 10px 0;
}
.left {
    float: left;
    margin: 15px 20px 0 0;
    text-align: left;
    width: 502px;
}
.left.series {
    width: 384px;
}
.contentBlock {
    overflow: hidden;
    padding: 10px 3px;
}
.leftFloat {
    float: left;
    margin: 0 15px 5px 0;
}
.rightFloat {
    float: right;
    margin: 5px 0 15px 15px;
}
.left .about {
    border-bottom: 1px solid #999;
    border-top: 1px solid #999;
    height: 543px;
    margin: 0 0 20px;
    overflow: hidden;
}
.left .about p a {
    font-weight: bold;
}
.left.series .about {
    max-height: 450px;
}
.left.series .about.soccer {
    max-height: 600px;
}
.left.film .about {
    border-bottom: medium none;
    height: 100%;
}
.left.film .about .contentBlock {
    border-bottom: 1px solid #999;
    padding: 20px 5px 10px;
}
.left.film .about .contentBlock.first {
    padding-top: 10px;
}
.left.film .about .contentBlock.last {
    border-bottom: medium none;
}
.left.film .about img {
    border-top: medium none;
    width: 134px;
}
.left.film .about img:hover {
    border-top: medium none;
}
.left.film h4 {
    font-size: 15px;
    padding-bottom: 5px;
}
.left.film .modHead {
    float: left;
}
.left.film .presby {
    float: right;
    margin: 5px 0 0;
}
.left.film .presby img {
    border-style: none;
    border-top: medium none;
    height: 40px;
    width: 175px;
}
.left.film .presby img:hover {
    border-top: medium none;
}
.left.series .presby {
    float: right;
    margin: 5px 0 0;
}
.left.series .presby img {
    border-style: none;
    border-top: medium none;
    height: 40px;
    width: 175px;
}
.left.series .presby img:hover {
    border-top: medium none;
}
.left.home .presby {
    float: right;
    margin: 5px 0 0;
}
.left.home .presby img {
    border-style: none;
    border-top: medium none;
    height: 40px;
    width: 175px;
}
.left.home .presby img:hover {
    border-top: medium none;
}
.filmStream {
    float: left;
    margin: 0 0 20px;
}
.filmStream .comments {
    width: 1024px;
}
.comments {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/fb_502.jpg") no-repeat scroll 0 0;
    float: left;
    height: 797px;
    width: 502px;
}
.middle {
    float: left;
    margin: 15px 20px 0 0;
    overflow: hidden;
    text-align: left;
}
.middle.home, .middle.film {
    width: 182px;
}
.middle.series {
    width: 300px;
}
.middle .shorts {
    background: #000 url("/30for30/prod/assets/film_repeat.jpg") repeat-y scroll 0 0;
    border-style: none;
    height: 843px;
    margin: 0 0 20px;
    overflow: hidden;
}
.shorts .header a img {
    border-style: none;
}
.shorts .header {
    padding-bottom: 15px;
}
.shorts .tile.small {
    margin-bottom: 10px;
    margin-left: 8px;
}
.middle.series.soccer {
    border-bottom: 1px solid #999;
    border-top: 1px solid #999;
}
.director {
    background: #000 url("/30for30/prod/assets/directorCred_repeat.jpg") repeat-y scroll 0 0;
    height: 100%;
    margin: 0 0 20px;
    overflow: hidden;
}
.director .header {
    border-bottom: 5px solid #a9342d;
}
.director .contentBlock {
    height: 100%;
    margin: 0 10px;
}
.director h2 {
    padding: 3px 0 2px;
}
.director h5 {
    padding: 0 0 3px;
}
.director h5 img {
    margin-left: -7px;
}
.credits {
    background: #000 url("/30for30/prod/assets/directorCred_repeat.jpg") repeat-y scroll 0 0;
    height: 100%;
    overflow: hidden;
    padding: 0 10px 10px;
}
.credits h5 {
    padding: 2px 0;
}
.credits p {
    margin-bottom: 7px;
}
.credits h3 img {
    margin: -7px 0 0 -7px;
}
.middle .social {
    border-bottom: 1px solid #999;
    border-top: 1px solid #999;
    height: 450px;
    overflow: hidden;
}
.mod-header img {
    border-style: none;
    margin: 16px 12px 0 3px !important;
}
.middle .social .mod-header img {
    margin: 16px 12px 0 3px !important;
}
.mod-open-list .mod-content ul li {
    background-color: #f0efeb;
    padding: 3px 0 !important;
}
.mod-open-list .mod-content ul li.alt {
    background-color: #fff;
    padding: 3px 0 !important;
}
.mod-content {
    margin: 10px 3px 5px !important;
}
.mod-content ul {
    border-bottom: 1px solid #999;
    border-top: 1px solid #999;
    height: 294px !important;
    list-style-type: none;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    padding: 0 !important;
    width: 100% !important;
}
.middle .social .mod-content ul {
    height: 375px !important;
}
.mod-content ul li.first.ad {
    display: none !important;
}
.mod-content img {
    border-style: none;
    float: left;
    padding: 14px 10px 14px 0 !important;
}
.mod-footer {
    float: right;
    padding: 0 5px 0 0 !important;
}
.right {
    float: left;
    margin: 15px 0 0;
    text-align: left;
    width: 300px;
}
.converse .social {
    border-top: 1px solid #999;
    height: 35px;
    margin: 0 0 10px;
}
.converse .modHead {
    float: left;
    margin-right: 10px;
}
.converse .social .fb-like {
    border-style: none;
    padding: 12px 10px 0 0;
}
.converse .social .twitter-share-button {
    border-style: none;
    padding: 12px 10px 0 0;
}
.purchase {
    border-bottom: 1px solid #999;
    border-top: 1px solid #999;
    height: 133px;
    margin: 0 0 20px;
    overflow: hidden;
    position: relative;
}
.purchase .contentBlock {
    overflow: visible;
    padding-top: 5px;
}
.purchase img {
    float: right;
    margin: -30px 0 0 15px;
}
.purchase .purchaseLinks {
    bottom: 0;
    position: absolute;
}
.purchase p a {
    margin-right: 15px;
}
.right .ad {
    height: 250px;
    margin: 0 0 20px;
}
.right .extra {
    border-bottom: 1px solid #999;
    border-top: 1px solid #999;
    height: 370px;
    overflow: hidden;
}
.right .twitter ul {
    height: 295px;
}
.texture {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/fb_repeat.png") repeat scroll 0 0;
    display: none;
    float: right;
    height: 400px;
    margin-top: 20px;
    width: 502px;
}
.tile {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/overlay_none.png") repeat scroll 0 0;
    float: left;
    height: 250px;
    margin: 0 20px 20px 0;
    overflow: hidden;
    position: relative;
    text-align: left;
    width: 154px;
}
.tile.small {
    height: 170px;
    left: 24px;
    margin: 10px 20px 10px 0;
    width: 134px;
}
.tile.small img {
    border-bottom: 5px solid #a9342d;
}
.tile.small img:hover {
    border-bottom: 5px solid #86a2a6;
}
.tile.last {
    margin-right: 0;
}
.tileContainer {
    bottom: 25px;
    height: 225px;
    overflow: hidden;
    position: absolute;
    width: 154px;
}
.tile.small .tileContainer {
    bottom: 0;
    height: 100px;
    width: 134px;
}
.tileOver {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/overlay_black.png") repeat scroll 0 0;
    border-top: 5px solid #a9342d;
    bottom: -110px;
    height: 150px;
    position: absolute;
    width: 154px;
}
.tile.small .tileOver {
    border: medium none;
    height: 100px;
    top: 10px;
    width: 134px;
}
.tileOver h4 {
    bottom: 113px;
    margin: 5px 10px 0;
    position: absolute;
}
.tile.small h4 {
    margin: 5px 5px 0;
    position: relative;
    top: 0;
}
.tileOver p {
    padding: 0 10px;
    position: absolute;
    top: 45px;
}
.tile.small p {
    padding: 0 5px;
    position: relative;
    top: 2px;
}
.tileSocial {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/overlay_black.png") repeat scroll 0 0;
    bottom: 0;
    height: 25px;
    position: absolute;
    width: 154px;
}
.tile.comingSoon .tileSocial {
    background-color: #000000;
}
.tileSocial span {
    display: block;
}
.tileSocial .fb, .tileSocial .twitter {
    float: right;
    height: 15px;
    margin: 5px 5px 5px 0;
}
.tileSocial .fb span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/film-tile-social.jpg") no-repeat scroll 0 0;
    height: 15px;
    width: 16px;
}
.tileSocial .fb span:hover {
    background-position: 0 -15px;
    cursor: pointer;
}
.tileSocial .twitter span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/film-tile-social.jpg") no-repeat scroll 0 -30px;
    height: 15px;
    width: 16px;
}
.tileSocial .twitter span:hover {
    background-position: 0 -45px;
    cursor: pointer;
}
.tile.comingSoon .tileContainer {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/overlay_black.png") repeat scroll 0 0;
}
.tile.comingSoon .tileContainer .releaseState {
    position: relative;
    text-align: center;
    top: 70px;
}
.tile.small .releaseState {
    left: 15px;
    position: relative;
    top: 30px;
}
.push {
    height: 100px;
}
.footer {
    background: #000 url("/30for30/prod/assets/footer_repeat.jpg") repeat-x scroll 0 0;
    height: 375px;
    margin: 50px 0 0;
    padding-top: 20px;
    text-align: center;
    width: 100%;
}
.footer .innerWrapper {
    overflow: visible;
    position: relative;
}
.footer .logo span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/footer_logo.jpg") no-repeat scroll 0 0;
    height: 85px;
    left: 470px;
    position: absolute;
    top: 15px;
    width: 110px;
}
.footer .logo span:hover {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/footer_logo_hover.jpg") no-repeat scroll 0 0;
    cursor: pointer;
}
.footer .returnUp span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/footer_rtt.jpg") no-repeat scroll 0 0;
    height: 40px;
    position: absolute;
    right: 0;
    top: -4px;
    width: 110px;
}
.footer .returnUp span:hover {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/footer_rtt_hover.jpg") no-repeat scroll 0 0;
}
.footer .moreContent {
    border-bottom: 1px solid #262626;
    border-top: 1px solid #262626;
    height: 160px;
    margin-bottom: 15px;
    overflow: hidden;
    padding: 20px 0 0 20px;
    position: absolute;
    top: 120px;
    width: 1024px;
}
.footer .contentBlock {
    float: left;
    margin-bottom: 20px;
    text-align: left;
    width: 220px;
}
.footer .contentBlock img {
    height: 20px;
    padding-bottom: 8px;
    width: 145px;
}
.footer .contentBlock.first {
    padding: 0 20px;
}
.footer .contentBlock.second {
    padding: 0 25px 0 0;
}
.footer .contentBlock.third {
    border-left: 1px solid #262626;
    padding: 0 20px 0 40px;
}
.footer .contentBlock.fourth {
    padding: 0 0 0 40px;
    width: 150px;
}
.footer .contentBlock a, .footer .contentBlock .current {
    display: block;
    margin: 0 0 1px 4px;
}
.footer .fLine {
    bottom: 20px;
    padding: 15px;
    position: absolute;
    right: 0;
    width: 100%;
}
h1 {
    color: #c2bfb6;
    font: 40px/42px "JosefinSansStdLight",Arial,sans-serif;
    letter-spacing: 0;
    text-shadow: 2px 2px 5px #000;
}
* html h1 {
    color: #000;
    padding-bottom: 2px;
}
h1 span {
    color: #86a2a6;
}
h2 {
    color: #86a2a6;
    font: bold 13px/16px "Karla",Arial,sans-serif;
}
.director h2 {
    font: 16px/19px "Karla",arial,sans-serif;
}
h3, .mod-header h4 {
    color: #333333 !important;
    font: 20px/22px "KarlaBold",arial,sans-serif;
    padding: 15px 2px 0 0;
}
.mod-header h4 {
    padding: 0;
}
.modHead.open {
    float: left;
    margin: -17px 0 8px;
    text-align: left;
}
.credits h3 {
    color: #fff;
    padding-bottom: 3px;
}
h4 {
    color: #86a2a6;
    font: 13px/15px "KarlaBold",arial,sans-serif;
}
h5 {
    color: #333;
    font: bold 11px/11px Arial,sans-serif;
}
h5.header, .middle h5, .releaseState h5 {
    color: #666;
    font: bold 12px/12px Arial,sans-serif;
}
.releaseState h5 {
    color: #666;
}
.director h5 {
    color: #fff;
    padding-bottom: 8px;
}
.contentBlock .caption {
    color: #999;
    font: 12px/13px "Karla",Arial,sans-serif;
    width: 250px;
}
.contentBlock .credit {
    color: #999;
    font: 9px/10px Arial,sans-serif;
    margin: 5px 0;
    text-align: right;
}
.footer {
    color: #343434;
    font: 12px/16px "Karla",arial,sans-serif;
}
.footer .fLine {
    font: 10px/10px Arial,sans-serif;
}
p, li {
    color: #333;
    font: 12px/15px "Karla",Arial,sans-serif;
    margin-bottom: 10px;
}
.headline p, .tile p, .shorts p {
    color: #c2bfb6;
}
.shorts p {
    padding-top: 2px;
}
.footer p {
    color: #e1e0dc;
}
.credits p, .director p {
    color: #c2bfb6;
    font: 11px/15px "Karla",Arial,sans-serif;
}
.credits h5 {
    color: #86a2a6;
    font: bold 11px/15px "Karla",Arial,sans-serif;
}
a:hover, .tile a, .director a, .director p a:hover {
    color: #86a2a6 !important;
}
a, .modHead a:hover, .mod-header a:hover, .tile a:hover, .footer .fLine a:hover, .director a:hover, .director p a {
    color: #a9342d !important;
    text-decoration: none;
}
.footer .fLine a {
    color: #561b17 !important;
}
.modHead a, .mod-header h4 a {
    color: #333 !important;
    text-decoration: none;
}
.videoplayer {
    display: block;
    height: 576px;
    overflow: hidden;
    position: absolute;
    width: 1024px;
}
.videoplayer-show {
    height: 576px;
    position: inherit;
}
@media all and (min-width: 728px) {
.innerWrapper {
    width: 1024px;
}
.mem, .lights {
    height: 576px;
    width: 100%;
}
#videoPlayer, .videoplayer {
    width: 1024px;
}
#videoPlayer, .videoplayer-show {
    height: 576px;
}
}
@media all and (max-width: 727px) and (min-width: 481px) {
.innerWrapper {
    width: 100%;
}
.content .innerWrapper {
    width: 535px;
}
.tonight .innerWrapper {
    width: 100%;
}
.tonight h5.header, .tonight h5.thirdAir {
    display: none;
}
.tonight h5 {
    margin-right: 7px;
}
#videoPlayer, .videoplayer {
    width: 688px;
}
#videoPlayer, .videoplayer-show {
    height: 387px;
    width: 688px;
}
.mem, .lights {
    height: 387px;
    width: 688px;
}
.mem {
    background-size: 100% auto;
}
.headline p, .headline h4 {
    display: none;
}
.headline h1 {
    font: 30px/32px "JosefinSansStdLight",Arial,sans-serif;
}
.headline {
    bottom: 200px;
}
.lights2 {
    top: 418px;
    width: 688px;
}
.brand {
    left: -30px;
}
.nav {
    left: 130px;
}
.nav .wrap {
    height: 97px;
    overflow: hidden;
    width: 394px;
}
.banner {
    display: none;
}
.left, .middle, .right {
    margin-left: 20px;
}
.left.series, .middle.series, .right {
    width: 502px;
}
.left.series .about {
    border-bottom: medium none;
    height: 100%;
}
.right .converse .social {
    border-top: medium none;
}
.right .ad {
    margin-left: 20%;
}
.tile, .modHead.open {
    margin-left: 20px;
    margin-right: 0;
}
.left .tile {
    margin-left: 0;
    margin-right: 20px;
}
.left .tile.last {
    margin-right: 0;
}
.middle.home {
    height: 270px;
    width: 500px;
}
.middle.film {
    width: 500px;
}
.director, .credits {
    background: #000 none repeat scroll 0 0;
}
.director .header {
    text-align: center;
}
.footer {
    height: 530px;
    width: 100%;
}
.footer .innerWrapper {
    width: 535px;
}
.footer .logo span {
    left: 180px;
    top: 20px;
}
.footer .returnUp span {
    right: 10px;
}
.footer .moreContent {
    height: 310px;
    padding-left: 50px;
    width: 480px;
}
.footer .contentBlock.first {
    height: 150px;
    padding: 0 10px;
}
.footer .contentBlock.second {
    height: 150px;
    padding: 0 0 0 10px;
}
.footer .contentBlock.third {
    border-left: medium none;
    height: 150px;
    padding: 0 10px;
}
.footer .contentBlock.fourth {
    height: 150px;
    padding: 0 0 0 10px;
}
.footer .fLine {
    width: 90%;
}
}
@media all and (max-width: 480px) {
.gradient {
    height: 220px;
}
.content .innerWrapper, .innerWrapper {
    width: 100%;
}
.tonight .innerWrapper {
    width: 100%;
}
.tonight h5.header, .tonight h5.secondAir, .tonight h5.thirdAir {
    display: none;
}
.tonight h5 {
    margin-right: 7px;
}
#videoPlayer, .videoplayer {
    width: 100%;
}
#videoPlayer, .videoplayer-show {
    height: 220px;
    width: 100%;
}
.mem, .lights {
    height: 220px;
    width: 100%;
}
.mem {
    background-size: 100% auto;
}
.headline p, .headline h4 {
    display: none;
}
.headline h1 {
    font: 16px/18px "JosefinSansStd",Arial,sans-serif;
}
.headline h2 {
    color: #86a2a6;
    font: bold 10px/12px "Karla",Arial,sans-serif;
}
.headline {
    bottom: 380px;
    position: relative;
    right: 75px;
    width: 40%;
}
.lights2 {
    top: 251px;
    width: 100%;
}
.brand {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_small.png") no-repeat scroll center top;
    height: 176px;
    left: -3px;
    padding: 8px 0 0;
    width: 107px;
}
.brand .espnFilms span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -3px;
    height: 16px;
    margin: 2px 0 0 18px;
    width: 68px;
}
.brand .espnFilms span:hover {
    background-position: -70px -3px;
}
.brand .thirty4thirty span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -20px;
    height: 25px;
    margin: 6px 0 3px 18px;
    width: 68px;
}
.brand .thirty4thirty span:hover, .brand .thirty4thirty.active span {
    background-position: -70px -20px;
}
.brand .buick span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -47px;
    height: 18px;
    margin: 0 0 7px 19px;
    width: 68px;
}
.brand .buick span:hover {
    background-position: -70px -47px;
}
.brand .volume1 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -67px;
    height: 12px;
    margin: 0 0 5px 19px;
    width: 68px;
}
.brand .volume1 span:hover, .brand .volume1.active span {
    background-position: -70px -67px;
}
.brand .volume2 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -80px;
    height: 12px;
    margin: 0 0 4px 19px;
    width: 68px;
}
.brand .volume2 span:hover, .brand .volume2.active span {
    background-position: -70px -80px;
}
.brand .shorts span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets//brand_sprite_small.jpg") no-repeat scroll 0 -90px;
    height: 12px;
    margin: 0 0 7px 19px;
    width: 68px;
}
.brand .shorts span:hover, .brand .shorts.active span {
    background-position: -70px -92px;
}
.brand .volume3 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -102px;
    height: 12px;
    margin: 0 0 7px 19px;
    width: 68px;
}
.brand .volume3 span:hover, .brand .volume3.active span {
    background-position: -70px -102px;
}
.brand-presby {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand/presby_bg.png") no-repeat scroll 0 0;
    display: none;
    height: 45px;
    left: 25px;
    margin-bottom: 5px;
    padding: 5px 0 0 22px;
    position: absolute;
    top: 209px;
    width: 120px;
}
.nav {
    display: none;
    left: 130px;
}
.nav .wrap {
    height: 97px;
    overflow: hidden;
    width: 262px;
}
.banner {
    display: none;
}
.filmStream {
    display: none;
}
.left, .left.series, .middle.series, .right {
    width: 348px;
}
.left.series .about {
    border-bottom: medium none;
    height: 100%;
}
.right .converse .social {
    border-top: medium none;
}
.rightFloat {
    display: none;
}
.middle.home {
    height: 470px;
    width: 348px;
}
.shorts {
    width: 368px;
}
.middle.film {
    width: 348px;
}
.director, .credits {
    background: #000 none repeat scroll 0 0;
}
.director .header {
    text-align: center;
}
.left .about {
    height: 100%;
    width: 348px;
}
.left .caption {
    padding-bottom: 10px;
}
.tile, .modHead.open {
    margin-left: 20px;
    margin-right: 0;
}
.left .tile.last {
    display: none;
}
.left.home .about, .left.film, .left.series {
    margin-left: 20px;
}
.middle {
    margin-left: 20px;
}
.right {
    margin-left: 20px;
}
.right .ad {
    margin-left: 7%;
}
.footer {
    height: 770px;
    width: 100%;
}
.footer .innerWrapper {
    width: 360px;
}
.footer .logo span {
    left: 80px;
    top: 20px;
}
.footer .returnUp span {
    right: 5px;
}
.footer .moreContent {
    height: 550px;
    width: 300px;
}
.footer .contentBlock.first {
    padding: 0 20px 0 30px;
}
.footer .contentBlock.second {
    padding: 0 20px 0 30px;
}
.footer .contentBlock.third {
    border-left: medium none;
    padding: 0 20px 0 30px;
}
.footer .contentBlock.fourth {
    padding: 0 20px 0 30px;
}
.footer .fLine {
    text-align: left;
    width: 90%;
}
}
@media screen and (max-device-width: 1024px) and (min-device-width: 728px) {
.content .innerWrapper, .innerWrapper {
    width: 1024px;
}
.left {
    margin-right: 10px;
    padding-left: 10px;
}
.middle {
    margin-right: 10px;
}
.right {
    padding-right: 10px;
}
.tonight {
    width: 1024px;
}
#videoPlayer, .videoplayer {
    width: 1024px;
}
.mem, .lights {
    padding: 0;
}
.lights2 {
    width: 1024px;
}
.banner {
    overflow: hidden;
}
.brand {
    left: -30px;
}
.nav {
    left: 130px;
}
.modHead.open {
    margin-left: 10px;
}
.tile {
    margin: 0 5px 20px 10px;
}
.left .modHead.open {
    margin-left: 0;
}
.left .tile {
    margin: 0 20px 20px 0;
}
.left .tile.last {
    margin-right: 0;
}
.footer, .footer .innerWrapper {
    width: 1024px;
}
.footer .moreContent {
    padding: 20px 0;
}
}
@media screen and (max-device-width: 480px) {
.gradient {
    height: 270px;
}
.outerWrapper {
    width: 480px;
}
.tonight .innerWrapper {
    width: 100%;
}
.tonight h5.header, .tonight h5.secondAir, .tonight h5.thirdAir {
    display: none;
}
.tonight h5 {
    margin-right: 7px;
}
.filmStream {
    display: none;
}
#videoPlayer, .videoplayer {
    height: 270px;
    width: 480px;
}
#videoPlayer, .videoplayer-show {
    height: 270px;
    width: 480px;
}
.mem, .lights {
    height: 270px;
    width: 480px;
}
.mem {
    background-size: 100% auto;
}
.headline p, .headline h4 {
    display: none;
}
.headline h1 {
    font: 25px/27px "JosefinSansStdLight",Arial,sans-serif;
}
.headline {
    bottom: 10px;
    left: 10px;
    padding: 190px 3px 20px 5px;
    position: relative;
    right: 10px;
    width: 40%;
}
.lights2 {
    top: 251px;
    width: 480px;
}
.lights, .lights2 {
    display: none;
}
.brand {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_small.png") no-repeat scroll center top;
    height: 160px;
    left: -3px;
    padding: 8px 0 0;
    width: 107px;
}
.brand .espnFilms span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -3px;
    height: 16px;
    margin: 2px 0 0 18px;
    width: 68px;
}
.brand .espnFilms span:hover {
    background-position: -70px -3px;
}
.brand .thirty4thirty span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -20px;
    height: 25px;
    margin: 6px 0 3px 18px;
    width: 68px;
}
.brand .thirty4thirty span:hover, .brand .thirty4thirty.active span {
    background-position: -70px -20px;
}
.brand .buick span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -47px;
    height: 18px;
    margin: 0 0 7px 19px;
    width: 68px;
}
.brand .buick span:hover {
    background-position: -70px -47px;
}
.brand .volume1 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -67px;
    height: 12px;
    margin: 0 0 5px 19px;
    width: 68px;
}
.brand .volume1 span:hover, .brand .volume1.active span {
    background-position: -70px -67px;
}
.brand .volume2 span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -80px;
    height: 12px;
    margin: 0 0 4px 19px;
    width: 68px;
}
.brand .volume2 span:hover, .brand .volume2.active span {
	background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -80px;
    background-position: -70px -80px;
}
.brand .shorts span {
    background: rgba(0, 0, 0, 0) url("/30for30/prod/assets/brand_sprite_small.jpg") no-repeat scroll 0 -92px;
    height: 12px;
    margin: 0 0 7px 19px;
    width: 68px;
}
.brand .shorts span:hover, .brand .shorts.active span {
    background-position: -70px -92px;
}
.nav {
    display: none;
    left: 130px;
}
.nav .wrap {
    height: 97px;
    overflow: hidden;
    width: 262px;
}
.banner {
    display: none;
}
.left, .left.series, .middle.series, .right, .left .about {
    width: 440px;
}
.left.series .about {
    border-bottom: medium none;
    height: 100%;
}
.right .converse .social {
    border-top: medium none;
}
.rightFloat {
    display: none;
}
.middle.home {
    height: 470px;
    width: 440px;
}
.shorts .tile.small {
    margin-left: 35px;
}
.middle.film {
    width: 440px;
}
.director, .credits {
    background: #000 none repeat scroll 0 0;
}
.director .header {
    text-align: center;
}
.tile, .modHead.open {
    margin-left: 20px;
    margin-right: 0;
}
.left .tile.last {
    display: none;
}
.left.home .about, .left.film, .left.series {
    margin-left: 20px;
}
.middle {
    margin-left: 20px;
}
.right {
    margin-left: 20px;
}
.right .ad {
    margin-left: 0;
}
.footer {
    height: 770px;
    width: 480px;
}
.footer .innerWrapper {
    width: 440px;
}
.footer .logo span {
    left: 120px;
    top: 20px;
}
.footer .returnUp span {
    right: 0;
}
.footer .moreContent {
    height: 550px;
    width: 440px;
}
.footer .contentBlock.first {
    padding: 0 20px 0 80px;
}
.footer .contentBlock.second {
    padding: 0 20px 0 80px;
}
.footer .contentBlock.third {
    border-left: medium none;
    padding: 0 20px 0 80px;
}
.footer .contentBlock.fourth {
    padding: 0 20px 0 80px;
}
.footer .fLine {
    text-align: left;
    width: 90%;
}
}
