/*
Theme Name: www.jamesmckay.net Web 2.0 version
Theme URI: http://www.jamesmckay.net/
Description: My website's new Web 2.0 theme
Version: 1
Author: James McKay
Author URI: http://www.jamesmckay.net/
*/

/* ====== Fonts ====== */

body {
	font-size: 90%;
	font-family: trebuchet ms, 'Lucida Sans Unicode', Verdana, Arial, Sans-Serif;
}

p {
	margin: 0px;
	padding: 0.5em 0 0.5em 0;
}

h1, h2, h3, h4, h5, h6 {
	font-family: trebuchet ms, tahoma, arial, helvetica, sans-serif;
}

input, textarea, select {
	font-family: 'Lucida Sans Unicode', Verdana, Arial, Sans-Serif;
	font-size: 1em;
}

#topsearch, #sidebar, #comments, #mainlinks, .postmetadata, .comments-link {
	font-size: 85%;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Arial, Sans-Serif;
}

#topsearch input {
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Arial, Sans-Serif;
	font-size: 100%;
	font-weight: normal;
}

small {
	font-size: 85%;
}

dfn, abbr, acronym {
	font-style: normal;
	color: #33c;
	border-bottom: 1px dashed #f60;
	cursor: help;
}


/* ====== General widgets ====== */

a {
	color: #f60;
	text-decoration: none;
}

a:visited {
	color: #c30;
}

a:hover, a:active {
	text-decoration: underline;
}

a img {
	border: none;
}


form {
	 margin: 0px;
	 padding: 0px;
}


/* ====== Main layout features ====== */


body {
	background-color: #fff;
	margin: 0px;
}


#all {
	width: 900px;
	margin: 0px auto 15px;
	clear: both;
}

#all, #content, #sidebar {
	background-color: #ffffff;
}


/* ====== Header ====== */

#blog-header {
	background-image:url(images/blue-white-fade.png);
	background-position: top left;
	background-repeat: repeat-x;
	background-color: #000099;
	min-height: 200px;
}

#blog-header-contents {
	width: 900px;
	margin: 0 auto;
}

#blog-title {
	padding: 60px 0 0 0;
	float: left;
	width: 590px;
}

#blog-toolkit {
	width: 300px;
	min-height: 200px;
	background-color: #333333;
	float: right;
}

#blog-toolkit form {
	padding: 20px;
}

input#s {
	margin: 10px 0;
	width: 200px;
	background-color: #cccce0;
	border: 1px solid white;
	font: 90% arial, helvetica, sans-serif;
	padding: 2px 1em;
	color: #808080;
	font-style: italic;
}

input#s.active {
	font-style: normal;
	color: #000000;
}


#blog-toolkit form input#topsearchsubmit {
	margin: 0px 0px -15px -10px;
}

a#blog-feeds img {
	padding-left: 12px;
	float: left;
	margin-top: 5px;
}

#header-photo {
	float: right;
	margin-right: 25px;
}



h1 {
	font-size: 35px;
	padding: 0px;
	margin: 0px;
}

h1 a, h1 a:visited {
	text-decoration: none;
	color: #ffffff;
}

h1 a:hover, h1 a:active {
	color: #ffffff;
	text-decoration: underline;
}

.description {
	font-weight: bold;
	font-family: trebuchet ms;
	font-size: 120%;
	color: #ffffff;
	min-height: 30px;
}


#mainlinks {
	margin: -20px auto 0;
	width: 900px;
	font-weight: bold;
}

#mainlinks a, #mainlinks a:visited {
	padding: 4px 6px;
	color: #ffffff;
	text-decoration: none;
}

#mainlinks a:hover, #mainlinks a:active {
	background-color:#ffffff;
	color: #990000;
}

#mainlinks a.rss {
	border-width: 0px;
	padding: 0;
	margin: 0px;
}

#mainlinks ul, #mainlinks li {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

#mainlinks li {
	display: inline;
}

#mainlinks ul {
	min-height: 20px;
}

#twitter {
	background-color: #333333;
	color: #ffffff;
	padding: 7px 0px;
	font-size: 85%;
}

#twitter a {
	color: #ffcc33;
}

#tweet-postscript {
	font-size: 75%;
	font-style: italic;
}

#twitter div {
	width: 900px;
	margin: 0 auto;
}

/* ====== Content ====== */

#content {
	float: left;
	width: 600px;
	line-height: 1.5em;
	padding: 10px 0px 30px;
}

#content-nosidebar {
	padding: 30px;
}

#content h2 {
	font-weight: bold;
	font-size: 1.6em;
	line-height: 1.2em;
	text-align: left;
}

#content h2, content-nosidebar h2 {
	color: #b50033;
}

#content h3, #content-nosidebar h3 {
	font-size: 1.2em;
}

#clear {
	clear: both;
}

#footer {
	background-color: #cccccc;
	font-size: 85%;
	clear: both;
	padding: 10px 0px;
}

#footer-inner {
	margin: 0px auto;
	width: 900px;
}

#footer-inner p {
	margin: 0px;
	padding: 0px;
}

/* ====== Sidebar ====== */

#sidebar {
	float: right;
	width: 250px;
	padding: 10px 0px 30px;
	text-align: justify;
}


#sidebar ul {
	margin: 0px;
	padding: 0px;
	list-style-type: disc;
	margin: 0px 0px 0px 16px;
}

#sidebar ul li {
	padding: 0px;
	margin: 0px;
}

#sidebar ul.widget {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}



#wp-calendar {
	width: 100%;
}

#wp-calendar th {
	text-align: center;
}

#wp-calendar td {
	text-align: center;
}

#wp-calendar td#prev,
#wp-calendar td#next
{
	text-align: center;
}

#wp-calendar td a, #wp-calendar td a:visited {
	font-weight: bold;
}

#wp-calendar td#today {
	font-weight: bold;
	background-color: #333333;
	color: #ffffff;
}

#sidebar h2,
#wp-calendar caption {
	font-family: inherit;
	font-weight: bold;
	padding: 15px 0px 5px 0px;
	font-size: 125%;
	text-align: center;
}

#sidebar h2 {
	margin: 0px 0px 0px 0px;
}

#wp-calendar caption {
	margin: 0px;
}

ul#social {
	margin-left: auto;
	margin-right: auto;
	width: 50%;
	padding-left: 0px;
	list-style: none;
}

ul#social li {
	padding: 2px 0px;
	min-height: 16px;
	background: left center no-repeat;
	list-style: none;
}

ul#social li a {
	padding-left: 20px;
}

ul#social li.facebook      { background-image: url(images/icons/facebook.png); }
ul#social li.github        { background-image: url(images/icons/github.png); }
ul#social li.linkedin      { background-image: url(images/icons/linkedin.png); }
ul#social li.stackoverflow { background-image: url(images/icons/stackoverflow.png); }
ul#social li.twitter       { background-image: url(images/icons/twitter.png); }




/* ====== Entries ====== */

.post {
	clear: both;
	padding-bottom: 30px;
}

.entry {
	text-align: justify;
}



.minical {
	width: 54px;
	height: 75px;
	float: right;
	margin-left: 15px;
	background-image: url(images/minical-back.gif);
	background-position: top left;
	background-repeat: no-repeat;
	font-weight: bold;
	color: #ffffff;
	font-family: trebuchet ms;
	text-align: center;
}


.minical .day {
	font-size: 200%;
	line-height: 1em;
	margin: 12px 5px 0px 3px;
}

.minical .month {
	font-size: 125%;
	line-height: 1em;
	margin: 0px 5px 0px 3px;
}


.postmetadata {
	text-align: left;
}

.comments-link {
	float: right;
}

.postmetadata img, .comments-link img {
	border: none!important;
	margin: 0px!important;
	padding: 0px!important;
	vertical-align: text-top;
}


.utwtags {
	font-size: 80%;
	padding: 10px 0px;
}

/* ====== Trackbacks ====== */

#discussion {
	clear: both;
/*	padding-left: 30px; */
}

#trackbacks {
	margin: 10px 0px 10px 25px;
	padding: 0px;
	list-style-type: none;
	font: 85% lucida sans unicode, lucida sans;
}

#trackbacks li {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

#trackbacks li h4 {
	font-size: 100%;
	margin: 0px;
	padding: 0px;
}

#trackbacks li .commentbody {
	padding: 5px 0px 5px 10px;
	display: block;
	margin: 0px 0px 5px 7px;
	border-left: 2px solid #cccccc;
	border-bottom: 2px solid #cccccc;

}

#trackbacks li.collapsed .commentbody {
	display: none;
}

#trackbacks li .commentbody p {
	padding: 0px;
	margin: 0px;
}

#trackbacks li h4 span {
	padding-left: 16px;
	background: url(images/minus.gif) top left no-repeat;
	cursor: default;
}

#trackbacks li.collapsed h4 span {
	background-image: url(images/plus.gif);
}



/* ====== Comments ====== */

#comments {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

#comments li {
	border-top: 1px solid #33f;
	margin: 0px 0px 2px 0px;
	padding: 0px;
	list-style: none;
	clear: both;
	background-image: url(images/gradients/comments-c0c0ff.gif);
	background-color: #e0e0ff;
	background-repeat: repeat-x;
	background-position: top left;
}

#comments li.alt {
	border-color: #39f;
	background-image: url(images/gradients/comments-c0e0ff.gif);
	background-color: #e0f0ff;
}

#comments li.mine {
	border-color: #f60;
	background-image: url(images/gradients/comments-ffcc99.gif);
	background-color: #ffe8d0;
}

/* ====== Comment author and gravatar ====== */

.comment-author {
    float: left;
    width: 125px;
    text-align: center;
}

.comment-author-name {
    font-size: 125%;
    overflow: hidden;
    font-weight: bold;
    padding-top: 10px;
    font-family: trebuchet ms;
}

.avatar {
    padding: 10px 0px;
}

#comments li .commentbody {
    margin-left: 150px;
    margin-right: 10px;
}

#comments a, #comments a:visited {
	color: #0000ff;
}


#comments li.alt h4 {
	background-color: #9cf;
}



#comments li h4 img {
	vertical-align: text-bottom;
}

#comments li .commentbody {
	padding: 4px;
	display: block;
	text-align: justify;
}

#comments li .commentbody p {
	padding: 5px 0px 5px 0px;
	margin: 0px;
}

.awaiting-moderation {
	font-size: 90%;
	font-weight: not-bold;
	font-style: italic;
}


/* ====== Comment form ====== */

#commentform {
	margin: 20px 0px 10px 0px;
	border: 5px solid #666;
	background-color: #666;
}

#commentform h3 {
	text-align: center;
	margin: 0px;
	padding: 4px;
	background-color: #666;
	color: #ffffff;
}

#commentform #login-info {
	padding: 1px 10px;
	background-color: #999;
	color: #fff;
}

#commentform #login-info a {
	color: #ff0;
}

#commentform-inner {
	padding: 1px 10px;
	background-color: #ccc;
}

#commentform input, #commentform textarea {
	border: 1px solid #99f;
	font-size: 80%;
}

#commentform input#author, #commentform input#email, #commentform input#url {
	width: 50%;
}

textarea#comment {
	width: 100%;
	height: 150px;
}


code {
	font-family: consolas, monaco, courier new, courier, monospace;
	font-size: 90%;
	color: #009;
}

pre {
	border: 1px dotted #999;
	background-color: #f0f0ff;
	padding: 5px;
	line-height: 1.3em;
}

blockquote {
	margin: 0px 30px;
	border: 1px solid #999;
	background-color: #eef;
	padding: 5px 15px;
	font-size: 90%;
	line-height: 1.3em;
}



img.wp-smiley {
	border: 0px;
	padding: 0px;
	margin: 0px;
	vertical-align: text-top;
}



table.listing {
	border: 0px;
	padding: 0px;
	border-collapse: collapse;
}

table.listing tr {
	border-bottom: 2px solid white;
}

table.listing tr td {
	padding: 2px;
	margin: 0px;
}

table.listing tr.tr1 {
	background-color: #ccccff;
}

table.listing tr.tr2 {
	background-color:#e0e0ff;
}

ul.social {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	float: right;
}

ul.social li {
	margin: 0px 0px 1em 1em;
	padding: 0px;
}

/* ====== Download box ====== */

.download-box {
	float:right;
	border: 1px solid #999999;
	padding: 10px;
	margin: 10px 0 10px 10px;
	width: auto;
	text-align: center;
	background-color: #e4e4ff;
}

.download-box img {
	margin: 0px;
	padding: 0px;
	border: 0px;
}


/* ====== Alert box ====== */

#alertbox {
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	padding: 5px;
	background-color: #ffff99;
	border-bottom: 1px solid #000000;
	width: 100%;
	z-index: 9998;
}

#alertbox p {
	padding: 0px;
	margin: 0px;
}

#alertbox.error {
	background-color: red;
	color: #ffffff;
	font-weight: bold;
}

#alertbox.warn {
	background-color: #ff8000;
	font-weight: bold;
}

.invalid {
	border: 1px solid #c00;
	background-color: #fc9;
	color: #000;
}


/* ====== Specific classes for use in posts ====== */

.footnotes {
	margin: 10px 0px;
	padding: 10px 0px 0px 0px;
	border-top: 1px dotted #9999ff;
	font-size: 85%;
	color: #505050;
}







/* ====== Drop shadow stuff ====== */

/* default setup that everything sees */
.shadow {
  /* needed for Internet explorer */
  height: 1em;
  filter: Shadow(Color=#666666,
                 Direction=135,
                 Strength=5);

  /* Needed for Gecko */
  line-height: 1em;
  white-space: nowrap;
}

/*
 * used by browsers which know about
 * :before to create the shadow
 */
.shadow:before {
  display: block;
  margin: 0 0 -1.05em 0.05em;
  padding: 0;
  color: #444;
  content: attr(title);
line-height: 1em;
}

/*\*/
html*.shadow {

  [color:red;/* required by Safari
              * so that [] is correctly
              * begun. associated with
              * the property, yet hiding
              * it. Seen by IE6 */

    /*
     * seen by IE6 and Safari, but hidden
     * from Gecko
     */
    text-shadow: #666666 5px 5px 5px;

  ]color:auto; /* resets color for IE6 */
}/**/

/*
 * end hack using dummy attribute selector
 * for IE5 mac
 */
.dummyend[id]{clear: both;}

/*\*/
html*.shadow:before {

  [color:red;/* required by Safari.
                seen by IE6 */

    /*
     * seen by IE6 and Safari, but hidden
     * from Gecko
     */
    display: none;

  ]color:auto; /* resets color for IE6 */
}/**/

/*
 * end hack using dummy attribute selector
 * for IE5 mac
 */
.dummyend[id]{clear: both;}