@font-face {
  font-family: DINPro;
  src: url(http://franq.co.uk/cst/4ff/media/extra/DINPro-Regular.ttf) format("TrueType");
}

body, html { padding:0px; margin:0px; }
body { background-color:rgb(33,33,33); background-image:url(http://franq.co.uk/cst/4ff/media/images/DSC_0231_4ff_bg5.jpg); background-repeat:repeat; color: #262626; font-family:DINPro, Arial, Helvetica; font-size:12px; word-spacing:1px; line-height:1.5; height:100%; width:100%; }
/*body { background-color:rgb(33,33,33); background-image:url(http://franq.co.uk/cst/4ff/media/images/bgbody.jpg); background-repeat:repeat; color: #262626; font-family:DINPro, Arial, Helvetica; font-size:12px; word-spacing:1px; line-height:1.5; height:100%; width:100%; }*/

.loader_holder { z-index:3; position:absolute; text-align:center; top:57px; left:90px; display:none;  }
.cardimgcrop { width:200px; height:134px; overflow:hidden; position:relative; text-align:center; padding:9px 10px 0px; }
.ie .cardimgcrop { padding:4px 10px 0px; }
.project_thumb { width:200px; height:205px; position:relative; margin-right:35px; float:left; }
.project_header { margin-right:35px; }
.bottompad { clear:both; position:relative; height:25px; width:100%; }
.project_feed_thumb .hover { text-decoration:none; }
.project_feed_thumb .nohover { text-decoration:none; }
.slideshow_wrapper a, .slideshow_wrapper a:hover, .slideshow_wrapper a:active { background:none !important; }


/* MAIN CONTENT POSITIONING */ 
.header_img { margin-top:30px; margin-left:25px; z-index:99; }
#items_container { margin-left:25px; margin-top:25px; }*/clear:both;*/
#items {  }
.nav_container { margin-top:25px; margin-left:49px; margin-right:25px; margin-bottom:15px; height:auto; line-height:2.4;  z-index:50; color:#ffffff; width:auto; position:absolute;}
.nav_container.horizontal { width:auto; position:relative;}
.nav_container.horizontal div { float:left; }
.nav_container.horizontal div.clear { float:none; }
*/#body_container { width:640px; overflow:hidden; }*/

.pagination { left:740px; color:#666; font-size:12px; z-index:11; margin:25px; height:50px; }
.loader_holder { margin-left:10px; margin-top:9px; }

.horizontal .page_link,
.horizontal .project_link,
.horizontal .nav_active { float:left; padding-right:14px; }

#nav_loadspin { position:fixed; top:8px; left:35px; display:none; visibility:hidden; }

/* PROJECT CONTENT */
.project_title { font-family:DINPro, Georgia, Arial; font-size:24px; color: rgb(51,51,51); font-weight:normal; line-height:1.5; padding-bottom:11px; margin-top:-8px; width:600px; }
.project_content { width:640px; color:#666; }
.project_content img { margin:0px 15px 15px 0px;}

.project_content #slideshow_container img { margin:0px; }
.project_content #slideshow_container { margin:0px 15px 15px 0px; }

.project_footer { clear:both; padding:32px 0px 0px 0px; font-size:11px; color:rgb(51,51,51); margin-left:0px; margin-right:30px; }
.project_bottom { clear:both; width:640px; margin:0px 0px; }
.project_index { height:21px; width:21px; float:right; overflow:hidden; margin:0px 0px 3px 3px; }
.tags { color:rgb(51,51,51); }
blockquote { color:#888; margin-top:0px; margin-bottom:0px; }
.project_header { color:#fff; font-size:12px; font-style:bold; margin:0px 0px 0px 0px; }
.project_views { font-style:italic; color:rgb(51,51,51); }
.footer_title_type { font-weight:bold; color:rgb(51,51,51) }
/*.cargo_link { position:fixed; bottom:15px; right:15px; font-family: arial; font-size:11px; color:#666; line-height:165%; z-index:99; }*/

/* cargo + 4ff footer fixed */
.cargo_link { position:fixed; bottom:0px; width:100%; left:0px; color:#555; background:#000; font-family: DINPro, Arial; font-size:10px; line-height:150%; z-index:99; padding:6px 10px 6px 40px;}

.nav_follow { position:fixed; bottom:35px; right:35px; color:#666; font-size:12px; z-index:11; }
.horizontal .nav_follow { position:relative; float:left; right:auto; bottom:auto; }

h1 { font-family: Georgia,"Lucida Grande",Arial,Helvetica,sans-serif; font-size:16px; font-weight:normal; margin:0px; margin-bottom: 1.5em; padding:0px; line-height:150%; color:rgb(153,153,153); }
h2 { font-family: Georgia,"Lucida Grande",Arial,Helvetica,sans-serif; font-size:14px; font-weight:normal; margin:0px; margin-bottom: 1.5em; padding:0px; color:rgb(153,153,153); line-height:1.14em; }
h3 { font-family:"Trebuchet MS",Arial,Helvetica,sans-serif; font-size:10px; line-height:150%; }

/* PROJECT CUSTOM STYLES */
.project-info-container {margin-top: 3em; margin-bottom:3em; border-bottom:0px solid rgb(51,51,51); color:rgb(145,145,145); letter-spacing:0.1em; font-size:11px }
.project-img-divider {border-top:1px solid rgb(41,41,41); width:100%; text-align:right; vertical-align:bottom; line-height:18px;}
.project-img-divider b {font-weight:normal; font-family:"Trebuchet MS", "Lucida Grande", Arial, sans-serif; letter-spacing:1px; font-size:9px; float:left; line-height:18px;}
.col-left { float: left; vertical-align: top; width: 389px; }
.col-right { float: right; width: 237px; vertical-align: top; line-height:2.7em; font-size:9px; letter-spacing:normal;}
.fact { padding-left:15px; border-bottom: 1px dotted rgb(31,31,31); width:222px; font-family: Arial,"Trebuchet MS","Lucida Grande",Helvetica,sans-serif; letter-spacing:1px;}
.fact b {letter-spacing:1px !important; font-size:9px; font-family:"Trebuchet MS",Arial; }
.smallcaps {font-variant: small-caps; font-family:"Trebuchet MS",Arial; letter-spacing:1px !important; font-size:9px;}

/* THUMBNAIL STYLES */
.thumb_title, .thumb_title a, .thumb_title a:visited {text-align:center; color:#737373; font-size:12px; font-weight:normal; margin:10px 0px 0px 10px; line-height:15px; overflow:hidden; white-space:nowrap; width:200px; text-shadow:rgba(0,0,0,0.01) 0 0 1px;}
.thumb_tag { text-align:center; font-size:10px; line-height:15px; color:#424242; }
.thumb_tag.notitle { margin-top:12px; }


.project_feed_thumb { float:left; width:220px; margin:0px 10px 10px 0px; padding:0 0 0 0; height:195px; position:relative; background-image:url(http://franq.co.uk/cst/4ff/media/images/bgthumb.png); }
.project_feed_thumb .hover { cursor: pointer; text-decoration:none !important; }
.project_feed_thumb .hover .thumb_title .text, .project_feed_thumb.hover .thumb_title .text { color:#f4f4f4; padding:1px 2px 1px 2px; text-decoration:none; }
.project_feed_thumb.hover { background:#000;}


/* FADE BG 
.project_feed_thumb {background-image: url(http://www.tamburlane.se/thumb-bg.gif); background-position: 11px 10px; background-repeat: no-repeat; }  
.project_feed_thumb img { margin-bottom: 10px; -webkit-transition: all 150ms linear; opacity:0.6; filter:alpha(opacity=60); }  
.project_feed_thumb .hover img { opacity:1; filter:alpha(opacity=100);} 
.project_feed_thumb .hover .thumb_title .text, .project_feed_thumb.hover .thumb_title .text { color:#000; padding:1px 2px 1px 2px; text-decoration:none; }
.project_feed_thumb.hover { background-color:rgb(230,220,180); } */



.project_feed_full { float:left; width:640px; position:relative; background:#000; padding:20px; }

.info_contain { width:200px; padding-bottom:10px; margin-left:10px; }

.thumb_type .text a { text-decoration:none; }
.thumb_type .text a:hover { text-decoration:underline; }


	/* ROUNDED CORNERS FOR IE ONLY 
	.project_feed_thumb.ie { background:none; }
	.project_feed_thumb.ie .pr_wrapper { background-image:url(http://www.tamburlane.se/bgthumb.png); padding-bottom:5px; }
         b.rtop, b.rbottom { display:block; }
	b.rtop b, b.rbottom b { display:block; height: 1px; overflow:hidden; background-image:url(http://www.tamburlane.se/bgthumb.png); }
*/


         /* ROLLOVER CARD */
	.project_feed_thumb.ie.hover .pr_wrapper { background:#000; }
         .project_feed_thumb.ie.hover b.rtop b, 
	.project_feed_thumb.ie.hover b.rbottom b { background:#000; }



	/* STANDARD */
	b.r1 { margin: 0 5px }
	b.r2 { margin: 0 3px }
	b.r3 { margin: 0 2px }
	b.rtop b.r4, b.rbottom b.r4 { margin: 0 1px; height:2px }
	b.rtop b.r5, b.rbottom b.r5 { margin:0 0px; height:1px; }
	
	/* ROUNDED CORNERS FOR IE ONLY */
	.project_feed_thumb.ie { background:none; }
	.project_feed_thumb.ie .pr_wrapper { background-image:url(http://franq.co.uk/cst/4ff/media/images/bgthumb.png); padding-bottom:5px; }
	.project_feed_thumb.ie.hover .pr_wrapper { background:#000; }
	b.rtop, b.rbottom { display:block; }
	b.rtop b, b.rbottom b { display:block; height: 1px; overflow:hidden; background-image:url(http://franq.co.uk/cst/4ff/media/images/bgthumb.png);  }
	.project_feed_thumb.ie.hover b.rtop b, 
	.project_feed_thumb.ie.hover b.rbottom b { background:#000; }
	b.r1 { margin: 0 5px }
	b.r2 { margin: 0 3px }
	b.r3 { margin: 0 2px }
	b.rtop b.r4, b.rbottom b.r4 { margin: 0 1px; height:2px }
	b.rtop b.r5, b.rbottom b.r5 { margin:0 0px; height:1px; }
	
	.project_feed_full.ie { padding:0px 20px; margin:0px; }
	.project_feed_full.ie b.rtop { padding-bottom:10px; margin:-6px -20px 0px -20px; }
	.project_feed_full.ie b.rbottom { margin:0px -20px -6px -20px; }
	.project_feed_full.ie b.rtop b, .project_feed_full.ie b.rbottom b { background-color:#000; }
 
 /* IE Header fixes */
.project_feed_full.ie .project_index { margin:0px 0px 3px 3px; }
.project_feed_full.ie .project_title { margin-top:-4px; }
.project_feed_full.ie .project_footer { padding-bottom:14px; }

.slideshow_nav { color:rgb(81,81,81); font-family: "Trebuchet MS","Lucida Grande", Arial, Helvetica, sans-serif; font-size:9px; letter-spacing:1px; height:12px; vertical-align:middle; width:190px; background-color:rgb(45,45,45); opacity:0.8; filter:alpha(opacity=80); text-align: left; padding-left:3px; padding-top:3px; padding-bottom:4px; position:relative; top:19px; z-index:111; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px;} 

.slideshow_count {  }
.slideshow_wrapper { margin:0px 15px 15px 0px; }
.slideshow_wrapper img { margin:0px;}
.slide_slash {color:rgb(153,153,153);}


/* TAG VIEW STYLE */
.view_tag_info { font-size:14px; color:rgb(61,61,61); padding:40px 0px 0px 0px; position:absolute; top:-23px;}
.view_tag_info b {font-weight:normal; font-style:italic !important;}
.view_all { color:rgb(81,81,81); text-decoration:none; font-size:9px; font-family:"Trebuchet MS","Lucida Grande",Arial,Helvetica; text-transform:uppercase; letter-spacing:0.1em;}
.view_all:hover { color:rgb(255,204,0); text-decoration:none;}

/* TOOLSET */
.toolset { position:fixed; top:2px; right:3px; z-index:9999; }



/* #################### LINK STYLES START #################### */

/* BODYCOPY */
.bodycopy a { color:rgb(180,180,180); text-decoration:none; }
.bodycopy a:hover { color:rgb(255,204,0); text-decoration:none; }
.bodycopy a:active { color:#fff;  }

.blue a { color:#06f; text-decoration:none; }
.blue a:hover { color:#000; background:#ff6; text-decoration:underline; }
.blue a:active { color:#fff; background:#000; }

.cargo_link a { color:#888; text-decoration:underline; }
.cargo_link a:hover { color:#1795A3; background:none; text-decoration:underline; }
.cargo_link a:active { color:#fff; background:none; }

/* NAV LIST */
.page_link a { text-decoration:none; color:rgb(230,220,180); font-size:9px; text-transform:uppercase; letter-spacing:2px; font-family: DINPro, Arial,Helvetica,sans-serif; line-height:2.9;}
.page_link a:hover { color:rgb(255,204,0); text-decoration:none; }
.page_link a:active { color:rgb(255,204,0); text-decoration:none; }

.nav_active a { text-decoration:none; color:rgb(255,204,0); font-size:9px; text-transform:uppercase; letter-spacing:2px; font-family: DINPro, Arial,Helvetica,sans-serif; line-height:2.9; }
.nav_active a:active  { color:rgb(255,204,0); text-decoration:none; }

.pagination a { color:rgb(180,180,180); font-size:12px; padding:2px 3px 3px 3px; text-decoration:none; }
.pagination a:hover { color:rgb(255,204,0); text-decoration:underline; background:transparent; }
.pagination a:active { color:rgb(255,204,0); text-decoration:underline; }

.slideshow_nav a { color:rgb(153,153,153); text-decoration:none; letter-spacing:1px; font-weight:normal; text-transform:uppercase;}
.slideshow_nav a:hover { color:rgb(255,204,0); text-decoration:none; letter-spacing:1px; font-weight:normal; text-transform:uppercase; }
.slideshow_nav a:active {  }

.thumb_tag a, .thumb_tag a:visited { text-decoration:none; text-align:center; color:#424242; font-size:10px; font-style:italic; line-height:15px; }
.thumb_tag a:hover { color:#333; text-decoration:underline; }

.nav_line {
border-bottom:3px solid rgb(0,0,0);
width:100%;
margin-right:15px;
}

/* FILTER LIST */

.filter_link {color:rgb(61,61,61); font-family:"Trebuchet MS","Lucida Grande"; line-height:2.4; font-size:11px;}
.filter_link a {color:rgb(97, 95, 84); text-decoration:none;}
/*.filter_link a {color:rgb(91, 91, 91); text-decoration:none;}*/
.filter_link a:hover {color:rgb(255,204,0); text-decoration:none;}
.filter_link a:active {color:#fff;}

/* SAFARI THUMB HOVER UNDERLINE HACK */
.bodycopy a.hover:hover { text-decoration:none; }

/* PROJECT HEADER */
.project_header .project_index a img { margin-top:0px; border:none;}
.project_header .project_index a:hover img { margin-top:-21px; }
.project_header .project_index a:active {  }
.project_header .project_index a:visited {  }


/* PROJECT FOOTER */
.project_footer .permalink a { text-decoration:none; color:rgb(81,81,81); font-style:italic; }
.project_footer .permalink a:hover { color:rgb(255,204,0); background:transparent; text-decoration:none; }
.project_footer .permalink a:active { color:#fff; }
.project_footer .permalink a:visited {  }

.project_footer .editlink a { color:rgb(255,204,0); font-style:normal; text-decoration:none;}
.project_footer .editlink a:hover { color:#fff; text-decoration:none;}
.project_footer .editlink a:active { color:#fff; }
.project_footer .editlink a:visited {  }

.tags .view_tag_info a { rgb(180,180,180); text-decoration:none; }
.tags .view_tag_info a:hover { color:rgb(255,204,0); background:transparent; text-decoration:none; }
.tags .view_tag_info a:active { color:#fff; text-decoration:none;}
.tags .view_tag_info a:visited {  }

.nav_follow a { color:#666; font-size:12px; padding:px 3px 2px 3px; text-decoration:none; }
.nav_follow a:hover { color:#1795A3; background:transparent; text-decoration:underline; }
.nav_follow a:active { color:#000; text-decoration:underline; }


.tags a { color:rgb(81,81,81); text-decoration:none; }
.tags a:hover { color:rgb(255,204,0); text-decoration:none; }
.tags a:active { color:#fff; }
.tags a:visited {  }

.project_top a { text-decoration:underline; color:rgb(51,51,51); font-style:italic; }
.project_top a:hover { }
.project_top a:active {  }
.project_top a:visited {  }

.project_close a { text-decoration:underline; color:#999; font-style:italic; }
.project_close a:hover {  }
.project_close a:active {  }
.project_close a:visited {  }

/* #################### LINK STYLES END #################### */



	
/* ### ADDITION: TEXT NAV LINK STYLE ### */
.link_link a { text-decoration:underline; color:#1795A3; font-size:11px; }
.link_link a:hover { color:rgb(230,220,180); text-decoration:underline; }
.link_link a:active { color:#000; text-decoration:underline; }
.horizontal .link_link { float:left; padding-right:14px; }

.yello {color:rgb(255,204,0); }

.grey { color:#555; font-family: DINPro, Arial; font-size:11px; line-height:150%; z-index:99; padding:6px 10px 6px 40px; }

.comingsoon { color:#555; font-size:9px; text-transform:uppercase; letter-spacing:2px; font-family: DINPro, Arial,Helvetica,sans-serif; line-height:2.9;}


/* TAGS */

/*#tagmenu {
	position:fixed;
	left:24px;
	top:170px;
	margin:0px;
	padding:0px; 
	white-space:nowrap; 
	z-index:133;
}*/

#tagmenu {
	position:absolute;
	left:0px;
	top:170px;
	width:150px;
	height:213px;
	z-index:133;
}


#tagmenu ul li a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding:2px 3px 2px 3px;
	text-decoration: none;
	list-style-type: none;
	color:#180043;
	/*color:#999;*/
}

#tagmenu ul li a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding:2px 3px 2px 3px;
	text-decoration: none;
	list-style-type: none;
	color:#222;
	background:#ff6;
}

/*#tagmenu ul li a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding:2px 3px 2px 3px;
	text-decoration: none;
	list-style-type: none;
	color:#f2f2f2;
	background:#180043;
}*/

li {
	list-style-type: none;
}

/*.fewwords {
	font-family: DINPro, Arial, Helvetica, sans-serif;
	font-size: 11px;
	padding:2px 3px 3px 3px;
	color:#999;
	}
*/


    
	
	.project_thumb { min-width:200px; }
	.thumb_title { min-width:194px; }
	.thumb_tag { min-width:200px; }
	
	 
	
	.slideshow_thumbs {
            margin: 0 0 0 0;
        }
            
        ul.slideshow_thumbs {
            margin: 0;
            padding: 0;
        }    

        .slideshow_thumb {
            float: left;
            list-style: none;
            padding: 0 8px 8px 0;
        }

        .slideshow_thumb a {
            background: none !important;
            border: 1px solid transparent;
            display: block;
            padding: 1px;
        }

            .slideshow_thumb a:hover {
                background: none !important;
                border: 1px solid #ccc;
            }

            a.activeSlide {
                background: none;
                border: 1px solid #ccc;
            }

            .slideshow_thumb a:active, a.activeSlide:active {
                background: none !important;
                border: 1px solid #666;
            }

        .slideshow_thumb img {
            border: 0;
            display: block;
            margin: 0;
            height: 60px;
        }

.thumb_title.notag {
        margin: 0 0 22px 0;
    }

.cardimgcrop.notitle_notag {
        margin-bottom: 22px;
    }



	


/* */

/* Next project
***********************************************************************************************************/

.project_next {
    float: right;
    height: 21px;
    margin: 0px 0px 3px 3px;
    overflow: hidden;
    position: relative;
    width: 21px;
    z-index: 99;
}
        
    .project_header .project_next a img { margin-top: 0px; }
    .project_header .project_next a:hover img { margin-top: -21px; }



	
	
/* Video component
***********************************************************************************************************/

.video_component {
	float: left;
	margin: 0 15px 15px 0;
}

/* Audio component
***********************************************************************************************************/

.audio_component {
	color: #777777;
	font-family: "Droid Sans Mono", Monaco, Monospace, Arial, san-serif;
    font-size: 10px;
	height: 30px;
	line-height: 26px;
    width: 300px;
}

	.audio_component div {
    	height: 26px;
    }

	.audio_component .border {
		border: 2px solid #aaaaaa;
		opacity: 0.5;
		
		-moz-border-radius: 5px;
    	-webkit-border-radius: 5px;
    	filter: alpha(opacity=50);
    	-moz-opacity: 0.5;
    	-khtml-opacity: 0.5;
	}
	
	.audio_component .vertical_border {
		background: #aaaaaa;
		opacity: 0.50;
		
		filter: alpha(opacity=50);
    	-moz-opacity: 0.5;
    	-khtml-opacity: 0.5;
	}
    
    .audio_component .controls {
    	top: 2px; left: 2px;
    }
    
    	.audio_component .play_pause {
    		background: url("/_gfx/playpause.png");		
    	}
    
	.audio_component .spectrum .spectrum_bar {
        background: #666666;
    }
    
    .audio_component .loading {
    	background: #bbbbbb;
    	opacity: 0.25;
    	
    	filter: alpha(opacity=25);
    	-moz-opacity: 0.25;
    	-khtml-opacity: 0.25;
    }
    
    .audio_component .progress {
    	background: #bbbbbb;
    	border-right: 1px dotted #333333;
    	opacity: 0.25;
    	
    	filter: alpha(opacity=25);
    	-moz-opacity: 0.25;
    	-khtml-opacity: 0.25;
    }
    
    .audio_component .volume_slide.hover {
    	background: #bbbbbb;
    	opacity: 0.3;

    	filter: alpha(opacity=30);
    	-moz-opacity: 0.3;
    	-khtml-opacity: 0.3;
	}
	
/* In-browser code editing made "almost bearable" by CodeMirror: http://marijn.haverbeke.nl/codemirror
***********************************************************************************************************/