/* *************** Information ************** */
/*
Text Colour: #4c4b4b
Nav Background Colour: #989898
Footer Colour: #ddd

Free:#93c41e (text: #739a17)
On-Demand:#1686dc (text: #1062a4)
Enterprise:#ffa200 (text: #c37c01)
Hosted:#77200e (text: #470e03)
SiteTagger Blue Dark:#007791;
SiteTagger Blue Light:#09b8c2;
*/

/***** Global Settings *****/
html, body {
margin:0;
padding:0;
}
html{
width:100%;
height:100%;
background:#ddd;
}
body {
/* Set font as 10px - 1em will equal 10px */
font:62.5%/1.25 Arial, Helvetica, sans-serif;
width:100%;
background:#fff url(images/navigation.gif) top repeat-x;
color:#4c4b4b;
line-height:1.4;
float:left;
}
#wrapper{
width:882px;
margin:0 auto;
}
/***** Headings *****/
h1, h2, h3, h4, h5, h6 {
margin:0;
padding:0;
font-weight:normal;
}
h2{
font-size:1.8em;
margin:0 0 14px;
}
/***** Common Formatting *****/
p, ul, ol, li {
margin:0;
padding:0;
}
li{
list-style-type:none;
}
img {
border:0;
}
.free{
color:#739a17;
}
.ondemand{
color:#1062a4;
}
.enterprise{
color:#c37c01;
}
.hosted{
color:#470e03;
}
.small{
font-size:0.6em;
}
#signupbtn{
margin-top:40px;
}
.hide{
display:none;
}
.content p.smallprint{
font-size:0.9em;
margin-top:40px;
}
.extra-padding-bottom{
padding-bottom:160px;
}
.nomargin{
margin:0;
padding:0;
line-height:0;
}
/***** Links *****/
a{
text-decoration:none;
}
a:hover{
text-decoration:underline;
}
#breadcrumbs{
padding-bottom:4px;
}
#breadcrumbs a{
color:#4c4b4b;
}
/* *********************************** Navigation ********************************* */
#navigation{
padding:24px 0 0;
font-size:1.2em;
width:100%;
overflow:hidden;
}
#nav{
width:782px;
float:left;
}
#nav li{
display:inline;
margin-right:28px;
}
#nav li.hide{
display:none;
}
#navigation a{
color:#fff;
}
#login{
width:100px;
float:right;
}
/* *********************************** Banner ********************************* */
#banner{
width:100%;
overflow:hidden;
padding:42px 0;
}
h1{
float:left;
width:250px;
margin:0;
padding:0;
height:49px;
position:relative;
overflow:hidden;
font-size:1.6em;
}
h1 span {
background:url(images/sitetagger-logo.gif) top no-repeat;
position:absolute;
width:100%;
height:100%;
}
h2{
float:left;
width:532px;
padding:22px 0 0;
margin:0;
}
/* *********************************** Content ********************************* */
#content-index{
background:url(images/content-base.jpg) bottom no-repeat;
width:437px;
padding:26px 415px 0 30px;
overflow:hidden;
}
#content-index p{
font-size:1.4em;
margin-bottom:8px;
}
h3 {
font-size:1.8em;
margin-bottom:8px;
}
#products{
margin:30px 0 0 1px;
float:left;
width:435px;
}
#products li{
float:left;
}
#hosted{
width:174px;
background:url(images/sitetagger-hosted.gif) top no-repeat;
height:84px;
padding:28px 60px 0 648px;
}
#hosted p{
font-size:1.2em;
margin-bottom:6px;
}
.content{
background:url(images/content.gif) bottom left no-repeat;
width:822px;
padding:26px 30px 20px;
overflow:hidden;
margin-bottom:42px;
}
.content p{
font-size:1.2em;
margin-bottom:12px;
width:600px;
}
/* ******** content free *********** */
#content-free{
background:url(images/content-free.gif) bottom no-repeat;
}
/* ******** content on-demand *********** */
#content-ondemand{
background:url(images/content-ondemand.gif) bottom no-repeat;
}
/* ******** content enterprise *********** */
#content-enterprise{
background:url(images/content-enterprise.gif) bottom no-repeat;
}
/* ******** content hosted *********** */
#content-hosted{
background:url(images/content-hosted.gif) bottom no-repeat;
}
/* ********************************** footer *********************************** */
#footer{
width:100%;
height:100%;
background:url(images/footer.gif) top repeat-x;
padding:20px 0 0;
overflow:hidden;
margin:20px 0 0;
font-size:1.1em;
}
#footer-content{
width:882px;
margin:0 auto;
}
.footer-nav{
float:left;
width:140px;
}
h4 {
font-size:1.1em;
font-weight:bold;
margin-bottom:8px;
}
#footer a{
color:#4c4b4b;
}
#footer p{
float:right;
}
/* ******************************** Product Comparison *************************** */
table#product-comparison{
border-top:1px solid #c0c0c0;
margin:20px 0;
}
table#product-comparison th{
font-size:1.4em;
color:#fff;
font-weight:normal;
border-bottom:1px solid #c0c0c0;
border-right:1px solid #c0c0c0;
padding:2px 0 0;
height:32px;
}
table#product-comparison th.header{
color:#00a0b2;
font-weight:normal;
text-align:left;
padding:2px 10px 0;
border-left:1px solid #c0c0c0;
background:#fff;
}
table#product-comparison td{
font-size:1.2em;
border-bottom:1px solid #ddd;
border-right:1px solid #ddd;
padding:0;
}
table#product-comparison td.td-feature{
border-left:1px solid #c0c0c0;
padding:0 10px;
}
.th-free{
background:url(images/th-free.gif) top no-repeat;
width:99px;
height:34px;
}
.th-ondemand{
background:url(images/th-ondemand.gif) top no-repeat;
width:99px;
height:34px;
}
.th-enterprise{
background:url(images/th-enterprise.gif) top no-repeat;
width:99px;
height:34px;
}
.th-hosted{
background:url(images/th-hosted.gif) top no-repeat;
width:99px;
height:34px;
}
table#product-comparison td.td-free{
background-color:#f4f9e8;
width:99px;
height:29px;
}
table#product-comparison td.td-ondemand{
background-color:#e7f3fb;
width:99px;
height:29px;
}
table#product-comparison td.td-enterprise{
background-color:#fff6e5;
width:99px;
height:29px;
}
table#product-comparison td.td-hosted{
background-color:#f5efee;
width:99px;
height:29px;
border-right:1px solid #c0c0c0;
}
table#product-comparison td.last{
border-bottom:1px solid #c0c0c0;
}
table#product-comparison td.td-empty{
border:none;
}
table#product-comparison td.td-more{
border:none;
}
table#product-comparison td.border-fix{
border-right:1px solid #77200e;
}
table#product-comparison a{
color:#fff;
}
/* ************************************* Columns ***************************** */
#col-left{
width:496px;
float:left;
}
#col-right{
width:326px;
float:left;
padding-bottom:42px;
}
#col-left h3{
font-size:2.4em;
margin-bottom:30px;
}
#col-right h3{
color:#fff;
font-size:2.4em;
}
#col-left h4{
width:436px;
font-size:1.6em;
margin-bottom:14px;
}
#col-left p{
width:436px;
}
#col-right p{
width:326px;
color:#fff;
}
.content #col-right a{
color:#fff;
text-decoration:underline;
}
#col-right a.black{
color:#000;
}
/* ************************************** Form *************************** */
form{
margin:36px 0 0;
}
input{
border:1px solid #fff;
width:305px;
height:18px;
margin-bottom:12px;
padding:2px 0;
}
.field-name{
background:url(images/field-name.png) top left no-repeat;
padding-left:48px;
width:268px;
}
.field-company{
background:url(images/field-company.png) top left no-repeat;
padding-left:70px;
width:246px;
}
.field-email{
background:url(images/field-email.png) top left no-repeat;
padding-left:48px;
width:268px;
}
.field-website{
background:url(images/field-website.png) top left no-repeat;
padding-left:64px;
width:252px;
}
.field-username{
background:url(images/field-username.png) top left no-repeat;
padding-left:78px;
width:238px;
}
.field-password{
background:url(images/field-password.png) top left no-repeat;
padding-left:78px;
width:238px;
}
.field-confirm{
background:url(images/field-confirm.png) top left no-repeat;
padding-left:132px;
width:184px;
}
input.button{
border:none;
width:103px;
height:25px;
padding:0;
margin-top:20px;
cursor:pointer;
background:url(images/button.png) top no-repeat;
}
#form-errors{
width:316px;
clear:both;
color:#fff;
background:#c00;
margin-top:20px;
font-size:1.4em;
padding-left:4px;
}
/* *********************************** Features List **************************** */
#features{
color:#fff;
font-size:1.2em;
margin:40px 0;
font-weight:bold;
}
#features li{
padding:2px 0 2px 24px;
margin-bottom:14px;
}
.feature-free li{
background:url(images/feature-bullet-free.png) top left no-repeat;
}
.feature-ondemand li{
background:url(images/feature-bullet-ondemand.png) top left no-repeat;
}
.feature-enterprise li{
background:url(images/feature-bullet-enterprise.png) top left no-repeat;
color:#000;
}
.feature-hosted li{
background:url(images/feature-bullet-hosted.png) top left no-repeat;
}
/* ******************************* Products Page ******************************* */
.content-products{
padding-bottom:20px;
}
.h3-short{
width:500px;
float:left;
margin-bottom:20px;
}
#key{
float:right;
width:172px;
padding-top:6px;
}
#key p{
margin:0;
padding:0;
}
.product-feature{
width:822px;
border-bottom:1px solid #ccc;
border-top:1px solid #ccc;
padding:14px 0 0;
float:left;
overflow:hidden;
margin:-1px 0 0;
}
.product-feature .screenshot{
float:left;
margin-right:18px;
width:201px;
}
.product-feature-text{
float:left;
width:602px;
padding:10px 0 0;
}
.product-feature-text h4{
font-size:1.4em;
}
.product-feature-ticks{
width:822px;
margin:0;
padding:0;
clear:both;
float:left;
height:21px;
}
.product-feature-ticks li{
float:right;
margin:0 0 0 1px;
}
.product-free, .product-ondemand, .product-enterprise, .product-hosted{
float:left;
overflow:hidden;
border:1px solid #ccc;
color:#4c4b4b;
width:620px;
padding:0 0 6px 204px;
margin-bottom:14px;
margin-top:20px;
}
.product-free{
background:url(images/products-gradient-free.gif) top left no-repeat;
}
.product-ondemand{
background:url(images/products-gradient-ondemand.gif) top left no-repeat;
}
.product-enterprise{
background:url(images/products-gradient-enterprise.gif) top left no-repeat;
}
.product-hosted{
background:url(images/products-gradient-hosted.gif) top left no-repeat;
}
.product-free h4, .product-ondemand h4, .product-enterprise h4, .product-hosted h4{
font-size:2.4em;
font-weight:normal;
margin-top:4px;
color:#4c4b4b;
}
.product-free a, .product-ondemand a, .product-enterprise a, .product-hosted a{
text-decoration:underline;
font-weight:bold;
}
.product-free a{
color:#739a17;
}
.product-ondemand a{
color:#1062a4;
}
.product-enterprise a{
color:#c37c01;
}
.product-hosted a{
color:#470e03;
}
/* ***************************** Contact ****************************** */
#content-contact{
background:url(images/content-contact.gif) bottom no-repeat;
}
#content-contact p{
font-size:1.4em;
}
#content-contact a{
color:#4c4b4b;
text-decoration:underline;
}
#contact-form{}
#contact-form textarea{
border:1px solid #fff;
width:240px;
height:140px;
padding:2px 0;
background:url(images/textarea.png) top left no-repeat;
padding-left:76px;
margin-bottom:10px;
}
#contact-details{
margin-top:34px;
}
/* ********************************** Benefits ******************************** */
#benefits{
width:100%;
clear:both;
padding:30px 0 10px;
float:left;
margin-bottom:20px;
}
.benefit{
width:411px;
float:left;
height:125px;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
margin-top:-1px;
}
.benefit img{
float:left;
}
.benefit-text{
float:left;
width:300px;
}
.benefit-text p{
width:300px;
}
.benefit h4{
font-size:1.4em;
margin:22px 0 0;
}
p.calltoaction{
font-size:1.6em;
padding-bottom:12px;
}
p.calltoaction a{
color:#4c4b4b;
text-decoration:underline;
}
/* ******************************** Log In Form **************************** */
#panel {
width:100%;
position: relative;
top: 4px;
height: 0px;
margin-left: auto;
margin-right: auto;
z-index:999;
overflow: hidden;
text-align: left;
float:left;
background:url(images/login-form.gif) top left repeat-x;
color:#fff;
}
#panel a{
color:#fff;
}
#login-form{
margin:10px 0 0 10px;
width:842px;
float:left;
background:url(images/login-form-back.png) top left repeat-x;
padding:10px;
}
#login-form label{
color:#fff;
margin:0 4px 0 0;
font-size:1.2em;
font-weight:bold;
}
#login-form input{
width:140px;
height:16px;
padding:2px 0;
border:1px solid #ccc;
margin:0 10px 0 0;
}
#login-form input#login_btn{
border:none;
width:103px;
height:25px;
padding:0;
cursor:pointer;
background:url(images/button.png) top no-repeat;
}
#panel p{
color:#fff;
font-size:1.4em;
margin:20px 0 0 20px;
}
#hide_button{
display: none;
font-size:1.4em;
float:left;
width:20px;
position:absolute;
top:6px;
right:6px;
}
#hide_button a{
text-decoration:underline;
}
/* ********************************** Privacy Policy ****************************** */
.privacy{
padding-bottom:120px;
}
/* ********************************** Site Map ****************************** */
.content-sitemap{
padding-bottom:120px;
}
#sitemap, #sitemap ul, #sitemap li{
margin:0;
padding:0;
list-style:none;
}
#sitemap{
margin-top:20px;
font-size:1.2em;
}
#sitemap a{
color:#4c4b4b;
}
#sitemap ul{
display:none;
}
#sitemap li{
line-height:200%;
margin-top:1px;
position:relative;
width:100%;
}
/* IE leaves a blank space where span is added so this is to avoid that */
* html #sitemap li{
float:left;
display:inline;
}

#sitemap li a{padding-left:28px;}
#sitemap li span{float:left;position:absolute;top:5px;left:5px;width:13px;height:13px;cursor:auto;font-size:0;}
#sitemap li span, #sitemap li span.collapsed{
background:url(images/collapsed.gif) no-repeat 0 0;
cursor:pointer;
} 
#sitemap li span.expanded{
background:url(images/expanded.gif) no-repeat 0 0;
cursor:pointer;
}

/* second level */
#sitemap li li{}
#sitemap li li a{padding-left:56px;}
#sitemap li li span{left:28px;}

/* third level */
#sitemap li li li a{padding-left:84px;}
#sitemap li li li span{left:56px;}