/* @override http://travisdmathews.com/workspace/css/core.css */
/************************************
	http://www.travisdmathews.com
	core.css, v1.0
	2010 07 19
	designed and coded by
	Kyle McGuire, kyle@kymcism.com
*************************************/
@import url("reset.css");

body {
	color: #ddd;
	background: #1e7486;
	font: .625em "Lucida Grande", Lucida, Verdana, sans-serif;
	line-height:2em
	}
a {
	text-decoration: none;
	}
div.masthead {
	position: absolute;
	height: 30px;
	top: -1.625em;
	left: -10px;
	color: #fff;
	letter-spacing: 5px;
	text-transform: uppercase;
	font: bold 2.5em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	}
.masthead h1 a {
	color: #fff;
	}
div.content-frame {
	margin:-210px 0 0 -370px ;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 720px;
	height: 400px;
	border: 10px solid #fff;
	}
div.content {
	position: relative;
	top:0;
	left: 0;
	width: 720px;
	height: 400px;
	overflow: hidden;
	}
	
div.nav-main { 
	position: absolute;
	bottom: -3.25em;
	right: -1em;	
	}
.site-credit {
	position:absolute;
	bottom: -3em;
	left:-1em;
	padding: 5px 0 0 0;
	color: #789399;
	}
.site-credit a {
	color: #76a7b1;
	}
	
/* @group Navigation Menu Styles */
.nav-main ul li {
	display: inline;
	letter-spacing: 2px;
	padding: 0 0 0 8px;
	}
.nav-main a {
	color:  #fff;
	text-transform:uppercase;
	font: bold 1.3em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	}
.nav-main a:hover {
	color: #9f2125;
	}
.close a {
	display:block;
	width:20px;
	height: 20px;
	position: absolute;
	top:5px;
	left: 320px;
	z-index:500;
	text-indent: -9999px;
	background:url(../int-img/close.png) left center no-repeat;
	}
.close a:hover {
	background:url(../int-img/close.png) center center no-repeat;
	}
.close a:active {
	background:url(../int-img/close.png) right center no-repeat;
	}
/* @end */
/* @group Module Divs */
.left-strip, .left-square, .left-wide, .right-wide, .right-revsquare
	{
	position:absolute;
	padding: 20px 20px 20px 20px;
	top: 0;
	background: rgba(14,11,14,0.8);
	height:360px;
	overflow:hidden;
	z-index: 100;
	}	
body.has-js .left-strip, body.has-js .left-square, body.has-js .left-wide, body.has-js .right-wide, body.has-js .right-revsquare
	{
	opacity: 0;
	width:0;
	box-shadow:#000 0px 0px 10px;
	-webkit-box-shadow:#000 0px 0px 10px;
	-moz-box-shadow:#000 0px 0px 10px;
	}
body.isiPhone .left-strip, body.isiPhone .left-square, body.isiPhone .left-wide, body.isiPhone .right-wide, body.isiPhone .right-revsquare
	{
	overflow: auto !important;
	}
div.scroll-container
	{
	height:320px;
	overflow: auto;
	}
body.has-js div.scroll-container
	{
	height:320px;
	overflow: hidden;
	}
body.has-js.isiPhone div.scroll-container
	{
	overflow: auto;
	}
.left-strip, .left-square, .left-wide {
	border-right: 10px solid #fff;
	left: 0;
	}
.right-revsquare, .right-wide {
	border-left: 10px solid #fff;
	right: 0;
	}
.left-strip
	{
	width: 126px;
	}
.left-square
	{
	width: 360px;
	}
.left-wide {
	width: 500px;
	}
.right-wide {
	width: 500px;
	}
.right-revsquare{
	width: 270px;
	}
.bg-underlay {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	height: 400px;
	width: 720px;
	z-index: 10;
	}

	
/* @end */

/* @group Text Styles */
.content p {
	padding:0 0 10px 0;
	}
.article {
	padding: 0 20px 0 0;
	font: 1.3em/1.75em "Helvetica Neue", Helvetica, sans-serif;
	}
.content a {
	color: #126a81;
	}
.content a:visited {
	color: #70a19b;
	}
.content a:hover {
	color: #9f0036;
	}
.content h2 {
	letter-spacing: 6px; 
	padding: 0 0 23px 0;
	font: 1.5em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	text-transform: uppercase;
	}
.content h3, .info-popup h3, .embed-popup h3 {
	letter-spacing: 2px;
	padding: 15px 0 4px 0;
	margin: 0 0 10px 0;
	font: 1.4em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	border-bottom: 3px solid #bbaa20;
	}
	
.content h4 {
	font: 1.3em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	font-weight: bold;
	padding: 0 0 7px 0;
	}
blockquote {
	font: 1.3em/1.8em "Helvetica Neue", Helvetica, sans-serif;
	padding: 0;
	text-align: left;
	}
cite {
	font-size: 1.1em;
	line-height: 1em;
	display: block;
	padding: 0;
	margin: 0;
	color: #888;
	font-weight: normal;
	font-style: normal;
	}
pre {
	width: 540px;
	height: 150px;
	overflow: auto;
	white-space: normal;
	background:#222;
	padding: 10px;
	}

/* @end */


/* @group Page Specific Styles */

#movies-page .content .movie-listing li {
	padding: 0 0 10px 0;
	}
#contact-page .content h3	{
	border: none;
	padding: 0;
	}
#contact-page .content ul	{
	border: none;
	padding: 10px 0 10px 0;
	}
#screenings-page .content ul {
	padding: 0 0 20px 0;
	}
#news-page h3 {
	position: relative;
	padding: 0 3.5em 5px 0;
	}
#news-page .article {
	margin: 0 40px 20px 30px;
	}
#news-page span.date {
	font-size: .625em;
	position: absolute;
	bottom:9px;
	right: 0;
	}
#press-page .scroll-content ul li { 
	padding: 20px 70px 10px 80px; /*was 20px 40px 20px 80px*/
	position: relative;
	}
#press-page .content p {
	padding:0 0 5px 0;
	}
#press-page .scroll-content li .date {
	position: absolute;
	left: 0px;
	top: 18px;
	width: 60px;
	}
#video-page .movie-info {
	display: none;
	}
#video-page .info-popup, #video-page .embed-popup {
	background: #000;
	height:400px;
	padding: 10px 80px 10px 80px;
	font: 1.3em/1.75em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	}
#video-page .info-popup a, #video-page .embed-popup a {
	color: #126a81;
	}
	
.embed-popup textarea {
	margin: 20px 0 0 0;
	width: 555px;
	height: 100px;
	}

/* @group 
Movies Listing Page */
#video-page .content .movie-listing img {
	display: block;
	padding: 0 0 4px 0;
	}
#video-page .content .movie-listing li {
	padding: 0 0 20px 0;
	}
/* @end */


/* @end */


/* @group Video Thumbnail Listings */
#video-page .movie-details {
	padding: 0 0 0px 106px;
	height: 7em;
	}
#video-page ol li {
	position: relative;
	padding: 0 0 10px 0;
	}
#video-page ol li p {
	line-height: 1em;
	margin: 0;
	}
#video-page ol li div.icon {
	position: absolute;
	top: 0px;
	left: 0px;
	}
#video-page .icon a span.play-icon {
	display: block;
	width: 96px;
	height: 53px;
	position: absolute;
	top: 0;
	left: 0;
	text-indent: -9999px;
	}
#video-page .icon a:hover span.play-icon {
	background: url(../int-img/icon-play.png) no-repeat center center;
	
	
	}
#video-page p {
	margin: 0 0 .25em 0;
	}


/* @end */

/* @group Pagination Controls */
ul.pagination {

	position: absolute;
	top: 10px;
	right: 40px;
	margin: 10px 0px;
	}
ul.pagination li {
	display: inline-block;
	}
ul.pagination li a {
	display: block;
	height: 20px;
	color:#fff;
	padding: 0 5px 0 5px;
	}
ul.pagination li.ellipsis {
	color: #fff;
	}
ul.pagination li a.page {
	}
ul.pagination li a:hover {
	background-color: rgba(255, 255, 255, .25);
	color: #fff;
	}
ul.pagination li.selected a.page {
	color: #fff;
	background-color: rgba(255, 255, 255, .125);
	}
ul.pagination li.disabled a {
	display:none;
	}
ul.pagination li a.pagination-previous, ul.pagination li a.pagination-next {
	}
/* @end */

/* @group Scroll Bar */

.jScrollPaneContainer {

	position: relative;

	overflow: hidden;

	z-index: 1;

	}



.jScrollPaneTrack {

	position: absolute;

	cursor: pointer;

	right: 0;

	top: 0;

	height: 100%;

	}

.jScrollPaneDrag {

	position: absolute;

	

	cursor: pointer;
	background: url(../int-img/scroll-bar-fill.png) repeat-y left top;
	}
.jScrollPaneDrag:hover {

	background: url(../int-img/scroll-bar-fill.png) repeat-y center top;

	}
.jScrollPaneDrag:active {

	background: url(../int-img/scroll-bar-fill.png) repeat-y right top;

	}

.jScrollPaneDragTop {

	position: absolute;

	top: -5px;

	left: 0;

	overflow: hidden;
	height: 5px;
	width: 10px;
	background: url(../int-img/scroll-bars.png) no-repeat left -20px;
	}
.jScrollPaneDrag:hover .jScrollPaneDragTop {
	background: url(../int-img/scroll-bars.png) no-repeat center -20px;
	}
.jScrollPaneDrag:active .jScrollPaneDragTop {
	background: url(../int-img/scroll-bars.png) no-repeat right -20px;
	}

.jScrollPaneDragBottom {

	position: absolute;

	bottom: -5px;

	left: 0;

	overflow: hidden;
	height: 5px;
	background: url(../int-img/scroll-bars.png) no-repeat left -25px;
	}

.jScrollPaneDrag:hover .jScrollPaneDragBottom {
	background: url(../int-img/scroll-bars.png) no-repeat center -25px;
	}
.jScrollPaneDrag:active .jScrollPaneDragBottom {
	background: url(../int-img/scroll-bars.png) no-repeat right -25px;
	}
a.jScrollArrowUp {

	display: block;

	position: absolute;

	z-index: 1;

	top: 0;

	right: 0;

	text-indent: -2000px;

	overflow: hidden;

	height: 10px;
	background: url(../int-img/scroll-bars.png) left top;
	}

a.jScrollArrowUp:hover {

	background: url(../int-img/scroll-bars.png) center top;

	}
a.jScrollArrowUp:active {

	background: url(../int-img/scroll-bars.png) right top;

	}



a.jScrollArrowDown {

	display: block;

	position: absolute;

	z-index: 1;

	bottom: 0;

	right: 0;

	text-indent: -2000px;

	overflow: hidden;

	height: 10px;
	background: url(../int-img/scroll-bars.png) no-repeat left -10px;
	}

a.jScrollArrowDown:hover {

	background: url(../int-img/scroll-bars.png) no-repeat center -10px;

}
a.jScrollArrowDown:active {

	background: url(../int-img/scroll-bars.png) no-repeat right -10px;

}

a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {

	/*background-color: #f00;*/

}
/* @end */
/* @group Colorbox */
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    ColorBox example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:#211505;}

#colorbox{}
	#cboxTopLeft{width:30px; height:30px;}
	#cboxTopCenter{height:30px;}
	#cboxTopRight{width:30px; height:30px; }
	#cboxBottomLeft{width:20px; height:30px; }
	#cboxBottomCenter{height:30px; }
	#cboxBottomRight{width:30px; height:30px; }
	#cboxMiddleLeft{width:30px; }
	#cboxMiddleRight{width:30px; }
	#cboxContent{}
		#cboxLoadedContent{border: #fff 10px solid; background: #fff;}
		#video-page #cboxLoadedContent{border: #372c1e 10px solid; background: #372c1e scroll;}
		#cboxLoadingGraphic{background:url(../int-img/loading.gif) center center no-repeat;}
		#cboxLoadingOverlay{background:#fff;}
		#cboxTitle{text-indent: -9999px; visibility: hidden;}
		#cboxCurrent{text-indent:-9999px; visibility: hidden;}
		#cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{width:20px; height:20px; position:absolute; background:url(../int-img/controls.png) 0 0 no-repeat; text-indent: -9999px; bottom:-27px;}
		#cboxPrevious{background-position:0px 0px;  left:0px;}
		#cboxPrevious.hover{background-position:0px -20px;}
		#cboxNext{background-position:-20px 0px; left:30px;}
		#cboxNext.hover{background-position:-20px -20px;}
		#cboxClose{background-position:-80px 0px; top: -22px; right: -4px;}
		#cboxClose.hover{background-position:-80px -20px;}
		/*.cboxSlideshow_on #cboxSlideshow{background-position:-60px 0px; left:20px;}
		.cboxSlideshow_on #cboxSlideshow.hover{background-position:-60px -20px;}
		.cboxSlideshow_off #cboxSlideshow{background-position:-40px 0px; left:20px;}
		.cboxSlideshow_off #cboxSlideshow.hover{background-position:-40px -20px;}*/

/* @end */