/*
Theme Name: 24NQ
Theme URI: http://www.24nq.com
Description: Theme for 24 Lever Street Manchester
Author: Digital Blah Blah
Version: 1.0
*/

/* -----------------------------------------------
RESET
----------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{ margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; line-height: 1em; }
:focus { outline: 0; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; } 
blockquote, q { quotes: "" ""; }

/* -----------------------------------------------
FRAMEWORK
--------------------------------------------------
 .cF - Clear Fix
 .h  - Hide - Display None
 .r  - Replace Image
 .rO - Replace Image Off Screem
 .cP - Cursor Pointer
------------------------------------------------ */
.cF:after { content:"."; display:block; height: 0; clear: both; visibility: hidden; }
.cF { display: inline-block; }
/* Hide from IE Mac \*/
.cF { display:block; }
/* End hide from IE Mac */
.h { display: none !important; }
.r { display: block; position: relative; overflow: hidden; }
.r span { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.rO { display: block; }
.rO span { position: absolute; left: -9999em; top: -9999em; }
.cP { cursor: pointer; }

/* -----------------------------------------------
BASE SPRITE
----------------------------------------------- */
div#Branding div.item,
div.date { background: url(images/base_spr_v2.png) no-repeat; }

/* -----------------------------------------------
ELEMENTS
----------------------------------------------- */
html { height: 100%; }
body { background: #d8eaf3; color: #000; font-size: 13px; font: 13px Helvetica, Arial; height: 100%; }
strong { font-weight: bold; }
a { color: #000; text-decoration: none; }

/* -----------------------------------------------
STRUCTURE
----------------------------------------------- */

/* Container
------------------------- */
body.loading { background: #d8eaf3 url(images/loader.gif) no-repeat center center; }
body.loading div#Container { width: 1px; height: 1px; overflow: hidden; }

/* Content
------------------------- */
div#Content { width: 465px; margin: 35px 0 0 35px; }
div#Content h1 { display: none; }
div#Content div.post { border-top: 1px solid #000; padding: 10px 0 0 0; margin: 0 0 25px 0; }
div#Content div.post div.date { right: 0; margin-top: 0; background: red; position: absolute; text-align: right; }
div#Content div.post div.date span { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); }
body.width-lowres div#Content div.post div.date { display: none; }
div#Content div.post div.title { position: relative; }
div#Content div.post div.title p { position: absolute; top: 0; left: 0; font-size: 13px; border-bottom: 1px solid #000; }
div#Content div.post div.title h2 { margin: 0 0 10px 70px; font-size: 24px; letter-spacing: -.2px; }
div#Content div.post div.content p { margin: 0 0 10px 0; line-height: 1.2em; }
div#Content div.post div.content blockquote { text-indent: 70px; font-weight: normal; }
div#Content div.post div.content a { text-decoration: underline; text-indent: 0; }
div#Content div.credit { border-top: 1px solid #000; padding: 10px 0 15px 0; }
div#Content div.credit p { line-height: 1.4em; font-size: 11px; }
div#Content div.credit a { border-bottom: 1px solid #000; }

/* Branding
------------------------- */
div#Branding { width: 425px; height: 300px; position: fixed; top: 30px; right: 35px; overflow: hidden; }
body.width-lowres div#Branding { right: auto; left: 550px; }
div#Branding div.item { width: 425px; height: 300px; position: absolute; top: 0; left: 0; }
div#Branding div.item-2 { background-position: -425px 0; }
div#Branding div.item-3 { background-position: -850px 0; }
div#Branding div.item-4 { background-position: -1275px 0; }
div#Branding div.item-5 { background-position: -1700px 0; }
div#Branding div.item-6 { background-position: -2125px 0; }
div#Branding div.item-7 { background-position: -2550px 0; }
div#Branding div.item-8 { background-position: -2975px 0; }
div#Branding ul.tabs { display: none; }

/* Navigation
------------------------- */
div#Navigation { width: 425px; position: fixed; bottom: 30px; right: 35px;  }
body.width-lowres div#Navigation { right: auto; left: 570px; }
div#Navigation h2 { font-size: 22px; margin: 0 0 25px 0; letter-spacing: -.2px;  }
div#Navigation h3 { float: left; margin: 0 15px 0 0; border-bottom: 1px solid #000; }
div#Navigation ul { float: left; }
div#Navigation li { letter-spacing: -.2px; }
div#Navigation a { font-size: 24px;  }
div#Navigation a:hover { color: #666; }

/* Loading
------------------------- */
body.loading div#Container { visibility: hidden; }

/* Map
------------------------- */
div#Map { display: none; z-index: 10000; }
div#GoogleMap { width: 100%; height: 100%; }
div#Map a.close { background:url("../../plugins/fancybox-for-wordpress/css/img/fancy_closebox.png") no-repeat scroll left top transparent; cursor: pointer; height: 30px; position: absolute;
width: 30px; z-index: 1810; top: 15px; right: 15px; }
/* -----------------------------------------------
COMPONENTS
----------------------------------------------- */

/* Scrollable
------------------------- */
div.date { width: 10px; position: fixed; height: 30px; right: 10px; }
div.date-top { top: 35px; background-position: 0 -400px; }
div.date-bottom { bottom: 35px; background-position: -20px -400px; }
