/*
Lookaly
Author: Lee Munroe September 2008
*/


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


/* 
# Colour reference ###################

#e6e8ea Light grey
#A1A2A3 Grey

#025990 Dark blue

#ff9600 Orange
*/
 
/*
# Reset defaults ################### 
*/

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,  
pre, form, fieldset, table, th, td { margin: 0; padding: 0; } 

.clear{clear:both;}

a{text-decoration:none;}

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

#skipto{display:none;}

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

body{font:75%/1.7  Helvetica, Arial,Verdana, sans-serif;color:#2a2a2c;}

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

#top{background-color:#e6e8ea;border-bottom:1px solid #fff;padding:10px 0;text-align:right;height:20px;}

#header{border-top:1px solid #A1A2A3;border-bottom:1px solid #013b60;height:110px;}

#header .container, #signup .container{position:relative;}

#banner{background:url(/images/layout/bannerbg2.jpg) #004b94 no-repeat center bottom;border-bottom:1px solid #388eca;padding:10px 0}

#home #banner{height:259px;background:url(/images/layout/bannerbg.jpg) #004b94 no-repeat center;}

#signup{border-top:1px solid #04395b;padding:10px 0;border-bottom:1px solid #dadadb;text-align:right;}

#content{border-top:1px solid #fff;background:url(/images/layout/mainbg.gif) repeat-x top;border-bottom:1px solid #dadadb;padding-bottom:30px}

.main{width:620px;float:left;margin-right:40px;padding-top:20px;}

#pricing .main{width:100%;float:none;margin:0;}

.sidebar{width:270px;float:left;background:url(/images/layout/sidebarbg.gif) no-repeat top left;padding-left:30px;}

#home .sidebar{background:none;}

#home #content .container, #footer .container{padding-top:20px;}

.block{width:45%;margin-right:10%;float:left;}

#footer{border-top:1px solid #fff;background:url(/images/layout/mainbg.gif) repeat-x top;padding-bottom:20px;}

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

#top ul{float:right;list-style: none;}

#top ul li{display:inline;float:left;display:block;margin-left:10px;}

#top ul li a{color:#646464; font-weight:bold;display:block;float:left;padding-left:10px;background:url(/images/layout/topnav.gif) top left;border:none;}

#top ul li a span{display:block;float:left;padding-right:10px;height:18px;line-height:18px;background:url(/images/layout/topnav.gif) top right;font-size:0.9em}

#top ul li a:hover{background-position:0% -18px;color:#fff;}

#top ul li a:hover span{background-position:100% -18px;color:#fff;cursor:pointer;}

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

#nav li{display:inline;float:left;display:block;margin-left:10px;}

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

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

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

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

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

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

#footernav{list-style:none;}

#footernav li{display:inline;}

#footernav li a{border-bottom:none;border-right:1px solid #A1A2A3;padding:0 5px;}

#footernav li a span{border-bottom:1px solid #025990;}

.sidenav{list-style: none;}

.sidenav li a{display:block;padding:15px 10px 0 20px;height:35px;background:url(/images/layout/sidenav.png) top;border:none;font-weight: bold;}

.sidenav li a:hover{background-position:0 -50px;}

.sidenav li.current a{background-position:0 -100px;color:#fff;}

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

.first{margin-top:0 !important;}

#home h1{color:#fff;font-weight:normal;font-size:3em;}

h1{color:#388ECA;font-size:1.2em;}

h2{color:#fff;font-weight:normal;font-size:3em;}

h3{font-size:1.6em;color:#434343;font-weight: bold;margin:30px 0 10px;}

h4{font-size:1.2em;margin:20px 0 10px;}

h5{font-size:1.3em;color:#434343;font-weight: bold;margin:30px 0 10px;}

#logo{width:317px;height:72px;background:url(/images/layout/logo.gif) no-repeat;margin-top:20px;}

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

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

/*
# Lists ################### 
*/

.last{margin-right:0 !important;}

.features{list-style:none;}

.features li{width:240px;padding-left:60px;background-image:url(/images/layout/features.gif);background-repeat:no-repeat;float:left;margin:0 20px 20px 0;}

.features li.retention{background-position:0 0;}

.features li.support{background-position:0 -400px;}

.features li.reliability{background-position:0 -400px;}

.features li.free{background-position:0 -600px;}

.features li.speed{background-image:url(/images/layout/arrow_blue_down.png); }

.features li.storage{background-image:url(/images/layout/data.png); }


.how{list-style: none;}

.how li{padding-bottom:130px;text-align: center;background-repeat:no-repeat;background-image: url(/images/layout/steps.gif)}

.how li.step1{background-position: center 30px;}

.how li.step2{background-position: center -270px;}

.how li.step3{background-position: center -570px;}

.how li.step4{margin-top:30px;background:transparent;text-align: center;}

.list{margin-left:20px;}

.list li{margin-bottom:10px;}

.blog{list-style:none;}

.blog li{clear:both;}

.blog .date{width:30px;height:33px;float:left;margin-right:10px;background:url(/images/layout/date.gif) no-repeat top left;font-size:0.8em;text-align: center;padding-top:5px}

.blog .title{float:left;width:190px;padding-top:5px;}

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

img{border:none;}

.pimg{float:left;margin:0 10px 2px 0;}


.gimg{border: none;  text-decoration: none;}

.img-left{float:left;margin:0 10px 2px 0;}

.img-right{float:right;margin:0 0px 2px 10px;}

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

a{color:#025990;border-bottom:2px solid #025990;}

a:hover{}

a:hover span{cursor: pointer;}

.buttons{list-style:none;}

.buttons li{display:block;margin:0 10px 10px 0;clear:both;}

.buttons li a{color:#fff; font-weight:bold;display:block;float:left;padding-left:10px;background:url(/images/layout/button.gif) top left;border:none;margin-bottom:10px}

.buttons li a span{display:block;float:left;padding-right:10px;height:27px;padding-top:8px;background:url(/images/layout/button.gif) top right;font-size:1.1em}

.buttons li a:hover{background-position:0% -35px;color:#fff;}

.buttons li a:hover span{background-position:100% -35px;color:#fff;}

.img{border:none;}

#banner a{color:#fff;border-color:#fff;}

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

.frm-hor {margin:10px 0 20px;}

.frm-hor legend{display:none;}

.frm-hor fieldset{border:solid #C8C9CA;border-width:1px 0;background:#fff;padding:20px 10px 0;}

.frm-hor .item{clear:both;margin-bottom:20px;}

.frm-hor .item label{width:140px;float:left;font-weight:bold;}

.frm-hor .item label span{color:#004B94;font-size:1.3em;}

.frm-hor .item .text{padding:5px;border:1px solid #004B94;}

.frm-hor .actions{margin-left:140px;}

.frm-hor .submit{padding:4px;margin-right:10px;}

.frm-login, .frm-login input{font-size:0.9em;}

.frm-login input{margin-right:10px;padding:2px;}

.frm-hor fieldset{margin-bottom:40px;}

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

table{margin-bottom:20px;}
.tbl-pricing{width:100%;text-align: center;}

.tbl-pricing td{vertical-align: top;}

.tbl-pricing thead th{background:url(/images/layout/tbl-top.gif) repeat-x top;height:56px;color:#fff;font-size:1.6em;vertical-align:middle;padding-top:30px;}

.tbl-pricing td{padding:10px;}

.tbl-pricing tbody td{background-color:#ffffec;}

.tbl-pricing .price td{font-weight:bold;color:#ff9600;font-size:1.2em;}

.tbl-pricing .features td{font-size:1.4em;color:#808080;line-height:1.8em;}

.tbl-pricing .features td strong{color:#025990;}

.tbl-pricing th.hl{width:200px;background:url(/images/layout/hl-top.png) no-repeat top;font-size:2.2em;}

.tbl-pricing .price .hl{color:#ffffec;font-size:1.6em;}

.tbl-pricing .features .hl{color:#fff;}

.tbl-pricing tbody td.hl{background:url(/images/layout/hl-bg.gif) repeat-y;}

.tbl-pricing .signup .hl{background:url(/images/layout/hl-bottom.gif) no-repeat bottom;padding-bottom:30px;}

.tbl-settings{clear:both;}

.tbl-settings th{text-align:left;padding-right:30px;;border-bottom:1px solid #E6E8EA;}

.tbl-settings td{padding:3px;border-bottom:1px solid #E6E8EA;}
/*
# Typography ################### 
*/

p{margin:10px 0;}


blockquote{border-left:5px solid #e6e8ea;padding-left:20px;margin-left:10px;font-size:1.6em;margin-top:40px;}

.author{font-style: italic;}

p.signupfree{position:absolute;top:0;left:0;}

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

.right{	float: right;}

.left{	float: left;}

.alignleft{	text-align: left;}

.alignright{	text-align: right;}

.aligncenter{	text-align: center;}

#guy{position:absolute;left:0;top:-130px;}

#home .heading{width:550px;float:right;padding-top:0;}

.heading{padding-top:20px;}

.learn{position:absolute;right:250px;top:20px;}

.relative{position:relative;}

.upgrade,.download, .cancel{margin-top:30px;padding:10px;}

.upgrade h4, .download h4, .cancel h4{margin-top:0;}

.upgrade-button{text-align: right;margin-bottom: 0;}

.upgrade{background:#e4edf9 no-repeat center;border:1px solid #388eca;}

.howpay{background:#e4edf9 no-repeat center;border:1px solid #388eca;padding:0 10px;}

.download{background:#E6E8EB no-repeat center;border:1px solid #A1A2A3;}

.cancel{background:#FFFFCC no-repeat center;border:1px solid #388eca;}

hr{border-width:0;height:1px;background-color:#004B94;margin:40px 0;}

.entry{margin-bottom:70px;}

.entry .date{width:44px;height:44px;float:left;margin-right:10px;background:url(/images/layout/date2.gif) no-repeat top left;font-size:0.8em;text-align: center;padding-top:6px}

.entry .date strong{font-weight: bold;font-size:1.7em;}

.blog .title{float:left;padding-top:5px;}

.postmetadata{background:#e4edf9;border:solid #388eca;border-width:1px 0;padding:3px;clear:both;}

.postmetadata a{border-bottom:0;}

.total{font-size:2.4em;}

.usage-container{height:19px;position:relative;border:1px solid #909090;background:url(/images/layout/usage.gif) repeat-x;}

.usage-indicator{height:17px;position:absolute;top:0;left:0;background:url(/images/layout/usage2.gif) repeat-x;border-top:1px solid #d0dfa3;border-bottom:1px solid #d0dfa3;}

.split{width:45%;margin-right:10%;float:left;}

/*
# Carousel ################### 
*/

.jcarousel-list li{background:url(/images/layout/carousel.png) no-repeat;}

.jcarousel-list li.retention{background-position:0 0;}

.jcarousel-list li.security{background-position:0 -200px;}

.jcarousel-list li.worldwide{background-position:0 -400px;}

.jcarousel-list li.signup{background-position:0 -600px;}

.jcarousel-skin-tango .jcarousel-container {}

.jcarousel-skin-tango .jcarousel-container-horizontal {height:130px;width:450px;padding:0 50px;}

.jcarousel-skin-tango .jcarousel-clip-horizontal {width:450px;height:130px;}

.jcarousel-skin-tango .jcarousel-item {width:350px;padding-left:100px;height:130px;color:#fff;font-size:1.2em}

.jcarousel-skin-tango .jcarousel-item-horizontal {}

.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 43px;
    right: 5px;
    width: 38px;
    height: 38px;
    cursor: pointer;
    background: transparent url(/images/layout/next.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
    background-position: 0 -38px;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
/*     background-position: -64px 0; */
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 43px;
    left: 5px;
    width: 38px;
    height: 38px;
    cursor: pointer;
    background: transparent url(/images/layout/prev.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
    background-position: 0 -38px;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
/*     background-position: -64px 0; */
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}






/*
# Edit ################### 
*/

.error{border:1px solid #cc0000;background-color:#ffcccc;}

.error ul{color:#cc0000;font-weight: bold;margin-left:20px;}

.success{border:1px solid #339900;background-color:#ccffcc;}

.alert{padding:5px 5px 5px 30px;background-position:10px;margin:5px 0;}

.alert p{margin:0;}

.alert.error{background-image:url(images/layout/error.gif);background-repeat: no-repeat;}

.alert.success{background-image:url(images/layout/success.gif);background-repeat: no-repeat;}

.table thead th{background:#025990;color:#fff;text-align: left;font-weight: normal;}
.table tbody th{background:#c2c4c6;text-align: left;}
.table tbody td{background:#e6e8ea;}
.table th, .table td{padding:4px 6px;border-right:1px solid #fff;border-bottom:1px solid #fff;}
.table tr.alt td{background:#d9dce0;}
.table tr.alt th{background: #afb2b6;}
.table caption{text-align: left;font-size: 0.8em;}