#film .top {
}

#front {
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
  display:block;
  position:fixed;
  top:0;
  bottom:0;
  left:0;
  right:0;
  width:100%;
  height:100%;
  z-index:1;
}

#front .highlight {
	font-family:Lato, sans-serif;
	position: fixed;
	bottom:20px;
	left:20px;
	color:white;
	font-size:2em;
	line-height: 0.9em;
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);
	max-width: 60%;
  height:50px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#film {
  position:relative;
  z-index:50;
}

#film .rest {
	width:500px;
	float:right;
	clear:both;
	background:url('../img/home-film.png') repeat-y top right;
}

#film .topfilm {
	margin-top:20%;
	width:500px;
	height:60px;
	float:right;
	background:url('../img/home-film-top.png') no-repeat top right;
}

#film .rest .content {
	padding-left:165px;
}

#film .rest .box a {
	display:block;
	width:280px;
	height:155px;
	margin:10px 0;
	background-repeat: no-repeat;
	background-position: center center;
  	background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;
	color: white;
}

#film .rest .box a:after {
    content: ' ';
    display: block;
    float: right;
    border-radius: 50% 0 50% 50%;
    margin: 0;
    width: 20px;
    height: 20px;
    background: none;
    opacity: 0.4;
}

#film .rest .box a span {
	display:block;
	position:absolute;
	bottom:0;
	right:0;
	line-height: 0.9em;
	padding-left:5px;
	text-align: right;
	text-shadow: 0px 0px 4px rgba(0, 0, 0, 1);
	background-color: rgba(0,0,0,0.2);
	padding: 5px 5px;
	width: 100%;
}

#film .rest .box a { opacity: 0.9; position:relative; }
#film .rest .box a:hover { opacity: 1; }

#film li {
	border-bottom: 1px solid white;
	width: 100%;
	text-align: center;
	padding: 5px 0;
}
#film li a {
	color:white;
}

#film ul#menu {
    margin: 0 0 50px 20px;
}

@media only screen and (max-width: 800px) {

	body.home {
		background:none !important;
	}

	#front {
		position:static;
  }
	#front .highlight {
		position:static;
		padding: 200px 0 30px 10px;
		text-align:center;
		max-width: 100%;
	}

	#film .rest, #film .topfilm {
		float: none;
	}

	#film .rest {
		background:black;
		width:100%;
	}
	#film ul {
		width:100%;
	}
	#film .rest .content {
		padding:5px;
	}
	#film .rest .box a {
		width:auto;
		height:250px;
		font-size:1.2em;
	}
	#film .topfilm {
		display:none;
	}
}