/*************************************************************
*
*  File:			main.css
*  Author:		Revolve Productions
*  Created:		August 2009
*
*************************************************************/

/* ==============================
	HTML ELEMENTS
============================== */
html {
	font-size:					62.5%;
	line-height:		    1.5;
	height:						  100%;
}
body {
	font:						    normal 1.1em/1.6em "Lucida Grande",Arial,sans-serif;
	color:						  #282e40;
	width:						  100%;
	height:						  100%;
	background:         #212227 url(../images/bg_texture.jpg) top center repeat;
}
a {
	text-decoration:	  none;
	color:						  #5374a9;
}
a:hover,
a:active {
	text-decoration:	  underline;
	color:						  #5374a9;
	outline:					  none;
}
form {
  position:           relative;
}
input.text {
  font:             1.05em/1.1em Arial,sans-serif;
  height:           16px;
  width:            150px;
  margin:           0 5px 0 0;
  padding:          2px 4px 2px 6px;
  border:           1px solid #d7d7d7;
  border-top:       1px solid #959595;
  float:            left;
  display:          inline;
}
textarea {
  font:             1.05em/1.1em Arial,sans-serif;
  padding:          0 0 0 6px;
}
select {
  width:            150px;
  margin:           2px 5px 0 0;
  display:          block;
}
label {
	display:          block;
}
h2 {
  font:              normal 1.9em/1.1em "Lucida Grande",Arial,sans-serif;
  padding:            0;
}
h3 {
  color:              #313132;
  font:              normal 1.2em/1.05em "Lucida Grande",Arial,sans-serif;
  padding:            0 0 6px 0;
}

/* ==============================
	LAYOUT
============================== */
.wrapper {
  width:              1010px;
  margin:             0 auto;
  padding:            0 50px;
  position:           relative;
}
#header {
  height:             165px;
  border-bottom:      2px solid #777c88;
  position:           relative;
  top:                0;
  left:               0;
  z-index:            4000;
  overflow:           visible;
  zoom:1;
}
#navigation {
  width:              788px; /* (187 + 10) * # nav items showing */
  height:             43px;
  position:           absolute;
  top:                121px;
  right:              50px;
  z-index:            1900;
}
#content {
	font-size:          1.1em;
  width:100%;
	height:             386px;
  position:           relative;
  top:0;
  left:0;
	z-index:            1000;
  overflow:           visible;
}
#contentMain {
	width:              100%;
  height:             363px;
  position:           relative;
  top:                0;
  left:               0;
  background-color:   #000;
  z-index:            10;
}
#vidCarousel {
  width:              100%;
  height:             363px;
  position:           absolute;
  top:                0;
  left:               0;
  z-index:            499;
  overflow:           hidden;
  visibility:         hidden;
}

.stillCont {
  width:              640px;
  height:             363px;
  position:           absolute;
  top:                0;
  left:               0;
/*  background-color:   #bbb;*/
}
.stillCont img {
  position:           relative;
  z-index:            10;
}
.stillCont a.play {
	text-indent:        -9999px;
  width:              640px;
  height:             363px;
  display:            block;
  position:           absolute;
  z-index:            100;
  background:         transparent url(../images/bg_play.png) center center no-repeat;
  overflow:           hidden;
}
#vidCont {
	width:              100%;
	height:             363px;
  position:           absolute;
  top:                0;
  left:               0;
  z-index:            50;
  overflow:           hidden;
}
#vidCont #playerCont {
  width:              640px;
  height:             363px;
  margin:             0 auto;
  position:           relative;
  top:                -9999px;
  left:               -170px;
/*  background-color:   #bbb;*/
  overflow:           hidden;
  display:            block;
  z-index:-1;
}
#centerCont {
  width:              335px;
  margin:             0 auto;
  position:           relative;
  left:               337px;
  z-index:            500;
}
.nonvid #centerCont {
  width:              1010px;
  left:               0;
}
#metaCont {
  width:              335px;
  height:             363px;
  position:           relative;
  float:              right;
  overflow:           hidden;
}
#metaContFull {
  width:              1010px;
  height:             363px;
  position:           relative;
  overflow:           hidden;
}
#metaBg {
  width:              335px;
  height:             363px;
  position:           absolute;
  top:                0;
  left:               0;
  z-index:            10;
  overflow:           hidden;
  -moz-opacity:       0.6;
  -ms-filter:         "alpha(opacity=60)";
  filter:             alpha(opacity=60);
  opacity:            0.6;
  background-color:   #fff;
}
#metaData {
	font-family:        Arial,sans-serif;
  width:              295px;
  height:             330px;
  padding:            19px 20px 14px 20px;
  position:           relative;
  z-index:            100;
}
#metaContFull #metaBg {
  width:              100%;
}
#metaContFull #metaData {
  width:              auto;
  padding:            24px 40px 14px 40px;
}
#metaContFull #metaData .colLt {
  width:              620px;
  padding:            0 40px 0 0;
  float:              left;
}
#metaContFull #metaData .colRt {
  width:              270px;
  float:              left;
}
#metaContFull #metaData .colRt .imgCont {
	padding:            1px;
	border:             1px solid #888;
	background-color:   #eee;
  float:              left;
}
#metaContFull #metaData .colRt .imgCont img {
  display:            block;
}
#vidNav {
  height:             23px;
  position:           relative;
  z-index:            10;
  background:         #797d8a url(../images/bg_vid_nav.png) top center repeat-x;
}
#vidNav .wrapper {
  overflow:           hidden;
}
#dotNavOuter {
  position:           relative;
  top:                0;
  left:               50%;
  padding:            5px 0 0 0;
  float:              left;
}
#dotNavInner {
  position:           relative;
  top:                0;
  left:               -50%;
  float:              left;
}
#dotNavInner a {
  text-indent:        -9999px;
	width:              20px;
	height:             13px;
	margin:             0 5px;
  background:         transparent url(../images/dot_nav.png) 0 0 no-repeat;
  float:              left;
  display:            inline;
}
#dotNavInner a:hover,
#dotNavInner a.sel {
  background-position:0 -13px;
}
#hlContentTop,
#hlContentBtm {
	width:              100%;
  position:           absolute;
  left:               0;
  z-index:            1000;
  overflow:           hidden;
}
#hlContentTop {
  height:             11px;
  top:                0;
  background:         transparent url(../images/hl_content_top.png) top center repeat-x;
}
#hlContentBtm {
  height:             12px;
	bottom:             0;
  background:         transparent url(../images/hl_content_btm.png) top center repeat-x;
}
#footer {
  position:           relative;
}
#mdLogos a {
  margin:             0 8px 0 0;
  float:              left;
  display:            inline;
  border:             1px solid #bababa;
}
#mdLogos a img {
  border:             none;
  display:            block;
}

/* ==============================
  COMMON ELEMENTS
============================== */
input.hover {
  text-indent:        -9999px;
  height:             22px;
  cursor:             pointer;
}
ol {
	margin:            0 0 0 26px;
}
ul.bulleted {
  margin:            0 0 10px 2px;
}
ul.bulleted li {
  padding:           0 0 2px 9px;
  background:        transparent url(../images/bullet.gif) 0 0.5em no-repeat;
}

/* ==============================
  TOP NAVIGATION, HEADER, FOOTER
============================== */
#header h1 {
  position:           absolute;
  top:                0;
  left:               27px;
}
#header h1 a{
  text-indent:        -9999px;
  overflow:           hidden;
  display:            block;
  width:              183px;
  height:             170px;
  background:         transparent url(../images/rp_logo_hd.png) top left no-repeat;
}
#header h1 a img{
  display:            none;
}
h2 .mdDate {
	color:              #313132;
	font-weight:        normal;
	font-size:          0.55em;
}
#mdRuntime {
  color:              #313132;
  font-size:          1.15em;
  margin:             0 0 8px 0;
}
#metaData p {
	line-height:        1.3em;
	padding:            0 0 4px 0;
}
a#clipNavLt,
a#clipNavRt {
  text-indent:        -9999px;
  width:              31px;
  height:             68px;
  position:           absolute;
  top:                140px;
  overflow:           hidden;
  display:            block;
  background:         transparent url(../images/arrows_clip_nav.png) 0 0 no-repeat;
  -moz-opacity:       0.8;
  -ms-filter:         "alpha(opacity=80)";
  filter:             alpha(opacity=80);
  opacity:            0.8;
  cursor:             pointer;
  z-index:            600;
}
a#clipNavLt {
  left:               10px;
}
a#clipNavRt {
  right:              10px;
  background-position:-31px 0;
}
a#clipNavLt:hover,
a#clipNavRt:hover {
  -moz-opacity:       1;
  -ms-filter:         "alpha(opacity=100)";
  filter:             alpha(opacity=100);
  opacity:            1;
}
#footer ul {
  padding:             18px 0 7px;
}
#footer ul li {
	width:               330px;
	height:              80px;
	margin:              0 10px 0 0;
  padding:             0;
  float:              left;
  display:            inline;
  position:           relative;
  background:         transparent url(../images/bg_ft.png) 0 0 no-repeat;
}
#footer ul li.ftReel {
  background-position:0 0;
}
#footer ul li.ftAbout {
  background-position:-330px 0;
}
#footer ul li.ftContact {
  background-position:-660px 0;
	margin:              0;
}
#footer ul li.ftReel a,
#footer ul li.ftAbout a {
	text-indent:         -9999px;
	text-decoration:      none;
  width:               330px;
  height:              80px;
  display:            block;
  position:           relative;
  overflow:           hidden;
  z-index:            1;
}
#footer ul li.ftReel a:hover,
#footer ul li.ftAbout a:hover {
  text-decoration:      none;
}
#footer ul li.ftContact h5 {
  display:            none;
}
#footer ul li.ftContact p {
	color:              #eaeaea;
	line-height:        1.2em;
  text-align:         right;
  width:              288px;
  position:           absolute;
  top:                40px;
  left:               21px;
  z-index:            10;
  cursor:             pointer;
}
#footer ul li.ftContact p a,
#footer ul li.ftContact p a:hover {
  color:              #eaeaea;
  text-decoration:    underline;
}
#footer #credits {
	color:               #5b5b5b;
	line-height:         1.1em;
	text-align:         right;
	padding:             0 0 0 9px;
}
#footer #credits a {
	text-decoration:     underline;
  color:               #5b5b5b;
}

/* ==============================
  NAV
============================== */
ul#nav li {
  width:              187px;
  height:             43px;
  margin:             0 0 0 10px;
  float:              left;
  display:            inline;
  position:           relative;
  z-index:            1;
}
ul#nav li a {
	text-indent:        -9999px;
	width:              187px;
  height:             37px;
  display:            block;
  position:           relative;
  background:         transparent url(../images/btns_global_nav.png) 0 0 no-repeat;
  z-index:            20;
}
ul#nav li a.navFilm {
  background-position:0 0;
}
ul#nav li a.navTv {
  background-position:0 -37px;
}
ul#nav li a.navWeb {
  background-position:0 -74px;
}
ul#nav li a.navBrand {
  background-position:0 -111px;
}
ul#nav li a em {
  text-indent:        -9999px;
  width:              20px;
  height:             6px;
  display:            none;
  position:           absolute;
  top:                37px;
  left:               84px;
  background:         transparent url(../images/arrow_global_nav.png) 0 0 no-repeat;
  overflow:           hidden;
}
ul#nav li a.sel em,
ul#nav li a:hover em {
  display:            block;
}

/* ==============================
	UTILITY STYLES
============================== */
.hide {
	display:					  none;
}
.invisible {
  visibility:         hidden;
}
.faded {
  -moz-opacity:       0;
  -ms-filter:         "alpha(opacity=0)";
  filter:             alpha(opacity=0);
  opacity:            0;
}
.noBorderTop {
	border-top:          none !important;
}
.noMarginRt {
  margin-right:        0 !important;
}
.noPadRt {
  padding-right:       0 !important;
}
.noPadLt {
  padding-left:        0 !important;
}
.padTop {
  padding-top:         10px;
}
.padBtm {
  padding-bottom:      10px;
}
.floatLt {
	float:               left;
}
.floatRt {
  float:               right;
}
.noFloat {
	float:               none;
}
.ctr {
	text-align:          center;
}