body
{
	background:				#f8f8f8;
	overflow-x:				hidden;
}

#top
{
	height:					275px;
}


/* BEGIN HEADER */

#top-bar
{
	width: 					100%;
	height: 				0;
	border-left: 			1200px solid transparent;
	border-right: 			800px solid transparent;
	border-top: 			40px solid #860038;
	-webkit-transition: 	all 0.8s ease;
            transition: 	all 0.8s ease;
}

#header-container
{
	position:				fixed;
	-webkit-transition: 	all 0.8s ease;
            transition: 	all 0.8s ease;
}

header
{
	padding:				40px 0 40px 0;
	-webkit-transition: 	all 0.8s ease;
            transition: 	all 0.8s ease;
	position:				relative;
	z-index:				999999;
}

#header-container.is-stuck header {
	padding-top:			0;
	padding-bottom:			20px;
}

#header-container.is-stuck #top-bar {
	border-top: 			20px solid #860038;
}

#header-container.is-stuck {
	box-shadow:				0px 0px 40px rgba(0,0,0,0.05);	
	background:				#fff;	
}

/* BEGIN LOGO */

#logo
{
	background:				url('img/logo.png') no-repeat;
	background-size:		185px 100px;
	height:					100px;
	width:					185px;
	text-indent: 			-9999px;
}

/* END LOGO */

header p {
	float:					right;
	padding-top:			40px;
	margin:					0;
	font-family:			'Calligraffitti', cursive;
	font-size:				30px;
	color:					#222;
}

/* BEGIN NAVIGATION */

#main-nav
{
	float:					right;
}

#main-nav li
{
	display:				inline;
}

#main-nav li a {
	padding:				0 20px;
	font-family: 			'Tajawal', sans-serif;
	text-decoration:		none;
	color:					#222;
	font-size:				18px;
	text-transform:			uppercase;
	letter-spacing:			2px;
}

#main-nav li:first-child a
{
	padding-left:			0;
}

#main-nav li:last-child a
{
	padding-right:			0;
}

/* END NAVIGATION */

/* END HEADER */

#home {
	margin-top:				50px;
	padding-bottom:			100px;
}

#slideshow
{
	height:					500px;
	background:				url('img/1.jpg') no-repeat;
	background-size:		cover;
	transform: 				perspective(10px) rotateY(-0.1deg) translateZ(-1px) scale(1.1);
	margin-top:				20px;
	margin-bottom:			40px;
	overflow:				hidden;
	position: 				relative;
}

#slideshow-small 
{
	height:					300px;
	width:					100%;
	background:				url('img/1.jpg') no-repeat;
	background-size:		cover;
}

#vid
{
  position: absolute;
  top: 50%; 
  left: 50%;
  transform: translate(-50%,-50%);
  min-width: 100%; 
  min-height: 100%; 
  width: auto; 
  height: auto;
  z-index: -1000; 
  overflow: hidden;
}

#featured-text
{
	background:				url('img/trianglify.png') no-repeat;
	background-size:		cover;
	padding:				75px 125px;
	transform: 				perspective(10px) rotateY(0.1deg) translateZ(-1px) scale(1.1);
	margin-bottom:			20px;
	position: 				relative;
}

#home h1
{
	font-family:			'Calligraffitti', cursive;
	font-size:				34px;
	font-weight:			300;
	color:					#fff;
	letter-spacing:			0.5px;
}

#home h2
{
	font-family:			'Tajawal', sans-serif;
	font-size:				22px;
	line-height:			32px;
	font-weight:			300;
	color:					#fff;
	letter-spacing:			0.5px;
}

.button
{
	margin-top:				10px;
	background:				url('img/iconmonstr-angel-right-circle-thin-64.png') no-repeat #5a0026;
	background-size:		34px;
	background-position:	30px 15px;
	border-bottom:			5px solid #46001d;
	padding:				15px 30px 15px 80px;
	display:				inline-block;
	color:					#fff;
	font-family:			"Tajawal", sans-serif;
	font-weight:			300;
	font-size:				22px;
	text-decoration:		none;
	text-transform:			uppercase;
	letter-spacing:			1px;
	border-radius:			2px;
}

@media screen and (max-width: 770px) {
	#main-nav li a
	{
		padding:				0 5px;
	}
}

.content {
	padding:				150px 0;
}

.content h1 {
	font-family:			'Tajawal', sans-serif;
	font-weight:			200;
	font-size:				50px;
	color:					#222;
}

.content p {
	font-family:			'Tajawal', sans-serif;
	font-weight:			300;
	font-size:				22px;
	color:					#222;
}

.firstcharacter {
  color: #903;
  float: left;
  font-family: Georgia;
  font-size: 75px;
  line-height: 60px;
  padding-top: 4px;
  padding-right: 8px;
  padding-left: 3px;
}

.content h2 {
	font-family:			'Tajawal', sans-serif;
	font-weight:			400;
	font-size:				30px;
	color:					#222;
}

.content h3 {
	font-family:			'Tajawal', sans-serif;
	font-weight:			400;
	font-size:				24px;
	color:					#222;
}

.content h4 {
	font-family:			'Tajawal', sans-serif;
	font-weight:			300;
	font-size:				24px;
	color:					#222;
}

#films-container .content h2 {
	color:					#fff;
}

.film-details 
{
	padding:				0;
}

.film-details li {
	display:				inline;
	padding:				0 20px 0 25px;
	font-family:			'Tajawal', sans-serif;
	font-weight:			400;
	font-size:				15px;
	-webkit-filter:			brightness(200);
}

.film-details li.year {
	background:				url('img/iconmonstr-time-2-32.png') no-repeat;
	background-size:		16px;
}

.film-details li.duration {
	background:				url('img/iconmonstr-time-15-32.png') no-repeat;
	background-size:		16px;
}

p.film-description {
	font-size:				18px;
	padding-right:			35px;
	font-weight:			400;
	text-align: justify;
    text-justify: inter-word;
	color:					#fff;
}

p.film-fineprint {
	font-size:				12px;
	padding-right:			35px;
	text-align: justify;
    text-justify: inter-word;
	color:					#fff;
}

#films-container {
	background:				url('img/trianglify.png') no-repeat;
	background-size:		cover;
	transform: 				perspective(85px) rotateY(0.1deg) translateZ(-1px);
}

#contact-container {
	background:				url('img/trianglify.png') no-repeat;
	background-size:		cover;
	transform: 				perspective(85px) rotateY(0.1deg) translateZ(-1px);
}

#contact-container h1, 
#contact-container p,
#contact-container a {
	-webkit-filter:			brightness(200);
}

.awards {
	padding-left:			0;
}

.awards li {
	padding:				0 40px 0 40px;
	margin-bottom:			25px;
	font-family:			'Tajawal', sans-serif;
	font-weight:			400;
	font-size:				18px;
	color:					#222;
	list-style-type:		none;
	background:				url('img/iconmonstr-trophy-13-240.png') no-repeat;
	background-size:		24px;
	background-position:	0 5px;
}

.borderleft {
	border-left:			1px solid #eee;
	padding-left:			40px;
}

a.e-mail {
	text-decoration:		none;
	color:					#222;
	background:				url('img/iconmonstr-email-3-48.png') no-repeat;
	background-size:		44px;
	padding-left:			60px;
	font-size:				24px;
	font-weight:			500;
	height:					44px;
}

@media screen and (max-width: 64em) {
	
	#featured-text
	{
		padding:				40px 60px;
	}
	
	.borderleft {
		border:					none;
	}
	
	.award-cell {
		padding-left:			40px;
	}
	
	.film-cell {
		padding:				0 40px;
	}
	
	.film-cell img {
		margin:					0 auto;
	}
	
	#films h1,
	#about-us h1,
	#contact h1,
	#about-us p,
	#contact p	{
		padding:				0 40px;
	}
	
	#contact a {
		font-size:				18px;
		background-size:		24px;
		padding-left:			35px;
	}
	
	#featured-text h1 {
		padding:				0;
	}
	
	p.film-description,
	p.film-fineprint
	{
		padding-right:			0;
	}
	
}

@media screen and (max-width: 640px) {
	#top
	{
		height:					275px;
	}
	
	#logo
	{
		margin:					0 auto;
	}
	
	#header-container.is-stuck #logo
	{
		background-size:		140px 75px;
		height:					75px;
		width:					140px;
	}
	
	#header-container.is-stuck #main-nav
	{
		margin:					0;
	}
	
	header p {
		display:				none;
	}
	
	#main-nav
	{
		float:					left;
		width:					100%;
		text-align:				center;
		padding:				15px 0 0 0;
	}
	
	#slideshow,
	#featured-text,
	#films-container,
	#contact-container {
		transform: 				none !important;
	}
	
	#slideshow {
		display: none;
	}
}