/*
SwiftStore Signup Website
Author: Lee Munroe August 2008
*/

/*
################# Colour Ref ####################
#27343c Dark blue
#7199f5 Blue
#d4e2fc Light blue
*/


/* 
################### CSS contents ###################
* 1 Common
* 2 Layout
* 3 Nav
* 4 Headings
* 5 Lists
* 6 Images
* 7 Links
* 8 Forms
* 9 Tables
* 10 Typography 
* 11 Other
*/
 
 
/*
################### Common ################### 
*/

*{
margin:0;
padding:0;
text-decoration:none;
}

.clear{
clear:both;
}

html {
overflow: -moz-scrollbars-vertical;
}

#skipto{
display:none;
}

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/*
################### Layout ################### 
*/

body{
font:72.5%/1.5 Arial, Helvetica, sans-serif;
color:#2a2a2a;
background:url(../images/layout/bg.png) repeat-y center #27343c;
}

.container{
width:960px;
margin:0 auto;
padding:10px;
}

#header{
background:#fff;
}

#header .container.signup{
height:auto;
padding-bottom:10px;
}

#header .container{
position:relative;
height:90px;
}

#banner{
background:url(../images/layout/bannerbg.png) repeat-x top #71adf5;
border-bottom:1px solid #27343c;
}

#banner.banner-home .container{
position:relative;
height:230px;
}

#banner .container div.signup{
float:right;
width:450px;
color:#fff;
}

#content{
border-top:#547183 1px solid;
padding-top:30px;
background:url(../images/layout/mainbg.gif) no-repeat top center;
}

#main{
float:left;
width:630px;
margin-right:30px;
}

#sidebar{
float:left;
width:300px;
}

#footer{
padding-top:40px;
}

#signup{
background:#7199f5;
border-bottom:1px solid #27343c;
}

#login{
width:400px;
margin:0 auto;
}

/*
################### Nav ################### 
*/

#nav{
position:absolute;
bottom:0px;
right:0px;
list-style:none;
}

#nav li{
display:inline;
}

#nav li a{
float:left;
padding-left:20px;
background:url(../images/layout/nav.gif) no-repeat top left;
border:none;
font-weight: bold;
}

#nav li a span{
padding-right:20px;
background:url(../images/layout/nav.gif) no-repeat top right;
display:block;
float:left;
height:23px;
padding-top:10px;
}

#nav li a:hover{
background-position:0% -33px;
cursor: pointer;
color:#fff;
}

#nav li a:hover span{
background-position:100% -33px;
color:#fff;
}

#nav li.current a{
background-position:0% -66px;
}

#nav li.current a span{
background-position:100% -66px;
color:#fff;
}

#subnav{
float:right;
list-style:none;
}

#subnav li{
display:inline;
margin-right:10px;
}

#subnav li a{
padding-left:10px;
border-bottom:0;
}

#subnav li a span{
border-bottom:1px solid #000;
}

#subnav li a:hover span{
border:0;
}

#subnav li.subnav-login a, #subnav li.subnav-signup a{
border-left:1px solid #27343c;
}

#subnav li.subnav-contact a, #subnav li.subnav-faq a,#subnav li.subnav-back a,#subnav li.subnav-rss a{
padding-left:25px;
}

#subnav li.subnav-contact a{
background:url(../images/layout/contact.gif) no-repeat left;
margin-left:20px;
}

#subnav li.subnav-faq a{
background:url(../images/layout/info.gif) no-repeat left;
background-position: 0% -2px;
}

#subnav li.subnav-rss a{
background:url(../images/layout/rss.gif) no-repeat left;
background-position: 0% -2px;
}


#subnav li.subnav-back a{
background:url(../images/layout/back.gif) no-repeat left;
}

#subnav a{
border:0;
}

#subnav a span{
border-bottom:1px solid #27343c;
}

#subnav a:hover span{
border:none;
}

/*
################### Headings ################### 
*/

#logo{
width:384px;
height:82px;
float:left;
background:url(../images/layout/logo.gif) no-repeat;
margin-top:10px;
}

#logo span{
position:absolute;
left:-9999px;
top:-9999px;
}

h1{
font-size:2em;
font-weight: bold;
color:#fff;
}

h2{
font-size:1.8em;
font-weight:normal;
color:#27343c;
margin-bottom:20px;
border-bottom:1px solid #d4e2fc;
}

h3{
font-size:1.4em;
font-weight: bold;
color:#27343c;
margin-bottom:10px;
}

ol h3{
margin-top:20px;
}

/*
################### Lists ################### 
*/
.home-features{
list-style:none;
}

.home-features li{
float:left;
width:300px;
margin-right:30px;
margin-bottom:30px;
}

.home-features li.last{
margin-right:0;
}

.home-features li img{
border:5px solid #d4e2fc;
}

.sidebar-features ul{
margin-left:10px;
list-style:none;
}

.sidebar-features ul li{
padding-left:25px;
background:url(../images/layout/tick.png) no-repeat left top;
margin-bottom:10px;
}

ul.sidebar-customers li{
padding-left:25px;
background:url(../images/layout/arrow.png) no-repeat left top;
margin-bottom:10px;
}

#footer-links{
margin-top:20px;
list-style:none;
}

#footer-links li{
display:inline;
margin-right:10px;
}

#signup ol{
width:580px;
margin:0 auto;
text-align: center;
list-style:none;
}

#signup ol li{
display:block;
width:150px;
height:70px;
margin:0 20px;
float:left;
display:inline;
}

#signup ol li span{
position:absolute;
top:-9999px;
left:-9999px;
}

#signup ol li.signup-1{
background:url(../images/layout/signup1.gif) top no-repeat;
}

#signup ol li.signup-2{
background:url(../images/layout/signup2.gif) top no-repeat;
}

#signup ol li.signup-3{
background:url(../images/layout/signup3.gif) top no-repeat;
}

#signup ol li.selected{
background-position:0% -70px;
}

.themes{
list-style:none;
}

.themes li{
text-align: center;
float:left;
margin:0 10px 20px 10px;
}

.feature ul{
margin-left:10px;
list-style: none;
}

.feature ul li{
padding-left:20px;
background:url(../images/layout/tick.png) no-repeat left;
margin:0 20px 10px 0;
width:250px;
float:left;
}

ol.faq{
margin-left:10px;
margin-bottom:20px;
}

.faq li{
margin-bottom:5px;
margin-left:20px;
}

/*
################### Images ################### 
*/

img{
border:none;
}

.img{
border:none;
}

#banner-image{
position:absolute;
left:0;
bottom:0;
}

.feature-img img{
border:5px solid #d4e2fc;
}

/*
################### Links ################### 
*/

a{
text-decoration:none;
color:#27343c;
border-bottom:1px solid #27343c;
}

a:hover{
border-bottom:none;
}

.home-features li a{
font-weight: bold;
}

#logo a{
display:block;
width:100%;
height:100%;
border:none;
}

#banner-links{
float:right;
padding:10px 0;
}

#banner-links li{
display:inline;
float:left;
}

.banner-plan a{
width:192px;
height:73px;
display:block;
background:url(../images/layout/plan.png) no-repeat;
border:none;
}

.banner-plan a:hover{
cursor: pointer;
background-position:0% -73px;
}

.banner-plan span{
position:absolute;
top:-9999px;
left:-9999px;
}


.banner-signup a{
width:192px;
height:73px;
display:block;
background:url(../images/layout/signup.png) no-repeat;
border:none;
}

.banner-signup a:hover{
cursor: pointer;
background-position:0% -73px;
}

.banner-signup span{
position:absolute;
top:-9999px;
left:-9999px;
}

.banner-more{
margin-right:20px;
padding-top:20px;
}

.banner-more a{
color:#e6fd98;
font-weight: bold;
border-bottom: 2px solid #e6fd98;
font-size: 1.2em;
}

a.cancel{
color:#9F1E00;
border-color:#9F1E00;
}

/*
################### Forms ################### 
*/

fieldset{
border:none;
margin-top:20px;
}

legend{
color:#2a2a2a;
font-weight:bold;
font-size:1.2em;
}

fieldset div{
padding:10px 0;
border:solid #d4e2fc;
border-width:1px 0 0 0;
}

label{
display:block;
float:left;
width:100px;
color:#2a2a2a;
}

.input-text, .input-textarea{
float:left;
margin-right:30px;
border:1px solid #7199f5;
padding:5px;
width:400px;
font-size:1.6em;
}

.input-text-small{
border:1px solid #7199f5;
padding:5px;
width:300px;
font-size:1.6em;
}

.input-textarea{
width:400px;
height:100px;
}

.input-submit{
background:#d4e2fc;
padding:10px;
border-top:2px solid #7199f5;
text-align:right;
}


/*
################### Tables ################### 
*/

#tbl-pricing{
width:100%;
}

#tbl-pricing tbody td, #tbl-pricing tbody th{
padding:10px 20px;
text-align: center;
border:solid #a6bfed;
border-width: 1px 1px 0 0;
}

#tbl-pricing tfoot td{
padding:10px 20px;
text-align: center;
}

#tbl-pricing tbody th.desc{
border-left:1px solid #a6bfed;
}

#tbl-pricing tfoot th{
border-top:1px solid #a6bfed;
padding-bottom:20px;
font-size:1.2em;
}

#tbl-pricing tbody th{
text-align: left;
}

#tbl-pricing thead th{
background:url(../images/layout/th.png) repeat-x top #d4e2fc;
font-size:1.2em;
padding:20px;
}

#tbl-pricing thead th.on{
background:url(../images/layout/thon.gif) no-repeat top #7199f5;
width:200px;
padding:20px 0;
}

#tbl-pricing tfoot th.on{
background:url(../images/layout/thfooton.gif) no-repeat bottom #7199f5;
}

#tbl-pricing .even td{
background:#eff4fc;
}

#tbl-pricing tbody th{
background:#eff4fc;
}

#tbl-pricing tbody .even th{
background:#e2ebfb;
}

#tbl-pricing td.on, #tbl-pricing th.on{
background:#7199f5;
color:#fff;
font-size:1.6em;
}

#tbl-pricing .even .on{
background:#6b93f1;
}


table.table{
width:100%;
}

table.table thead th{
background:#27343c;
padding:2px;
color:#d4e2fc;
text-align:left;
}

table.table td{
padding:4px 4px;
background:#fff;
}

table.table tr.odd td{
background:#d4e2fc;
}

table.table tbody tr:hover td{
background:#bccceb;
}

table.table tfoot td{
text-align:right;
border-top:2px solid #27343c;
}

/*
################### Typography ################### 
*/

p{
margin:10px 0;
}

#banner .container div p{
font-size:1.2em;
}

.txtcenter{
text-align: center;
}

.txtright{
text-align: right;
}

.txtleft{
text-align: left;
}

.home-features li p{
margin:2px 0;
}

blockquote{
text-align: center;
color:#7199f5;
}

blockquote p{
background:url(../images/layout/quotetop.gif) no-repeat top left;
padding:15px 0 0 20px;
display:inline;
}

blockquote p span{
background:url(../images/layout/quotebottom.gif) no-repeat bottom right;
padding:0 20px 15px 0;
font-size:1.4em;
text-align: center;
margin: 0;
}

blockquote .author{
font-size:1em;
display: block;
margin:0;
background:none;
}

#check-address{
color:#4C8700;
}

#footer, #footer a{
color:#777777;
border-color:#777777;
}

/*
################### Other ################### 
*/

.sidebar-features{
background:#d4e2fc;
border:3px solid #7199f5;
padding:10px;
margin-bottom:20px;
}


.sidebar-help{
border:1px solid #d4e2fc;
padding:10px;
background:#d4e2fc;
color:#27343c;
}

.left{
float:left;
}

.fullwidth, #main.fullwidth{
width:auto;
}

.feature{
margin:20px 0;
}

.feature-img{
width:300px;
margin-right:30px;
float:left;
}

.feature-desc{
width:600px;
float:left;
}

.green{
color:#4C8700;
}

.red{
color:red;
}