body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}li{list-style:none;}h1,h2,h3,h4,h5,h6{font-size:16px;font-weight:bold;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}

/* Generic */
body {background: #ccc; color: #FFF; font: 12px/18px Arial;}
a {color: #FFD200; text-decoration: none;}
p {margin-bottom: 1em;}
.clear {clear: both;}

/* Logos and Content Containers */
#logo {background: url('../images/logo.png') no-repeat; height: 76px; margin: 0; text-indent: -9999px; width: 270px;}
#contentContainer {float: left; margin: 8px; min-width:972px; width: 70%;}
#past, #present, #future {background: transparent url('../images/fade.png'); clear: both; display: block; float: left; width: 100%;}
#present .content, #past .content, #future .content {display: none; clear: both;}
.moveMe {color:#ffd200; cursor: pointer; font: bold 24px/32px "Trebuchet MS", Arial; display: block; padding: 3px 8px;}

.explain {color: #ececec; font: bold 12px/12px "Trebuchet MS", Arial; display: none; position: relative; left: 20px; top: -3px;}

#presentContent, #pastContent, #futureContent {float: left; margin: 8px;}

/* Corners */
.topLeftCorner {background: url('../images/topLeftCorner.png') no-repeat top left; display: inline; float: left; font-size: 0; height: 5px; position: relative; width: 60%;}
.topRightCorner {background: url('../images/topRightCorner.png') no-repeat top right; display: block; float: right; font-size: 0; height: 5px; position: relative; width: 40%;}
.bottomLeftCorner {background: url('../images/bottomLeftCorner.png') no-repeat top left; clear: both; display: inline; float: left; font-size: 0; height: 5px; margin: 0 0 8px; position: relative; width: 60%;}
.bottomRightCorner {background: url('../images/bottomRightCorner.png') no-repeat top right; display: block; float: right; font-size: 0; height: 5px; margin: 0 0 8px; position: relative; width: 40%;}

/* Content */
#mainBlurb {margin-right: 595px;}
#blog {border-left: 1px solid #CCC; border-right: 1px solid #CCC; float: right; margin: 0 8px; padding: 0 8px; width: 364px;}
#blog hr {clear:both; display:block; float:left; margin:12px 0 6px; width:100%;}
.blogPost {background: url('../images/quoteBottom.gif') no-repeat right bottom; clear: both; width: 100%;}
#contentContainer .blogPost h4 {color: #FFD200; font: bold 16px/22px "Trebuchet MS",Arial; padding: 4px 0;}
.textRight {text-align: right; left:35px;/* position: absolute;*/ top: 0; width: 294px;}
.textLeft {display: block; text-align: left;}
.blogText {background: url('../images/quoteTop.gif') no-repeat; display: block; padding: 0 35px; position: relative; clear: both; float: left; width: 294px;}
.blogText img {border: 1px solid #fff; float: left; margin: 0 6px 6px 0;}
.blogText img.mainBlogImage {border: none; position: absolute; top: -36px;}
.published {background: url('../images/published.png') no-repeat; clear: both; display: block; font-size: 10px; height: 19px; text-align: center; width: 194px;}
#viewMore, #hideMore {clear: both; cursor: pointer; display: block; float: right; font-size: 10px; height: 19px; text-align: center; width: 194px;}
#hideMore {display: none;}

/* CV block */
#cv {float: right; width: 200px;}
.cvContent {background: #fff; color: #333; float: left; padding: 3px 8px; position: relative;}
#cvTop {background: url('../images/cvTop.png') no-repeat; font-size: 0; height: 5px;}
#cvBottom {background: url('../images/cvBottom.png') no-repeat; clear: both; font-size: 0; height: 5px; margin-bottom: 8px;}
#cvDownloads a {color: #464646; float: left; height: 124px; text-align: center; width: 92px;}
#cvImage {position: absolute; top: 22px; left: 8px; display: none;}

.doingBlock {clear: both; margin-bottom: 8px;}
.doingBlock img {border: 1px solid #fff; margin: 0 6px 6px 0; display: inline; float: right;}
.doingBlock strong {color: #FFD200;}

#photoStream {clear: both; display: block;}
#photoStream div a {border: 1px solid #fff; display: block; height: 197px;}

/* Portfolio */
.portfolio {width: 24%; margin-right: 12px; float: left;}
.portfolio h2 {clear: both; font: bold 16px/22px Arial;}
.portfolio ul {margin-bottom: 1em;}
.portfolio ul li h3 {font: normal 12px/18px Arial;}
.portfolio ul li ul h3 {margin: 0.2em 2em; font-style: italic;}
.portfolio hr {clear: both; margin: 2em 0;}

.work p {margin-bottom: 2em;}
.work img, .personal .eduImage {float: left; margin: 6px 6px 6px 0;}
.work h3 {clear: both;}
.dates {font-size: 10px; display: block;}
#companies {margin-top: 40px;}
#companies img {margin: 0 18px 12px 0; vertical-align: middle;}
.tooltip {display:none;background:url('../images/black_arrow_big.png'); height:276px; padding:30px 30px 10px 30px; width:310px; font-size:11px; color:#fff;}
.tooLarge {background:url('../images/black_arrow_big_large.png'); height: 296px;}
#companies .tooltip img {margin: 0 6px 6px 0; float: left;}
#myContent {display: block; margin: 0 auto;}
.personal img {border: 1px solid #fff; float: right; margin: 4px 0 6px 6px;}
.personal h3 {clear: both;}
.skills {margin-right: 0;}

/* bing Overlays */
.bingFlash, #mainPhoto {display: none; background: #fff; color: #333; font-size: 10px; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
#mainPhoto a {color: #333; font-weight: bold;}
.close {background: url('../images/close.png') no-repeat; cursor: pointer; display: block; height: 25px; width: 25px; position: absolute; top: -10px; right: -10px; z-index: 9999999;}
#companies .tooltip #bingLogo {margin: 12px 6px 6px 0;}

/* JS disabled */
.javascriptWarning, #formError {border: 1px solid #ccc; background: transparent url('../images/fade.png');}
.javascriptWarning p, #formError {background: url('../images/warning.gif') no-repeat 5px center; margin: 0; padding: 4px 4px 4px 38px; text-align: center;}
#formError {display: none; font-weight: bold; width: 260px; float: right; margin: 8px 3px;}

/* Form */
#quoteMe {border-right: 1px dotted #ccc; margin-right: 430px; padding-right: 12px;}
#quoteMe h4 {margin-bottom: 1em;}
#form {float: right; margin-right:24px; width:388px;}
.form label {width: 70px; display: block; float: left; clear: both; text-align: right; padding: 0 10px 2px 0; margin-bottom: 0.5em; position: relative;}
.form input, .form textarea {background: #fff url('../images/formFade.gif') repeat-x; border: 1px solid #333; float: left; padding: 2px; margin-bottom: 0.5em; width: 300px;}
.form #submitBut {background: url('../images/butBack.gif') no-repeat; border: none; clear: both; cursor: pointer; float: right; height: 26px; margin-right: 2px; padding: 0 0 2px; width: 306px;}
.form #submitBut:hover {background-position: left -28px;}
#contactMe .formError {background: url('../images/formError.png') no-repeat top right;}
#followMe {border-top: 1px dotted #CCC; clear: both; font: 16px/20px Arial; padding: 12px 0 6px; margin-top: 12px;}
#followMe img {vertical-align: middle; margin: 0 6px;}
#followMe strong {color: #FFD200; position: relative; top: 2px; margin-right: 6px;}
#areWeHuman {background:transparent url('../images/fade.png'); border:1px solid #CCC; float: right; margin: 0 2px 8px 0; padding: 6px; width: 292px;}
#recaptcha {float: right; text-align: center; width: 183px;}
#contactMe img {border: 1px solid #fff; float: right; margin-left: 6px;}
#recaptcha strong {font-size: 14px;}
#recaptcha input {clear: both; float: none; width: 3em;}
#recaptcha label {float: none; text-align: center; width: auto; margin: 0; padding: 0;}

/* Backgrounds */
#block0 {background: transparent url('../images/greenBackground.jpg') no-repeat top left; display: block; width: 100%; min-height: 100%; position: fixed; left:0; top: 0; z-index: -1;}
#block1 {background: transparent url('../images/blueBackground.jpg') no-repeat top left; display: block; width: 100%; min-height: 100%; position: fixed; left:0; top: 0; z-index: -2;}
#block2 {background: transparent url('../images/flowerBackground.jpg') no-repeat top center; display: block; width: 100%; min-height: 100%; position: fixed; left:0; top: 0; z-index: -3;}
#tagLines {position: relative;}

/* Sidebar */
#tag0, #tag1, #tag2 {position: absolute; left: 0; top: 0;}
#tag1, #tag2 {display: none;}
#tag0 div, #tag1 div, #tag2 div {background: url('../images/tabMiddle.png') no-repeat center center; padding: 2px 0;}
.tabUpper, .tabLower {background: url('../images/tabTop.png') no-repeat; clear: both; display: block; height: 6px; line-height: 0; width: 259px;}
.tabLower {background-image: url('../images/tabBottom.png');}

#tagLines {color: #fff; float: left; font: bold 16px/22px "Trebuchet MS"; text-align: center; width: 259px;}
.tagText {background: none; height: 74px; text-indent: -9999px; width: 259px;}

#everyTag {background: transparent url('../images/text/everyone.png') no-repeat top center; position: relative;}
#somethingTag {background: transparent url('../images/text/something.png') no-repeat bottom center; position: relative; top: 10px;}
#forTag {background: transparent url('../images/text/for.png') no-repeat bottom center; position: relative;}
#designTag {background: transparent url('../images/text/design.png') no-repeat top center; position: relative;}
#buildTag {background: transparent url('../images/text/build.png') no-repeat bottom center; position: relative; top: 10px;}
#createTag {background: transparent url('../images/text/create.png') no-repeat bottom center; position: relative;}
#inspireTag {background: transparent url('../images/text/inspire.png') no-repeat bottom center; position: relative;}
#getTag {background: transparent url('../images/text/get.png') no-repeat bottom center; position: relative; top: 10px;}
#freeTag {background: transparent url('../images/text/free.png') no-repeat bottom center; position: relative; top: 6px;}
#quoteTag {background: transparent url('../images/text/quote.png') no-repeat bottom center; position: relative;}

/* IE "Fixes" */
#everyTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/everyone.png', sizingMethod='scale');}
#somethingTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/something.png', sizingMethod='scale');}
#forTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/for.png', sizingMethod='scale');}
#designTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/design.png', sizingMethod='scale');}
#buildTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/build.png', sizingMethod='scale');}
#createTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/create.png', sizingMethod='scale');}
#inspireTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/inspire.png', sizingMethod='scale');}
#getTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/get.png', sizingMethod='scale');}
#freeTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/free.png', sizingMethod='scale');}
#quoteTag {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/text/quote.png', sizingMethod='scale');}

*:first-child+html .form #submitBut {float: none; margin-left: 80px;} * html .form #submitBut {float: none; margin-left: 80px;}
*:first-child+html #followMe strong {top: 0;} * html #followMe strong {top: 0;}

/* IE 6 - Sigh.... */
*html body {background: transparent url('../images/greenBackground.jpg') top left;}
*html #contentContainer {width: 76%;}
*html #pastContent {padding: 6px 6px 0; margin: 0;}*html #futureContent {padding: 8px 8px 0; margin: 0;}*html #presentContent {padding: 6px 6px 0; margin: 0;}
*html #block0 {display: none !important;}*html #block1 {display: none !important;}*html #block2 {display: none !important;}
*html .moveMe {width: 85%;}
*html #quoteMe {margin-right:450px;}
*html .published {background-image: url('../images/published.gif');}
*html #mainPhoto {white-space:nowrap;}
*html .tooltip {background-image:url('../images/black_arrow_big.gif'); }
*html .tooLarge {background-image:url('../images/black_arrow_big_large.gif');}
*html .tabUpper {font: 0px/0px Arial !important;}

/* Webkit */
@media screen and (-webkit-min-device-pixel-ratio:0){
.topRightCorner {padding-left: 1px;}
.bottomRightCorner {padding-left: 1px;}
}