/*------------------------------------------------------------------*/
/* Will Dayble plays guitar solos with both hands behind his back
/*------------------------------------------------------------------*/


/*--------------------------------------------------------------------
lump z-indexes togetha, foreva
/*------------------------------------------------------------------*/
body{z-index: 100;}
.m1{z-index: 500;}
.m1 form .text{z-index: 600;}
.m1 form .submit{z-index: 650;}
.editPostLink{z-index: 700;}
.plant{z-index: 1000;}
.colMaker-aColumn p{z-index: 1100;}
.thePageContent h2 .pages{z-index: 1250;}
.multipleEntries .colMaker-aColumn .exerpt{z-index: 1200;}
.multipleEntries .colMaker-aColumn .bottomRightThing{z-index: 1300;}


body{background:#000; font-family: "Helvetica Neue", Helvetica, Arial, san-serif; min-height: 800px;}
.clear{background-color: none; color: none; height: 0px; clear: both; overflow: hidden;} 

.editPostLink{position: absolute; top: 0; left: -60px; display: block; width: 30px; background: #777; color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; padding: 6px 10px 5px; text-align: center; line-height: 100%; border: 1px solid #000; border-top-width: 0;}
.editPostLink:hover{color: #fff; background: #000; border-color: #333;}

/*--------------------------------------------------------------------
The contentWraps can be used for big page-wide styliez
/*------------------------------------------------------------------*/
.contentWrapBottom{background:#e8ecdc url(../images/layout/footer/subfooter-texture.jpg) repeat-x bottom;}
.contentWrapTop{background: url(../images/layout/main-grad-to-e8ecdc.jpg) repeat-x top;}
.contentWrapOptional{/* alt styles might use this... */}
.container{position: relative;}

.ideasLogo{background: #fff; height: 124px; position: relative;}
.ideasLogo a{height: 123px; display: block; text-decoration: none; background: url(../images/layout/header/ideas-logo.jpg) no-repeat center; text-indent: -999em; border: 1px solid #b4b4b3;}
.ideasLogo a:hover{border: 1px solid #797a76;}

/* top bar main menu thing: m1. Has main nav + search */
.m1{background: #ececec; border: 1px solid #d6d6d5; border-top-width: 0px; height: 35px; position: relative; margin-bottom: 10px;}
.m1 .menu{position: absolute; top:0; left: -1px;}
.m1 .menu a{color: #989898; display: block; float: left; text-decoration: none; font-size: 11px; text-transform: uppercase; padding: 9px 12px;}
.m1 .menu a.active{background: #f5f5f5; border: 1px solid #d6d6d5; border-top-width: 0px; border-bottom: 1px solid #e8e8e8; color: #000;}
.m1 .menu a:hover{color: #000; text-decoration: underline;}

.m1 .menu a.leftMost.active{border-left-color: #e8e8e8;}

.m1 form{position: absolute; top:0; right: 0; width: 400px;}
.m1 form label{display: block; position: absolute; top:10px; right: 243px; width: 100px; color: #9e9e9e; text-transform: uppercase; font-size: 11px; font-weight: normal; text-align: right;}
.m1 form label a{display: block; color: #9e9e9e;text-decoration: none;}
.m1 form label a:hover{color: #797a76;}
.m1 form .text{width: 223px; padding: 4px; border: 1px solid #cecfcb; background: #f9f9f9; position: absolute; top:0; right: 5px; font-size: 11px; display: block;}
.m1 form .submit{display: block; text-indent: -999em; width: 14px; height: 14px; position: absolute; top:12px; right: 10px; border: none; cursor: pointer; background: url(../images/layout/header/search/magnify-sprite.png) no-repeat 0 0;}
* html .m1 form .submit{background-image: url(../images/layout/header/search/magnify-sprite.gif); top: 11px;}
.m1 form .submit:hover{background-position: 0 -15px;}


/*--------------------------------------------------------------------
Saki moved quickly, within a year he had built the
New York "FOOT" into a force to be reckoned with...
/*------------------------------------------------------------------*/
.subFooter{background:url(../images/layout/footer/subfooter-strip-texture.jpg) no-repeat bottom; height: 36px; position: relative;}
.subFooter a, .subFooter span{display: block; padding: 0 20px; top:0; position: absolute;  font-size: 11px; color: #5a5a5a; text-decoration: none;  line-height: 36px; width: 200px;}
.subFooter a{left: 0; font-weight: bold;}
.subFooter a:hover{color: #000;}
.subFooter span{right: 0; text-align: right}


.footerGreyBar{background: url(../images/layout/footer/grey-bar-rep.jpg) repeat-x bottom; height: 3px; clear: both; overflow: hidden;}
.footer{background: #000 url(../images/layout/footer/grille-rep.jpg) repeat-x top; height: 200px; padding: 60px 0 0;}

.footer p{line-height: 28px; font-size: 11px; color: #ccab83;}
.footer p a{text-decoration: none;}
.footer .centre p {text-align: center;}
.footer .centre p a{margin: 0 5px; color: #ccab83; border-bottom: 1px solid #876d4e; text-transform: lowercase;}
.footer .centre p a:hover{color: #fff; border: none;}

.footer .left p{color: #fff; text-align: right;}
.footer .left p a{color: #fff; border-bottom: 1px solid #999}
.footer .left p a:hover{border: none;}

.footer .right p a{color: #ccab83; border-bottom: 1px solid #876d4e;}
.footer .right p a:hover{color: #fff; border: none;}
.footer .right p .squareweave{border: none; display: block;background: url(../images/layout/footer/squareweave-logo.gif) no-repeat bottom left;}
.footer .right p .squareweave span{display:block; height: 25px; text-indent: -999em;}
.footer .right p .squareweave:hover{color: #fff;}


/*--------------------------------------------------------------------
pageSynopsis can be used for a quote, or alt-css'd into an image
/*------------------------------------------------------------------*/
.pageSynopsis{height: 124px;background: #eeefec;}
.pageSynopsis blockquote{color: #545556; font-family: Georgia, Times, serif; padding: 15px 15px 0 20px; font-size: 24px; font-weight: normal; font-style: italic; line-height: 22px; margin: 0; }
.pageSynopsis a{color: inherit; text-decoration: underline; color: #000;}
.pageSynopsis a:hover{color: #000; text-decoration: none;}
.pageSynopsis .smallr{color: #999; font-size: 75%; display: block; padding-top: 10px;}
.pageSynopsis .smallr a{color: #666; text-decoration: none;}
.pageSynopsis .smallr a:hover{color: #000;}
/*--------------------------------------------------------------------
thePageContent is the div where all habari-spat-out content is. 
/*------------------------------------------------------------------*/
.thePageContent{padding: 12px 0; clear: both; min-height: 500px;}

h1{padding: 0; margin: 0;}
h1 a{text-decoration: none;}

.thePageContent h2, .thePageContent h3, .otherCaseStudies h3{color: #63655c; font-weight: bold; font-size: 16px; text-transform: uppercase; padding-left: 10px; position: relative;}
h2 a, h3 a, h4 a, h5 a, h6 a{text-decoration: none}
* html .thePageContent h2{padding-left: 30px;}

.thePageContent h2 strong{color: #000;}
.thePageContent h2 .pages{display: block; position: absolute; top:0; right: 0; width: 50%; text-align: right; font-size: 12px;}
.thePageContent h2 .pages a{color: #000; cursor: pointer; text-decoration: none;}
.thePageContent h2 .pages a.current-page{background: #000; color: #fff;padding: 3px 5px; text-decoration: none;}
.thePageContent h2 .pages a:hover{color: #666; text-decoration: none;}
.thePageContent h2 .pages a.current-page:hover{color: #fff; background: #666;}

.thePageContent a{color: #000;}

.simpleBlockContent, .colMaker-aColumn{border-top:1px solid #cecfca; float: left; margin-right: 10px; padding: 10px 0 0;}
.simpleBlockContent h3, .colMaker-aColumn h3, .colMaker-aColumn h4, .colMaker-aColumn h5, .colMaker-aColumn h6, .simpleBlockContent p, .colMaker-aColumn p{padding: 0 10px;}
.simpleBlockContent h3, .colMaker-aColumn h3{color: #000; padding-top: 5px;}
.simpleBlockContent h6, .colMaker-aColumn h6{color: #000; padding-bottom: 0; font-size: 11px;}

.simpleBlockContent p, .colMaker-aColumn p, .colMaker-aColumn li{color: #33342e; font-size: 11px; line-height: 18px;}
.simpleBlockContent a, .colMaker-aColumn a{color: #33342e;}
.simpleBlockContent a:hover, .colMaker-aColumn a:hover{color: #000; text-decoration: none;}

/* default */
.colMaker-multipleColumns .colMaker-last{margin-right: 0;}
.colMaker-aColumn{width:230px; position: relative;}

/* We're only using this for the search results pages now! */
.multipleEntries .colMaker-aColumn{height: 200px; background: #fff; border: 1px solid #d1d7c5; width: 228px; margin-bottom: 10px; position: relative;}
.multipleEntries .colMaker-aColumn h3{height: 30px;}
.multipleEntries .colMaker-aColumn .excerpt {height:130px; overflow: hidden; padding-top: 10px;}
.multipleEntries .colMaker-aColumn .excerpt *{display: none;}
.multipleEntries .colMaker-aColumn .excerpt p{display: block; color: #575854;}
.multipleEntries .colMaker-aColumn .excerpt p .caps{display: inline;}
.multipleEntries .colMaker-aColumn .bottomRightThing{display: block; position: absolute; bottom: 0; left: 0; height: 210px; background: url(../images/icons/bottom-right-thing.gif) no-repeat 210px 192px; text-decoration: none; width: 100%; }
.multipleEntries .colMaker-aColumn .bottomRightThing:hover{background-image:url(../images/icons/bottom-right-thing-over.gif); }

/* some stuff within posts */
.pdfDownload {display: block;}
.pdfDownload a{display: block;font-size: 13px; padding: 8px 0 8px 45px; background: url(../images/icons/pdf.gif) no-repeat top left;}

.habariImage{display: block; padding: 0; margin: 0; line-height: 90%;}
.habariImage br{display: none;}
.habariImage a{display: block; text-decoration: none; overflow: hidden; height: 100px;border: 2px solid #808778; padding: 0; margin: 0;line-height: 90%;}
.habariImage a:hover{border: 2px solid #555;}
.largerImage a, .largeImage a{height: auto;}


/*--------------------------------------------------------------------
Blog blog bloggage boggety blag
/*------------------------------------------------------------------*/
h3.columnTop, .blogColumn h2, .tagCloud h3{border-bottom: 1px solid #cecfca; padding-bottom: 15px; padding-top: 5px; position: relative;}
h3.columnTop a{color: #000;}
h3.columnTop a:hover{color: #666;}
h3.columnTop a.questionMark{display: block; position: absolute; top:8px; left: 108px; width: 20px; height: 20px; background: url(../images/icons/questionmark.gif) no-repeat 50% 50%;}
h3.columnTop a.questionMark span{display: none;}
h3.columnTop a.questionMark:hover{background-image: url(../images/icons/questionmark-over.gif);}
h3.columnTop a.questionMark:hover span{display:block; padding: 10px; background: #fff; border: 1px solid #ccc; font-size: 11px; color: #666; width: 200px; position: absolute; top:40px; left: 50%; margin-left: -100px; font-weight: normal; text-transform: none; line-height: 18px;}

h3.columnTop span{font-size: 11px; color: #b1b59f;}
.blogColumn .excerpt, .blogColumn .blogContent{padding:0 10px;}
.blogColumn .chrono{font-size: 11px; color: #666;}
.blogContent h2, .blogContent h3, .blogContent h4, .blogContent h5{padding-left: 0;}

.someSimilarEntries{margin: 0 0 20px 0;}
.someSimilarEntries h3{padding: 10px 0 10px; margin: 0 10px;}
.someSimilarEntries ul{padding: 10px 0 0; margin: 0;}
.someSimilarEntries ul li{list-style: none; margin: 0; padding: 0;}
.someSimilarEntries li a{display: block; text-decoration: none; padding: 0 10px 10px; font-size: 12px; line-height: 14px;}
.someSimilarEntries li a em{font-style: normal;}
.someSimilarEntries li a:hover{color: #000;}
.someSimilarEntries li a:hover em{text-decoration: underline;}
.someSimilarEntries li a span{display: block; padding: 0 0; color: #999; font-size: 11px; text-decoration: none;}

/* hover and not hover states */
.someSimilarEntries h3, .someSimilarEntries li a, .someSimilarEntries li a span{color: #c7c9c2;}

.someSimilarEntries:hover, * html .someSimilarEntries{background: #ecede8}
.someSimilarEntries:hover h3, * html .someSimilarEntries h3{color: #63655C;}
.someSimilarEntries:hover li a, * html .someSimilarEntries li a{color: #41423d;}

/*--------------------------------------------------------------------
Tag cloud action (nb we're overwriting the plugins defaults here)
/*------------------------------------------------------------------*/
#tag-cloud{margin: 0; padding: 0 10px; overflow: auto;}
.tagCloud h3{margin: 0 0 5px;}
#tag-cloud li a {line-height: 24px; text-decoration: none; background: #e8ecdc;}

.tagCloud h3, .tagCloud #tag-cloud li a{color: #c7c9c2;}
.tagCloud:hover h3, * html .tagCloud h3{color: #63655C;}
.tagCloud:hover #tag-cloud li a, * html .tagCloud #tag-cloud li a{color: #797a77;}
.tagCloud:hover #tag-cloud li a:hover, * html .tagCloud #tag-cloud li a:hover {color: #000; background: none;}

/*--------------------------------------------------------------------
This is for the rad awesome quick search
/*------------------------------------------------------------------*/
#quickSearchForm{display: none;}
#quickSearchNoJs{display: block;}

.quickSearch {position: relative; background:#eeefec url(../images/quicksearch/up-arrow.jpg) no-repeat 20px 100%;}
.quickSearch p{color: #a7aaa1;}
.quickSearch p span{color: #000;}
.quickSearch form{display: block; position: absolute; top:0; left: 0;}
.quickSearch form p{border: 3px solid #d9dad8; width: 660px; height: 35px; background: #fff; position: absolute; top:50px; left: 20px;}
.quickSearch form p .text{display: block; position: absolute; top:0; left: 0; font-size: 18px; color: #666; padding: 0; margin: 0; border: 5px solid #fff; border-left-width: 10px; width: 610px;}
.quickSearch form p .submit{display: none;}

.quickSearch p a.ajaxIcon{width: 25px; text-decoration: none; height: 25px; overflow: hidden; position: absolute; top:4px; right: 5px; background: url(../images/icons/big-magnification.jpg) no-repeat 50% 4px; display: block; cursor: pointer;}
.quickSearch p a.ajaxIcon.active{background: url(../images/icons/close-box.jpg) no-repeat center;}
.quickSearch p a.ajaxIcon:hover{background: url(../images/icons/close-box-over.jpg) no-repeat center;}



/*--------------------------------------------------------------------
This is a case study / case studies
/*------------------------------------------------------------------*/
.ajaxBrowsableList{margin: 0; padding: 0;}
.ajaxBrowsableList li{clear: both; list-style: none; margin: 0; padding: 0; overflow: hidden; height: 50px;}
.ajaxBrowsableList li a{text-decoration: none; display: block; cursor: pointer; position: relative;}
.ajaxBrowsableList li span{display: block; float: left; margin-bottom: 5px;}
.ajaxBrowsableList li .number{font-size: 24px; list-style: decimal-leading-zero inside; font-family: Georgia, Times, serif; color: #9ea08e; font-style: italic;width: 70px; text-align: center; padding-right: 10px; display: block;}
.ajaxBrowsableList li .date{font-size: 11px; width: 120px; padding-top: 12px; text-decoration: none;}
.ajaxBrowsableList li .title{padding: 10px; font-size: 12px; font-family: Georgia, Times, serif; font-style: italic; float: left; text-transform: none; color: #000; text-decoration: none;background: #e8e8e3; width: 328px; border: 1px solid #e8e8e3;}
.ajaxBrowsableList li .longTitle{width: 558px; margin-right: 0 !important;}
.ajaxBrowsableList li .excerpt{font-family: Helvetica, Arial, sans-serif; color: #7b7d75; padding: 5px 20px; width: 480px;overflow: hidden; height: 35px;}

.ajaxBrowsableList li .postContent{display: none;}

.ajaxBrowsableList li a:hover{color: #000;}
.ajaxBrowsableList li a:hover .number{color: #444;}
.ajaxBrowsableList li a:hover .title{background: #fff; border: 1px solid #ccc;}
.ajaxBrowsableList li a:hover .excerpt{color: #444;}

#nothingFoundAlert{display: none;}


/* this makes the blog entries nice */
body.is-entry .container .optionalPostBanner{display: none;}
body.is-entry .container .thePageContent{float: left; clear: none;}
.singleBlogEntry .colMaker-aColumn{width:350px;}

.singleBlogEntry .colMaker-aColumn .habariImage a,
.singleBlogEntry .colMaker-aColumn .habariImage img {width:320px !important;}
* html .singleBlogEntry .habariImage a,
* html .singleBlogEntry .habariImage img {width:310px !important;}

body.is-entry.tag-css-threecolumns .container .colMaker-aColumn .habariImage a{width:230px;}
body.is-entry.tag-css-threecolumns .container .colMaker-aColumn .habariImage img{max-width:210px;}


/*--------------------------------------------------------------------
Home page action...
/*------------------------------------------------------------------*/
.homePageBox{position: relative; height: 320px;}
.homePageBox a{display: block;color: #73766b; text-decoration: none;}
.homePageBox img{border: 1px solid #c7c7c5; height: 227px;}
.homePageBox .label{background: #cecfca; border: 1px solid #cecfca;  font-size: 14px; font-weight: bold; text-transform: uppercase; line-height: 30px; padding-left: 13px; position: absolute; top: 228px; left: 0; width: 230px;}

.homePageBox a:hover {color: #333;}
.homePageBox a:hover img, .homePageBox a:hover .label  {border-color:#555; background-color:#c5c5c5;}

.homePageBox .title {font-size: 11px; color: #5d6053; position: absolute; top:228px; left: 250px; padding: 10px; width: 200px; line-height: 18px;}
.homePageBox .title a, body.title-Home .colMaker-aColumn a{color:#212870; text-decoration: none; display: inline; background: url(../images/icons/arrows/right-pale-blue.gif) no-repeat 100% 4px; padding-right: 9px; font-weight: bold;}
.homePageBox .title a:hover, body.title-Home .colMaker-aColumn a:hover{color: #000; background-image: url(../images/icons/arrows/right-black.gif);}

.newsticker {margin: 0;}
.newsticker li{list-style: none; margin: 0; padding: 0;}
.homeCaseStudy {position:absolute; display:none;}
.homeCaseStudy:first-child{display:block;}

body.title-Home{position: relative;}
body.title-Home .plant{background: url(../images/home/plant-life.png); width: 216px; height: 142px; position: absolute; bottom:-34px; left:0;}
* html body.title-Home .plant{display: none;}
body.title-Home p{position: relative;}
body.title-Home .container .colMaker-multipleColumns .colMaker-aColumn h3 a{background: none; color: #63655c;}
body.title-Home .container .colMaker-multipleColumns .colMaker-aColumn h3.enviro a{color: #85b765;}
body.title-Home .container .colMaker-multipleColumns .colMaker-aColumn h3 a:hover{color: #000}
/* a.enviro{color: #2d7200;} */


#mbCenter{border: none; padding: 0;}
#mbCanvas, #mbBottom{border: 10px solid #fff;}
#mbCanvas{border-bottom-width: 0;}
#mbBottom{border-top-width: 0;}


/*--------------------------------------------------------------------
Will Dayble this one time went went back in time and
arm-wrestled a T-rex. 
/*------------------------------------------------------------------*/