

body {
	background-color: #505050;
	text-align:center;
	color: #fff;
}

a {
color: #f99925;
}
a:hover {
color: #fff;
}

.film:hover {
color: #fff;
text-decoration: none;
transition: all 1s;
font-size:120%;
}

.film:hover a {
color: #fff;
text-decoration: none;
transition: all 1s;
font-size:120%;
}

.film:hover img {
max-width: 160px;
transition: all 1s;
}
.film:hover p {
opacity:1;
transition: all 1s;
}





#container {
	margin-bottom: 80px;
}

small {
	color: #fff !important;
}

#logo {
	width:75%;
	max-width: 280px;
	height: auto;
	margin-top: 80px;
	margin-bottom: 80px;
	margin-left: auto;
	margin-right: auto;
}

.film {
opacity:1;
padding: 30px;
}
.film:before {
  content: "";
  position: absolute;
  top: 0; 
  left: 0;
  width: 100%; 
  height: 100%;  
  opacity: .2; 
  z-index: -1;
	background-image: url("../images/circle.svg");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
transition: all 1s;

}
.film:hover:before {
  opacity: 1; 
transition: all 1s;
}


.film img {
	width:75%;
	max-width: 120px;
	height: auto;
	padding-top: 10px;
	padding-bottom: -10px;
}

.film p {opacity:0;
transition: all 1s;
text-decoration:underline;
}

.film a h3 {
text-transform: uppercase;
}

.lastfilm {
	margin-bottom: 80px;
}

.footer {
padding-bottom: 50px;
}
