/*
Theme Name: HubOnline
Theme URI: http://www.hubonline.com.au/
Description: HubOnline Blog Site
Version: 1.0
Author: Abraham Beshara
Tags: Body Pages
*/

/* Helpers
---------- */
.break,
.clear {
clear:both;
}
.right {
float: right;
}
.left {
float: left;
}
img.imageLeft,
img.alignleft {
float: left;
margin: 0 20px 20px 0;
}
img.imageRight,
img.alignright {
float: right;
margin: 0 0 20px 20px;
}
img.centered,
.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
.leftCol {
float: left;
width: 480px;
}
.rightCol {
float: right;
width: 480px;
}
a.button {
display: block;
background-color: transparent;
background-position: top left;
background-repeat: no-repeat;
text-indent: -999em;
}
a.button:hover {
background-position: bottom left;
}


/* Typography
------------- */
body {
font-size: 76%; /* Global font-size */
font-family: Arial, Helvetica, sans-serif;
color: #333;
background-color: #cdcbcb;
}
p  {
font-size: 1.1em;
margin-bottom: 10px;
}
dl,
ul,
ol,
form input, 
form textarea,
form select {
font-size: 1.1em;
font-family: Arial, Helvetica, sans-serif;
}
ul,
ol {
list-style-position: outside;
margin: 0 0 10px 30px;
}
ul.orange {
color: #f4911d;
}
ul.orange li span {
color: #333;
}
a:link,
a:visited {
color: #f5921d;
}
a:hover {
color: #1c335f;
}

h1 {
color: #333;
font-size: 2em;
margin: 30px 0 20px 0;
}
h2 {
color: #1c335f;
font-size: 1.5em;
margin: 20px 0 15px 0;
}
h2.large {
color: #333;
font-size: 2em;
}
h3 {
color: #323232;
font-size: 1.2em;
margin: 0;
}
h4 {
color: #f5921d;
margin: 20px 0 10px 0;
}

/* Structure
------------ */
#wrap {
background: #f5f6f7 url(images/bg_body.gif) top left repeat-x;
padding: 0 0 15px 0;
}
.container {
margin: 0 auto;
width: 980px;
}
#content {
display: inline-block;
width: 100%;
margin: 15px 0 0 0;
background: none;
}
#columns {
margin: 15px 0 0 0;
background: transparent url(images/bg_content_2cols.gif) top right repeat-y;
}
#mainContent {
padding: 25px 25px 25px 0;
width: 644px;
float: left;
}
#columns #mainContent {
padding-top: 0;
margin-top: -15px;
}
#subContent {
padding: 25px 25px;
width: 236px;
float: right;
}
#columns #subContent {
padding-top: 0;
}

/* Hacked in by Ivan */
.rightContentCol {
float: left;
width: 580px;
}
.rightContentCol ul {
list-style-position:inside;
}

/* Header
--------- */
#header {
margin: 0 0 1px 0;
}
#header a#logo img {
float: left;
}

/* Top Stripe
------------- */
#topStrip {
height: 43px;
}
#topStrip p.adminLink {
float: right;
margin: 8px 0 0 0;
}
#topStrip p.adminLink strong {
color: #908f8f;
font-size: 1.6em;
background: transparent url(images/icn_phone.gif) left center no-repeat;
padding: 0 5px 0 15px;
}
#topStrip p.adminLink a {
color: #908f8f;
text-decoration: none;
background: transparent url(images/icn_login_arrow.gif) right center no-repeat;
padding: 0 10px 2px 0;
font-size: 1em;
}
#topStrip p.adminLink a:hover {
color: #f4f4f4;
}

/* Main Menu
------------ */
#nav {
float: right;
}
#nav ul#menu {
list-style: none;
margin: 23px 0 0 0;
}
#nav ul#menu li {
float: left;
}
#nav ul#menu a {
display: inline-block;
text-decoration: none;
margin: 0 0 0 40px;
padding: 10px 0 0 0;
color: #5b5b5b;
}
#nav ul#menu a:hover,
#nav ul#menu a.active {
color: #f38f1d;
background: transparent url(images/icn_mm_hover.gif) left top no-repeat;
}
#nav ul#menu a strong {
display: block;
font-size: 1.2em;
}
#nav ul#menu a em {
font-style: normal;
color: #c0bfbf;
font-size: 1em;
}

/* Banner
--------- */
#banner {
background: transparent url(images/banner_glow.png) top center no-repeat;
height: 108px;
overflow:hidden;
}
#banner ul#bannerAni {
padding: 20px 0 0 0;
margin:0;
list-style: none;
width: 980px;
}
#banner ul#bannerAni li {
width: 980px;
}
#banner ul#bannerAni img {
float: right;
margin: 0;
}
#banner ul#bannerAni p {
color: #fff;
font-style: italic;
margin: 0 200px 0 0;
}

/* Blog Scroller
---------------- */
#rp_frame {
height: 108px;
overflow:hidden;
position: relative;
}
#rp_frame .rp_post {
margin: 15px 55px 0;
}
#rp_frame .rp_post a.rp_nav_thumbnail img {
height: 80px;
float: left;
margin: 0 10px 0 0;
}
#rp_frame .rp_post h2 {
padding: 5px 0 0 0;
margin: 0;
}
#rp_frame .rp_post h2 a {
color: #fff;
text-decoration: none;
margin: 0;
}
#rp_frame .rp_post p {
color: #fff;
font-size: 1em;
}
#rp_frame .rp_post p a.readMore {
color: #1d3260;
}
#rp_nav_left {
position: absolute;
cursor: pointer;
left: 0;
top: 30px;
}
#rp_nav_right {
position: absolute;
cursor: pointer;
right: 0;
top: 30px;
}


/* Footer
--------- */
#footer #specials_tab #specials_icon {
width:154px; 
height: 195px; 
display:block;
position:fixed;
bottom:0;
right:0;
background: url(images/specials.png) no-repeat bottom right;
text-indent:-9000px;
}


#footer {
border-top: 1px solid #c5c3c3;
padding: 40px 0;
}
#footer a#partOfREA {
float: right;
background: transparent url(images/logo_rea_footer.gif) top left no-repeat;
width: 214px;
height: 60px;
display: block;
text-indent: -9999em;
margin: 35px 0 0 0;
}
#footer #footerLinks ul {
list-style: none;
border-bottom: 1px solid #c2c1c1;
width: 495px;
padding: 15px 0;
margin:0;
}
#footer #footerLinks ul.last {
border: none;
margin: 0 0 20px 0;
}
#footer #footerLinks ul li {
display: inline;
}
#footer #footerLinks ul h3 {
color: #666;
font-size: 1.1em;
float:left;
}
#footer #footerLinks ul a {
font-size: 0.9em;
color: #666;
margin: 0 0 0 30px;
text-decoration: none;
}
#footer #footerLinks ul a:hover {
color: #333;
}
#footer p.publisher {
font-size: 0.8em;
color: #666;
margin: 0;
}
/* Standard forms
------------------*/
form {
display: block;
}
legend {
color: #1c335f;
font-size: 1.3em;
font-weight: bold;
}
form fieldset {
margin-bottom: 15px;
padding: 10px 0;
border: none;
}
form ul {
margin: 0;
}
form li {
list-style-type: none;
margin: 0 0 10px 0;
}
form label {
display: block;
float: left;
width: 180px;
margin-right: 10px;
margin-bottom: 5px;
}
form input {
width: 250px;
}
form textarea {
width: 250px;
}
form select {
width: 254px;
}
form input.radio {
width: 30px;
border: none;
}
form fieldset#submit,
form fieldset.submit {
border: none;
padding: 0;
text-align: right;
}
form fieldset#submit input,
form fieldset.submit input,
form input.button {
height: 38px;
width: 122px !important;
background-color: transparent;
background-position: top left;
background-repeat: no-repeat;
color: #fff;
text-indent: -9999em;
padding: 0;
margin: 0;
cursor: pointer;
border: none;
}
form input.button {
background-image: url(images/btn_submit.gif);
}
form fieldset input.submit {
background-image: url(images/btn_submit.gif);
}
form fieldset input.quote {
width: 282px !important;
height: 50px;
background-image: url(images/btn_get_quote.gif);
}
form em span,
form .required {
color: #333;
font-weight: bold;
}
form .error {
padding: 1px;
border: 1px solid #D00000;
background-color: #ffd7d7;
}
form li.specialURL {
display: none !important;
}

/* Sitewide Elements
-------------------- */
a.followTwitter {
display: block;
background: transparent url(images/btn_twitter.gif) top left no-repeat;
width: 207px;
height: 44px;
margin: 30px 0 0 0;
}
#subContent a.followTwitter {
margin: 0;
}
#subContent a.rss {
display: block;
background: transparent url(images/icn_rss.gif) top left no-repeat;
height: 24px;
padding: 10px 0 0 40px;
margin: 0 0 10px 0;
text-decoration: none;
font-size: 1.2em;
}
.orangeArrow {
background: transparent url(images/icn_arrow_right_orange.gif) 0 2px no-repeat;
padding: 0 0 0 22px;
color: #f4911d;
text-decoration: none;
}

/* ===================== */
/* Pages Specifics       */
/* ===================== */

/* Software/Web Design
---------------------- */
.heroContent {
padding-top: 20px;
}
.images {
width: 356px;
margin: 0 20px 0 0;
float:left;
}
.images span {
overflow: auto;
display: block;
}
.images span img {
float: left;
}
a.viewshowcase {
background-image: url(images/btn_viewclients.gif);
width: 272px;
height: 40px;
margin: 10px auto;
clear: both;
}

/* Features Lists */
#featuresList {
background: transparent url(images/bg_features.gif) bottom left no-repeat;
}
#featuresList .featuresListWrap {
background: transparent url(images/bg_features_top.gif) top left no-repeat;
padding: 30px;
}
#featuresList .featuresListWrap #agencyList,
#featuresList .featuresListWrap #professionalList {
float: left;
width: 450px;
}
#featuresList .featuresListWrap #essentialList,
#featuresList .featuresListWrap #starterList {
float: right;
width: 424px;
padding: 0 0 30px 0;
}
#featuresList h2 {
color: #333;
margin: 0;
}
#featuresList .featuresListWrap #agencyList .heightSet {
height: 153px;
}
#featuresList .featuresListWrap #essentialList h2,
#featuresList .featuresListWrap #starterList h2 {
font-size: 1.2em;
margin-top: 20px;
}
#featuresList h3 {
margin: 0 0 10px 5px;
}
#featuresList .featuresListWrap a.hubAgency {
background-image: url(images/btn_hubAgency.gif);
width: 272px;
height: 40px;
margin: 20px 0;
}
#featuresList .featuresListWrap a.hubEssentials {
background-image: url(images/btn_hubEssentials.gif);
width: 272px;
height: 40px;
margin: 20px 0;
}
#featuresList .featuresListWrap ul {
margin-left: 10px;
}
#featuresList .featuresListWrap ul.theList {
list-style: none;
list-style-position: outside;
margin: 0;
padding:0;
}
#featuresList .featuresListWrap ul.theList li {
padding: 8px 5px;
}
#featuresList .featuresListWrap ul.theList li.stripe {
background-color: #f0f0f0;
}
#featuresList .featuresListWrap ul.theList li span {
float: right;
width: 120px;
display: block;
text-align: center;
font-size: 0.9em;
}
#featuresList .featuresListWrap ul.theList li span img {
margin: 0 auto;
}
#featuresList .featuresListWrap a.professionalSite {
background-image: url(images/btn_needprofessional.gif);
width: 272px;
height: 40px;
margin: 20px 0;
float: left;
}
#featuresList .featuresListWrap a.starterSite {
background-image: url(images/btn_needstarter.gif);
width: 272px;
height: 40px;
margin: 20px 0;
float: left;
}
#featuresList .featuresListWrap img.imageLeft {
margin: 15px 0 0 10px;
}
#featuresList .featuresListWrap strong.new {
color: #D00000;
}

/* Support
---------- */
.supportForm {
background: #f0f1f2;
padding: 30px 50px;
height: 325px;
width: 575px;
float:left;
}
.supportForm form fieldset.leftInputs {
float: left;
width: 320px;
}
.supportForm form fieldset.rightInputs {
width: 245px;
float:right;
}
.supportForm form fieldset.leftInputs label {
width: 100px;
}
.supportForm form fieldset.leftInputs input {
width: 190px;
}
.supportForm form fieldset.rightInputs textarea {
width: 240px;
height: 109px;
}
.supportForm form fieldset.rightInputs label {
width: 240px;
margin: 23px 0 12px 0;
}
.supportForm form fieldset.submit {
float:right;
}
/* Blog
------- */
ul.blackList {
list-style: none;
margin: 0 0 40px 0;
}
ul.blackList li {
background: transparent url(images/icn_arrow_right_black.gif) 0 2px no-repeat;
padding: 0 0 0 15px;
}
ul.blackList li a {
color: #333;
text-decoration: none;
}
ul.blackList li a:hover {
color: #f5921d;
}
#content #mainContent .post {
border-bottom: 2px solid #f3860c;
margin: 0 0 30px 0;
padding: 0 0 30px 0;
}
#content #mainContent h2 {
font-size: 1.2em;
}
#content #mainContent h2.postTitle {
margin-bottom: 0;
font-size: 1.5em;
padding:0;
}
#content #mainContent h2.postTitle a {
text-decoration: none;
color: #1c335f;
}
#content #mainContent h2.postTitle a:hover {
color: #f5921d;
}
#content #mainContent p.postDate {
font-size: 0.9em;
}
#content #mainContent .feedback {
background: #f0f1f2;
padding: 4px 5px;
border: 1px solid #e1e1e1;
}
#content #mainContent .wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding: 4px 4px 0 4px;
margin: 10px auto;
}
#content #mainContent .wp-caption img {
display: block;
margin: 0 auto;
padding: 0;
}
#content #mainContent .wp-caption p.wp-caption-text {
font-size: 0.9em;
padding: 4px 0;
margin: 0;
text-align: center;
font-style: italic;
}
/* post */
h1.postTitle {
margin-bottom: 0;
}

/* Comments */
ol#commentlist {
font-style: italic;
}
ol#commentlist li {
background: #f0f1f2;
padding: 4px 5px;
margin: 0 0 5px 0;
border: 1px solid #e1e1e1;
}
ol#commentlist li img {
float: right;
border: 1px solid #e1e1e1;
}
ol#commentlist li p {
margin: 0 40px 10px 0;
font-style: normal;
font-size: 1em;
}
ol#commentlist li .author {
font-style: normal;
font-size: 0.9em;
margin: 0 40px 0 0;
color: #888;
}
.commentsForm {
background: #f0f1f2;
padding: 15px 49px;
margin: 0 0 5px 0;
border: 1px solid #e1e1e1;
}
.commentsForm ul li input {
width: 350px;
}
.commentsForm ul li textarea {
width: 350px;
height: 150px;
}

/* Tweets */
#subContent ul.tweets {
list-style: none;
margin: 20px 0;
}
#subContent ul.tweets li {
margin: 0 0 10px 0;
}
#subContent ul.tweets li a {
color: #333;
}
/* Showcase
----------- */
.showcaseCol {
float: left;
width: 32%;
margin: 0 5px 0 0;
}
.showcaseCol ul {
list-style: none;
margin: 0 0 10px 0;
}

/* Home
------- */
body#home #wrap {
background: #f5f6f7 url(images/bg_body_home.gif) top left repeat-x;
}
body#home #banner {
background: transparent url(images/home_banner_glow.png) top center no-repeat;
height: 351px;
}
body#home #banner ul#bannerAni {
padding: 0;
}
#content {
margin: 0;
padding: 0;
}
/* Main Content */
body#home #mainContent {
float: right;
width: 583px;
margin: 10px 16px 0 0;
padding: 0;
}
body#home #mainContent .leftCol,
body#home #mainContent .rightCol {
width: 275px;
margin: 0 0 20px 0;
}
body#home #mainContent .homeTestimonial {
background-color: #fff;
border: 1px solid #e1e1e1;
padding: 30px 50px 10px 50px;
margin: 0 0 20px 0;
}
body#home #mainContent .homeTestimonial p.maintext {
font-size: 1.9em;
text-align: center;
}
body#home #mainContent .homeTestimonial p.author {
text-align: right;
margin: 0;
font-style: italic;
}
body#home #mainContent .homeVideo {
border: 1px solid #e1e1e1;
padding: 15px;
}
body#home #mainContent .homeVideo a.homeVideoLink {
float: left;
}
body#home #mainContent .homeVideo p {
margin: 70px 0 0 300px;
}
/* Sub Content */
body#home #subContent {
float:left;
width: 364px;
margin: 0;
padding: 0;
}
body#home #subContent .quoteWrap {
background: transparent url(images/bg_home_quote.gif) top left no-repeat;
height: 324px;
width: 284px;
overflow: hidden;
padding: 0 40px;
}
#TB_ajaxContent .quoteWrap {
height: 324px;
width: 284px;
padding: 0 40px;
overflow:hidden;
}
body#home #subContent .quoteWrap form fieldset,
#TB_ajaxContent .quoteWrap form fieldset {
padding-bottom: 0;
margin-bottom: 0;
}
body#home #subContent .quoteWrap form ul,
#TB_ajaxContent .quoteWrap form ul {
margin: 0;
}
body#home #subContent .quoteWrap form li,
#TB_ajaxContent .quoteWrap form li {
margin: 0 0 10px 0;
}
body#home #subContent .quoteWrap form label,
#TB_ajaxContent .quoteWrap form label {
width: 80px;
font-size: 0.9em;
}
body#home #subContent .quoteWrap form label.large,
#TB_ajaxContent .quoteWrap form label.large {
width: 220px;
}
body#home #subContent .quoteWrap form input.radio,
#TB_ajaxContent .quoteWrap form input.radio {
width: 15px;
padding: 0;
marign: 0;
}
body#home #subContent .quoteWrap form li span.labeled,
#TB_ajaxContent .quoteWrap form li span.labeled {
margin: 0 0 0 5px;
}
body#home #subContent .quoteWrap form input,
#TB_ajaxContent .quoteWrap form input {
width: 185px;
font-size: 0.9em;
}
body#home #subContent .quoteWrap form select,
#TB_ajaxContent .quoteWrap form select {
width: 189px;
font-size: 0.9em;
}
a.followTwitterHome {
display: block;
background: transparent url(images/btn_home_twitter.gif) top left no-repeat;
width: 324px;
height: 68px;
margin: 15px auto;
}
body#home #subContent .exports {
background: transparent url(images/bg_home_exports.gif) top left no-repeat;
height: 390px;
width: 284px;
overflow: hidden;
padding: 0 40px;
}
body#home #subContent .exports a.fullList {
display: block;
background: transparent url(images/btn_full_list.gif) top left no-repeat;
width: 282px;
height: 68px;
margin: 5px auto;
}

/* About Us */
#map_canvas {
width: 460px;
height: 300px;
border: 10px solid #dfdfdf;
margin: 20px 0 2px 0;
}
#addresses {
}
#addresses a.address {
color: #333;
background-color:#d5d5d5;
display:block;
margin-bottom:2px;
padding:6px 40px 6px 20px;
text-decoration:none;
background-repeat: no-repeat;
background-position: right center;
background-image: url(/wp-content/themes/hubonline/images/icon_contact.gif);
}
#addresses a.stripe {
background-color:#dfdfdf;
background-image: url(/wp-content/themes/hubonline/images/icon_contact_stripe.gif);
}
#addresses a:hover {
color:#000;
opacity:0.3;
filter:alpha(opacity=30);
}
#addresses p {
padding:24px 20px;
font-size: 1.4em;
font-weight: bold;
text-align: center;
background-color:#CDCBCB;
}



/* Quote Dropdown */
.ui-dropdownchecklist {
height: 17px;
border: 1px solid #7f9db9;
width: 183px;
background: #fff url(/wp-content/themes/hubonline/images/dropdown.gif) no-repeat center right;
font-size: 0.9em;
font-family: Arial, Helvetica, sans-serif;
padding: 0 0 0 4px;
color: #000;
}
.ui-dropdownchecklist-hover, .ui-dropdownchecklist-active {
background-image: url(/wp-content/themes/hubonline/images/dropdown_hover.gif);
border-color: #7f9db9;
}
.ui-dropdownchecklist-text {
height: 17px;
width: 187px;
margin-right: 17px; /* background dropdown.png image */
}
.ui-dropdownchecklist-dropcontainer {
background-color: #fff;
border: 1px solid #a5acb2;
width: 206px;
}
.ui-dropdownchecklist-item {
padding: 0 3px;
margin: 2px 0 0 0;
}
.ui-dropdownchecklist-item-hover {
background-color: #b2b4bf;
}
.ui-dropdownchecklist-item input {
margin: 0 4px 0 0;
}

.sessions {
background-color: #f0f1f2;
padding: 15px;
margin: 10px 0;
}
.sessions h4 {
margin-top: 0;
font-size: 1.2em;
}
.sessions .dateCol {
border-right: 1px solid #ccc;
float: left;
margin: 0 10px 0 0;
padding: 0 10px;
width: 162px;
height: 150px;
font-size: 0.9em;
}
.sessions .dateCol.last {
margin: 0;
padding-right: 0;
border: none;
}
.sessions .dateCol ul {
margin-left: 0;
list-style: none;
}

/* Design Guidelines
-------------------- */
body#designguidelines #content h3,
body#seorequirements #content h3 {
margin: 0 0 10px 0;
}
body#designguidelines #content .guidelinesWrap {
background: #f0f1f2;
padding: 0 29px 10px 29px;
margin: 20px auto 0 auto;
border: 1px solid #e1e1e1;
width: 460px;
}
body#designguidelines #content .guidelinesWrap form li#acceptTerms label {
width: auto;
float: none;
margin:0 0 0 30px;
font-style: italic;
}
body#designguidelines #content .guidelinesWrap form li#acceptTerms input {
float: left;
margin: 2px 0 0 0;
}
body#seorequirementsform #content .seoWrap {
background: #f0f1f2;
padding: 0 29px 10px 29px;
margin: 0 auto 20px auto;
border: 1px solid #e1e1e1;
}
body#seorequirementsform #content .seoWrap form textarea {
height:100px;
}
body#seorequirementsform #content .seoWrap .exampletext {
width:48%;
float:right;
}
body#seorequirementsform #content .seoWrap .exampletext i {
color: #1c335f;
}
body#seorequirementsform #content .seoWrap .charCounter {
width:30px;
margin-top:10px;
}


/* Error 404
------------ */
#content #errorContent ul {
margin: 0 0 20px 0;
list-style-position: inside;
}
#content #errorContent h3 {
text-indent: -20px;
margin: 0 0 10px -20px;
color: #1c335f;
}
#content #errorContent p {
text-indent: -20px;
}
#content #errorContent .content ul {
list-style: none;
margin: 0;
list-style-position: outside;
}
#content #errorContent form input#goog-wm-qt {
padding: 3px;
margin: 0 5px 0 0;
}
#content #errorContent form input#goog-wm-sb {
height: 38px;
width: 122px !important;
background-color: transparent;
background-position: top left;
background-repeat: no-repeat;
color: #fff;
text-indent: -9999em;
padding: 0;
margin: 0;
cursor: pointer;
border: none;
background-image: url(images/btn_submit.gif);
}