/* This stylesheet is a JWP joint -- 2009 */

/*
COLORS
------
Gray Text: #857f7d
Blue Links: #4475ba
*/

.bn { border:0; }
.fl { float:left; }
.fr { float:right; }
.cl { clear:left; }
.clear { clear: both; }

.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */
strong.replace { left:-9999px; position:absolute; }

/* 
======================================================
Basic site styles
======================================================
*/

body { margin:0; padding:0; background: #05264f url(images/body-bg.jpg) top repeat-x; font-family:"Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:76%; }
span.highlight { background-color:#FFC; }
a { color:#fff; text-decoration:underline; }
a:hover { text-decoration:none;}
a:visited { color:#fff; }

/* 
======================================================
Site structure (layout)
======================================================
*/
div#outer-wrapper { width:611px; margin:8px auto; padding:15px 0 0 0; background: transparent url(images/glow.png) top no-repeat;}
div#wrapper { width:498px; margin:12px auto 0; padding:0; background: url(images/wrap-top.png) top left no-repeat; }
div#masthead { width:460px; height:85px; margin:30px 0 0 20px; float:left; }
div#content { width:460px; padding:0; margin:0 0 0 20px; float:left; padding:21px 0 0 0; }
* html div#content { margin-left:10px;}
div#about-me { padding:9px 0 18px;}
div.content-section { margin:0 30px; }
div.copyright { text-align:center; margin:30px; background-color:#111136; border:1px solid #1a1a49; }
div#footer { margin:0 auto; padding:12px 0; width:498px; height:20px; background: url(images/footer-bg.png) bottom no-repeat; } 
/*
======================================================
Navigation
======================================================
*/
ul.tabnav { margin:0 0 15px 36px; padding:0; }
.tabnav li { float:left; list-style: none; padding-right: 5px; }
.tabnav li a { height:29px; float:left; text-decoration: none; display:block; padding:0; margin:0; outline: none; }
.tabnav li a#around { width:116px; background: url(images/around.png) top left no-repeat; margin:0 30px 0 0;}
.tabnav li a#info { width:102px; background: url(images/info.png) top left no-repeat; margin:0 12px 0 0;}
.tabnav li a#get { width:98px; background: url(images/get.png) top left no-repeat;}
* html .tabnav li a#around, * html .tabnav li a#info { margin-right:15px;}

.tabnav li a#around:hover,
.tabnav li a#info:hover,
.tabnav li a#get:hover,
.tabnav li.ui-tabs-selected a#around,
.tabnav li.ui-tabs-selected a#info,
.tabnav li.ui-tabs-selected a#get { background-position:0 -29px;}

.tabnav li a:hover, .tabnav li a:active, .tabnav li.ui-tabs-selected a { background: #dedbd1; color: #222; text-decoration: none; }
.tabdiv { margin-top: 2px; background:#e1e8f2; padding:0; width:460px; }
.tabdiv li { margin-left: 20px; }
.ui-tabs-hide { display: none; }

/*
======================================================
Headers
======================================================
*/

div#masthead h1 { background: url(images/name.png) top left no-repeat; height:76px; width:210px; margin:0 0 0 18px; float:left; }
h2 { font-family:Georgia,"Times New Roman",Times,serif; color:#31c1ed; font-weight:normal; font-size:3em; margin:0 0 0 0;}


/*
======================================================
Paragraphs
======================================================
*/
p { margin: 12px 24px; line-height:18px; font-size:.9em; color:#37567F; }
div#footer p { margin:0; text-align:center;}
div.copyright p { margin:0 !important; padding:18px 0; }
/*
======================================================
List Styles
======================================================
*/
ul { margin:0;}

.tabdiv div#networks dl.my-networks dt { display:none; }
.tabdiv div#networks dl.my-networks dd { margin:0; float:left; clear:left; margin:0 0 0 30px;}
* html .tabdiv div#networks dl dd { margin:0 0 0 15px;}
.tabdiv div#networks dl.my-networks dd a { display:block; height:60px; width:420px;}

.tabdiv div#networks dl.my-networks { height:48px; border-bottom:1px solid #cfd9e7; padding:6px 0 12px; margin:0;}
* html .tabdiv div#networks dl { padding:3px 0 6px; }
.tabdiv div#networks dl.my-networks:hover { background: url(images/gradient.png) top repeat-x; }
.tabdiv div#networks dl.my-networks dd a#wordpress { background: url(images/network/wordpress.png) no-repeat;}
.tabdiv div#networks dl.my-networks dd a#wordpress:hover { background: url(images/network/wordpress-hover.png) no-repeat;}
.tabdiv div#networks dl.my-networks dd a#twitter { background: url(images/network/twitter.png) no-repeat; }
.tabdiv div#networks dl.my-networks dd a#twitter:hover { background: url(images/network/twitter-hover.png) no-repeat;}
.tabdiv div#networks dl.my-networks dd a#tumblr { background: url(images/network/tumblr.png) no-repeat; }
.tabdiv div#networks dl.my-networks dd a#tumblr:hover { background: url(images/network/tumblr-hover.png) no-repeat; }
.tabdiv div#networks dl.my-networks dd a#flickr { background: url(images/network/flickr.png) no-repeat; }
.tabdiv div#networks dl.my-networks dd a#flickr:hover { background: url(images/network/flickr-hover.png) no-repeat; }
.tabdiv div#networks dl.my-networks dd a#linkedin { background: url(images/network/linkedin.png) no-repeat; }
.tabdiv div#networks dl.my-networks dd a#linkedin:hover { background: url(images/network/linkedin-hover.png) no-repeat;  }
.tabdiv div#networks dl.my-networks dd a#dribbble { background: url(images/network/dribbble.png) no-repeat; }
.tabdiv div#networks dl.my-networks dd a#dribbble:hover { background: url(images/network/dribbble-hover.png) no-repeat; }

div#contact-me { padding:18px 0; }
div#contact-me dl { margin:0 0 18px 0; }
div#contact-me dl dt { margin:0 0 6px 30px; font-size:15px; color:#37567F; font-weight:bold; }
div#contact-me dl dd { margin:0 0 6px 30px;}
div#contact-me dl dd a { color:#59779b; font-size:1.1em; }



/*
======================================================
Link Styles
======================================================
*/
div#about-me a { color:#05264F; border:1px dotted #5B9FF5; padding:2px; text-decoration:none; }
div#about-me a:hover { background:#5B9FF5; color:#05264F; }

div#contact-me a { text-decoration:none; height:16px; }
a.mail { background: url(images/mail.gif) left no-repeat; padding:0 0 0 24px;}
a.chat { background: url(images/chat.gif) left no-repeat; padding:0 0 0 24px;}
a.site { background: url(images/site.gif) left no-repeat; padding:0 0 0 24px;}
a.doc { background: url(images/doc.gif) left no-repeat; padding:0 0 0 24px;}

/*
======================================================
Images Styles
======================================================
*/
div.content-section img {  }

/*
======================================================
Form Styles
======================================================
*/
form { margin:16px 0 0 10px; }
input, textarea { border:1px solid #ccc; padding:3px; }
input.submit, input.subscribe { border:none; }


/*
======================================================
Miscellaneous Styles
======================================================
*/

hr.clear { height:10px; margin:30px; background: url(images/br.gif) repeat-x; border:0; }


.tabdiv div#networks dl.my-networks dd em {
	font-weight: normal;
	background: url(images/hover.png) no-repeat;
	width: 180px;
	height: 45px;
	position: absolute;
	top: -85px;
	left: -15px;
	text-align: center;
	padding: 20px 12px 10px;
	font-style: normal;
	z-index: 2;
	display: none;
}


* html img,
* html .png{
    position:relative;
    behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
        this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
        this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
        this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
        this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
    );
}