@charset "utf-8";
/* CSS Document */

/**
 * Project:		PROJECT-TITLE
 * Purpose:		Global Styles
 * 
 * @author:		Andreas Prockl <ap@okapi.de>
 * @version:	1.0
 * @date:		11/2009
 */


/* TABLE OF CONTENTS:
---------------------------------------------------------------------------------------
	
	0:	CSS RESET & HELPERS:
	
		0.1:	CSS RESET:
		0.2:	AUTO-CLEAR & GLOBAL HELPERS
	
	1:	TYPOGRAPHY & LINK STYLING:
		
		1.0:	COLOURS:
		1.1:	TYPO:
		1.2:	LINKS:
	
	2:	STRUCTURE & LAYOUT
		
		2.1:	STRUCTURE
		
		2.2:	HEADER
				
		2.3:	NAVIGATION & MENU-LISTS
				
		2.4:	FOOTER
		
		2.5:	CONTENT

		
	
--------------------------------------------------------------------------------------	
*/



/*  >> 0.	CSS RESET & HELPERS:
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */

/*  		>> 0.1.	CSS RESET:
--------------------------------------------------------------------------------------- */

/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td 
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body { line-height: 1; }

ol, ul { list-style: none; }

/*
blockquote, q { quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after
{
	content: '';
	content: none;
}
*/

/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }

del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table
{
	border-collapse: collapse;
	border-spacing: 0;
}




/*  		>> 0.2.	AUTO-CLEAR & GLOBAL HELPERS:
--------------------------------------------------------------------------------------- */

.autoclear:after,
.col-box:after,
ul.pic-matrix:after,
ul.center-list:after,
ul.download-matrix:after,
div.press-plakat:after,
ul.partner-matrix:after
{
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}


.pic-sec
{
	position: relative;
	display: block;
	overflow: hidden;
}


.col-box
{
	position: relative;
	display: block;
}

.col
{
	position: relative;
	float: left;
	display: inline;
	line-height: 0.01%;
/*	overflow: hidden;	*/
}



/*  >> 1.	TYPOGRAPHY & LINK STYLING:
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */


/*  		>> 1.0.	COLOURS:
--------------------------------------------------------------------------------------- */


div#video-container p { color: #999; }

div#content { color: #000; }


/*  		>> 1.1.	TYPO:
--------------------------------------------------------------------------------------- */

body, h1, h2, h3, h4, h5, h6, p, a, li, th, td, input, textarea
{
	font-family: Arial, Helvetica, sans-serif;
/*	font-family: "Lucida Grande", "Lucida Sans Unicode", Arial,Verdana, sans-serif;	*/
}

body
{
	font-size: 12px;
	line-height: 16px;
}

input,
textarea { font-size: 13px; }

textarea { font-family: sans-serif, Arial, Helvetica; font-size: 13px; }


div#content p
{
	font-size: 12px;
	line-height: 1.3em;
}



/*  		>> 1.2.	LINKS:
--------------------------------------------------------------------------------------- */

a:link,
a:visited,
a:hover { text-decoration: none; }

div#video-container a:link,
div#video-container a:visited { color: #FFF; }
div#video-container a:focus,
div#video-container a:hover { color: #900; }

div.section li a:link,
div.section li a:visited,
div#content a.btn:link,
div#content a.btn:visited { color: #000; text-decoration: none; }
div.section li a:focus,
div.section li a:hover,
div#content a.btn:focus,
div#content a.btn:hover { color: #900; }

div.section li.selected a:link,
div.section li.selected a:visited,
div.section li.selected a:hover { color: #900; }

div.section a { color: #900; }

div.section a:link,
div.section a:visited { text-decoration: underline; }
div.section a:focus,
div.section a:hover { text-decoration: none; }



/*  >> 2.	STRUCTURE LAYOUT
---------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------- */

body { background-color: #900; color: #FFF; }



/*  		>> 2.1.	STRUCTURE:
--------------------------------------------------------------------------------------- */

html, body { height: 100%; }

div#wrapper
{
	position: relative;
	width: 900px;
	margin: 0 auto;
	min-height: 100%;
	height: auto !important;
	height: 100%;
}

	div#wrap-cnt {	padding-bottom: 106px; }
	
		div#header
		{
			position: relative;
			height: 172px;
		}
		
		ul#navigation
		{
			position: relative;
			margin-top: 20px;
			height: 35px;
			overflow: hidden;
			background-color: #000;
		}
		
		div#content
		{
			position: relative;	
			margin-top: 15px;
		}
		
		div#content div.col-box { padding: 15px 0 15px 0; background-color: #FFF; }
		
		div#content div.col-box.cnt-section { padding-top: 12px; }
		
		div#content div.col { margin: 0 5px 0 15px; }
		
		div#content div.col-w1 { width: 295px; }
		div#content div.col-w2 { width: 555px; }
		div#content div.col-full { width: 870px; padding-bottom: 10px; }


div#footer
{
	position: relative;
	margin-top: -46px;
	height: 46px;
	background-color: #000;
}

	div#footer ul
	{
		position: relative;
		width: 900px;
		margin: 0 auto;
	}



/*  		>> 2.2.	HEADER:
--------------------------------------------------------------------------------------- */

h1#btn-home
{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 505px;
	height: 145px;
	overflow: hidden;
}

h1#btn-home a 
{
	position: relative;
	display: block;
	width: 505px;
	height: 145px;
	background: url(../images/logo_raeuber.png) 0 0 no-repeat;
	text-indent: -9999px;
}

a#btn-zorro
{
	position: absolute;
	right: 0;
	bottom: 0;
	width: 122px;
	height: 66px;
	display: block;
	background: url(../images/logo_zorrofilm.png) 0 0 no-repeat;
	text-indent: -9999px;
}



/*  		>> 2.3.	NAVIGATION & MENU-LISTS:
--------------------------------------------------------------------------------------- */

ul#navigation { padding-left: 15px; }

ul#navigation li
{
	position: relative;
	height: 35px;
	overflow: hidden;
	float: left;
	margin-right: 20px;
}

#navigation a
{
	display: block;
	height: 35px;
	overflow: hidden;
	padding: 0 10px;
	background: url(../images/nav_main.png) no-repeat;
	background-position: 0 0;
	text-indent: -9999px;
}

li#nav-trailer a { width: 55px; }
li#nav-trailer a:link,
li#nav-trailer a:visited { background-position: -15px 0; }
li#nav-trailer a:focus,
li#nav-trailer a:hover,
li#nav-trailer.selected a { background-position: -15px -35px; }

li#nav-inhalt a { width: 81px; }
li#nav-inhalt a:link,
li#nav-inhalt a:visited { background-position: -111px 0; }
li#nav-inhalt a:focus,
li#nav-inhalt a:hover,
li#nav-inhalt.selected a { background-position: -111px -35px; }

li#nav-galerie a { width: 87px; }
li#nav-galerie a:link,
li#nav-galerie a:visited { background-position: -233px 0; }
li#nav-galerie a:focus,
li#nav-galerie a:hover,
li#nav-galerie.selected a { background-position: -233px -35px; }

li#nav-cast a { width: 84px; }
li#nav-cast a:link,
li#nav-cast a:visited { background-position: -361px 0; }
li#nav-cast a:focus,
li#nav-cast a:hover,
li#nav-cast.selected a { background-position: -361px -35px; }

li#nav-infos a { width: 135px; }
li#nav-infos a:link,
li#nav-infos a:visited { background-position: -486px 0; }
li#nav-infos a:focus,
li#nav-infos a:hover,
li#nav-infos.selected a { background-position: -486px -35px; }

li#nav-partner a { width: 62px; }
li#nav-partner a:link,
li#nav-partner a:visited { background-position: -662px 0; }
li#nav-partner a:focus,
li#nav-partner a:hover,
li#nav-partner.selected a { background-position: -662px -35px; }

li#nav-presse a { width: 90px; }
li#nav-presse a:link,
li#nav-presse a:visited { background-position: -765px 0; }
li#nav-presse a:focus,
li#nav-presse a:hover,
li#nav-presse.selected a { background-position: -765px -35px; }



/*  		>> 2.4.	FOOTER:
--------------------------------------------------------------------------------------- */

div#footer ul
{
	position: relative;
	height: 46px;
	overflow: hidden;
}

#footer li
{
	display: block;
	position: relative;
	float: left;
	height: 46px;
	overflow: hidden;
	background: url(../images/nav_footer.png) no-repeat;
	background-position: 0 0;
	text-indent: -9999px;
}

li#filminstitut	{ width: 50px; background-position: 0 0; }
li#orf 				{ width: 82px; background-position: -50px 0; }
li#fonds-wien		{ width: 75px; background-position: -132px 0; }
li#arte				{ width: 66px; background-position: -207px 0; }
li#zdf				{ width: 67px; background-position: -273px 0; }
li#fff				{ width: 85px; background-position: -340px 0; }
li#kultur-no		{ width: 104px; background-position: -425px 0; }
li#ffa				{ width: 61px; background-position: -529px 0; }
li#jung				{ width: 41px; background-position: -590px 0; }
li#dolby				{ width: 61px; background-position: -631px 0; }
li#ngf				{ width: 96px; background-position: -692px 0; }
li#heilrath			{ width: 76px; background-position: -788px 0; }
li#fd					{ width: 36px; background-position: -864px 0; }



/*  		>> 2.5.	CONTENT:
--------------------------------------------------------------------------------------- */

/* TRAILER */
div#content div#video-container
{
	position: relative;
	width: 900px;
	height: 538px;
	margin: 0;
}

div#content div#video-container.small
{
/*	height: 372px;	*/
	height: 392px;
	text-align: center;
	background-color: #000;
	width: 630px;
}

	div#video-container.small div.flash-content { width: 612px; }

div#content div#trailer-sidebar
{
	width: 260px;
	height: 392px;
	margin: 0 0 0 10px;
	background-color: #000;
}

div#trailer-sidebar img { margin: 10px 0 0 20px; }

img#kinostart
{
	position: relative;
	display: block;
	margin: 22px auto 0;
}


/* GALLERY */
ul.pic-matrix
{
	position: relative;
	display: block;
	background-color: #FFF;
	padding: 15px 0;
}

ul.pic-matrix li
{
	position: relative;
	float: left;
	width: 162px;
	height: 162px;
	overflow: hidden;
	padding: 0 0 15px 15px;
	font-size: 0.01em;
	line-height: 0.01%;
	display: inline;
}

ul.pic-matrix li a
{
	position: relative;
	display: block;
	width: 162px;
	height: 162px;
	overflow: hidden;
}

ul.pic-matrix li img
{
	position: relative;
	display: block;
	z-index: 101;
}

ul.pic-matrix a span
{
	position: absolute;
	top: 0;
	display: block;
	width: 150px;
	height: 150px;
	border: 6px solid #FFF;
	z-index: 110;
}

ul.pic-matrix li a:link,
ul.pic-matrix li a:visited { background-color: #FFF; }
ul.pic-matrix li a:focus,
ul.pic-matrix li a:hover { background-color: #CCC; }

ul.pic-matrix li a:link span,
ul.pic-matrix li a:visited span { display: none; }
ul.pic-matrix li a:focus span,
ul.pic-matrix li a:hover span { display: block; }


/* SLIMBOX CUSTOM */
div#lbBottomContainer div#lbNumber { /* display: none; */ padding-left: 10px; }

div#lbBottom { border-width: 0 10px 0 0; }
a#lbCloseLink { margin-top: 0; }

div#lbCenter { overflow: visible; }

a#lbPrevLink
{
	left: 0;
	margin-left: -56px;
	padding-left: 56px;
}

a#lbNextLink
{
	right: 0;
	margin-right: -56px;
	padding-right: 56px;
}

a#lbPrevLink:hover {	background: transparent url(../images/sb_prevlabel.png) no-repeat 0 50%; }
a#lbNextLink:hover { background: transparent url(../images/sb_nextlabel.png) no-repeat 100% 50%; }



/* CAST & CREW */
div.col-w1 div.section { padding-bottom: 15px; padding-top: 3px; }
div.col-w2 div.section { padding-bottom: 18px; }

div.section h2
{
	font-size: 18px;
	line-height: 1.2em;
	color: #000;
	text-transform: uppercase;
	border-bottom: 3px solid #000;
	margin-bottom: 6px;
/*	margin-top: -3px; */
	clear: both;
}

div.section h3
{
	text-transform: uppercase;
	padding-bottom: 2px;
	border-bottom: 3px solid #000;
	margin-bottom: 6px;
	clear: both;
}

div.col-w1 div.section li { padding-bottom: 4px; }

div.section h3,
div.section li a,
ul.center-list li
{
	font-size: 12px;
	line-height: 1.3em;
	color: #000;
}

ul.center-list li
{
	line-height: 1.8em;
	display: block;
	clear: left;
}

ul.center-list li strong
{
	width: 262px;
	text-align: right;
	float: left;
}
ul.center-list li span
{
	float: left;
	padding-left: 10px;
	text-transform: uppercase;
}

div.vis-cnt,
div.txt-cnt
{
	position: relative;
	float: left;
}

div.vis-cnt
{
	width: 210px;
	overflow: hidden;
	margin-right: 10px;
	padding-top: 2px;
}

div.txt-cnt { width: 335px; }
div.txt-cnt.f-width { width: 555px; }

div.txt-cnt.f-width img
{
	float: left;
	margin: 2px 10px 10px 0;
}

div.section li a,
a.btn
{
	display: inline-block;
	background: url(../images/bg_arrow_black.png) -2px 2px no-repeat;
	padding-left: 7px;
}


/* PARTNER */
div.partner-wrapper
{
	position: relative;
	width: 870px;
	overflow: hidden;
	padding-bottom: 25px;
}

ul.partner-matrix
{
	position: relative;
	margin-left: -50px;
	width: 920px;
}

ul.partner-matrix li
{
	position: relative;
	width: 410px;
	overflow: hidden;
	float: left;
	display: inline;
	margin-top: 25px;
	margin-left: 50px;
}

div.section ul.partner-matrix li a
{
	background: none;
	padding: 0;
	font-weight: bold;
	text-transform: uppercase;
}

div.section ul.partner-matrix li a:link,
div.section ul.partner-matrix li a:visited { color: #FFF; }
div.section ul.partner-matrix li a:focus,
div.section ul.partner-matrix li a:hover { color: #900; }

div#content ul.partner-matrix li p
{
	position: relative;
	display: block;
	width: 410px;
	height: 25px;
	background-color: #000;
	padding: 0;
	text-align: center;
	line-height: 25px;
}



/* HINTERGRUND-INFOS */

div#content img.buchcover
{
	position: relative;
	display: block;
	margin-top: 0;
	margin-left: -3px;
	margin-right: 5px;
}



/* DOWNLOAD-AREA */

ul.download-matrix
{
	position: relative;
	width: 570px;
	margin-left: -15px;
}

ul.download-matrix li
{
	position: relative;
	float: left;
	display: inline;
	width: 175px;
	height: 123px;
	overflow: hidden;
	margin-left: 15px;
}

div.section ul.download-matrix li a
{
	padding-left: 0;
	background-image: none;
	display: block;
	width: 175px;
	height: 98px;
}

div.section ul.download-matrix li a span.btn
{
	background: url(../images/bg_arrow_black.png) no-repeat scroll -2px 2px;
	display: block;
	padding-left: 7px;
}

div.press-plakat
{
	position: relative;
	padding-bottom: 15px;
	
}

div.press-plakat a.plakat
{
	float: left;
	margin-right: 10px;
	display: block;
	width: 113px;
}

div.press-plakat ul
{
	float: left;
	position: absolute;
	bottom: 15px;
	left: 123px;
}



/* TEXT IN GENERAL */
div#content div.col-box p { padding-bottom: 1.2em; }

div#content p span.sep { display: inline-block; padding: 0 3px; }