/*
============================================================================
Theme Name: TMRW v3
Theme URI: http://www.tmrw.co.uk/
Description: Bespoke theme, made from scratch as oppsoed to v2
Version: 1.0
Author: Rich Hinchcliffe
Author URI: http://www.tmrw.co.uk/

REMEMBER 
yellow = #f0c100
============================================================================
*/
/*
============================================================================
 _____ __  __ _____      __ TM
|_   _|  \/  | _ \ \    / /
  | | | |\/| |   /\ \/\/ / 
  |_| |_|  |_|_|_\ \_/\_/  
============================================================================
*/
/*
============================================================================
DEFAULT BROWSER SETTINGS/OVER-RIDES
============================================================================
*/
* {
  margin:0;
  padding:0;
}
body {
  font:normal 0.70em Arial, Helvetica, sans-serif;
  background:#fff;
  color:#555;
}
html, body { height:100%; }
p { margin:0 0 15px 0; }
a { color:#f0c100; }
a:hover, a:focus, a:active {
  color:#f0c100!important;
  text-decoration:none!important;
}
h1, h2, h3, h4, h5, h6 {
  color:#444;
  font-family:Georgia, "Times New Roman", Times, serif
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  color:#444;
  text-decoration:none;
}
h2 a:hover, h2 a:focus, h2 a:active { color:#f0c100; }
img { -ms-interpolation-mode: bicubic; }
hr {
  border:none;
  background:none;
  border-top:1px dotted #ccc;
  height:1px;
  line-height:1px;
  margin:30px 0 30px 0;
}
blockquote {
  padding:10px;
  background:#eee;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
/*
============================================================================
FLOATFIX
bit of css to fix the clearing problem with divs containing floats
explained here http://www.positioniseverything.net/easyclearing.html 
might cause some problems? Keep an eye on it, seems to work well though 
============================================================================
*/

.floatfix:after {
  content:".";
  display:block;
  height:0px;
  clear:both;
  visibility:hidden
}
.floatfix { display:inline-block }
/* Hides from IE-mac \*/
* html .floatfix { height:1% }
.floatfix { display:block }
/* End hide from IE-mac */

/*
============================================================================
MAIN LAYOUT, COLUMNS ETC
============================================================================
*/

#wrapper { width:990px; }
#header {
  margin:15px 30px 20px 30px;
  padding:0 0 20px 0;
  border-bottom:1px dotted #ccc;
}
#colL {
  width:250px;
  z-index:100;
  position:absolute;
  left:30px;
  float:left;
}
#colM {
  float:right;
  width:640px;
  margin:-13px 30px 0 0;
}
#colM-inner { float:left; }
/*
============================================================================
HEADER - main container style is above
============================================================================
*/	
#strapline {
  float:right;
  text-align:right;
  font-family:Georgia, "Times New Roman", Times, serif;
  color:#999;
  font-variant:small-caps;
  font-size:2.0em;
  margin:15px 0 0 0;
}
#strapline em {
  background:url(images/icon-i-over.png) no-repeat left top;
  width:17px;
  height:17px;
  display:block;
  float:right;
  margin:5px 0 0 5px;
  cursor:pointer;
}
#strapline em:hover { background:url(images/icon-i.png) no-repeat left top; }
#strapline em span { display:none; }
.about {
  width:300px;
  float:right;
  clear:right;
  text-align:right;
  color:#777;
}
.about a {
  color:#777;
}
.about .ajax-content { padding:10px 0 0 0; }
.about p { clear:both; }
#about-close {
  cursor:pointer;
  padding:2px;
  background:#aaa;
  color:#fff;
  float:right;
  text-transform:uppercase;
  font-size:0.8em;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
#about-close:hover { background:#888; }
#contact {
  clear:right;
  float:right;
  text-align:right;
  font-family:Georgia, "Times New Roman", Times, serif;
  margin:8px 0 0 0;
  color:#888;
  font-size:1.3em;
  width:400px;
}
#contact .smaller {
  font-size:0.75em;
  color:#ccc;
}
#contact a {
  color:#f0c100;
  text-decoration:none
}
#contact .tmrwMagic {
  font-weight:bold;
  font-size:1.1em;
  color:#777;
  unicode-bidi:bidi-override;
  direction: rtl;
}
/*
============================================================================
LOGO
============================================================================
*/
#logo {
  width:113px;
  float:left;
}
#logo p { display:none; }
#logo h1 {
  height:110px;
  width:113px;
  display:block;
  background:url(images/ht-logo.png) no-repeat left top;
  _background:url(images/ht-logo.gif) no-repeat left top;
}
#logo h1 span { display:none; }
#logo h3 a {
  height:110px;
  width:113px;
  display:block;
  background:url(images/ht-logo.png) no-repeat left top;
  _background:url(images/ht-logo.gif) no-repeat left top;
}
#logo h3 a span { display:none; }
/*
============================================================================
MAIN/BOLD TOP NAV
============================================================================
*/
#main-nav {
  padding:10px 0 20px 0;
  font-family:Georgia, "Times New Roman", Times, serif
}
#main-nav a {
  text-transform:uppercase;
  line-height:0.9em!important;
  font-size:2.0em;
  font-weight:normal!important;
  color:#f0c100!important;
}
#main-nav ul a { color:#999!important; }
#main-nav span {
  position:relative;
  top:-4px
}
#main-nav a:hover, #main-nav a:focus, #main-nav a:active { color:#666!important; ; }
#main-nav a:visited { text-decoration:none!important; }
/*
============================================================================
COL L LAYOUT SPECIFIC OVERRIDES
============================================================================
*/
#colL a {
  color:#999;
  text-decoration:none;
}
#colL h3 {
  margin:35px 0 3px 0;
  font-weight:normal;
  text-transform:uppercase;
  font-size:1.5em;
  color:#666;
  width:100%;
  padding:1px 0;
}
#colL ul { list-style:none; }
#colL ul li a:visited { text-decoration:line-through; }
#colL ul li.activePost a {
  color:#222;
  cursor:default;
  text-decoration:none!important;
}
#categories {
  background:#f6f6f6;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding:3px 5px 3px 5px;
  margin:0 0 20px 0;
}
#categories h3 {
  margin:0;
  cursor:pointer;
  color:#bbb;
  font-family:Arial, Helvetica, sans-serif;
  text-transform:none!important;
}
#categories h3:hover { color:#777; }
#categories h3 { font-family:Georgia, "Times New Roman", Times, serif; }
#categories h3:hover span strong { color:#f0c100; }
#categories a:visited { text-decoration:none!important; }
#categories ul {
  margin:8px;
  color:#bbb;
}
#categories ul a { font-weight:bold; }
/*
============================================================================
COL M LAYOUT SPECIFIC OVERRIDES
============================================================================
*/
#colM ul {
  margin:10px 0 20px 30px;
  color:#666;/*font-family:"Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana, sans-serif;*/
}
#colM ol {
  margin:0 0 20px 20px;
  color:#777;
}
#colM li { margin:0 0 3px 0 }
/*
============================================================================
IMAGE ZOOM/RESIZE FUNCTIONALITY
============================================================================
*/
.workPost img {
  width:100%;
  border:1px solid #ccc;
  background:#fff url(images/lgrey_diag.gif);
}
.blogPost img {
  border:1px solid #ccc;
  background:#fff url(images/lgrey_diag.gif);
}
.forcedSize {
  max-width:100%;
  cursor:pointer;
  background:#fff url(images/lgrey_diag.gif);
}
.actualSize {
  width:auto!important;
  max-width:none!important;
  background:#fff url(images/lgrey_diag.gif);
	-webkit-box-shadow: 10px 10px 25px #ccc;  
	-moz-box-shadow: 10px 10px 25px #ccc;  
	box-shadow: 10px 10px 25px #ccc; 
}
span.clickzoom {
  clear:both;
  display:block;
  position:relative;
}
span.clickzoom strong {
  display:block;
  font:normal 1.0em Arial, Helvetica, sans-serif;
  text-transform:uppercase;
  color:#fff;
  background:#f0c100;
  padding:2px 4px 2px 4px;
  position:absolute;
  top:10px;
  left:10px;
  z-index:300;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
/*
============================================================================
POST SYTLING
============================================================================
*/
.entry {
  clear:both;
  font-size:1.2em
}
.post {
  padding:20px 0 20px 0;
  float:left;
  width:640px;
  border-bottom:1px dotted #ccc;
}
.post h1, .post h2 {
  float:left;
  width:70%;
  text-transform:uppercase;
  font-size:2.3em;
  font-weight:normal;
}
.post h3 {
  text-transform:uppercase;
  font-size:1.3em;
  font-weight:normal;
  margin:30px 0 5px 0;
}
.postMeta {
  font-size:0.9em;
  text-align:right;
  float:right;
  width:22%;
  padding:5px 0 0 0;
  color:#bbb;
}
.postMeta .comments {
  background:url(images/chat_grey.gif) no-repeat left center;
  padding-left:15px;
  margin-left:2px;
}
.isSingle .intro {
	font-size:1.6em;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	padding:15px 0;
	border-top:1px dashed #ddd;
	border-bottom:1px dashed #ddd;
}
.info, .cats {
  color:#bcbcbc;
  clear:both;
}
.info a, .cats a { color:#bcbcbc; }
.info { margin:0; }
.post-image { margin:0 0 10px 0; }
.more-link {
  background:#f0c100;
  color:#fff;
  font-size:1.2em;
  text-decoration:none!important;
  text-transform:uppercase;
  padding:4px 6px 3px 6px!important;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.more-link:hover, .more-link:focus, .more-link:active {
  background:#444!important;
  color:#f0c100!important;
}
.previous-page, .next-page {
  background:#444;
  color:#fff;
  font-size:1.8em;
  margin:10px 0 0 0;
  font-weight:bold;
  text-decoration:none!important;
  text-transform:uppercase;
  padding:7px 10px 5px 10px!important;
  -moz-border-radius: 4px;
  -khtml-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}
.previous-page:hover, .previous-page:focus, .previous-page:active, .next-page:hover, .next-page:focus, .next-page:active {
  background:#f0c100;
  color:#fff!important;
}
/*
============================================================================
SOCIAL BOOKMARKS AREA
============================================================================
*/
#social {
  padding:100px 0 10px 0;
  float:left;
}
/*
============================================================================
COMMENT AREA
============================================================================
*/
#comments-wrapper {
  clear:both;
  float:left;
  width:100%;
}
#comment {
  width:99%;
  -moz-border-radius: 4px;
  -khtml-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background:#eee;
  border:none;
  padding:4px;
  font:normal 1.2em Verdana, Arial, Helvetica, sans-serif;
  color:#999;
}
h3#comments {   font-variant:small-caps;
  margin:50px 0 10px 0;
  font-size:2.0em;
  font-weight:normal; }
 
h3#pings {   font-variant:small-caps;
  margin:50px 0 10px 0;
  font-size:1.5em;
  font-weight:normal; }
  
  
/* style me some comments and inputs */
#colM ol.commentslist {
  list-style:none!important;
  margin:5px 0 0 0!important;
}
.commentlist li {
  font-size:1.1em;
  background:#f6f6f6;
  border:1px solid #eee;
  margin-bottom:7px;
  padding:15px;
  -moz-border-radius: 4px;
  -khtml-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}
.pinglist li {
  font-size:0.9em;
  background:#f9f9f9;
  border:1px solid #f6f6f6;
  padding:8px 15px 8px 15px;
}
.pinglist li a {
  color:#999
}
.commentlist li.bypostauthor {
  background:#FBEFBF;
  background:#fff;
  border:none;
}
 
.commentlist .comment-author {
	font-size:1.1em;
  font-weight:bold
}
.commentlist .comment-author cite {
	font-style:normal
}
.commentlist .comment-meta {
	font-size:0.9em;
  font-style:italic;
	margin:0 0 10px 0;  
}
.pinglist .comment-meta {
	font-size:1.0em;
  color:#bbb
}

.commentlist li.alt { }

.commentlist ul.children { 
margin:15px 0 0 0!important;
padding:0!important;
list-style:none;

}



h3#respond {
  margin:0 0 10px 0;
  font-weight:normal;
}
/*
============================================================================
PAGINATION
============================================================================
*/
#more-reading {
  clear:both;
  text-transform: uppercase;
  padding:4px 0 0 0;
  margin:25px 0 55px 0;
}
.previous-page {
  float:left;
  display:block
}
.next-page {
  float:right;
  display:block
}
/*
============================================================================
SEARCH AREA
============================================================================
*/
#search-wrap input { vertical-align:middle; }
#search-wrap #s {
  padding:1px 2px;
  margin-right:3px;
  width:160px;
}
#search-wrap #searchsubmit {
  position:relative;
  top:0px;
}
/*
============================================================================
HOMEPAGE SPECIFIC
============================================================================
*/
#home-top-split {
  border-bottom:1px dotted #ccc;
  color:#999;
}
#intro {
  float:left;
  width:420px;
  border:none;
}
#intro h2 {
  width:420px!important;
  margin:0 0 10px 0;
  padding:0 0 0 21px;
  background:url(images/icon-i.png) no-repeat left;
}
#intro p em { display:none }
#latest {
	font-size:1.0em;
  position:relative;
  float:left;
  width:100%;
  border:none;
  color:#888;
  padding:1px 0;
 /* text-align:right;*/
}
#latest .more-link {
  background:#ddd;
  color:#666;
  font-size:0.9em;
  padding:2px 4px 1px 4px!important;
}
#latest h3 {
	margin:0 0 10px 0;
  border-bottom:1px dotted #aaa;
}
#latest h4 {
  width:210px!important;
  font-size:1.3em;
  font-weight:normal;
  text-transform:uppercase;
  margin:0 0 6px 0;
}
#latest div {
  margin:0 0 10px 0;
  border-bottom:1px dotted #ccc;
}
#latest-label {
  /*text-align:right;*/
  position:absolute;
  top:7px;
  right:0px;
  font-family:Georgia, "Times New Roman", Times, serif;
  color:#ccc;
}
#latest p {
	clear:both
}
/*
============================================================================
MISC
============================================================================
*/

#error h2 {
  width:100%!important;
  margin:0 0 10px 0;
  float:none!important;
}
#noscript { display:none }
/*.visit-link {
	font-weight:bold;
	background:#eee;
	color:#666;
	text-decoration:none!important;
	text-transform:uppercase;
	padding:4px 9px!important;
	-moz-border-radius: 100px;
	-khtml-border-radius: 100px;
	-webkit-border-radius: 100px;
	border-radius: 100px;
}
.visit-link:hover,.visit-link:focus,.visit-link:active {
	background:#666;
	color:#f0c100;
}
.download-link {
	font-weight:bold;
	background:#f0c100;
	color:#fff;
	text-decoration:none!important;
	text-transform:uppercase;
	padding:4px 9px!important;
	-moz-border-radius: 100px;
	-khtml-border-radius: 100px;
	-webkit-border-radius: 100px;
	border-radius: 100px;
}
.download-link:hover,.download-link:focus,.download-link:active {
	background:#666;
	color:#f0c100;
}*/
.visit-link { font-weight:bold; }
.download-link { font-weight:bold; }
.code-quote {
  font-family:"Courier New", Courier, monospace;
  padding:20px;
  background:#eee;
  -moz-border-radius: 5px;
  -khtml-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  margin:0 0 20px 0;
}
.code-quote strong { color:#CC0000 }
.highlight-a {
  padding:20px;
  background:#FBEFBF;
  -moz-border-radius: 5px;
  -khtml-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  margin:0 0 20px 0;
}



