/*=====================================================================
* Filename: main.css
* Template: News360
* Author: Jarel Remick - http://www.jremick.com
* Date Created: 11/03/2008
* Media: Screen
*
* Description
* -----------
* CSS Reset using "reset.css" from 960 framework package, derived from Eric Meyers.
=====================================================================*/
 
@import "reset.css";

/* ===== GLOBAL ===== */
.center { margin: 0 auto; }
.tcenter { text-align: center; }

.fl { float: left; }
img.fl { float: left; margin: 10px 10px 10px 0; }
.column p img.fl,
#sidebar .smallbox p img.fl { float: left; margin: 0 8px 2px 0; }

.fr { float: right; }
img.fr { float: right; margin: 10px 0 10px 10px; }
.column p img.fr,
#sidebar .smallbox p img.fr { float: right; margin: 0 0 2px 8px; }

.clear { clear: both; }
.cr { clear: right; }
.cl { clear: left; }

h1.title, h2.title,
h3.title, h4.title,
h6.date { border-bottom: solid 1px #dfdfdf; padding: 8px 15px; }

p { margin: 10px 0; padding: 0 15px; }
.column p { margin: 10px 0; padding: 0 8px; }

/* Use this instead of html hr tag */
#wrapper span.hr { width: 100%; height: 1px; display: block; border-top: solid 1px #ccc; margin: 12px 0; }

/* ===== LAYOUT ===== */
body { background: #dadada; }

/* Header */
#header { width: 100%; height: 183px; background: #fff; margin-bottom: 15px; text-align: left; }
#header .container { height: 150px; }
#header .logo { position: absolute; top: 25px; left: 35px; clear: right; }
#header .tagline { position: absolute; top: 123px; left: 80px; }
#header .search { position: absolute; top: 120px; right: 30px; }
#header .panel { position: absolute; top: 0; right: 45px; width: 502px; clear: left; z-index: 25; }
#header .panel_container { background: url(../images/layout/panel-bg.gif) no-repeat bottom; }
#header .panel_content { height: 93px; overflow: hidden; }
#header .panel_button { cursor: pointer; float: right; position: relative; top: -12px; right: -4px; }
#header .featured { width: 468px; height: 60px; position: relative; top: 15px; left: 15px; border: solid 1px #ccc; background: #fff; }
#header .advert { width: 468px; height: 60px; position: relative; top: 15px; left: 15px; border: solid 1px #ccc; background: #fff; }

#wrapper { width: 960px; margin: 0 auto; position: relative; }

/* Content (main content area) */
#content { width: 600px; float: left; }
#content .smallbox p { padding: 0 10px; }
#content .box { margin-bottom: 10px; background: #fff url(../images/layout/content-boxtop.jpg) no-repeat top; }
#content .container { padding: 10px 15px; background: url(../images/layout/content-boxbottom.jpg) no-repeat bottom; clear: both; }
#content .featured { background: #f6f6f6; padding: 0px 15px 6px 15px; }

#content .column { width: 285px; float: left; margin: 10px 0; }
#content .column .smallbox { border: solid 1px #ccc; margin-bottom: 10px; position: relative; }
#content .column .smallbox img.top { position: absolute; top: -1px; left: -1px; }
#content .column .smallbox img.bottom { position: absolute; bottom: -1px; left: -1px; }

#content .column ul { margin: 10px 0 0 8px; }
#content ul { margin: 12px 0 0 25px; }
#content ul li { background: url(../images/layout/bullet.gif) no-repeat 0 6px; padding-left: 8px; }
#content .caption { padding: 0 12px 8px 12px; }

/* Sidebar */
#sidebar { width: 345px; float: right; }
#sidebar .box { margin-bottom: 10px; background: #fff url(../images/layout/sidebar-boxtop.jpg) no-repeat top; }
#sidebar .container { padding: 9px; background: url(../images/layout/sidebar-boxbottom.jpg) no-repeat bottom; }

#sidebar .smallbox { border: solid 1px #ccc; position: relative; }
#sidebar .smallbox img.top { position: absolute; top: -1px; left: -1px; }
#sidebar .smallbox img.bottom { position: absolute; bottom: -1px; left: -1px; }

#sidebar a img.advert { cursor: pointer; }
#sidebar .advert125 { background: #f6f6f6; border: solid 1px #ccc; padding-top: 15px; margin: 5px; }
#sidebar .advert125 a img { margin-bottom: 15px; }
#sidebar .advert125 a img.first { margin-right: 20px; }

/* Footer */
#footer { margin: 0 auto; clear: both; }
#footer .container { padding: 15px 25px 25px 25px; }

/* Affiliate Lists/Tables */
#affiliates { border: solid 1px #ccc; text-align: left; }
#affiliates ul { margin: 0; }
#affiliates ul li { list-style: none; background: #f6f6f6; padding: 12px 7px; border-bottom: solid 1px #ccc; margin-top: -2px; }
#affiliates ul li:hover { background: #fff; }
#affiliates ul li span { width: 275px; display: inline-block; }
#affiliates ul li.first { margin-top: 0; }
#affiliates ul li.last { border: none; }

/* Listings Lists/Tables */
#listings { border: solid 1px #ccc; text-align: left; }
#listings ul { margin: 0; }
#listings ul li { height: 126px; list-style: none; background: #f6f6f6; padding: 3px; border-bottom: solid 1px #ccc; margin-top: -2px; }
#listings ul li:hover { background: #fff; }
#listings ul li.first { margin-top: 0; }
#listings ul li.last { border: none; }
#listings ul li .thumb { width: 125px; height: 125px; float: left; margin-right: 25px; background: #000; }
#listings ul li .info { float: left; margin: 20px 0; }
#listings ul li .name { font-size: 1.1em; }

/* Photo Gallery Image Styles */
#content .photo-link { padding: 3px; margin: 5px 3px; border: 1px solid #999; display: inline; width: 100px; float: left; }
#content .photo-link:hover { border-color: white; }

/* Image Fade Box */
#content ul.imagefade { margin: 0 0 5px 0; }
#content ul.imagefade li { list-style: none; background: none; padding: 0; }
#content ul.imagefade li a { cursor: pointer; }

#sidebar ul.imagefade { margin: 0 0 5px 0; position: relative; top: 0; left: 0; height: 200px; width: 325px; }
#sidebar ul.imagefade li { list-style: none; background: none; position: absolute; top: 0; left: 0; }
#sidebar ul.imagefade li a { cursor: pointer; }

/* ===== TABS ===== */
#tabs p { margin: 0; padding: 6px 9px; }
#contenttabs p { margin: 0; padding: 12px 9px; }
#tabs .ui-tabs-nav { padding-left: 3px; font-size: .9em; }
#contenttabs .ui-tabs-nav { font-size: .9em; }
#tabs .ui-tabs-nav li,
#contenttabs .ui-tabs-nav li { float: left; margin-right: 5px;  margin-bottom: -1px; list-style: none; background: none; padding: 0; }
#tabs .ui-tabs-nav li a,
#contenttabs .ui-tabs-nav li a { cursor: pointer; display: block; text-decoration: none; padding: 4px 0px 5px 10px; color: #999; font-weight: normal; }
#tabs .ui-tabs-nav li a:hover,
#contenttabs .ui-tabs-nav li a:hover { color: #ca0002; text-decoration: none; }
#tabs .ui-tabs-nav li.ui-tabs-selected,
#contenttabs .ui-tabs-nav li.ui-tabs-selected { border: solid 1px #ccc; border-bottom: 0; padding-right: 10px; margin-left: 10px; background: url(../images/layout/tab-bg.gif) repeat-x; }
#tabs .ui-tabs-nav li.ui-tabs-selected a,
#contenttabs .ui-tabs-nav li.ui-tabs-selected a { color: #00429d; font-weight: bold; }
#tabs .ui-tabs-nav li.ui-tabs-selected a:hover,
#contenttabs .ui-tabs-nav li.ui-tabs-selected a:hover { border: none; }
#tabs .ui-tabs-hide,
#contenttabs .ui-tabs-hide { display: none; }
#tabs .ui-tabs-panel,
#contenttabs .ui-tabs-panel { clear: both; }
#contenttabs .ui-tabs-panel p { margin: 5px 0; }
#tabs .ui-tabs-panel .round-small { margin: 0; }
#tabs .ui-tabs-panel .wrap { padding: 8px; }

#sidebar #tabs .smallbox ul { margin: 10px 8px; text-align: left; }
#sidebar #tabs .smallbox ul li { background: url(../images/layout/bullet.gif) no-repeat 0 6px; padding-left: 8px; }

/* ===== FONTS ===== */
body { font-family: Arial, Helvetica, sans-serif; font-size: .9em; color: #212121; text-align: center; }
p { font-size: .9em; line-height: 1.40em; font-family: Arial, Helvetica, sans-serif; text-align: left; }
a { color: #00429d; text-decoration: none; }
a:hover { color: #ca0002; text-decoration: underline; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; color: #000; text-align: left; font-weight: bold; }
h1 { font-size: 1.6em; }
h2 { font-size: 1.4em; }
h3 { font-size: 1.2em; }
h4 { font-size: 1em; }
h6 { font-size: .76em; color: #949494; line-height: 1.3em; }

#header .tagline { font-size: .9em; letter-spacing: .06em; font-style: italic; color: #666; }
#header .panel_button { font-size: .9em; }

#content .featured h1,
#content .featured h2,
#content .featured h3,
#content .featured h4 { color: #00429d; }
#content .smallbox p { font-size: .8em; }
#content .caption { font-size: .75em; color: #999; text-align: left; }
#content ul { text-align: left; font-size: .85em; line-height: 1.4em; }
#content ul li { margin-bottom: 2px; }
#content ul li a { font-weight: bold; color: #00429d; text-decoration: none; }
#content ul li a:hover { color: #ca0002; }

#sidebar .smallbox p { font-size: .8em; }
#sidebar .smallbox ul { font-size: .85em; line-height: 1.4em; }
#sidebar .smallbox ul li a { font-weight: bold; color: #00429d; text-decoration: none; }
#sidebar .smallbox ul li a:hover { color: #ca0002; }

#footer { text-align: right; }
#footer .legal { font-size: .75em; color: #717171; line-height: 22px; letter-spacing: .04em; }
#footer .legal a { color: #004276; text-decoration: underline; }
#footer .legal a:hover { color: #cc0002; text-decoration: none; }
