body {
   background-color: #000;
   border: 0;
   padding: 0;
   margin: 0;
}

#background {
   background-image: url(superbowl.jpg);
   background-repeat: no-repeat;
   background-position: center top;
   height: 900px;
   width: 1280px;
   margin-left: auto;
   margin-right: auto;
   position: relative;
}

/** playerContainer is positioned relative to the background
   so it always aligns. Otherwise rounding may cause the pixels to
   not sync up... */
#playerContainer {
   background-color: #000;
   top: 250px;
   left: 320px;
   width: 640px;
   height: 360px;
}
#foo {
width:100%;
vertical-align:middle;
display: none;
position: absolute;
top: 593px;
z-index: 100;
height: 0;
}

/*PREVIEW */
.commContainer {
   margin:77px auto 0;
   width:756px;
   min-height:388px;
}
.commLeft {
   margin-top: 12px;
}
.commCenter {
/*
TODO: Bring back later
   margin-left:4px;
*/
   margin:0px auto;
   width:666px;
}
.mainVideoBg {
   padding-top:8px;
   width:666px;
   height:378px;
   background: url(superbowl-texturesheet-1.png) 0px 0px no-repeat;
}
.mainVideo {
   width:640px;
   height:360px;
   background-color:#717171;
   border:6px solid #efb40c;
   margin:0px auto;
}
/*
TODO: Bring back later
.commLeft,
.commCenter,
.commRight {
   float:left;
}
*/
.commLeft,
.commRight {
   float:left;
}
.commRight {
   margin-left:10px;
}
.smallAd {
   display:block;
   width:147px;
   height:140px;
   margin-top:10px;
   padding-top:48px;
   background: url(superbowl-texturesheet-1.png) -667px 0px no-repeat;
}
.smallAd:hover {
   background: url(superbowl-texturesheet-1.png) -667px -189px no-repeat;
}
.smallAd:first-child {
   margin-top:0px;
}
.smallAd .adTextOne {
   width:106px;
   height:100px;
   background: url(superbowl-texturesheet-2.png) -109px -87px no-repeat;
}
.smallAd .adTextTwo {
   width:108px;
   height:102px;
   background: url(superbowl-texturesheet-2.png) -1px -78px no-repeat;
}
.smallAd .adTextOne,
.smallAd .adTextTwo {
   display:block;
   margin:0px auto;
}
.videoThumbContainer {
   margin: 0 auto 28px;
   width: 759px;
   height: 167px;
   position: relative;
}
.videoThumbContainer .videoNav {
   display:block;
   width:58px;
   height:58px;
   margin-top:60px;
   position: absolute;
   top: 0;
}
.videoNav.left {
   left: 0;
}
.videoNav.right {
   right: 0;
}
.videoNav.left .leftArrow {
   background: url(/cmsassets/superbowl/teaser/arrows.png) 0px 0px no-repeat;
}
.videoNav.right .rightArrow {
   background: url(/cmsassets/superbowl/teaser/arrows.png) -93px 0px no-repeat;
}
.videoNav.left .leftArrow,
.videoNav.right .rightArrow {
   display:block;
   width:45px;
   height:40px;
   margin: 8px auto 0px auto;
}
.videoNav.left:hover .leftArrow {
   background: url(/cmsassets/superbowl/teaser/arrows.png) -46px 0px no-repeat;
}
.videoNav.right:hover .rightArrow {
   background: url(/cmsassets/superbowl/teaser/arrows.png) -140px 0px no-repeat;
}

.videoThumbContainer .videoThumbs {
   float:left;
   width:132px;
   min-height:80px;
   margin:18px 0px 0px 22px;
   background: url(superbowl-texturesheet-1.png) 0px -387px no-repeat;
   color:#000;
   text-align:center;
   border: 1px solid #ffc221;
   font-size: 12px;
   padding: 4px 4px 8px;
   cursor: pointer;
}
.videoThumbs.hover {
   background: #ffc221;
}
.videoThumbs img {
   padding-bottom: 6px;
}
.centerText {
   text-align: center;
   margin: 0 85px;
}
.videoThumbRotor {
   position: absolute;
   left: 40px;
   right: 40px;
   top: 0;
   bottom: 0;
   overflow: hidden;
}
.videoThumbFrame {
   position: absolute;
   top: 0;
   left: 0;
   width: 675px;
}
.clear {
   clear:both;
}