/*************************************************************************
	Reading Sight: http://realpeopleproductions.net
	Developed by Highpass <rob@highpass.co.uk>

	MODULE: 	global.css
	PURPOSE:	all global rules for site
*************************************************************************/

/* Auto float clearing for compliant browsers
*************************************************************************/
.group:after {
	content: ".";
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
	}


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

/* General Rules and classes
*************************************************************************/
html { background: #0B0F11 url('../site_images/site-bg.png') no-repeat 110% 110%; }
body {
	width: 960px;
	height: 100%;
	margin: 60px auto 0;
	color: #FFF;
	font-size: 62.5%;
	font-family: "Helvetica Neue","Helvetica",Arial,sans-serif;
	line-height: 1.4;
}

a, a:visited { 
	text-decoration: underline; 
	color: #FDEF16; 
	font-weight: normal; 
	-webkit-transition: all .2s linear;  
    -moz-transition: all .2s linear;  
    -o-transition: all .2s linear;  
    -ms-transition: all .2s linear;  
    transition: all .2s linear;
}
	
a:hover, a:active, a:focus { text-decoration: none; }

h1, h2, h3, h4, h5 { font-weight: normal; }

h1 { font-size: 3.6em; margin-left: 20px; border-bottom: 1px solid #27262B; font-family: XenophoneRegular, Helvetica, sans-serif; }
	h1 span { border-bottom: 3px solid #27262B; position: relative; top: 4px; }
h2 { font-size: 2.3em; font-family: XenophoneRegular, Helvetica, sans-serif; }
h3 { font-size: 2em; font-family: XenophoneRegular, Helvetica, sans-serif; }
h4 { font-size: 1.8em; }
h5 { font-size: 1.5em; }
	
p { font-size: 1.4em; }
strong { font-weight: bold; }
em { font-style: italic; }

#pageTop { line-height: 0; height: 0; border: 0; padding: 0; }

/* Super classes */
.big { font-size: 1.6em; }
.caps { text-transform: uppercase; }
.hide { display: none; }
.last { margin-right: 0 !important; }
.clear { clear: both; }

/* Main block positioning and formatting
*************************************************************************/
.col1, .col2, .col3, .col1-2, .list-col1, .list-col2 { float: left; display: inline; }

.col1 { width: 580px; padding: 20px 20px 10px; }
.col2 { width: 340px; }

.list-col1 { width: 750px; margin-right: 40px; }
.list-col2 { width: 170px; }

.col1-2 { width: 960px; margin: 0 auto; }

#content { background: rgba(0, 0, 0, 0.24); margin-top: 15px; }

.col2 img { border: 1px solid #252529; display: block; margin: 0 0 0 auto; }


/* Site header
*************************************************************************/
#header { color: #376570; text-decoration: none; }
		
	#site_logo { display: block; width: 425px; height: 95px; text-indent: -9999em; background: url('../site_images/logo-header.png') no-repeat 0 0; float: left; }

/* Primary nav
*************************************************************************/
#main_nav { font-size: 1.4em; border-bottom: 1px solid #FFF; float: right; width: 500px; margin: 55px 0 0 35px; }
	
	#main_nav li { float: left; position: relative; }
	#main_nav li a {
		font-weight: bold;
		display: block;
		color: #FFF;
		text-decoration: none;
		position: relative;
		top: 4px;
		padding-bottom: 3px;
		margin-right: 40px;
		-webkit-transition: none;  
		-moz-transition: none;  
		-o-transition: none;  
		-ms-transition: none;  
		transition: none;
	}
		#main_nav li a:hover, #main_nav li.here a { border-bottom: 2px solid #FFF; padding-bottom: 0;}


/* Secondary nav
*************************************************************************/
#sub_nav { }
	
/* Footer Section
*************************************************************************/
#footer { border-top: 1px solid #27272B; margin-top: 40px; }
#footer ul { float: left; }

#footer a { color: #343338; text-decoration: none; font-size: 1.1em; }

#foot_nav li:first-child { padding-top: 3px; }

#foot_nav li { padding: 1px 0; }

#foot_nav li:first-child a {
	font-weight: bold;
	color: #27262B;
	font-size: 1.2em;
	border-top: 2px solid #27272B;
	padding-top: 2px;
}

#footer a:hover, #foot_nav li:first-child a:hover { color: #FDEF16; }

#footer #foot_links { margin: 10px 0 0 100px; }
#foot_links #foot_fb { display: block; background: url('../site_images/icon-fb.png') no-repeat 0 50%; padding-left: 24px; }
	#foot_links #foot_fb:hover { opacity: 0.8; }
		
/* Editorial styles
*************************************************************************/
.editorial {  }

.editorial h1 { line-height: 1.1; margin: 5px 0 10px; }

.editorial h2, .editorial h3, .editorial h4 { margin-bottom: 4px; }
	
.editorial p { margin-bottom: 18px; line-height: 1.8; }

.editorial ul, .editorial ol { margin-bottom: 12px; margin-left: 20px; font-size: 1.4em; }

.editorial li { list-style-position: outside; padding: 3px 0; }
	.editorial ul li { list-style: square; }
	.editorial ol li { list-style: decimal; }
	
	.editorial ul ul, .editorial ol ol { font-size: 1em; }
	.editorial ul ul li { list-style: circle; }
	
ul.al-anchor-list { margin-bottom: 8px; }
ul.al-anchor-list li { list-style: square; padding: 1px 0; }

.editorial img { display: inline; }
	
	.editorial .img_left { float: left; margin: 15px 15px 15px 0px; }
	.editorial .img_right { float: right; margin: 15px 0px 15px 15px; }

.editorial #ed_img { display: block; margin: 0 0 15px 15px; border: 1px solid #D6D8E2; padding: 3px; }

.editorial .standFirst { font-size: 1.6em; }

/* Blog item date */
.blog_item_date { display: block; font-size: 1.3em; margin: 0 0 10px; font-weight: bold; }

/* Homepage info */
#home_info { margin-top: 25px; }
	#home_info p { margin-bottom: 8px; }
	
/* Back to */
.back_to { font-family: "Helvetica Neue","Helvetica",Arial,sans-serif; font-size: 0.4em; float: right; position: relative; top: 25px; }

/* Listing styles
*************************************************************************/	
.project_box { width: 335px; min-height: 200px; float: left; background: rgba(0, 0, 0, 0.24); padding: 15px; position: relative; margin-bottom: 20px; }
	.project_box img { float: left; margin-right: 20px; border: 1px solid #FFF;}
		.project_box img:hover { border-color: #FDEF16; }
	.project_box h3 { font-size: 2.4em; line-height: 1.1; }
		.project_box h3 a { color: #FFF; text-decoration: none; }
			.project_box h3 a:hover { color: #FDEF16; text-decoration: none; }
	.project_box p { font-size: 1.2em; }
	
	.project_box.even { clear: left; margin-right: 20px; }
	
	.project_box .proj_list_status { position: absolute; bottom: 15px; left: 155px; width: 210px; border-top: 1px solid #27272B; }
		.project_box .proj_list_status p:first-child { font-weight: bold; color: #27272B; border-top: 2px solid #27272B; width: 140px; }
	
/* Project detail
*************************************************************************/
.project_rightcol {
	position: relative;
}

#proj_detail_status { width: 240px; float: right; border-top: 1px solid #27272B; margin: 15px 0; }
	#proj_detail_status p { font-size: 1.2em; }
	#proj_detail_status p:first-child { font-weight: bold; color: #27272B; border-top: 2px solid #27272B; width: 140px; }

.proj_media { float: right; clear: right; }

	.proj_media img, .proj_vid {
		margin-bottom: 15px;
	}
		.proj_media img:hover {
			border: 1px solid #FFF;
		}



/* Homepage
*************************************************************************/
#projectSwapper { margin-top: 25px; }

#projectSwapper .projectPanel { width: 545px; padding: 15px; background: rgba(0, 0, 0, 0.24); margin: 0 auto; position: relative; }


	#projectSwapper .projectPanel img {
		float: left; margin-right: 20px; border: 1px solid #FFF;
	}
		#projectSwapper .projectPanel img:hover { border-color: #FDEF16; }
		
	#projectSwapper .projectPanel h2 { font-size: 2.4em; line-height: 1.1; }
		#projectSwapper .projectPanel h2 a { color: #FFF; text-decoration: none; }
			#projectSwapper .projectPanel h2 a:hover { color: #FDEF16; text-decoration: none; }
	#projectSwapper .projectPanel p { font-size: 1.2em; }
	#projectSwapper .projectPanel .home_more_link { margin: 10px 0 50px; }
	
	.projectPanel .home_status { position: absolute; bottom: 15px; right: 0; width: 360px; border-top: 1px solid #27272B; }
		
		.projectPanel .home_status p:first-child { font-weight: bold; color: #27272B; border-top: 2px solid #27272B; width: 140px; }

/* Misc
*************************************************************************/

/* jqModal
*************************************************************************/
.media_dialog { width: 640px; background: #FFF; color: #000; display: none; position: fixed; top: 10%; left: 50%; margin-left: -320px; padding: 10px; }
    .media_dialog .jqmClose { float: right; font-size: 1.2em; color: #696969; }

/* Slimbox
*************************************************************************/
#lbOverlay {
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	cursor: pointer;
}

#lbCenter, #lbBottomContainer {
	position: absolute;
	z-index: 9999;
	overflow: hidden;
	background-color: #fff;
}

.lbLoading { background: #fff url(../site_images/sb-loading.gif) no-repeat center; }

#lbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #fff;
	background-repeat: no-repeat;
}

#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	width: 50%;
	outline: none;
}

#lbPrevLink { left: 0; }

#lbPrevLink:hover { background: transparent url(../site_images/sb-prevlabel.gif) no-repeat 0 15%; }

#lbNextLink { right: 0; }

#lbNextLink:hover { background: transparent url(../site_images/sb-nextlabel.gif) no-repeat 100% 15%; }

#lbBottom {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 10px solid #fff;
	border-top-style: none;
}

#lbCloseLink {
	display: block;
	float: right;
	width: 66px;
	height: 22px;
	background: transparent url(../site_images/sb-closelabel.gif) no-repeat center;
	margin: 5px 0;
	outline: none;
}

#lbCaption, #lbNumber { margin-right: 71px; }

#lbCaption { font-weight: bold; }
