/*
Theme Name: Good Life Films
Author: Francine Chong
Description: A repsonsive custom theme for Good Life Films.
Version: 1.0
*/

/* HTML5 ✰ Boilerplate 	h5bp.com/css*/

/*HTML 5 DISPLAY DEFINITIONS*/
html,body,div,ul,ol,li,dl,dt,dd,pre,form,p,blockquote,fieldset,input,hr {margin:0; padding:0;}
ul,ol {list-style:none;}
fieldset,img,hr {border:none;}
caption,th {text-align:left;}
table {border-collapse:collapse; border-spacing:0;}
td {vertical-align:top;}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

/*BASE*/

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; height:100%;}

body { 
	margin: 0; 
	line-height: 1.231; 
	font-family:'FuturaStdBook', Tahoma, sans-serif; 
	background:#000; 
	height:100%; 
	text-shadow:-1px -1px 1px #666;
	-moz-text-shadow:-1px -1px 1px #666;
	-webkit-text-shadow:-1px -1px 1px #666;	
}

body, p, span, a{font-size: 15px;}

body, button, input, select, textarea { font-family: sans-serif; color: #fff; font-size:.9em; }

::-moz-selection { background: #888; color: #fff; text-shadow: none; }
::selection { background: #888; color: #fff; text-shadow: none; }

/*LINKS*/
a{color:#fff; text-decoration:none;}
a:hover { color:#77d0d6; }/*f1c442 ORANGE*/
a:focus { outline: 0; }
a:hover, a:active { outline: 0; }
tr td a,p a{text-decoration:underline; color:#77d0d6;}
tr td a:hover,p a:hover, a.blue:hover{color:#94e4e9;/*LIGHTER BLUE*/}
/*TYPOGRAPHY*/

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin:0; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family:'FuturaStdBook',Tahoma,sans-serif; _font-family:'FuturaStdBook',Tahoma,sans-serif; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

/*FONT-FACE*/

@font-face {
    font-family: 'KorinnaBlackTTBoldItalic';
    src: url('fonts/goodlife-webfont.eot');
    src: url('fonts/goodlife-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/goodlife-webfont.woff') format('woff'),
         url('fonts/goodlife-webfont.ttf') format('truetype'),
         url('fonts/goodlife-webfont.svg#KorinnaBlackTTBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FuturaStdBook';
    src: url('fonts/futurastd-book-webfont.eot');
    src: url('fonts/futurastd-book-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/futurastd-book-webfont.woff') format('woff'),
         url('fonts/futurastd-book-webfont.ttf') format('truetype'),
         url('fonts/futurastd-book-webfont.svg#FuturaStdBook') format('svg');
    font-weight: normal;
    font-style: normal;
}

.highlight{font-family: 'KorinnaBlackTTBoldItalic',Tahoma,sans-serif; font-size:1.4em;}

html, body, p, ul.navMain li a{font-family:'FuturaStdBook',Tahoma,sans-serif;}
h1, h2, h3, h4, h5, h6, th{font-weight:lighter;}
/*LISTS */
ul, ol { margin:0; padding: 0; list-style:none; }
dd { margin:0; }
nav ul, nav ol { margin: 0; padding: 0; }

/*EMBEDDED CONTENT*/
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }

/*FIGURE + FORMS*/
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

/*	PRIMARY STYLES - AUTHOR: FRANCINE CHONG PORTFOLIO SITE { http://francine-chong.com } */

/* TABLES */

table{border-collapse: collapse; border-spacing: 0; }

td{vertical-align: top; }

th{text-align:left; font-size:1em; text-transform:uppercase; color:#fff;} /*77d0d6*/

tr.important td{padding:.75em 0 .75em 0;}

table.list-items td{padding-right:3em;}

table.list-items{margin-top:1em;} 

th.list-secondary,div.videography table{font-size:.9em;}


th.list-secondary{text-transform:lowercase;}

div.videography table{text-transform:uppercase;}

table, table tr td, table tr, table.list-items, table.list-items tr,table.list-items tr td,div.contenet{max-width:350px;}

div.videography table th.list-secondary{
	color:#fff;	
	text-shadow:-1px -1px 1px #666;
	-moz-text-shadow:-1px -1px 1px #666;
	-webkit-text-shadow:-1px -1px 1px #666;	
}

.label{font-size:1.4em;}

/*PAGE AWARDS*/

table.listAwards,table.listAwards td{max-width:100%;}

table.listAwards td.label{padding-right:1em;}

.bg-image{
	display:none; /*INITIALIZER*/
	min-width:1680px; 
	min-height:100%;
	width:100%;
	height:auto; 
}

.float-right{float:right;}

.float-left{float:left;}

img{max-width:100%;}

/*COMMON TRANSITIONS*/

a, a:hover, ul li a, ul li a:hover{
	-moz-transition:color .5s;
	-webkit-transition:color .5s;
	transition:color .5s;
}

input.button, input.button:hover{
	-moz-transition:background .5s;
	-webkit-transition:background .5s;
	transition:background .5s;
}

div.content, .bg-image{
	transition:opacity .5s;
	-moz-transition:opacity .5s;
	-webkit-transition:opacity .5s;
}

/*SNS ICONS*/

ul.sns{position:fixed; bottom:5%; right:2.5%;}

.twitter{background:url(images/snsIcons.png) 0 0 no-repeat;}

.twitter:hover{background-position:0 -33px;}

.twitter,li.twitter a{
	margin:2% 2% 4% 0; 
	width:40px; 
	height:33px; 
	float:right;
	display:block;
}

.copyright{	
	margin:1% 2% 0 0; 
 	float:right;
	font-size:2em;
	text-align:right;
	line-height:.6em;
}

.name{
	font-family: 'KorinnaBlackTTBoldItalic';
	font-size:.75em;
}

.director{
	font-size:.5em;
	text-transform:uppercase;
}

/*NAVIGATION*/

.logoOther{display:block; max-width:95%;}

.logo{width:100%;}


ul.navHome{
	text-transform:uppercase; 
	width:100%;
}

ul.navHome li{width:100%; float:right;}

ul.navHome li a{
	text-align:right;
	float:right;
	padding-bottom:2%; 
	font-size:.9em;
	text-shadow:-1px -1px 1px #666;
	-moz-text-shadow:-1px -1px 1px #666;
	-webkit-text-shadow:-1px -1px 1px #666;	
}

ul.navHome li img{margin-bottom:6%;}

ul.navMain,div.navMobile ul{float:right; padding:0; display:block;}

ul.navMain li,div.navMobile ul li{padding-bottom:4%;}

ul.navMain li a,div.navMobile ul li a{
	font-size:.9em; 
	letter-spacing:.05em;
	text-align:right;
	display:block;
	list-style:none;
	text-transform:uppercase;
	text-shadow:-1px -1px #666;
	-moz-text-shadow:-1px -1px #666;
	-webkit-text-shadow:-1px -1px #666;		
}

ul.subNav{padding-top:6%; display:block; background:rgba(255, 255, 255, .001);}

.ie8 ul.subNav,.ie7 ul.subNav{background:#aaa; filter:alpha(opacity=100);}

ul.subNav li a{
	font-size:.7em;	
	color:#fff;
	display:block;
}

ul.subNavSelected li a:hover, ul.subNav li a:hover, .label, .blue{
	color:#77d0d6;/*LIGHT BLUE*/
}

/*COMMONS*/

p{margin:0; padding:0 0 2% 0;}

#container{
	display:none;/*INITIALIZER*/
	margin:0 auto;
	width:98%;
}

.wrapper{padding:3% 2.0833% 2.0833% 2.0833%; min-height:100%; margin:0 auto;}

/*THUMBNAILS*/

.left-col-lrg{position:relative; float:left; max-width:55%;}

.left-col-larger{position:relative; float:left; max-width:30%;}

.left-col{width:65%; float:left;}

.index-col{margin-top:-5%; width:92%; float:left;}

.left-col,.left-col-lrg,.left-col-larger, .mid-main-col, .left-main-col, .mid-contact-col,.left-contact-col{
	margin-top:5%;	
}

.col-wrapper{
	width:100%;
	position:relative;
}

.index-col ul,.left-col ul,.left-col-lrg ul,.left-col-larger ul{width:100%;}

.index-col ul li{float:left; width:15%;}

.left-col ul li{float:left; width:25%; background:#000;}

.left-col-lrg ul li{float:left; width:50%; background:#000;}

.left-col-larger ul li{float:left; width:100%; background:#000;}

.thumbCredits{display:none;}

.right-col{
	width:18%;/*69.79166% 670/960*/
	float:right;	
}

.mid-col{
	width:37%;/*790/960*/
	background:#fff;
	float:left;
}

.full-col{width:80%;}

/*LARGE IMG*/

div.content{ 
	position:absolute;
	top:0;
	left:101%;
	opacity:0;
	color: #fff;
	text-shadow:-1px -1px 1px #666;
	-moz-text-shadow:-1px -1px 1px #666;
	-webkit-text-shadow:-1px -1px 1px #666;	
	visibility:hidden;
	max-width:350px;
	width:350px;
}

div.item{position:relative;}

div.videography{
	position: absolute;
	height:100%;
	width:100%;
	background:rgba(0,0,0,.95);
	top:0;
	color:#fff;
	z-index:1000;
	visibility:hidden;	
}

.ie8 div.videography, .ie7 div.videography{background:#000; filter:alpha(opacity=90); /* < IE9 */}

div.videography table{margin:3%;} 

.left-main-col{
	width:20%;
	padding:0 2% 2% 0;
	float:left;
}

.left-contact-col{
	width:30%;
	padding:1.8% 0 2% 0;
	float:left;
}

.mid-main-col{
	width:60%;
	padding:0 0 2% 0;
	float:left;
	text-align:justify;
}

.mid-contact-col{
	width:45%;
	padding:0 3% 1% 0;
	float:left;
}

/*PAGE CONTACT FORM*/
textarea:focus, input:focus{border:1px solid #77d0d6;}

textarea, input{
	width:100%;
	font-family:'FuturaStdBook', Tahoma, sans-serif;
	color:#eee;
	background:transparent;
	border:1px solid #fff;
	padding-left:10px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
}

textarea{height:200px; padding-top:10px;}

input{height:40px;}

input.button:hover{background:#999;}

input.button{
	width:100px;
	height:40px;
	background:#888;
	border:none;
	color:#fff;
	padding:0;
	margin-top:10px;
	-moz-text-shadow:1px 1px #666;
	-webkit-text-shadow:1px 1px #666;
	text-shadow:1px 1px #666;	
}

/*PAGE FILM FEST*/

div.listFestival ul li{
	float:left;
	width:100%;
	background-color:transparent;
}

/*NON-SEMANTIC HELPER CLASSES*/

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

.hidden { display: none !important; visibility: hidden; }

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

.invisible{ visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.hide, .hiddenFancybox,.mobileLogo,.showMobile{display:none;}
	
/*MEDIA QUERIES*/

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

body, p{font-size:1em;}

ul.navHome, ul.sns,ul.subNavSelected,ul.subNav2,ul.subNav3,div.content,ul.navMain,section.hideMobile{display:none;}

.index-col,.left-col,.left-col-lrg,.left-col-larger, .mid-main-col, .left-main-col, .mid-contact-col,.left-contact-col{
	margin-top:0%;	
	padding-bottom:5%;
	width:100%;
	max-width:960px;
}

ul.navMain li,div.navMobile ul li{padding:1% 0 1% 0;}

ul.separator,section.separator{
	border-bottom:1px dotted #fff;
	border-top:1px dotted #fff;
}

section.separator{
	margin:2% 0 2% 0;
	padding:2% 0 2% 0;
}

header{max-width:100%; margin:0 auto;}

.showMobile{display:block;}

.logoOther{
	display:block; 
	padding-bottom:2%;
	max-width:90%; 
	float:right;
}

a.showMobile.top{
	margin:6% 0 6% 2%;
	font-size:.9em;
}

div.navMobile ul{font-size:1em; margin:0 1% 2% 0;}

#container{
	max-width:96%;
	margin:2% auto;
	min-height:none;	
	max-height:none;
}	
	
.left-main-col{
	width:50%;
	padding:2%;
	float:left;
}

.mid-main-col{
	width:96%;
	padding:0 2% 0 2%;
	float:left;
}

.left-contact-col,.mid-contact-col{width:96%; padding-bottom:5%;}

textarea, input{width:100%;}

form#contact-form{margin-bottom:5%;}

.right-col{width:100%; margin:0 auto;}

.index-col,.left-col, .left-col-lrg, .left-col-larger{width:100%;}

/*MV THUMBS*/
.index-col ul,.left-col ul, .left-col-lrg ul,.left-col-larger ul{width:100%;}

.index-col ul li,.left-col ul li,.left-col-lrg ul li{
	width:33%; 
	position:relative; /*relative for thumbCredits absolute*/
}

.left-col-larger ul li{
	width:50%; 
	position:relative; 
}

.thumbCredits{
	display:block;
	position:absolute;
	z-index:999;
	bottom:0;
	right:0;
	margin-bottom:5.5%;
}

.thumbCredits a{
	font-size:1em;
	color:#fff;
	font-family: 'KorinnaBlackTTBoldItalic',Tahoma,sans-serif; 
	-webkit-text-shadow:-1px -1px #666;
	-moz-text-shadow:-1px -1px #666;
	text-shadow:-1px -1px #666;
	background:transparent;
	padding:10px 15px 10px 15px;

}

table.mobileTable{margin-top:20%;}

.mobileTable tr{color:#fff;}

.bg-image{
	display:none; /*INITIALIZER*/
	min-width:1620px; 
	min-height:1680px;
	width:100%;
	height:100%; 
}

}

@media only screen and (max-width: 480px){
table.list-items td{padding-right:0; font-size:.8em;}

a.logoOther{display:none;}

/*.logoLeft img{margin:1% 0 2% 0; float:right;}*/

.logoRight{
	color:#fff;
	font-size:1.8em;
	float:right; 
	margin:0 0 1% 0;
	font-family:'KorinnaBlackTTBoldItalic',Helvetica, sans-serif;
	text-transform:lowercase;
	text-shadow:none;
	text-align:right;
}

.mobileLogo{display:block; float:right;}

header{margin:0 auto; width:100%;}

.index-col ul li,.left-col ul li, .left-col-lrg ul li,.left-col-larger ul li{background:#000; width:100%;}

.index-col ul li img,.left-col ul li img, .left-col-lrg ul li img,.left-col-larger ul li img{opacity:1;}

.thumbCredits{padding:0 1% 2% 0;}

.thumbCredits a{
	font-size:1.2em;
	text-shadow:none;
}

.mobileTable tr,.list-items{color:#fff; font-size:.9em;}

table.listAwards td,.listFestival{font-size:.9em;}

.listFestival ul li{margin:0 0 2% 0; font-size:.8em;}

body,p{font-size:.85em;}

p{margin-bottom:5%;}

}


@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }    /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}