*{
	margin: 0;
	padding: 0;
}

html{
	height: 100%;
	margin: 0;
}

body{
	min-height: 95%;
	margin: 0;
	background-color: #E2E2E2;
	display: block;
  position: relative;
}

.header-top{
	padding-top: 60px;
}

.logo {
	padding-bottom: 2vh;
	margin: auto;
	width: 100%;
	max-width: 700px;
	height: 5vh;
	display: flex;
	align-items: center;
	justify-content: center;
	
}
.logo li{
	list-style: none;
}
.logo a{
	text-decoration: none;
	font-family: archivo black;
	font-size: 2em;
	color: black;
}
.nav{
	padding: 5px;
	margin: auto;
	width: 60%;
	max-width: 700px;
	height: 2vh;
	display: flex;
	align-items: center;
	justify-content: center;
	
}
.nav li{
	list-style: none;
}
.nav a{
	text-decoration: none;
	font-family: sans-serif;
	font-size: 0.7em;
	font-weight: 400;
	letter-spacing: 2px;
	color: #050505;
}

.container{
	margin: auto;
	margin-top: 30px;
	margin-bottom: 10px;
	max-width: 800px;
	position: relative;	
	display: flex;
  justify-content: center;
  overflow: hidden;
  flex-wrap: wrap;
}

div.gallery {
  size: relative;
  padding-top: 20px;
  margin-right: 15px;
  margin-left: 15px;
  margin-bottom: 0vh;
  float: left;
  width: 100%%;
}

@media screen and (max-width: 768px) {
  div.gallery {
  	margin-bottom: 0px;
  }
}

div.gallery img {
  max-width: 100%;
  height: auto;
}

h1.desc {
	font-weight: normal;
  font-family: sans-serif;
  font-weight: 0;
  font-size: 11px;
  padding: 9px;
  text-align: right;
}

div.desc {
  font-family: sans-serif;
  font-weight: 0;
  font-size: 10px;
  padding: 9px;
  text-align: right;
}

.nav-a:hover{
   color: white;
}

.nav-c:hover{
   color: white;
}

.copyr{
	position: relative;
}
.copyr ul li a{
	text-decoration: none;
	font-family: sans-serif;
	font-size: 9;
	font-weight: 0;
	letter-spacing: 2px;
	color: #050505;
}
.copyr li{
	list-style: none;
}

.footer{
	padding-bottom: 10px;
	position: relative;
	margin: auto;
	width: 95%;
	height: 5vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* contact page */

.header-top-c{
	padding-top: 60px;
	padding-bottom: 60px;
}

.contact{
	max-width: 300px;
	text-align: center;
	padding-top: 5%;
	padding-bottom: 5%;
	position: relative;
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact li{
	list-style: none;
	padding: 10px
}

.contact li a{
	font-family: sans-serif;
	font-weight: 0;
	font-size: 12px;
	letter-spacing: 2px;
	color: #050505;
	text-decoration: none;
}
.nav-c{
	padding: 5px;
	margin: auto;
	width: 60%;
	max-width: 700px;
	height: 2vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.nav-c li{
	list-style: none;
}
.nav-c a{
	text-decoration: none;
	font-family: sans-serif;
	font-size: 10;
	font-weight: 0;
	letter-spacing: 2px;
	color: #050505;
}

.footer-c{
	max-width: 300px;
	padding-bottom: 10px;
	position: relative;
	margin: auto;
	width: 95%;
	height: 5vh;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 50px;
}

.contact a:hover{
   color: white;
}
/* about page */

.about{
	display: flex;
	padding: 15px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
	
}

.imgabout{
	max-width: 300px;
	min-width: 200px;
}

div.imgabout img {
	width: 100%;
}

.bio{
	margin-left: 30px;
	max-width: 300px;
	display: flex;
	align-items: center;
	letter-spacing: 1px;
	line-height: 140%;
	justify-content: center;
	font-family: sans-serif;
	font-size: 14px;
	text-align: justify;
}


@media screen and (max-width: 768px) {
  .bio {
  	margin-top: 30px;
    margin-left: 0px;
  }
  .imgabout{
		max-width: 100%;
		min-width: 200px;
	}
}
/* sparks */

.header-top-sparks{
	padding-top: 60px;
	padding-bottom: 60px;
}

@media screen and (max-width: 768px) {
  .header-top-sparks {
  	padding-bottom: 15px;
  }
}

.sparks{
	display: flex;
	padding: 15px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
}
.postersparks{
	max-width: 300px;
	min-width: 200px;
}

div.postersparks img {
	width: 100%;
}

.descsparks{
	margin-left: 30px;
	max-width: 300px;
	display: flex;
	align-items: center;
	letter-spacing: 1px;
	line-height: 140%;
	justify-content: center;
	font-family: sans-serif;
	font-size: 14px;
	text-align: justify;
}

@media screen and (max-width: 768px) {
  .descsparks {
  	margin-top: 30px;
    margin-left: 0px;
  }
  .postersparks{
		max-width: 100%;
		min-width: 200px;
	}
}

.trailersparkscontainer{
	display: flex;
	padding-left: 15px;
	padding-right: 15px;
	margin-top: 50px;
	margin-bottom: 65px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
}
.trailersparks{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 630px;
	min-width: 300px;
	max-height: 350px;
}

@media screen and (max-width: 768px) {
  .trailersparkscontainer {
     margin-top: 0px;
     margin-bottom: 15px;
  }
}

.sparksgrid{ 
	margin: auto;
	margin-top: 0px;
	margin-bottom: 30px;
	padding-left: 15px;
	padding-right: 15px;
	max-width: 630px;
	position: relative;	
	display: flex;
  justify-content: center;
  overflow: hidden;
  flex-wrap: wrap;
  flex-direction: column;
}

.sparksgrid img{
	padding-bottom: 20px;
	width: 630px;
	max-width: 100%;
	height: auto;
}
/* wtcl */

.wtcl{
	display: flex;
	padding: 15px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
}

.header-top-wtcl{
	padding-top: 60px;
	padding-bottom: 60px;
}

@media screen and (max-width: 768px) {
  .header-top-wtcl {
  	padding-bottom: 15px;
  }
}

.posterwtcl{
	max-width: 300px;
	min-width: 200px;
}
div.posterwtcl img {
	width: 100%;
}


.descwtcl{
	margin-left: 30px;
	max-width: 300px;
	display: flex;
	align-items: center;
	letter-spacing: 1px;
	line-height: 140%;
	justify-content: center;
	font-family: sans-serif;
	font-size: 14px;
	text-align: justify;
}

@media screen and (max-width: 768px) {
  .descwtcl {
  	margin-top: 30px;
    margin-left: 0px;
  }
}

.trailerwtclcontainer{
	display: flex;
	padding-top: 0px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 0px;
	margin-top: 50px;
	margin-bottom: 50px;
	align-items: center;
	justify-content: center;
}

.trailerwtcl{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 630px;
	min-width: 300px;
	max-height: 350px;
}

@media screen and (max-width: 768px) {
  .trailerwtclcontainer {
     margin-top: 0px;
     margin-bottom: 0px;
     max-height: 300px;
  }

  .posterwtcl{
		 max-width: 100%;
	   min-width: 200px;
  }
}

.festivalswtclcontainer{
	display: flex;
	padding-top: 30px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 30px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
}

.festivalswtcl li{
	font-size: 14px;
	font-family: sans-serif;
	font-weight: 0px;
	list-style: none;
	line-height: 175%;
	letter-spacing: 1px;
}

.festivalswtcl{
	text-align: justify;
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 300px;
	min-width: 300px;
	max-height: 350px;
}
.festivalsawardswtcl{
	display: flex;
	padding-top: 15px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 0px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
  font-size: 14px;
  font-family: sans-serif;
  letter-spacing: 1px;
}
.wtclgrid{ 
	margin: auto;
	margin-top: 50px;
	margin-bottom: 30px;
	padding-left: 15px;
	padding-right: 15px;
	max-width: 630px;
	position: relative;	
	display: flex;
  justify-content: center;
  overflow: hidden;
  flex-wrap: wrap;
  flex-direction: column;
}

.wtclgrid img{
	padding-bottom: 20px;
	width: 630px;
	max-width: 100%;
	height: auto;
}

@media screen and (max-width: 768px) {
  .wtclgrid{
  	margin-bottom: 10px;
  }
}


/* ooftmif */

.header-top-ootmif{
	padding-top: 60px;
	padding-bottom: 60px;
}

@media screen and (max-width: 768px) {
  .header-top-ootmif {
  	padding-bottom: 15px;
  }
}

.ootmif{
	display: flex;
	padding: 15px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
}
.posterootmif{
	max-width: 300px;
	min-width: 200px;
}


div.posterootmif img {
	width: 100%;
}

.descootmif{
	margin-left: 30px;
	max-width: 300px;
	display: flex;
	align-items: center;
	letter-spacing: 1px;
	line-height: 140%;
	justify-content: center;
	font-family: sans-serif;
	font-size: 14px;
	text-align: justify;
}

@media screen and (max-width: 768px) {
  .descootmif {
  	margin-top: 30px;
    margin-left: 0px;
  }
}

.trailerootmifcontainer{
	display: flex;
	padding-top: 0px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 0px;
	margin-top: 50px;
	margin-bottom: 50px;
	align-items: center;
	justify-content: center;
}

.trailerootmif{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 630px;
	min-width: 300px;
	max-height: 350px;
}

@media screen and (max-width: 768px) {
  .trailerootmifcontainer {
     margin-top: 0px;
     margin-bottom: 0px;
     max-height: 300px;
  }
  .posterootmif{
		max-width: 100%;
		min-width: 200px;
	}
}

.festivalsootmifcontainer{
	display: flex;
	padding-top: 30px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 30px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
}

.festivalsootmif li{
	font-size: 14px;
	font-family: sans-serif;
	font-weight: 0px;
	list-style: none;
	line-height: 175%;
	letter-spacing: 1px;
}

.festivalsootmif{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 630px;
	min-width: 300px;
	max-height: 350px;
}

.festivalsawardsootmif{
	display: flex;
	padding-top: 15px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 0px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
  flex-wrap: wrap;
  font-size: 14px;
  font-family: sans-serif;
  letter-spacing: 1px;
}

.gallerylaurelootmif{
	margin: auto;
	margin-top: 0px;
	margin-bottom: 60px;
	max-width: 680px;
	position: relative;	
	display: flex;
  justify-content: center;
  overflow: hidden;
  flex-wrap: wrap;
}

div.gallerylaurelootmif img {
	padding: 15px;
    max-width: 175px;
    height: auto;
}

.ootmifgrid{ 
	margin: auto;
	margin-top: 50px;
	margin-bottom: 30px;
	padding-left: 15px;
	padding-right: 15px;
	max-width: 630px;
	position: relative;	
	display: flex;
  justify-content: center;
  overflow: hidden;
  flex-wrap: wrap;
  flex-direction: column;
}

.ootmifgrid img{
	padding-bottom: 20px;
	width: 630px;
	max-width: 100%;
	height: auto;
}

@media screen and (max-width: 768px) {
  .ootmifgrid{
  	margin-bottom: 10px;
  }
}
