/*==================================================
    M A I N   S T Y L E S
    
    * Last Updated    : 2008/10/01
    * Author         : Asela Jayarathne <asela@ultrasupernew.com>
    * Color Key     :
       * Blue	       : #36a3e1 
       * BG Gray       : #e7e7e7
==================================================*/
@import 'lib/reset.css';
@import 'lib/utilities.css'; 
@import 'lib/forms.css';

/* 
@import 'lib/forms.css';
*/

/*==================================================
    L A Y O U T 
    Basic page layout
==================================================*/
body { background: #000 url(../images/bg.jpg) top left; font: 62.5%/160% Verdana, Arial, Helvetica, sans-serif; text-align: center; color: #000; padding-top: 40px; }
    #page { text-align: left; margin: 0 auto; background: #e7e7e7 url(../images/page-bg.gif) top left repeat-x;  }
    #wrapper { background: transparent url(../images/wrapper-bg.gif) bottom left repeat-x;  }
    #header { width: 970px; height: 200px; margin: 0 auto 0 auto; position: relative; top: -40px; color: #fff; padding: 0; }
    #content { width: 970px; margin: -20px auto 20px auto; background: transparent url(../images/line-y.gif) 645px 0 repeat-y;  }
    #content-wrap { width: 625px; float: left; padding-bottom: 20px; }
    #sidebar { width: 324px; float: right; }
    #summary { background: #dbdbdb; padding: 20px 0; text-align: center; }
    #summary-wrap { width: 970px; margin: 0 auto; text-align: left; background: transparent url(../images/line-2col-y.gif) 315px 0 repeat-y;}
    #footer { clear: both; width: 970px; margin: 0 auto 100px auto; padding: 30px 0 20px 0;  }

/*==================================================
    C O M M O N  E L E M E N T S 
    Main HTML elements 
==================================================*/
h1 {}
h2 { font-family: "Century Gothic", "Avant Garde", sans-serif; font-size: 2.4em; line-height: 1em; }
h3 {}
li, p, td, th, dd, dt, label, legend { font-size: 1.2em; }
li p, li li { font-size: 1.0em; }
a:link { color: #36a3e1; text-decoration: none; }
a:visited { color: #999; text-decoration: none; }
a:hover { color: #000; }
a:active { color: #666; }


/*==================================================
    C O M M O N  S T Y L E S
     Project specific common design elements   
 ==================================================*/

/* patterns */
ul.navigation { margin-bottom: 10px; }
ul.navigation li { width: 45%; color: #999; }

ul.tabs { height: 20px; width: 100%; margin-bottom: 10px; }
ul.tabs li a { display: block; float: left; height: 20px; text-indent: -9999em; margin-right: 5px; display: inline; }
ul.tabs li { display: inline; }
ul.tabs li.categories a { width: 80px; background: transparent url(../images/tab-categories.gif) left top no-repeat; }
ul.tabs li.archives a { width: 65px; background: transparent url(../images/tab-archives.gif) left top no-repeat; }
ul.tabs li.tags a { width: 45px; background: transparent url(../images/tab-tags.gif) left top no-repeat; }
ul.tabs li.comments a { width: 120px; background: transparent url(../images/tab-comments.gif) left top no-repeat; }
ul.tabs li.popular a { width: 120px; background: transparent url(../images/tab-popular.gif) left top no-repeat; }
 
.ui-tabs-hide { display: none; }
ul.tabs li.ui-tabs-selected a { background-position: left bottom; }

h2.main-title { height: 15px; width: 90%; background: transparent url(../images/title-main.gif) left top no-repeat; text-indent: -9999em; margin-bottom: 15px; }

a.rss-small { height: 13px; width: 13px; background: transparent url(../images/button-rss-small.gif) left top no-repeat; position: absolute; top: 0; right: 20px; }

 
/* header */
#header p, #header ul { width: 39%; padding-top: 10px; color: #666; }
#header ul { width: 59%; }
#header ul { float: left; }
#header .name em { font-style: normal; color: #36a3e1; }
#header .description { float: right; text-align: right; }
#header .description em { font-style: normal; color: #999; }
#header a { color: #fff;  }
#header a:hover { text-decoration: underline; }
#header h1 { clear: both; padding: 50px 0 0 0; zoom: 1; }
#header h1 a { display: block; width: 388px; height: 77px; background: #fff url(../images/logo.gif) left top no-repeat; text-indent: -9999em; }

ul.link-back { margin: 0; padding: 0; width: 30%; overflow: hidden; }
ul.link-back li { display: inline; margin-right: 10px; }


/* sidebar */
#sidebar li { background: transparent url(../images/line-x.gif) left bottom repeat-x; padding: 0 0 15px 20px; margin-bottom: 20px; } 
#sidebar li li { padding: 0; margin: 0; background: none; }
#sidebar h2 { text-indent: -9999em; margin-bottom: 20px; height: 15px;}
#sidebar .search h2 { background: transparent url(../images/title-search.gif) left top no-repeat; }
.container.search { position: relative; height: 30px; padding-left: 10px; background: #fff url(../images/search-l.gif) left top no-repeat; }
.container.search label { display: none; }
.container.search input.submit { position: absolute; top: 0; right: 0; }
.container.search input.value { width: 230px; padding: 8px 0 0 0; border: none; }

#sidebar .browse h2 { background: transparent url(../images/title-browse.gif) left top no-repeat; }
#sidebar .browse li { color: #999; } 
/* #sidebar #tab-tags li { display: inline; margin-right: 10px; } */
#sidebar #tab-tags li { display: inline-block;  margin-right: 10px; }
#sidebar #tab-tags .count-1 a { font-size: 10px; }
#sidebar #tab-tags .count-2 a { font-size: 13px; }
#sidebar #tab-tags .count-3 a { font-size: 16px; }
#sidebar #tab-tags .count-4 a { font-size: 20px; }

#sidebar .about h2 { background: transparent url(../images/title-about.gif) left top no-repeat; }
#sidebar .rss h2 { background: transparent url(../images/title-rss.gif) left top no-repeat; }
#sidebar .rss li { padding-left: 21px; background: transparent url(../images/button-rss-small.gif) left center no-repeat; }  
  
/* for RSS image/links in category list */
#sidebar #tab-categories img { float: left; margin-right: 8px; }

 /* summary section */
#summary-wrap { }
#summary .block { width: 315px; float: left; margin: 0 15px 0 0; display: inline;  }
#summary .block ul { margin: 0 20px 0 0; }
#summary .block ul li h3 { font-size: 14px; }
#summary .block h2 { text-indent: -9999em; background-color: #dbdbdb; width: 90%; margin-bottom: 20px; }

#summary .recent { position: relative; }
#summary .recent h2 { height: 15px; background: #dbdbdb url(../images/title-recent.gif) left top no-repeat; }
#summary .recent ul { }
#summary .recent li { margin-bottom: 1em; }

#summary .users-say { margin-bottom: 20px; }
#summary .users-say ul { padding-right: 20px; }
#summary .users-say h2 { height: 15px; background: #dbdbdb url(../images/title-users-say.gif) left top no-repeat; }
#summary .users-say .tabs { margin-bottom: 10px; }
#summary .users-say #tab-popular li { background: transparent url(../images/bullet.gif) 0px 5px no-repeat; padding-left: 10px; margin-bottom: 3px; font-weight: bold; }
#summary .users-say #tab-comments li { margin-bottom: 5px; }
#summary .users-say #tab-comments li a { font-weight: bold; }

#summary .jt-headlines { position: relative; }
#summary .jt-headlines ul { padding-right: 20px; }
#summary .jt-headlines h2 { height: 15px; background: #dbdbdb url(../images/title-jt-headlines.gif) left top no-repeat; }
#summary .jt-headlines li { background: transparent url(../images/bullet.gif) 0px 5px no-repeat; padding-left: 10px; margin-bottom: 3px; font-weight: bold; }

/* added 2010/11/15 afp to try to get recent post sociable listings to not display */
#summary .sociable { display: none; } 

#page #summary .ads { width: 300px; margin: 0; }
#page #summary ul { margin-right: 0; }
.ads li { margin-bottom: 10px !important; }

/* post */
.post { margin-bottom: 20px; }
.post h3 { font-size: 1.4em; }
.post .meta { color: #999; margin-bottom: 10px; margin-top: 5px; }
.post .entry p { margin-bottom: 1em; }
.post .entry ul { margin: 0 0 .5em 1em; }
.post .entry ul li { padding: 0 0 1em 1em !important; background: transparent url(../images/bullet.gif) 0 5px no-repeat !important;  }
.post .entry blockquote { border-left: 5px #ccc solid; padding: 0 0 0 1em; margin-left: 1em; }
.post .postmetadata { color: #999; }


/* footer */
#footer p { color: #999; }
#footer li { display: inline; }
#footer li a { color: #333; background: transparent url(../images/footer-link-bg.gif) right center no-repeat; padding-right: 15px; margin-right: 10px; }
#footer .last a { background: none; }
#footer a.ownership { display: block; width: 168px; height: 26px; background: transparent url(../images/jt-logo-gray.gif) left top no-repeat; 
					  float: right; margin: 0 0 0 20px; display: inline; text-indent: -9999em;}


/* comments */
.comments { margin-bottom: 4em; }
.comments h3 { font-size: 1.4em; margin-bottom: 1em;}
ol.comments-list {  margin-bottom: 3em; }
ol.comments-list li { padding: 1em; margin-bottom: 1em; }
ol.comments-list li p { font-size: 1em; }
ol.comments-list li.alt { background: #dbdbdb; }
.comment-metadata { margin-top: .6em; }
.comment-metadata cite { font-size: 1.3em; font-style: normal; }
.comment-metadata span { font-style: italic; }

.comments textarea { width: 600px; }

/* Archives */
.archive #content-wrap h2 { margin-bottom: 20px; }


/* bios */
.postauthor { background: #F5F5F5; border-top: 0px solid #e1e1e0; border-bottom: 3px solid #e1e1e0 !important; overflow: hidden; padding: 1.5em; }
.postauthor img { border: 5px solid #e2dede; float: left; margin-right: 1.5em; }
.postauthor h4 { color: #666; font-size: 2em; margin-bottom: 5px; }
.postauthor p { color: #515151; font-size: 13px; margin-bottom: 12px; border-bottom: 0px solid #e1e1e0 !important; } 

/* related posts */
.relatedposts h2 { margin-top: 8px; margin-bottom: 8px; font-size: 2.5em; margin-left: .5em; }
.relatedposts ul { background: none !important; padding 0 0 0 0 !important; }
.post .entry .relatedposts .related_post li { 
	text-indent: 20px;  
/*	background: none !important; */
	padding: 0 0 0 0 !important;
	color: #515151;
	font: bold 13px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
/*	margin: 0px 0px 0px 0px; */
}

.relatedposts { background: #F5F5F5; border-top: 1px #e1e1e0; overflow: hidden; padding: 0.5em; margin-bottom: 30px; }

.relatedposts p { color: #515151;
	font: bold 13px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

/* sociable plugin hack */

.post .entry .sociable ul li { padding: 0 0 0 0 !important; background: none !important; }
.post .entry .sociable .sociable_tagline { margin-bottom: 5px; }

/* for sociable-30 pro plugin */
.post .entry .sociable span.sociable-tagline { margin-bottom: 5px; display: inline-block; }