/*
Theme Name: Fran and Jane
Theme URI: http://franandjane.com/blog/
Description: Custom Theme for Fran and Jane by 4pm 
Version: 1.0
Author: Pedro Ribeiro
Author URI: http://jpedroribeiro.com/
Tags: fixed width, two columns
*/

h1, h2, h3, h4, h5, div, p, ul, li, ol {margin: 0; padding: 0; font-weight: normal; font-size: inherit;; list-style: none}



body{background-color: #695C62;	margin: 0 auto; color:#4D4D4D; font-size: 12px;font-family: Helvetica, sans-serif;}
.area {width: 941px; margin: 0 auto}
.area:after {content: "."; display: block;height: 0;clear: both;visibility: hidden;}
.line {border: none; background:none repeat scroll 0 0 #FFFFFF; border-bottom:1px solid #e5e5e5; clear:both; color:#FFFFFF; height:1px; margin:73px 0 43px; overflow:hidden;width:100%;}

/*=========================HEADER==============================*/
.header{ background: url(img/bg-head.jpg) center top no-repeat ; width: 100%; height: 134px;}
.header h1, .header h1 a {width: 193px; height: 63px; margin: 0}
.header h1 a{display: block; background: transparent url(img/logo.png) no-repeat; text-indent: -9999px}
.header ul {margin: 30px 0 0 5px; width: 100%; height: 20px}
.header ul li {float: left; padding-right: 15px; height: 20px}
.header ul li a img {border:0}
	
	
	
	
	
	
	

/*=========================CONTENT==============================*/
.content{background: url(img/bg-body.jpg) center top repeat-y  ; width: 100%; min-height: 200px}
#blog-listing {width: 620px; height:auto; margin: 15px 20px 0 0; padding: 0; float: left}
.blog-item {margin: 0 0 120px 0}
.blog-item a {color: #e8559a}
.blog-item a:hover {color: #4d4d4d}
.blog-item p {margin: 5px 0 15px 0}
h4.blog-date-cat {font-size: 11px; color: #776e73; width: 100%; height: 18px; border-bottom: 1px solid #e5e5e5; margin-bottom: 16px;}
h4.blog-date-cat span a{display: block; width: 200px; text-align: right; height: 100%; float: right; font-size: 11px; color: #776e73; text-decoration: none}
h4.blog-date-cat span a:hover{text-decoration: underline}
h2 {font-size: 24px; margin-bottom: 16px}
.blog-item h2 a {background-color:#F390B0; color:white; padding:2px 5px; text-decoration:none;}
.blog-comments {width: 68px; height: 16px; background: url(img/base-comments.png) no-repeat; padding: 3px 0 0 17px; font-size: 11px; margin: 15px 390px 0 0; float: left; }
.blog-comments a {color: #776e73; text-decoration: none}
.blog-share {width: 128px; height: 15px; background: url(img/base-share.png) no-repeat; padding: 4px 0 0 7px; font-size: 11px; margin: 15px 0 0 0; float: left; color: #776e73; position: relative}
.blog-share img[src$="img/share-twitter.png"] {position: absolute; top: 1px; left: 65px}
.blog-share img[src$="img/share-fb.png"] {position: absolute; top: 2px; left: 87px}
.blog-share img[src$="img/share-rss.png"] {position: absolute; top: 2px; left: 109px}
.older-entries {font-size: 11px}
.older-entries:before {content: "."; display: block;height: 0;clear: both;visibility: hidden;} {}
.older-entries a {color: #e8559a; margin-right: 10px}
.older-entries a:hover {text-decoration: none}



#side-content {width: 300px; height:auto; margin: 15px 0 0 0; padding: 0; float: left }
h3 {widows: 277px; height: 34px; font-size: 22px; background: url(img/heart-bg.png) no-repeat 0 0; padding: 13px 0 0 23px; margin: 0 0 5px 0}
h3:first-letter {color:white}
h3.simple {widows: 277px; height: 34px; font-size: 22px; background: none; padding: 13px 0 0 23px; margin: 0 0 5px 0}
h3.simple:first-letter {color: #4d4d4d}
ul.categories {width: 280px; height: 177px; background: url(img/popular-bg.png) 2px 2px no-repeat; border: 1px solid #e5e5e5; margin-left: 20px; }
ul.categories li {margin: 9px 0 0 11px}
ul.categories li a {font-size: 16px; text-decoration: none; color: #4d4d4d}
ul.categories li a.current {color: #f390b0}
ul.categories li a:hover {text-decoration: underline}
div.ending {width: 280px; height: 8px; background: url(img/ending-shadow.png); margin: 0 0 10px 20px;}
ul.most-popular {margin-bottom: 33px}
ul.most-popular li {float: left; margin: 0 -10px 0 20px}
ul.most-popular li span {font-size: 15px; color: #c0bbbe; padding: 4px 11px 0 11px; cursor: pointer}
ul.most-popular li span:hover {text-decoration: underline}
ul.most-popular li span#popular-hits {display: block; width: 32px; height: 25px; padding-left: 15px;}
ul.most-popular li span#popular-comments {display: block; width: 82px; height: 25px; padding-left: 15px;}
ul.most-popular li span#popular-hits.on {background: url(img/hits-bg.png) no-repeat; color: #f390b0}
ul.most-popular li span#popular-comments.on {background: url(img/comments-bg.png) no-repeat; color: #f390b0}
ol.most-hits {width: 280px; height: 157px; background: url(img/popular-bg.png) 2px 0px no-repeat; border: 1px solid #e5e5e5; margin-left: 20px; list-style: decimal;  }

ol.most-hits li {margin: 9px 0 0 13px; list-style: inherit; color: white; background: url(img/heart-number.png) no-repeat; list-style-position: inside; padding:2px 0 5px 7px;}
ol.most-hits li a {font-size: 13px; text-decoration: none; color: #776e73}
ol.most-hits li a:hover {text-decoration: underline}
ol.most-comments {width: 280px; height: 157px; background: url(img/popular-bg.png) 2px 0px no-repeat; border: 1px solid #e5e5e5; margin-left: 20px; margin-left: 20px; list-style: decimal  }
ol.most-comments li {margin: 9px 0 0 13px; list-style: inherit; color: white; background: url(img/heart-number.png) no-repeat; list-style-position: inside; padding:2px 0 5px 7px;}
ol.most-comments li a {font-size: 13px; text-decoration: none; color: #776e73}
ol.most-comments li a:hover {text-decoration: underline}
.turned-off{display: none}
                        /* below is a fix for the lists not to change size according to its text */
ol.most-comments li, ol.most-hits li {background:url("img/heart-number.png") no-repeat scroll 0 0 transparent;
color:white; height:17px; list-style-image:inherit; list-style-position:inside; list-style-type:inherit; margin:7px 0 0 13px; padding:2px 0 5px 7px; width:258px;}
                        /* end fix */

div.vip {width: 280px; height: 108px; background: url(img/vip-bg.png) 2px 0px no-repeat; border: 1px solid #e5e5e5; margin-left: 20px; margin-left: 20px; list-style: decimal  }
div.vip p {padding: 10px 10px 10px 12px}
div.vip p span {font-size: 16px; letter-spacing: 1px; color: #404040}
div.vip input[type='text'] {width: 206px; height:29px; border: none; background: url(img/tf-bg.png) no-repeat; margin: 0 0 0 13px; padding: 0 2px 0 2px; color: #4d4d4d}
div.vip input[type='submit'] {width: 39px; height:29px; border: none; background: url(img/tf-btn-bg.png) 0 1px no-repeat; margin: 0 0 0 2px; cursor: pointer; text-indent: -99999px}
div.vip input[type='submit']:active {width: 39px; height:29px; border: none; background: url(img/tf-btn-bg.png) 0 2px no-repeat; margin: 0 0 0 2px; cursor: pointer; text-indent: -99999px}
.response {background:none repeat scroll 0 0 #FCFCFC; border:1px solid #D4D4D4; height:86px; padding:10px; position:absolute; top:648px; width:258px; cursor: pointer}


ul.social {margin-bottom: 33px}
ul.social li {float: left; margin: 0 -17px 0 20px}
ul.social li span {font-size: 15px; color: #c0bbbe; padding: 4px 11px 0 11px; cursor: pointer}
ul.social li span:hover {text-decoration: underline}
ul.social li span#social-twitter {display: block; width: 53px; height: 25px; padding-left: 15px;}
ul.social li span#social-facebook {display: block; width: 83px; height: 25px; padding-left: 15px;}
ul.social li span#social-twitter.on {background: url(img/tw-bg.png) no-repeat; color: #f390b0}
ul.social li span#social-facebook.on {background: url(img/fb-bg.png) no-repeat; color: #f390b0}
div.tweets, div.fans {width: 260px; height: 257px; background: url(img/popular-bg.png) 2px 0px no-repeat; border: 1px solid #e5e5e5; margin-left: 20px; padding: 10px  }
#twitter_update_list li a {display:none}
#twitter_update_list li span a {color: #4d4d4d; display: inline}
#twitter_update_list li {border-bottom:1px solid #D4D4D4; margin-bottom:5px;padding-bottom:5px;}
#twitter_update_list {display: box; overflow: hidden; width: 260px; height:260px}
#twitter_update_list li:last-child {border:none}


h4.comments{color:#4D4D4D;font-size:16px;}
ol.commentlist, #respond{margin: 10px 0 0 20px}
ol.commentlist cite{font-weight: bold}
.comment-body {border-left:3px solid #EFEFEF;margin-bottom:28px;margin-left:20px;padding-left:10px;}
.comment-meta a {color: #4d4d4d; text-decoration: none}


/*=========================FOOTER==============================*/
.footer{background: url(img/bg-footer.jpg) center top no-repeat ; width: 100%; height: 96px; color: white; padding-top: 45px; text-align: center; text-decoration: none;}
.footer a {color: white}












/* XTRAS */
.wp-caption {font-size: 11px; color: #4d4d4d; font-style: italic}
.aligncenter {margin: 15px auto;}
.alignleft {margin: 10px; float: left}
.alignright {margin: 10px; float: right}
.blog-item ul, .blog-item ul li, .blog-item ol, .blog-item ol li{list-style: disc inside url("http://www.franandjane.com/img/heart-bullet.png")}