@charset "utf-8";
/* CSS for - Copyright www.simpleisbest.co.uk */

body {margin: 0; padding: 0; background: #e0e0e0; color: #444; font-family: Verdana, Arial, Helvetica, sans-serif;}
* {margin: 0; padding: 0}
a img {border: 0}

/* ----------------------------------------- LAYOUT ------------------------------------------- */

div#top-full {width: 100%; height: 127px; background: url(../images/top-full-back.jpg) left 50% repeat-x #eee}
div#top {position: relative; margin: 0 auto; width: 990px; height: 127px}

div#main-nav-full {width: 100%; height: 41px; background: url(../images/nav-full-back.jpg) left 50% repeat-x}
div#main-nav {
    position: relative;
	margin: 0 auto;
    width: 990px;
    height: 41px;
	overflow: hidden
}

div#content-full {width: 100%; background: #fff}
div#content {position: relative; margin: 0 auto; width: 990px; background: #fff; overflow: hidden}


div#left-col {float: left; width: 710px; overflow: hidden}


div#right-col {float: right; width: 280px; margin: 5px 0 0 0; padding: 18px 0; background: url(../images/rgt-back.gif) 50% top repeat-y #fff; position: relative; z-index: 1; overflow: hidden}
div#right-col div#rgt-top
{position: absolute; left: 0; top: -5px; width: 280px; height: 15px; background: url(../images/rgt-top.gif) 0 50% no-repeat; overflow: hidden; z-index: 10}
div#right-col div#rgt-bottom {position: absolute; left: 0; bottom: 0; width: 280px; height: 15px; background: url(../images/rgt-bottom.gif) 0 top no-repeat #fff; z-index: 10}


div#footer {position: relative;	clear: both; padding: 10px 0 5px 0; width: 990px; height: 35px}

div#shadow {width: 100%; height: 35px; background: url(../images/shadow-back.gif) 0 0 repeat-x}

div#search-box {width: 260px; height: 44px; position: absolute; right: 10px; top: 36px; background: url(../images/search-form-back.gif) 0 0 no-repeat}
div#search-box input#search-text {position:absolute; left: 91px; top: 17px; height: 16px; line-height: 16px; width: 140px; background: #878787!important; border: 0!important; padding: 2px; color: #fff; font-size: 11px}

div#search-box input#search-go {position:absolute; left: 237px; top: 18px;width: 22px; height: 18px; background: url(../images/search-go.gif) 0 0 no-repeat!important; border: 0!important; cursor: pointer}


/* ------------------------------------ ADDITIONAL DIVS ------------------------------------------ */
div.blog {}
div.blog-bottom {margin: 0 10px; border-bottom: 1px solid #c7c7c7;}
div.blog-bottom p {font-size: 11px; margin-left: 0}
span.blog-author {padding: 0 0 0 0px; background: url(../images/blog-author2.gif) left 50% no-repeat}
span.blog-comments {padding: 0 0 0 40px}
span.blog-links {padding: 0 0 0 40px}


/* STYLES FOR SHOWING CODE 
div.code {margin: 10px; background: #fff7e6; border: 1px solid #eddcb7}
div.code p {font-family: "Courier New", Courier, monospace; font-size: 12px; color: #ff6f1f}
p.code,
span.code,
code {font-family: "Courier New", Courier, monospace; color: #ff6f1f; background: #fff7e6; border: 1px solid #eddcb7}
*/

/* RIGHT COLUMN SECTIONS */
div#right-col div#rgt-bottom {position: absolute; left: 0; bottom: 0; width: 280px; height: 15px; background: url(../images/rgt-bottom.gif) 0 top no-repeat #fff; z-index: 10}

#mvp {padding: 20px 20px 20px 20px; 10px left}
#promotejs {margin-left: 40px;}

/* -------------------------------------------- TYPE --------------------------------------------- */
h1 {position: absolute; left: 0; top: 17px}

a {text-decoration: none; color: #2e58c2}
a:hover {text-decoration: underline}

h2, h3, h4 {font-family: Arial, Helvetica, sans-serif; color: #2e58c2}
h2 {margin: 15px 10px 0 10px; font-size: 20px; font-weight: bold}
h3 {margin: 15px 10px 5px 10px; font-size: 18px; font-weight: bold}
h4 {margin: 15px 10px 5px 10px; font-size: 12px; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif}
div#right-col h3 {margin: 10px 25px; font-weight: normal}


p, dd {margin: 10px; font-size: 12px; line-height: 18px}
div#right-col p {margin: 10px 25px; font-size: 11px; line-height: 18px}

acronym {border-bottom: 1px dashed #ccc; cursor: help}

table {margin: 10px; font-size: 12px}

/* LISTS */
ul, ol {margin: 10px; padding: 0; font-size: 12px; line-height: 18px}
ul {list-style: none outside; margin-left: 15px}
ul li {padding: 0 0 0 13px; background: url(../images/blue-bullet.gif) 0 50% no-repeat}

ol {list-style: decimal outside}
ol li {padding: 0 0 0 20px;}

#right-col ul {margin: 10px 25px; padding: 0; font-size: 11px; line-height: 18px}
#right-col ul li {padding: 0 0 0 13px; background: url(../images/grey-bullet.gif) 0 50% no-repeat}


/* ------------------------------------------ MAIN NAV ------------------------------------------- */
div#main-nav ul {margin: 7px 0 0 10px; height: 34px; padding: 0;}
div#main-nav ul li {float: left; display: block; height: 34px; line-height: 34px; margin: 0 6px 0 0; padding: 0}
div#main-nav ul li a {float: left; display: block; height: 34px; line-height: 34px; color: #fff; background: url(../images/nav-a-back.jpg) left 50% repeat-x; text-align: center; font-size: 11px}
div#main-nav ul li a:hover {background: #777; text-decoration: none}

div#main-nav ul li a#nav-blog {width: 102px}
div#main-nav ul li a#nav-about {width: 105px}
div#main-nav ul li a#nav-contact {width: 110px}
div#main-nav ul li a#nav-links {width: 105px}
div#main-nav ul li a.genericLink {width: 105px}


/* CURRRENT STATES */
body#body-home div#main-nav ul li a#nav-blog,
body#body-about div#main-nav ul li a#nav-about, 
body#body-contact div#main-nav ul li a#nav-contact,
body#body-links div#main-nav ul li a#nav-links
{background: #fff; color: #2e58c2}



/* ------------------------------------------ FOOTER NAV ------------------------------------------- */
div#footer ul {margin: 0 0 0 10px; padding: 10px 0;}
div#footer ul li {float: left; display: block; height: 12px; line-height: 12px; margin: 0 1px 0 0; padding: 0; background: none}
div#footer ul li a {float: left; display: block; height: 12px; line-height: 12px; text-align: center; font-size: 11px; padding: 0 15px}

div#footer ul li a:hover {color: #222; text-decoration: none}

div#footer ul li a#tothetop {padding: 0 15px 0 20px; background: url(../images/tothetop.gif) left top no-repeat}
div#footer ul li a#tothetop:hover {background-position: left bottom}

p#copyright {margin: 0; line-height: 50px; position: absolute; right: 10px; top: 0px; text-align: right; color: #666; font-size: 11px; z-index: 10; font-weight: normal}


/* ----------------------------------------- BLOG TABS ----------------------------------------------*/
/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {display:none}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {}
.tabberlive {margin-top: 13px}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav {
	 margin:0;
	 text-align: right;
	 padding: 4px 0;
	 border-bottom: 1px solid #bbb;
	 font: 11px Arial, sans-serif;
}

h5.tab-title {display: none}  /* HIDES UNNECESSARY TAB TITLES */

ul.tabbernav li {
	 list-style: none;
	 background: none;
	 margin: 0;
	 padding: 0;
	 display: inline;
}

ul.tabbernav li a {
	 padding: 4px 20px;
	 margin-right: 8px;
	 border: 1px solid #bbb;
	 border-bottom: none;
	 background: #d9d9d9;
	 text-decoration: none;
	 font-size: 12px
}

ul.tabbernav li a:link,
ul.tabbernav li a:visited {color: #777}
ul.tabbernav li a:hover {background: #ccc; text-decoration: none}

ul.tabbernav li.tabberactive a {   /* CURRENT TAB */
	 background: #fff;
	 border-bottom: 1px solid #fff;
}

ul.tabbernav li.tabberactive a:hover {   /* CURRENT TAB HOVER */
	 color: #000;
	 background: white;
	 border-bottom: 1px solid #fff;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {padding:5px 0}



div.client {margin: -10px; padding: 10px; background: white}
 
div.job {width: 100%; position: relative}
div.job h3 {font-weight: bold}
div.job p {margin: 0px 200px 10px 10px}  /* p has right margin to clear image */
div.job img {position: absolute; right: 5px; top: 5px;}  /* image is positioned on the right */

#CommentEntry
{
    width: 450px;
    background: lightGrey;
}

.commentHeader
{
   font-family: Verdana;
   font-size: 12px;
   padding: 10px;
}

.comment
{
   font-family: Verdana;
   font-size: 12px;
}

.commentDate
{
   font-family: Verdana;
   font-size: 10px;
    
}

.mvpGraphic
{
    position:relative;
    left:60px;
}

.floatLeft
{
    float:left;
}

.floatClear
{
    clear:both;
}

#MVPlogo
{
    margin-left: 70px;    
}

#ReadifyLogo
{
    margin-left: 50px; margin-top: 20px; margin-bottom: 20px;    
}

#CurrentlyReading
{
    text-align: center;
}

#CurrentlyReading h2 {margin-bottom: 10px;}

#ContactMicroData {margin-left: 10px; font-size:12px; }

#HiddenContactDetails {display:none;}

#ProfilePic{ margin: 5px;}

#LatestBlogPosts {display:none;}