/*  
Theme Name: JD's Blog
Theme URI: http://www.jdyates.com
Description: Custome theme for JD Yates' blog.
Version: 1.0
Author: The Concept Colony
Author URI: http://www.conceptcolony.com/

*/

body { margin: 0 auto; padding: 0; background: #303030 url(images/bg.png); }
#wrap { width: 1000px; margin: auto; }

#head { width: 950px; margin: auto; background: none; position: relative; height: 110px; }
#main { width: 950px; margin: auto; background: #ffffff; padding: 50px 0 0 0; }
#foot { width: 950px; margin: auto; background: #ffffff; height: 220px; position: relative; margin-bottom: 30px; }

a:link, a:visited { text-decoration: none; color: #4d93a9; }
a:hover { text-decoration: none; color: #a9dae9; }

/* HEAD MENU AND FOOTER */
#title { margin: 0; padding: 0; }
#title a{ text-align: right; width: 320px; height: 83px; display: block; background: url(images/title.png); position: absolute; top: 11px; left: -23px; padding: 70px 8px 0 30px; font: 60px Helvetica, Arial, sans-serif; text-decoration: none; color: #ffffff; text-shadow: #3494bc 3px 3px 0; text-transform: lowercase; z-index: 1; }
#topnav { margin: 0; padding: 0; list-style: none; float: left; position: relative; top: 75px; left: 330px; z-index: 0;}
#topnav li { float: left; margin: 0; padding: 0; }
#topnav a { width: 155px; height: 25px; padding: 10px 0 0 0; display: block; position: relative; text-align: center; line-height: 35px; text-decoration: none; font: 16px Helvetica, Arial, sans-serif; color: #3494bc; text-shadow: 1px 1px 0 #fff; }
#topnav a:hover { height: 35px; top: -10px; }
#topnav a.active { height: 35px; top: -10px; }
#topnav a.blog { background: url(images/blog.png) top left; }
#topnav a.archives { background: url(images/archives.png) top left; }
#topnav a.about { background: url(images/about.png) top left; }
#topnav a.contact { background: url(images/contact.png) top left; }
#footer { height: 200px; list-style: none; margin: 0; padding: 0 10px; position: relative; z-index: 1; }
#footer li { width: 310px; float: left; padding: 0; margin: 0; }
#footer li .widgettitle { font: 25px Helvetica, Arial, sans-serif; color: #ffffff; text-shadow: #3494bc 2px 2px 0; padding: 15px; margin: 0; }
#footer ul { list-style: none; margin: 0; padding: 0; font: 14px Helvetica, Arial, sans-serif; color: #4d93a9; border-top: 1px solid #ededed; width: 295px; }
#footer ul li { padding: 3px; border-bottom: 1px solid #ededed; width: 289px; }
#footer ul li a { display: block; padding: 0; }
#footer ul li:hover { background: #f8f8f8; }
#foot .cell { width: 190px; height: 20px; float: left; }
#ribbon-foot { width: 978px; height: 54px; background: url(images/ribbon-contact.png); position: absolute; left: -14px; top: 10px; z-index: 0; }

/* HOME STYLES */
#index-top { width: 950px; height: 325px; }
#index-top p { text-align: center; margin: 0; padding: 0; font: 70px Helvetica, Arial, sans-serif; color: #73c2db; text-shadow: #a9dae9 3px 3px 0; }
#ribbon-index { width: 978px; height: 64px; background: url(images/ribbon-index.png); position: relative; left: -14px; }
#index-bottom { width: 950px; height: 300px;}
#index-bottom .cell { width: 300px; float: left; height: 300px; margin: 0 8px; }
#index-bottom .cell h2 { margin: 0; padding: 5px 0; font: 22px Helvetica, Arial, sans-serif; color: #8ecee2; text-shadow: #d0ebf3 1px 1px 0; }
#index-bottom .cell p  { margin: 0; padding: 5px 0; font: 14px Helvetica, Arial, sans-serif; color: #606060; }

/* BLOG STYLES */
#blog-left  { float: left; width: 615px; }
.post { margin: 15px 0; }
.title { width: 618px; height: 54px; background: url(images/ribbon-blog.png); position: relative; left: -14px; overflow: hidden; }
	.title h2 { font: 32px Helvetica, Arial, sans-serif; color: #ffffff; text-shadow: #3494bc 2px 2px 0; margin: 0; padding: 3px 8px; }
.meta { width: 615px; position: relative; top: -5px; }
	.meta h2 { font: 26px Helvetica, Arial, sans-serif; color: #73c2db; text-shadow: #a9dae9 1px 1px 0; padding: 0 15px; margin: 0; text-transform: lowercase; }
	.meta h2 span { font: 16px Helvetica, Arial, sans-serif; color: #174a5a; text-shadow: none; padding: 0; margin: 0; }
.content { width: 615px; }
	.content p { font: 12px Helvetica, Arial, sans-serif; color: #606060; padding: 0; margin: 7px 10px; }
	.wp-caption { background: #73c2db; margin: 0; padding: 0; }
	.wp-caption p { margin: 0; padding: 0; }
.comment { width: 600px; margin: auto; border-bottom: 2px solid #73c2db; }
	.comment p { font: 13px Helvetica, Arial, sans-serif; color: #71c2db; margin: 0; padding: 10px 0 2px 0;}
#blog-right { float: left; width: 335px; }
#blog-right .cell { width: 290px; border: 10px solid #ededed; margin: 0 12px; }
/* Sidebar */
#sidebar { list-style: none; margin: 0; padding: 0; border: 10px solid #ededed; margin: 0 12px; border-bottom: none; }
#sidebar li { padding: 0 0 10px 0; border-bottom: 10px solid #ededed; }
#sidebar ul { list-style: none; margin: 0 10px; padding: 0; font: 14px Helvetica, Arial, sans-serif; color: #4d93a9; border-bottom: 1px solid #ededed; }
#sidebar ul li { padding: 0 5px; border-top: 1px solid #ededed; border-bottom: none; }
#sidebar ul li a { display: block; padding: 3px 0; }
#sidebar ul li:hover { background: #f8f8f8; }
#sidebar .widgettitle { font: 30px Helvetica, Arial, sans-serif; color: #73c2db; text-shadow: #a9dae9 2px 2px 0; text-align: right; padding: 5px 10px; margin: 0; }
/* Calendar */
#wp-calendar { border: none; border-collapse: collapse; margin: 0 15px; }
#wp-calendar caption { display: none; }
#wp-calendar th { border: 5px solid white; height: 30px; width: 30px; background: #4d93a9; font: bold 13px Helvetica, Arial, sans-serif; color: #ffffff; }
#wp-calendar td { border: 5px solid white; height: 30px; width: 25px; background: #a9dae9; font: 13px Helvetica, Arial, sans-serif; color: #ffffff; text-align: right; padding: 0 5px 0 0; }
#wp-calendar td a { display: block; }
#wp-calendar td:hover { background: #c4e5f0; }
#wp-calendar td a:hover { color: #4d93a9; }
#wp-calendar tfoot { display: none; }
#blog-foot  { width: 950px; clear: both; }
/* Comments */
#comments { font: 20px Helvetica, Arial, sans-serif; color: #73c2db; text-shadow: #a9dae9 1px 1px 0; padding: 0 15px; }
#respond  { font: 20px Helvetica, Arial, sans-serif; color: #73c2db; text-shadow: #a9dae9 1px 1px 0; padding: 0 15px; }
.commentlist { font: 13px Helvetica, Arial, sans-serif; color: #606060; }
#author { border: solid 5px #ededed; height: 25px; width: 150px; float: left; margin: 5px 5px 5px 25px; }
#author:focus { border-color: #73c2db; }
#email { border: solid 5px #ededed; height: 25px; width: 150px; float: left; margin: 5px; }
#email:focus { border-color: #73c2db; }
#url { border: solid 5px #ededed; height: 25px; width: 322px; margin: 5px 5px 5px 25px; }
#url:focus { border-color: #73c2db; }
#comment { border: solid 5px #ededed; width: 324px; background: none; padding: 0; margin: 0 5px 0 25px; }
#comment:focus { border-color: #73c2db; }
#submit { border: none; background: #73c2db; height: 35px; width: 150px; margin: 0 5px 0 25px; font: 25px Helvetica, Arial, sans-serif; color: #ffffff; text-shadow: #3494bc 1px 1px 0; cursor: pointer; }
#submit:hover { background: #c4e5f0; }
/* Search */
#s { height: 25px; width: 290px; border: solid 5px #ededed; }
#s:focus { border-color: #73c2db; }
#searchsubmit { border: none; background: #73c2db; height: 35px; width: 100px; font: 25px Helvetica, Arial, sans-serif; color: #ffffff; text-shadow: #3494bc 1px 1px 0; cursor: pointer; }
#searchsubmit:hover { background: #c4e5f0; }

/* ABOUT STYLES */
#about-left { width: 400px; float: left; }
#about-left .cell { width: 280px; border: 10px solid #ededed; margin: 0 45px; padding: 5px 5px 5px 5px; }
#about-right { width: 550px; float: left; }
#about-right p { font: 12px Helvetica, Arial, sans-serif; color: #606060; padding: 5px 10px 5px 20px; margin: 0; }
#ribbon-about { width: 550px; height: 54px; background: url(images/ribbon-about.png); position: relative; left: 14px; }
#ribbon-about h2 { font: 32px Helvetica, Arial, sans-serif; color: #ffffff; text-shadow: #3494bc 2px 2px 0; margin: 0; padding: 3px 8px; text-align: right; }
#about-foot { width: 950px; height: 20px; clear: both; }
/* Info boxes */
#twitter_update_list { list-style: none; padding: 10px 5px; margin: 0; font: 16px Helvetica, Arial, sans-serif; color: #606060; }
#about-left .cell img { width: 50px; height: 50px; border: 5px solid #ededed; margin: 5px; }
#about-left .cell img:hover { border: 5px solid #a9dae9; }
#flickr_badge_wrapper { width: 280px; height: 70px; }
#flickr_badge_wrapper img { float: left; }

/* CONTACT STYLES */
#ribbon-contact { width: 978px; height: 54px; background: url(images/ribbon-contact.png); position: relative; left: -14px; }
#ribbon-contact h2 { font: 32px Helvetica, Arial, sans-serif; color: #ffffff; text-shadow: #3494bc 2px 2px 0; margin: 0; padding: 3px 8px; }
#field-left { width: 310px; float: left; }
#field-right { width: 475px; float: left; text-align: right; }
/* Contact Form */
fieldset { width: 900px; border: none; margin: 0 25px; }
fieldset p { font: 30px Helvetica, Arial, sans-serif; color: #73c2db; text-shadow: #a9dae9 1px 1px 0; float: left; text-align: right; line-height: 240%; padding: 0 10px 0 0; margin: 0; }
input { border: solid 10px #ededed; outline: none; height: 35px; width: 290px; margin: 0 0 17px 0; }
input:focus { border: solid 10px #73c2db; }
textarea { width: 411px; height: 175px; background: url(images/textarea-bg.png) top left; border: none; outline: none; padding: 15px 15px 15px 45px; resize: none; }
textarea:focus { background-position: bottom left; }
button { border: none; background: #73c2db; height: 40px; width: 150px; float: right; margin: 15px 0 0 0; font: 25px Helvetica, Arial, sans-serif; color: #ffffff; text-shadow: #3494bc 1px 1px 0; cursor: pointer; }
button:hover { background: #c4e5f0; }
/* something else */
#contacts { list-style: none; padding: 25px; margin: 0; text-align: center; height: 100px; }
#contacts li { float: left; margin: 0 10px; }
#contacts li a { display: block; height: 50px; width: 50px; background: #73c2db; overflow: hidden; font: 10px Helvetica, Arial, sans-serif; color: #ffffff; text-align: left; padding: 0 0 0 3px; }
#contacts li a:hover { background: #c4e5f0; color: #707070; }

/* ARCHIVE STYLES */
#archives { list-style: none; margin: 10px 25px; padding: 0; }
#archives li { font: 30px Helvetica, Arial, sans-serif; color: #73c2db; text-shadow: #a9dae9 2px 2px 0; padding: 10px; border-bottom: 2px solid #73c2db; }