/*  
	site: 		www.futuremovies.co.uk
	author: 	johan de silva www.johandesilva.co.uk
	
	index:
		templates
				1 site template
					1.1 lava menu
				2 page templates
					2.1 image cross fader by redux
				3 form template
		content
				4 block level
				5 inline elements
				6 custom class
					6.1 clearing
					6.2 homepage slider
					6.3 css buttons
					6.4 jquery tabs
*/

/* (1) site template */
#wrapper{clear:both;width:950px;position:relative;margin:10px auto; position:relative}
#twitter{position:absolute; z-index:2; top:13px; left:240px; display:block; width:150px; height:108px}
#head-top{clear:both;float:left;width:930px;padding:10px;background:#2B2C37 url('../images/menu_top.gif') no-repeat top left}
#head-top img{float:left}
#head-top h1{margin:0}
#head-ban{float:right}
#head-bottom{clear:both;float:left;width:950px;height:17px;background: url('../images/menu_bottom.gif') no-repeat bottom left;font-size:small;color:#f2f2f2;font-family:Arial, Helvetica, sans-serif}
#site-search{clear:right;float:right;width:300px;margin:5px 0 -5px 0}
#site-search .txt{border:1px solid #6a8ba6;background:#fff url('../images/form-textfield-bg.gif') no-repeat top left}
#site-search .btn{margin-bottom:-3px}
#site-search label{color:#88b0cf;font-size:12px}
#menu{clear:both;float:left;background-color:#394C5C;}
	/* (2.1) lava menu */
	.lavaLamp {position:relative;height:29px;width:935px;padding:0;margin:15px 0 5px 0;overflow:hidden;float:left;padding-left:15px}
	.lavaLamp li {float:left;list-style:none}
	.lavaLamp li.back {background:url("../images/lava.gif") no-repeat right -30px;width:9px; height:30px;z-index:8;position:absolute}
	.lavaLamp li.back .left {background:url("../images/lava.gif") no-repeat top left;height:30px;margin-right:9px}
	.lavaLamp li a {font:bold 14px arial; text-decoration:none;color:#fff;outline:none;text-align:center;top:7px;letter-spacing:0;z-index:10;display:block;float:left;height:30px;position:relative;overflow:hidden;margin:auto 10px}
	.lavaLamp li a:hover, 
	.lavaLamp li a:active,
	.lavaLamp li a:focus ,
	.lavaLamp li a:visited {border:none}
#content-wrap a{font-weight:bold;font-family:arial, verdana, helvetica, sans-serif}
#content-wrap a:link{color:#fff;text-decoration:none}
#content-wrap a:visited{color:#dedede;text-decoration:none}
#content-wrap a:hover{color:#fff;background-color:#7697b2}
#content-wrap a:active{color:#fff;background-color:#7697b2}
#content-wrap a:focus{color:#fff;background-color:#7697b2}	
#footer{clear:left;background-color:#2B2C37;margin:0;float:left;width:950px}
#footer-top{clear:left;background:url('../images/footer_top.gif') no-repeat bottom left;height:12px;margin:5px 0 0 0}
#footer-bottom{clear:both;background:url('../images/footer_bottom.gif') no-repeat top left;height:12px;margin:0}
#footer-tray{text-align:center;color:#fff;font-size:small;font-weight:bold}
#functional-footer{width:450px;margin:8px 0 0 20px;float:left}
#functional-footer h5, #footer-ad h5{margin:0 0 10px 0;padding:0}
#functional-footer ul{float:left;width:450px;margin:0;padding:0;list-style:none;margin-bottom:20px}
#functional-footer li{float:left;width:222px;margin:0 0 10px 0;padding:0 0 10px 0;border-bottom:dotted 1px #fff}
#footer-ad{padding:10px 70px 0 0;float:right;width:336px}
/* (2) page templates */
#home-top{clear:both;background:url('../images/home_top.gif') no-repeat top left;height:12px}
#home-bg{clear:both;background:#253942 url('../images/home_bg.gif');width:100%;overflow:hidden;margin:0}
#home-bottom{clear:both;background:url('../images/home_bottom.gif') no-repeat top left;height:12px}
#home-left-side{float:left;width:590px}
#home-left{float:left;width:275px;padding:10px 0 0 20px}
#home-middle{float:left;width:275px;padding:10px 0 0 20px}
#home-right{float:left;width:300px;padding:10px 0 0 40px}
#filmmaking-top{clear:both;background:#253942 url('../images/filmmaking_top.gif') no-repeat top left;height:12px}
#filmmaking-bg{clear:both;background:#253942 url('../images/filmmaking_bg.gif');width:100%;overflow:auto;margin:0}
#filmmaking-bottom{clear:both;background:url('../images/filmmaking_bottom.gif') no-repeat top left;height:12px;margin:0}
#filmmaking-left{float:left;width:285px;padding:10px 0 0 20px}
#filmmaking-middle{float:left;width:300px;padding:10px 0 0 20px}
#filmmaking-right{float:left;width:285px;padding:10px 0 0 15px}
#template-full-top{clear:both;background:url('../images/template-full-top.gif') no-repeat top left;height:12px}
#template-full-bg{clear:both;background-image:url('../images/template-full-bg.gif');width:100%;overflow:auto;margin:0}
#template-full-bottom{clear:both;background:url('../images/template-full-bottom.gif') no-repeat top left;height:12px;margin:0}
#template-full-main{float:left;width:745px;margin:8px 20px;display:inline}
#template-full-right{float:right;width:120px;margin:8px 20px 0 0}
#template-half-top{clear:both;background:url('../images/template-half-top.gif') no-repeat top left;height:12px}
#template-half-bg{clear:both;background-image:url('../images/template-half-bg.gif');width:100%;overflow:auto;margin:0}
#template-half-bottom{clear:both;background:url('../images/template-half-bottom.gif') no-repeat top left;height:12px;margin:0}
#template-half-main{float:left;width:514px;margin:8px 20px;display:inline}
#template-half-side{float:left;width:216px;margin:8px 15px;position:relative}
#template-half-right{float:left;width:120px;margin:8px 0 0 10px}
#template2-half-top{clear:both;background:url('../images/template2-half-top.gif') no-repeat top left;height:12px}
#template2-half-bg{clear:both;background-image:url('../images/template2-half-bg.gif');width:100%;overflow:auto;margin:0}
#template2-half-bottom{clear:both;background:url('../images/template2-half-bottom.gif') no-repeat top left;height:12px;margin:0}
	/* (2.1) image cross fader by redux */
	#imageContainer{position:relative;width:525px;height:200px;border:3px solid #6A838A;margin-right:5px;float:left}
	#imageContainer img{display:none}
/* (3) form template */
form{display:inline;margin:0}
#frm fieldset{border:1px solid #6a8ba6;margin-bottom:10px;padding-bottom:15px}
#frm legend{color:#fff;font-weight:bold;background:#6a8ba6;border:1px solid #6a8ba6;padding:2px 6px}
#frm label{width:250px;float:left;clear:both;text-align:right;margin-right:5px;display:block;font-weight:bold}
/* (4) block level tags */
img{border:0}
object, param, embed {margin:0;padding:0;/*float:left*/;display:inline;}
body{padding:0;margin:0;font-size:small;line-height:150%;color:#fff;background:#5F7573 url('../images/bg-keyline.gif') repeat fixed top left;font-family:verdana, arial, helvetica, sans-serif}
h1{font-size:large;font-family:Arial, Helvetica, sans-serif;margin-top:0px;padding-top:0px; font-weight:bold}
h2{font-size:medium;font-family:Arial, Helvetica, sans-serif;margin-top:0px;padding-top:0px;position:relative}
h3, h4, h5{font-size:11pt;font-weight:bold;font-family:Arial, Helvetica, sans-serif}
img{border:0 none}
p{margin:10px 0}
a{outline:0}

/* (5) inline level tags */
acronym, abbr{cursor:help;border-bottom:1px dashed}
/* (6) class */
.gbox{background:url('../images/gboxc.gif') no-repeat bottom right;padding:10px;margin-bottom:15px; clear:both; -moz-border-radius: 10px;-webkit-border-radius: 10px;}
.bbox{background:#394C5C url('../images/bboxc.gif') no-repeat bottom right;padding:10px;margin-bottom:15px; clear:both;  -moz-border-radius: 10px;-webkit-border-radius: 10px;}
.pbox{background:url('../images/pboxc.gif') no-repeat bottom right;padding:10px;margin-bottom:15px; clear:both; -moz-border-radius: 10px;-webkit-border-radius: 10px;}
.gborder{border:3px solid #6A838A;margin-right:5px;float:left}
.bborder{border:3px solid #7690A6;margin-right:5px;float:left}
.pborder{border:3px solid #826C82;margin-right:5px;float:left}
.title-link{margin:0;padding:0}
.aboutus-link{display:block;width:300px;padding:5px}
.side-title{padding:0;font-size:small;font-family:verdana, arial, helvetica, sans-serif}
.side-lable{margin:0;padding:0;font-size:small;font-family:verdana, arial, helvetica, sans-serif;display:inline}
.section-title-link{font-size:large;color:#fff;text-decoration:none;}
.small_text{font-size:small;font-family:verdana, tahoma, sans-serif;color:#fff}
.small_text a{font-weight:bold;color:#fff}
.az-arrow{background:#253942 url('../images/az.gif') no-repeat top left;width:600px;padding:35px 0 0 115px;height:55px;float:left}
.text-massive{font-size:xx-large;color:#888;text-decoration:none}
.ad_text{font-size:x-small;float:right;clear:both;white-space:nowrap}
.social {margin:10px 0;float:right;width:200px;float:left;clear:both}
.social img{border:0}
.social ul{display:inline;margin:0;padding:0;list-style:none}
.social li{float:left;margin:0 0 0 5px;padding:0}
	/* (6.1) clearing */
	.clear{clear:both;display:block}
	.clearfix:after{content: ".";display:block;height:0;clear:both;visibility:hidden}
	.clearfix{display:inline-block}
		/* Hides from IE-mac \*/
		* html .clearfix{height:1%}
		.clearfix{display:block}/* End hide from IE-mac */
	/* (6.2) homepage slider */
	#feature-container{width:570px;height:223px;margin:5px 0 0 20px;float:left;display:inline}
	.feature{width:570px;height:180px} /* ;display:relative */
	.feature-header{width:350px;height:40px;float:left;background-image:url('../images/fh.png')}
	.feature-header h2{font-weight:bold;display:inline;padding:10px 10px;margin:0px;font-size:large;float:left}
	.feature p{display:block;float:right;width:200px;margin:20px;height:180px;background-color:#333;margin:0;padding:10px}
	.feature .blue{background-color:#394C5C}
	.feature .green{background:#2B5057 url('../images/feature-green.gif') no-repeat top right}
	.feature .purple{background:#503C50 url('../images/feature-purple.gif') no-repeat top right}
	.feature a:hover{filter:alpha(opacity=10);opacity:0.1;-moz-opacity:0.1}
	.feature a:active{filter:alpha(opacity=10);opacity:0.1;-moz-opacity:0.1}
	.feature a:focus{filter:alpha(opacity=10);opacity:0.1;-moz-opacity:0.1}
	.feature a{position:absolute;height:200px;width:570px;top:0px;left:0px;text-decoration:none}	
	.feature i{visibility:hidden}
	.glidecontentwrapper{position:relative;width:570px;height:180px;overflow:hidden}
	.glidecontent{position:absolute;background: white;padding:0px;visibility:hidden;width:570px}
	.glidecontenttoggler{width:570px;margin-top: 6px;text-align: center; background-color:#253943}
	.cssbuttonstoggler{width:550px;padding:10px;margin-top:0px;margin-left:0;text-align:left;background-image:url('../images/feature-menu.gif');background-position:bottom left;background-color:#2b2c37;overflow:hidden}
	.cssbuttonstoggler a{background: transparent url('../images/square-gray-left.gif') no-repeat top left;color:#fff;display: block;float:left;margin-right:6px;font:bold 13px Arial;line-height:15px;height:23px;padding-left:9px;text-decoration:none}
	.cssbuttonstoggler a span{background:transparent url('../images/square-gray-right.gif') no-repeat top right;display:block;padding:4px 9px 4px 0}
	.cssbuttonstoggler a.selected, .cssbuttonstoggler a:hover{ /* auto generated! */ background-position:bottom left}
	.cssbuttonstoggler a.selected span, .cssbuttonstoggler a:hover span{ /* auto generated! */ background-position:bottom right;color:black}
	.cssbuttonstoggler a.toc{/* auto generated! */}
	.cssbuttonstoggler a.prev, .glidecontenttoggler-2 a.next{ /* auto generated! */}
	.cssbuttonstoggler a.prev:hover, .glidecontenttoggler-2 a.next:hover{}
	/* (6.3) css buttons */
	.cssbuttons {text-align:left;overflow:hidden}
	.cssbuttons a{background:transparent url('../images/square-gray-left.gif') no-repeat top left;color:#fff;display: block;float:left;margin-right:6px;font:bold 13px Arial;line-height:15px;height:23px;padding-left:9px;text-decoration:none}
	.cssbuttons a span{background:transparent url('../images/square-gray-right.gif') no-repeat top right;display:block;padding: 4px 9px 4px 0}
	.cssbuttons a.selected, .cssbuttons a:hover{background-position:bottom left}
	.cssbuttons a.selected span, .cssbuttons a:hover span{background-position:bottom right;color:black}
	.cssbuttons-purple {text-align:left;overflow:hidden}
	.cssbuttons-purple a{background:transparent url('../images/square-purple-left.gif') no-repeat top left;color:#fff;display:block;float:left;margin-right:6px;font:bold 13px Arial;line-height:15px;height:23px;padding-left:9px;text-decoration:none}
	.cssbuttons-purple a span{background:transparent url('../images/square-purple-right.gif') no-repeat top right;display:block;padding:4px 9px 4px 0}
	.cssbuttons-purple a.selected, .cssbuttons-purple a:hover{background-position:bottom left}
	.cssbuttons-purple a.selected span, .cssbuttons-purple a:hover span{background-position:bottom right;color:black}
	/* (6.4) jQuery tabs */
	#tabs ul{margin:0;padding:0;float:left;width:186px}
	#tabs li{margin:0;padding:0;list-style:none;font-size:12px}
	* html #tabs li{display:inline}
	#tabs li, 
	#tabs li a{float:left;outline:0}
	#tabs ul li a{text-decoration:none;padding:8px;color:#fff;font-weight:bold}
	#tabs ul li.active{background:#394c5c url('../images/tabs-right.gif') no-repeat right top}
	#tabs ul li.active a{background:url('../images/tabs-left.gif') no-repeat left top; color:#fff}
	#tabs div{background:#394c5c;width:186px;clear:both;float:left;padding:5px;min-height:80px}
	#tabs div textarea{width:180px;background:#fff url('../images/form-textfield-bg.gif') no-repeat top left}

