@import 'navigation.css';
/*
@import 'normalize.css';
@import 'layout.css';
@import 'colors.css';
@import 'typography.css';
*/

/*
  #############################
  #   A P P L I C A T I O N   #
  #############################

  @author: mgruschetzki
  @created: 09|07|2007
	@updated: 23|12|2007

*/

html {
  background:#eee;
}


#branding {
  background:#fff url(../images/prototype/branding_bg.jpg) repeat-x;
}


#content {
	color: #444;
  background: transparent;
}

#site-info {
	color: #bbb;
	border-top:1px solid #eee;
  background: #fff;
}
body.home li.project-info, body.home li.project-title, body.home h2{
    color:#F3DEB2;
    background-color: #A65400;
}

body.about h2, body.about .company{
	color:#A65400;
}
/*******************************************************************/
* { margin:0;padding:0;}
a { text-decoration: none;}
abbr { border:none;} 
em {	font-style: normal;}
html, body, #content{
	height: 100%;
}

a img {
	border:none;
}

body {
  position: relative;
  font-size: 62.5%;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  width: 80.2em;
	overflow:visible;
  margin:0 auto;
  text-align:center;
  background:#fff;
  
}
#container {
	position:relative;
	min-height:100%;
	border:1px solid #ccc;
	background:#fff;
}
ul,ol{
    list-style:none;
}
#content a,#site-info a {
	color:#888;
	text-decoration: underline;
}

/* MSIE display:inline-block is to make sure MSIE doesn't paint the backround above the containers, the overflow declaration is to make sure the containers do not drop below siblings if content pushes the width (in modern browsers it doesn't drop, but it spawns an orizontal scrollbar)  */
#branding,#navigation,#content ,#site-info {
  overflow:hidden;
  display:inline-block;
  text-align:left;
}
#branding,#navigation,#site-info,#content {
  width:100%
} /* safari and opera need this */

#branding {
    z-index:1;
    height: 150px;
}
#branding h1{
    margin-top:40px;
		margin-right:25px;
    text-align: right;
}

#content{
	position: relative;
}

#content-main {
  position:relative;
  width: 58.375%;
	padding-bottom:90px;
  float:right;
}

p {
	width:360px;
}

/*  H O M E  */

body.home h2#de {
	position: relative;
	padding-top:17px!important;
	color: #fff;
	font-weight: normal;
	height: 83px;
}

body.home h2 {
	position: relative;
	border-top:1px solid #fff;
	padding-top:17px!important;
	margin-left:0;
	color: #fff;
	font-weight: normal;
	height: 107px;
}

body.home h2 strong {
	position: absolute;
	display: block;
	left:20px;
	top:60px;
	font: 22px/110% "Walbaum",georgia, serif;
}

body.home h3 {
	font-weight: normal;
	padding:0;
	margin:0;
}

body.home .introduction {
	margin-top: 35px;
}



#content-main ul li, #content-main h2, p#more-about-project {
	padding:0 20px;
}
#content-main ul li ul li{
	padding-left:0px;
}
#content-main .project-titel {
	padding:0;
	margin:0;
}
.branding {
	font-family: Arial, sans-serif;
	letter-spacing: 1px;
}
.branding span {
	font-weight:bold;
}
body.home .project-info {
    height: 92px;
}

/* NEXT 2 ITEM NEW FOR EXTRA-INFO CLASS new for home extra info */
body.home .extra-info {
    position: absolute;
		top: 254px;
		font-size: 10px!important;
		right:100%;
		width:313px;
		padding-right:0!important;
		padding-left:0!important;
		color:#666;
}		

body.home .extra-info p {
	width:300px;
}	

body.home .extra-info img {
	float:right;
}	

body.home .extra-info strong {
	color:#A65400;
}

/* end new items */

body.home .de .project-info {
    height: 116px;
}

/*  PROJECTS  */

body.projects .project-title h2{
	margin-top:0px;
	margin-bottom:0px;
	margin-left:0;
	line-height:100%!important;
}
body.projects .project-title p{
	margin-top:0px;
	margin-bottom:16px;
}

body.projects .project-info {
    position: absolute;
		top: 254px;
		font-size: 10px!important;
		right:100%;
		width:313px;
		padding-right:0!important;
		padding-left:0!important;
		color:#666;
		
}
body.projects .view a span{
	display: none;
}
body.projects .view a:hover span{
	z-index:10000;
	display: block;
	position: absolute;
	top:30%;
	left:35%;
	color: #fff;
	background-color: #333;
	padding: 10px;
	border: 1px solid #fff;
}

body.projects .view.image p#player{
	display: none;
}

body.projects .view.show_trailer p#image-mederos {
	display: none;
}

body.projects .project-info ul li{
		width:100%;
		padding-right:0!important;
		font-size:11px;
}

.introduction p, .long-description p, .about ul li p {
	margin-bottom: 16px;
}


.genre, .runtime em, .format em,.production em,.aspect-ratio em
{
	display:block;
  margin:-1px 0 0 0;
  padding:0;
  width:0;
  text-align:left!important;
  text-indent: -9999px!important;
  height:1px!important;
  overflow:hidden;
}

.version-one .runtime, .version-one .aspect-ratio, .version-one .format{
	float:left;
}
.production ,.events{
	margin-top: 16px;
	clear:left;
}
.events span.location{
	display: block;
}
.events ul{
	margin-top:8px;
}

li.vevent{
	margin-bottom: 16px;
}

li.vevent strong {
	font-family: Arial, Helvetica, sans-serif;
	color:#A65400;
}

.delivery {
	margin-top:17px;
}

li.view {
    position: absolute;
    right: 100%;
    height:256px;
    top: 0;
    text-align: right;
    background-color: transparent;
}

li.view, li.view p {
  padding:0!important;
	width: 333px;
}
body.projects li.view {
	height:232px;
}

li.project-info .summary abbr {
	display: block;
}

/*  CONTACT  */


body.contact #content {

	background:#fff url(../images/prototype/about_bg_content-main.jpg) no-repeat left -7em;
}

body.contact #content-main {
	position: relative;
	height:210px;	
}

body.contact #content-main li{
	margin-right: 0;
	padding-right: 0;	
}

body.contact h2{
	position:relative;
	margin-left:0!important;
	margin-bottom:16px;
}
body.imprint h2 {
	padding:0!important;
	margin-left:0px!important;
	margin-bottom:16px;
}
body.imprint p {
	line-height: 140%;
	margin-bottom:14px;
	font-size:11px;
	
}
body.imprint p strong{
	color:#888;
	
}

.type, .region {
	display:none;
}
body.contact .e {
	margin-top:0px!important;
}
body.contact strong {
	font-weight: normal;
	color:#000;
}

#contact-spain, #contact-germany{
	position: relative;
	float:left;
	width: 45%;
	height:200px;
	padding:0!important;
	margin:0!important;
	overflow:hidden;
}


/*  ABOUT  */

body.about #content-main li a {
	text-decoration: underline;
	color:#A65400!important;
}

body.about #content {
	background:#fff url(../images/prototype/about_bg_content-main.jpg) no-repeat left top;
}

body.about #content-main h2{
	margin-bottom: 16px!important;
	margin-top:-3px;
	margin-left:0;
}

#imprint {
	padding-top:32px;
	clear:both;
}
#site-info {
	position: absolute; /* was: position: absolute; */
	margin-top: 30px;
	bottom:10px;
	
	right:0px;
	width:100%;
	clear: left;
}
#site-info p {
	position: relative;
	left:90px;
	text-align: left;
	width:100%;
	padding:3px 0 0 0;
	font-size: x-small;
}
h1,h2,h3,p,li,pre {
  /*padding: 10px;*/
  font-size: 12px;
	line-height: 140%;
}

body.projects #content-main h2 {
	font-size:22px;
	font-weight: normal;
	font: 22px/140% "Walbaum",georgia, serif;
	padding-bottom:0;
	padding-left:0;
}

.supplementary-info {
  display:block;
  margin:-1px 0 0 0;
  padding:0;
  width:0;
  text-align:left!important;
  text-indent: -9999px!important;
  height:1px!important;
  overflow:hidden;
}