/*
Theme Name: High Tech Forums
Theme URI: http://hightechforums.org
Description: Wordpress Theme for HTF
Version: 1.0
Author: Ray Henry
Author URI: http://reh3.com/
Tags:
*/

/* GLOBAL DECLARATIONS *************/

* {margin:0;padding:0;}
body {text-align:center;background:#fff url(images/htf-body-bg.gif) repeat-x 0 0;font-family:Verdana, Geneva, arial, sans-serif;}
p {margin:10px;font-size:12px;color:#444;line-height:1.5;}

.clr {float:none;clear:both;font-size:1px;line-height:0;height:0;}

a:link, a:active, a:visited {color:#2f7baa;}
a:hover {color:#5e181a;}

input.btn, a.btn {margin:0;padding:5px 10px;font-size:11px;text-transform:uppercase;color:#fff;background:#61a7ce url(images/htf-btn-bg.gif) repeat-x left bottom;border:none;text-decoration:none;}

.box {position:relative;}
.box .tl,
.box .tr,
.box .bl,
.box .br {position:absolute;width:10px;height:10px;line-height:0;background:url(images/htf-corners.png) no-repeat 0 0;z-index:10;}
.box .tl {top:0;left:0;background-position:0 0;}
.box .tr {top:0;right:0;background-position:-10px 0;}
.box .bl {bottom:0;left:0;background-position:0 -10px;}
.box .br {bottom:0;right:0;background-position:-10px -10px;}

/* CORE LAYOUT STRUCTURE *************/

#wrapper {margin:0 auto;width:910px;text-align:left;}
#wrapper #hat, 
#wrapper #masthead,
#wrapper #global, 
#wrapper #main {float:left;width:910px;}

/* HAT *************/
#wrapper #hat {padding:5px 0 0 0;height:30px;}
#wrapper #hat #hat-contact {float:left;}
#wrapper #hat #hat-contact .btn {float:left;padding:5px 10px 5px 25px;background:#6fcd60 url(images/htf-btn-contact-bg.gif) no-repeat left bottom;}
#wrapper #hat #hat-admin {float:right;}
#wrapper #hat #hat-admin .btn {float:left;margin:0 0 0 10px;}

/* MASTHEAD ********/
#wrapper #masthead {height:109px;}
#wrapper #masthead #branding {float:left;margin:32px 0 0 0;}
#wrapper #masthead #branding img {float:left;}
#wrapper #masthead #branding .subtitle {clear:both;float:left;margin:5px 0 0 0;font-size:13px;color:#666;}

#wrapper #masthead #social {float:right;margin:32px 0 0 0;}
#wrapper #masthead #social .title {float:left;font-size:12px;color:#666;}
#wrapper #masthead #social a {float:left;display:block;margin:0 0 0 10px;width:36px;height:54px;text-indent:-9999px;text-decoration:none;outline:none;}
#wrapper #masthead #social a#soc-rss {background:url(images/htf-icon-rss.png) no-repeat 0 0;}
#wrapper #masthead #social a#soc-twitter {background:url(images/htf-icon-twitter.png) no-repeat 0 0;}
#wrapper #masthead #social a#soc-facebook {background:url(images/htf-icon-facebook.png) no-repeat 0 0;}

/* GLOBAL **********/
#wrapper #global #nav {float:left;margin:10px 0 0 0;list-style:none;}
#wrapper #global #nav li {float:left;margin:0 10px 0 0;padding:0 5px;font-size:12px;text-transform:uppercase;}
#wrapper #global #nav li a {float:left;padding:5px 0;text-decoration:none;color:#666;border-bottom:3px solid #5e181a;}
#wrapper #global #nav li:hover {padding:0;}
#wrapper #global #nav li:hover a {padding:5px;color:#fff;background:#5e181a;}

#wrapper #global #nav.home li#tab1,
#wrapper #global #nav.About li#tab2,
#wrapper #global #nav.internet li#tab3,
#wrapper #global #nav.networking li#tab4,
#wrapper #global #nav.telecom li#tab5,
#wrapper #global #nav.privacy li#tab6,
#wrapper #global #nav.security li#tab7 {padding:0;}

#wrapper #global #nav.home li#tab1 a,
#wrapper #global #nav.About li#tab2 a,
#wrapper #global #nav.internet li#tab3 a,
#wrapper #global #nav.networking li#tab4 a,
#wrapper #global #nav.telecom li#tab5 a,
#wrapper #global #nav.privacy li#tab6 a,
#wrapper #global #nav.security li#tab7 a {padding:5px 5px 12px 5px;color:#fff;background:#5e181a url(images/htf-nav-twiddle.gif) no-repeat 50% bottom;border:none;}

#wrapper #global #siteSearch {float:right;margin:10px 0 0 0;}
#wrapper #global #siteSearch input.formclr {padding:5px;margin:0 5px 0 0;font-size:11px;color:#666;border:1px solid #a1a1a1;}

/* MAIN **********/
#wrapper #main {margin:18px 0 20px 0;}
#wrapper #main #content {float:left;width:600px;}
#wrapper #main #content p.title {margin:0 20px 0 0;;font-size:11px;color:#666;text-transform:uppercase;}

#wrapper #main #content .post.featured {float:left;margin:0 20px 20px 0;padding:10px 0;width:580px;background:#fff;}
#wrapper #main #content .post.featured h1 {font-size:26px;font-weight:normal;}
#wrapper #main #content .post.featured h1 a {color:#2f7baa;text-decoration:none;}
#wrapper #main #content .post.featured h1 a:hover {color:#5e181a;}
#wrapper #main #content .post.featured .meta {margin:5px 0;font-size:12px;color:#999;}
#wrapper #main #content .post.featured .meta a {color:#999;text-decoration:none;}
#wrapper #main #content .post.featured .meta a:hover {color:#666;}
#wrapper #main #content .post.featured .content .post-image {float:left;margin:10px 20px 0 0;padding:0 0 12px 0;width:180px;overflow:hidden;text-align:center;}
#wrapper #main #content .post.featured .content .post-image img {width:180px;}
#wrapper #main #content .post.featured .content p {margin:10px 0;font-size:14px;color:#444;}
#wrapper #main #content .post.featured .content a {color:#2f7baa;}
#wrapper #main #content .post.featured .content a:hover {color:#5e181a;}

#wrapper #main #content .post.sub {float:left;margin:0 20px 20px 0;padding:20px 0 0 0;width:580px;border-top:1px solid #ddd;}
#wrapper #main #content .post.sub h2 {font-size:18px;font-weight:normal;}
#wrapper #main #content .post.sub h2 a {color:#3a3a3a;text-decoration:none;}
#wrapper #main #content .post.sub h2 a:hover {color:#2f7baa;}
#wrapper #main #content .post.sub .meta {margin:5px 0;font-size:11px;color:#999;}
#wrapper #main #content .post.sub .meta a {color:#999;text-decoration:none;}
#wrapper #main #content .post.sub .meta a:hover {color:#2f7baa;}
#wrapper #main #content .post.sub .content .post-image-wrapper {float:left;margin:0;padding:0 20px 12px 0;width:180px;}
#wrapper #main #content .post.sub .content .post-image-wrapper .post-image {float:left;margin:0;width:180px;overflow:hidden;}
#wrapper #main #content .post.sub .content .post-image-wrapper .post-image img {width:180px;}
#wrapper #main #content .post.sub .content p {margin:10px 0;font-size:12px;}

#wrapper #main #sidebar {float:left;margin:17px 0 0 0;width:310px;background:#3a3a3a;}
#wrapper #main #sidebar p.title {margin:10px 0;padding:0 0 5px 0;font-size:13px;color:#fff;text-transform:uppercase;border-bottom:1px solid #4e4e4e;}

#wrapper #main #sidebar .section {float:left;margin:10px 10px 0 10px;padding:0 0 12px;width:300px;background:url(images/htf-section-bg.png) no-repeat 50% bottom;}
#wrapper #main #sidebar .section .menu {float:left;width:300px;list-style:none;font-size:12px;}
#wrapper #main #sidebar .section .menu li {float:left;margin:0 2px 0 0;}
#wrapper #main #sidebar .section .menu li a {float:left;display:block;padding:0 0 0 10px;color:#aaa;text-decoration:none;outline:none;}
#wrapper #main #sidebar .section .menu li a span {display:block;padding:7px 10px 7px 0;}
#wrapper #main #sidebar .section .menu li a:hover {color:#fff;}
#wrapper #main #sidebar .section .menu li.active a {background:url(images/htf-tab-a.gif) no-repeat 0 0;color:#418fbf;overflow:hidden;padding:0 0 0 10px;text-decoration:none;white-space:nowrap;width:auto;}
#wrapper #main #sidebar .section .menu li.active a span {padding:7px 10px 7px 0;background:url(images/htf-tab-b.gif) no-repeat right 0;cursor:pointer;display:block;overflow:hidden;}
#wrapper #main #sidebar .section .content {float:left;margin:0;padding:10px;width:270px;background:#fff url(images/htf-tab-content-bg.gif) repeat-x bottom left;}
#wrapper #main #sidebar .section .content .item {float:left;padding:10px 0;width:270px;font-size:12px;border-top:1px solid #ddd;}
#wrapper #main #sidebar .section .content .item:first-child {border:none;}
#wrapper #main #sidebar .section .content .item .date {float:right;margin:0 0 0 20px;color:#999;}
#wrapper #main #sidebar .section .content .item .link a {text-decoration:none;}
#wrapper #main #sidebar .section .content ul {float:left;list-style:none;width:270px;font-size:12px;}
#wrapper #main #sidebar .section .content ul li {padding:10px 0;border-top:1px solid #ddd;}
#wrapper #main #sidebar .section .content ul li:first-child {border:none;}
#wrapper #main #sidebar .section .content ul li a {text-decoration:none;}

#wrapper #main #sidebar .section.other .content p {margin:0;}
#wrapper #main #sidebar .section.other .content p a {color:#aaa;}
#wrapper #main #sidebar .section.other .content p a:hover {color:#fff;}


/* POSTS/PAGES ***/
#wrapper #main #content.page .post {float:left;margin:10px 20px 20px 0;width:580px;}
#wrapper #main #content.page .post h2,
#wrapper #main #content.page h3 {font-size:22px;font-weight:normal;color:#5e181a;}
#wrapper #main #content.page .post .meta {margin:5px 0;font-size:11px;color:#999;}
#wrapper #main #content.page .post .meta a {color:#999;text-decoration:none;}
#wrapper #main #content.page .post .meta a:hover {color:#2f7baa;}
#wrapper #main #content.page .post .content {padding:10px 0;font-size:12px;color:#444;border-bottom:1px solid #ddd;}
#wrapper #main #content.page .post .content h2 {margin:10px 0 0 0;font-size:18px;font-weight:normal;}
#wrapper #main #content.page .post .content .post-image-wrapper {float:right;margin:0 0 10px 20px;padding:0 0 12px 0;width:260px;background:url(images/htf-post-image-bg.png) no-repeat 50% bottom;}
#wrapper #main #content.page .post .content .post-image-wrapper .post-image {float:left;margin:0;width:260px;}
#wrapper #main #content.page .post .content .post-image.small {float:left;margin:10px 10px 10px 0;width:100px;}
#wrapper #main #content.page .post .content .post-image.small img {width:100px;}
#wrapper #main #content.page .post .content p {margin:10px 0;font-size:12px;}
#wrapper #main #content.page .post .content ol,
#wrapper #main #content.page .post .content ul {margin:10px 20px;font-size:12px;color:#444;}
#wrapper #main #content.page.newsarchive .post .content ul {list-style:none;margin:0;}
#wrapper #main #content.page .post .content ol li,
#wrapper #main #content.page .post .content ul li {margin:0 0 10px 0;line-height:1.5;}
#wrapper #main #content.page .post .content blockquote {margin:10px 0;padding:30px;font-size:12px;background:#efefef url(http://www.hightechforum.org/wp-content/uploads/2010/10/pull-quote.gif) no-repeat 0 0;}
#wrapper #main #content.page .post .content img.alignleft {float:left;margin:10px 10px 10px 0;}
#wrapper #main #content.page .post .content img.alignright {float:right;margin:10px 0 10px 10px;}

#wrapper #main #content.page .post .sharecontainer {float:left;margin:10px 0;padding:10px;width:560px;font-size:12px;background:#eee;}
#wrapper #main #content.page .post a.stbar.chicklet img {border:0;height:16px;width:16px;margin-right:3px;vertical-align:middle;}
#wrapper #main #content.page .post a.stbar.chicklet {height:16px;line-height:16px;text-decoration:none;}

#wrapper #main #content.page ol.commentlist {margin:10px 0;width:500px;list-style:none;}
#wrapper #main #content.page ol.commentlist li {margin:0 0 10px 0;padding:10px;width:480px;background:#eee;}
#wrapper #main #content.page ol.commentlist .comment-author {clear:both;width:480px;font-size:14px;}
#wrapper #main #content.page ol.commentlist .comment-author cite {font-style:normal;}
#wrapper #main #content.page ol.commentlist p {margin:10px 0;}

#wrapper #main #content.page #respond {margin:10px 0;width:500px;}
#wrapper #main #content.page #respond p {margin:10px 0;}
#wrapper #main #content.page #respond input {padding:2px;font-size:12px;width:300px;}
#wrapper #main #content.page #respond textarea {padding:2px;font-size:12px;width:500px;}
#wrapper #main #content.page #respond input.btn {margin:0;padding:5px 10px;width:auto;font-size:11px;text-transform:uppercase;color:#fff;background:#61a7ce url(images/htf-btn-bg.gif) repeat-x left bottom;border:none;text-decoration:none;}

#wrapper #main #content.page .post .navigation {clear:both;margin:10px 0;font-size:12px;}
#wrapper #main #content.page .post .navigation .alignleft {float:left;}
#wrapper #main #content.page .post .navigation .alignright {float:right;}

/* FOOTER ********/
#footer-wrap {background:#5E181A;}
#footer-wrap #footer {margin:0 auto;padding:20px 0;width:910px;font-size:12px;color:#fff;text-align:left;}
#footer-wrap #footer a {color:#fff;}