/*
Theme Name: Walter John [dot] Net
Theme URL: http://blog.walterjohn.net
Description: A wide single column theme with comment inline for each post suitable for photographic portfolio.
Author: Walter John
Author URI: http://www.walterjohn.net
Version: 1.0
Tags: 1 column, fixed width, gray, tan, no widget*/

/* General settings */
body {
	font-family: Tahoma, Helvetica, Verdana, Arial, sans-serif;
	background: #C9C9C9;
}

a, a:visited {
	text-align: left;
}

#maincontainer {
	width: 1000px;
	margin: 30px auto 0 auto;
	padding: 0;
}

#toptitle a {
  position: relative;
  left: 34px;
  top: 28px;	
  font-size:64px;	
  font-weight: bold;
  color: #545454;  
  text-decoration: none;
}

#toptitle .dot { position:relative; top:-8px; font-size:40px; color:Maroon; }

#slideshow {
  clear:both;
  margin: 14px auto -24px auto;  
  text-align: center; 
  width: 1000px;
  height: 438px;
  background: url(images/slideshow.jpg) no-repeat;
  padding-top: 20px;
  xoverflow: hidden;
}

#slideshow #imagearea {
	width: 948px;
	height: 398px;
	margin: 0 0 0 26px;
	padding: 0;
}

#slideshow #imagearea img {
	border: none;
}

/*mid section*/
#midsection {
  margin: -6px auto 12px auto;
  display: block;
  clear: both;
  height: 80px;
}
*html #midsection {
  margin: 2px auto;
  height: 40px !important;
}

#midsection .twitterbox {
  margin:6px 10px 8px 18px;
  padding: 4px;
  width: 350px;
  height: 64px;
  float:left;
  background: url(images/tweetbck.gif) no-repeat 50px -5px;
}
*html #midsection .twitterbox {
  margin-left: 6px;
}

#mtaTwitter { padding: 0; }
#mtaTwitter > a { float: left; }
#mtaTwitter a img {
	height: 48px;
	width: 48px;
	padding: 1px;
	margin-left: 2px;
	border: 1px solid #BABABA;
}

#mtaTwitter ul {
    position: relative;
   -moz-border-radius: 7px;
   -webkit-border-radius: 7px;
    border-radius: 7px;
    list-style: none;
    margin: 20px 0 0 0;
    margin-left: 66px;
    padding: 0px;
    font-family: Tahoma, Arial, Helvetica, sans-serif;
}
#mtaTwitter ul li { padding: 8px 0 8px 8px; font-size: 10pt; }
#mtaTwitter ul li.first { font-size: 11px;  margin-top: -20px; width: 266px; }
*html #mtaTwitter ul li.first { _margin-top: -74px;}
#mtaTwitter ul li.even { background-color: #EDEEFD; }
#mtaTwitter ul li.first span { font-size: 10px; font-weight: normal; }
#mtaTwitter ul li span { font-style: normal; }
#mtaTwitter ul li a { text-decoration: none; color: #8FBC8F; font-family: Arial, Helvetica, sans-serif; font-size: 10px; }

/*#midsection .navibox p { margin: 0; font: 12px Arial, sans-serif; } */

#midsection .socialbox {
  margin:10px 8px 2px 10px;
  width: 20px;
  float:left;
  text-align:center;
}

#midsection .socialbox ul { margin: 0; padding: 0; }
#midsection .socialbox li { list-style:none; line-height: 23px; margin-top: 2px\9; margin-bottom: 7px\9; }
#midsection .socialbox li a img { border: none; }

#midsection .feedbox {
  margin:0px 4px 12px 10px;
  width: 278px;
  height: 87px;
  float:left;
  background: url(images/feedburner.jpg) no-repeat 0px -4px;
}

#midsection .feedbox #fboxname1 { position: absolute; margin-top: 20px; margin-left: 12px; font-size:16px; color: #dc6009; }
#midsection .feedbox #fboxname2 { position: absolute; margin-top: 16px; margin-left: 106px; font-size:22px; color: Black;}

#midsection .feedbox input {
	margin-top: 48px;
	margin-left: 14px;
	border: none;
}

#midsection .searchbox {
  margin:0px 8px 12px 10px;
  width: 180px;
  float:right;
}

#midsection .searchbox #sname1 { position: absolute; margin-top: 20px; margin-left: 12px; font-size:16px; color: #dc6009; }
#midsection .searchbox #sname2 { position: absolute; margin-top: 16px; margin-left: 72px; font-size:22px; color: Black;}

#midsection .searchbox {
	width: 260px;
	height: 87px !important;
	background: url(images/searchbox.jpg) no-repeat 2px 1px;
	text-align: left;
}
#midsection .searchbox input {
	margin-top: 48px;
	margin-left: 17px;
	border: none;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
  #midsection .searchbox input { margin-top: 48px; }
}

/* end of midsection*/

/* mainposting settings */
#mainposting {
	position: relative;
	top: -8px;
	margin: 0;
	padding: 0;
}
#postheader {
	background: url(images/header.jpg) no-repeat;
	height: 25px;
	margin: 0;
	padding: 0;
}
#postbody {
	background: url(images/body.jpg);
	margin: 0;
	padding: 0 42px;
}
#postfooter {
	background: url(images/footer.jpg) no-repeat;
	height: 25px;
	margin: 0;
	padding: 0;
}
#postcontent {
	margin: 0;
	padding: 0;
	white-space: normal;
}

#postcontent table, tr, td {
       font: 12px Arial, Helvetica, sans-serif;
       white-space: normal;
}

#postcontent td {
      padding: 1px;
}

#postcontent td.title {
       font: bold 12px Arial;
       color: Black;
}

#postcontent a, a:visited {
	text-decoration: underline;
	color: #F5F5F5;
}
#postcontent a:hover {
	color: #8B0000;
}
#postcontent p.title {	
	margin: 0;
	color: #545454;
	font-size: 40px;
}

#postcontent p.metadata {
	margin: 0;
	color: #696969;
	font-size: 14px;
	font-weight: normal;
	margin-bottom: 12px;
	text-transform: uppercase;
}
#postcontent p.metadata a, p.metadata a:visited {
	margin: 0;
	color: #DCDCDC;
	font-size: 14px;
	font-weight: normal;
	margin-bottom: 12px;
	display: inline;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: bold;
}
#postcontent p.metadata a:hover {
	color: #8B0000;
}
#postcontent p {
	color: #DCDCDC;
	font-size: 12px;
	text-align: justify;
}
#postcontent b, strong {
	color: White;
	font-size: 12px;
}

#postcontent .respond {
	position: relative;
	left: 640px;
	top: 4px;
	color: White;	
	font-size: 15px;
	xtext-align: right;
}

@media screen and (max-device-width: 480px){
/*--- iPhone only CSS here ---*/
  #postcontent .respond { position:relative; left:568px; }
}

#postcontent .respond a, .respond a:visited {
	display: inline;
	color: #545454;
	font-size: 20px;
	text-decoration: none;
	font-weight: bold;
	text-transform: uppercase;
}
#postcontent .respond a:hover {
	color: White;
}

#postcontent img {
	display: block;
	background: #7A7A7A;
	padding: 1px;
	margin: 8px auto 8px auto;
	text-align: center;
	border: 1px solid #959595;
}

#postcontent img.wp-smiley {
	background: transparent;
	border: 0;
	display: inline;
	margin: -4px 2px;
	padding: 0;
}
#postcontent ul {
	margin: 0;
	padding: 0;
	width: 98%;
}
#postcontent li {
	list-style:  outside lower-roman;
	margin-left: 28px;
	padding: 0;
	font-size: 12px;
	color: #DCDCDC;
}
#postcontent blockquote {
	margin: 10px 24px;
	background: url(images/quote.gif) no-repeat;
	background-position: top left;
	text-align: justify;
	padding-left: 34px;
	padding-top: 1px;
}
#postcontent blockquote p {
	background: url(images/unquote.gif) no-repeat;
	background-position: bottom right;
	padding-right: 34px;
	padding-bottom: 8px;
	color: #EEE8AA;
}

#postcontent .thumb ul {
	width: 950px;
	margin: 0;
	padding: 0;
}

#postcontent .thumb li {
	margin: 0;
	padding-right: 9px;
	display: inline;
	list-style: none;
}

#postcontent .thumb li img {
	text-align: left;
	margin-bottom: 2px;
	display: inline;
	list-style: none;
}

#postcontent .thumb a.img {
	border: none;
}

#postcontent .sharethis {
	position:relative;
	top: 22px;
	left: -4px;
}

#navigatbox {
  display:block:
  width: 800px;  
}

#navigatbox .steps {
  position: relative;
  width: 84px;
  height:45px;
  float:right;
  margin: -14px 124px 0;
  background: url(images/steps.gif) no-repeat;
}

@media screen and (max-device-width: 480px){
/*--- iPhone only CSS here ---*/
  #navigatbox .steps { position:relative; left:-26px; }
}

#navigatbox .steps img { position:absolute; border:none;}

#navigatbox .steps #prv {
  position:absolute;
  margin-top:4px;
  margin-left:10px;
} 

#navigatbox .steps #nxt {
  position:absolute;
  margin-top:4px;
  margin-left:54px;
}
/************************************Comments************************************/
#postcontent .comments {
	margin: 0;
	padding: 0;
	background: url(images/comment_mid.jpg) -5px;
}
.comments #cheader {
	background: url(images/comment_top.jpg) no-repeat top;
	height: 25px;
	margin: 0;
	padding: 0;
	display: block;
}
.comments h2 {
	margin: -10px auto 6px 12px;
	font-size: 18px;
	color: Black;
}
.comments h2 .topics {
	color: #B22222;
}
.comments #contents {
	margin: -2px 0 0 12px;
	padding: 0;
	width: 880px;
	font-size: 11px;
	background: #DCDCDC;
	display: block;
}
#contents ol {
	margin-left: 12px;
	padding: 0;
	background: #DCDCDC;
}
#contents li {
	list-style: outside lower-roman;
	margin-left: 14px;
	padding-bottom: 6px;
	font-size: 11px;
	color: Black;
}
#contents li p {
	margin-top: 2px;
	color: black;
	font-size: 11px;
	*MARGIN-TOP: 4px;
}

#contents p a {
        color: Maroon;
        text-decoration: underline;   
}

#contents p a:hover {
        color: #5A5A5A;
}

#contents li .name {
	font-size: 11px;
	color: #5A5A5A;
	font-weight: bold;
	text-decoration: none;
}
#contents li .name a {
	text-decoration: none;
	color: #D2691E;
	font-size: 11px;
	font-weight: bold;
}
#contents li .name a:hover {
	color: Maroon;
}
#contents li .ondate {
	color: #696969;
}
#contents li img {
	border: none;
	text-align: left;
	display: inline;
	margin: -2px 2px -2px 2px;
	padding: 0;
}
.comments #cfooter {
	margin: -30px 0 0 0;
	*MARGIN-TOP: -25px;
	padding: 0;
	background: url(images/comment_bottom.jpg) no-repeat bottom;
	height: 25px;
	display: block;
}
/************************************Comments Popup************************************/
#cform {
	width: 700px;
	margin-left: 20px;
	padding: 0;
	font: 12px Tahoma, Helvetica, sans-serif;
}
#cform h1#header {
	font-size: 1.4em;
	color: #696969;
	text-decoration: none;
}
#cform h2 {
	font: 1.1em Tahoma, Verdana, Helvetica bold;
	color: #B22222;
}
/********************************** Archive **********************************/
#postcontent p.title strong {
	font-size: 40px;
	font-variant: small-caps;
	color: Maroon;
}
#postcontent .archive_list ul {
	width: 880px;
	margin: 0 8px 8px 18px;
	padding: 4px;
	border: 1px solid;
}
#postcontent .archive_list li {
	list-style: none;
	margin-bottom: 20px;
}
#postcontent .archive_list li .teaser {
	margin-left: 14px;
	margin-top: 2px;
}
#postcontent .archive_list li .postname {
	display: inline;
	color: #696969;
	font-size: 12px;
	text-decoration: none;
        font-weight: bold;
}
#postcontent .archive_list li a {
	display: inline;
	color: White;
	font-size: 14px;
	text-decoration: none;
}
#postcontent .archive_list li a:hover {
	color: Maroon;
}

/************************************Fixes************************************/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */

/*********************Footer*********************/

#proper_page {
	margin-top: -2px;
	margin-bottom: 2px;
	display: block;
	text-align: center;
	vertical-align: middle;
	font-size: 26px;
	color:Black;	
}

#proper_page a {
	vertical-align: middle;	
	padding: 0 4px;
	color: Maroon;
	font-size: 18px;
	text-decoration:none;
}

#footer {
	margin: -6px 0;
	background: url(images/footerbody.jpg);
	color: #DCDCDC;
	font-size: 12px;
	clear:both;
}

#footer a {
	color: Black;
	text-decoration: none;
}

#footer a:hover {
	color: White;
}

#footop {
	background: url(images/footertop.jpg) no-repeat;
	height: 25px;
	margin: 0 0 -8px 0;
	padding: 0;
}

#footbody {
	position:relative;
	margin: 0;
	padding: 0 34px;
}

#footbody h2 {
	font-family: Arial, Helvetica, sans-serif;;
	font-size: 14px;
	font-weight: bold;
	color: #F28600;
}

#footbody p {
	margin: 0 12px;
}

#footbody .col01 {	
	float: left;
	width: 200px;
	margin: 0px;
	padding: 0 6px 0 2px;
	clear: right;
	text-align: justify;
}

.col01 #profimg {
	width: 175px;
	display: block;
	background: #2A2A2A;
	padding: 1px;
	margin: 8px auto 8px auto;
	text-align: center;
	border: 1px solid #404040;
}

#footbody .col02 {
	position:absolete;
	float: left;
	width: 300px;
	margin: 0;
	padding: 0 2px;
}

.col02 #archivesblock {
	margin: -10px 0 0 -2px;
	padding-left: 2px;
	vertical-align: middle;
	line-height: 12px;
}
.col02 #archivesblock p, a.img {
	line-height: 22px;
	*LINE-HEIGHT: 12px;
	font-size: 11px;
}

.col02 a {
	font-size: 11px;
	text-decoration: none;
}

.col02 img {
	margin: 8px 0 -6px 1px;
	*VERTICAL-ALIGN: middle;
}

#footbody .col03 {
	position:absolete;
	float: left;
	width: 128px;
	margin: 0;
	padding: 0 6px 0 2px;
}

.col03 a {
	color: White;
}

.col03 a:hover {
	color: Maroon;
}

#footbody .col04 {
	position:absolete;
	float: left;
	width: 270px;
	margin: 0;
	padding: 0 6px 0 2px;
}

.ch2 ul {
	margin: 0 0 12px 0;
	padding: 0;
}

.ch2 li {
	background: url(images/btn-cats.gif) no-repeat -5px 0px;
	list-style-position: outside;
	display: block;
	width: 120px;
	margin: 2px 0 4px 4px;
	padding-left: 10px;
	line-height: 12px;
}

.ch2 {
	margin: 0;
	padding: 0;
}

.ch3 ul {
	margin: 0 0 12px 0;
	padding: 0;
}

.ch3 li {
	background: url(images/btn-cats.gif) no-repeat -5px 0px;
	list-style-position: outside;
	display: block;
	margin: 2px 0 8px 4px;
	padding-left: 10px;
	line-height: 12px;
}

.ch3 {
	margin: 0;
	padding: 0;
}

#footclaim {
	font-size: 11px;
	display: block;
	clear: both;
	margin-top: 20px;
	padding-top: 20px;
	text-align: center;
	color: #717171;
}

#footclaim a {
	color: #858585;
	font-weight: bold;
}

#footclaim a:hover {
	color: White;
}

#footbtom {
	background: url(images/footerbtom.jpg) no-repeat;
	height: 25px;
	margin: 0;
	padding: 0;
}

/* IE PNG fix */
* 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)
  );
}