/**********************************
*             Css Reset             *
**********************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1;}
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }

/**********************************
*             Generic         old colour 777777  666666  *
**********************************/
html{ height:101%;}
body{ font-family:Arial, sans-serif; font-size:12px; color:#4F5455;  background:#FFFFFF; font-style:normal; font-variant:normal;font-weight:normal; height:101%; padding-bottom:60px;}
body#home{ background:#FFFFFF url(../images/homeBG.jpg) 0px 50px repeat-x; }
body#pages{ background:#FFFFFF url(../images/pagesBG.jpg) 0px 50px repeat-x;}
.cb { clear:both;}
h1, h2, { margin:13px 0px;}
h3{ margin:5px 0px 13px 0px;}
h1{ color:#000000; } h2, h3 { color:#000000; }
h1 {font-size:24px} h2 {font-size:20px} h3 {font-size:13px}
a{ color:#333333; text-decoration:none; cursor:pointer;}
a:hover{text-decoration:underline;}
form fieldset{ -moz-border-radius:2px; -webkit-border-radius:2px;}
form fieldset legend {background-color:#ffffff;  color:#333333; margin:0 0 -15px; padding:5px 7px; font-size:16px; position:relative; -moz-border-radius:3px; -webkit-border-radius:3px;}
.note{ font-size:10px; color:#999999;}
.btn{ cursor:pointer;}

fieldset.frmPart{ padding:10px; border:solid 1px #cbcedd; margin:15px 0px; background:url(../images/elements/fieldset-Bg.jpg);}
fieldset.frmPart .field{ height:32px; margin-bottom:2px;}
fieldset.frmPart .fieldTA{}
fieldset.frmPart .fieldTA textarea{ width:252px;}
fieldset.frmPart .field label, fieldset.frmPart .fieldTA label{ line-height:27px; width:100px; display:block; float:left; font-weight:bold;}
fieldset.frmPart .field input{ }

input.input{border:1px solid #DDDDDD;color:#000000;font-size:12px;padding:8px 5px;width:300px;}


.smallLink{ font-size:10px;}
.flash{ background:#FFFFCC; border:1px solid #CC9933;}
.success{ font-weight:bold;color:#009900 }
a.boxlink{ background:#059545; color:#FFFFFF; padding:1px 2px 1px 2px; text-decoration:none;}
a.boxlink:hover{ background:#FFFFCC; color:#333333;}

/**********************************
*             Menu             *
**********************************/
#menu{ height:50px; background:#333333 url(../images/elements/menu_bg.png) repeat-x;}
#menu ul{list-style:none; list-style-type:none; margin:0 auto; padding:0; position:relative; width:1000px; height:50px;}
#menu ul li{ float:left; display:block; margin:15px 0px 0px 0px;}
#menu ul li a{ color:#FFFFFF; text-decoration:none; padding:5px 10px 0px 10px; display:block; }
#menu ul li a:hover{ background:url(../images/menu/menuBgs.jpg) no-repeat; color:#FFFFFF; display:block;  }
#menu ul li a.selected{ background:transparent; color:#1AA050; }
#menu ul li a.nohov:hover{color:#FFFFFF; background:#333333;}
#menu ul li.logo{ font-size:20px; margin:0px 330px 0 0; padding:0; }
#menu ul li a#m_logo:hover{ background:none; color:#FFFFFF;}
#menu ul li.actions a{ color:#9569C9;}
#menu span.homeLink{ position:absolute; margin:21px auto 0 -270px; left:50%; z-index:1000;}
#menu span.homeLink a{  color:#9569C9;} #menu span.homeLink a:hover{ text-decoration:none;}


#menu ul li a#m_pricing:hover{background-position:0px 0px; padding-bottom:5px;}
#menu ul li a#m_features:hover{ background-position:-150px top; padding-bottom:5px;}
#menu ul li a#m_tour:hover{ background-position:-230px top; padding-bottom:5px;}
#menu ul li a#m_faqs:hover{ background-position:-310px top; padding-bottom:5px;}
#menu ul li a#m_blog:hover{ background-position:-370px top; padding-bottom:5px;}
#menu ul li a#m_signup:hover{ background-position:-430px top; color:#FFFFFF; padding-bottom:5px;}
#menu ul li a#m_login:hover{ background-position:-500px top; color:#FFFFFF; padding-bottom:5px;}
#menu ul li a#m_logo:hover{ background:none;}


/**********************************
*             Main             *
**********************************/
#main {width:1000px;margin:auto; padding:0; }

#actionButton{ width:180px; height:160px; background:transparent url(../images/elements/post-it.png) no-repeat; margin:-22px 0px 0px 0px;  display:block; float:right;z-index:700;}
#actionButton #innerBtn{ height:40px; width:174px; margin:3px;  color:#333333;}
#actionButton #innerBtn a{ display:block; width:174px; padding:65px 0px 0px 15px;}
#actionButton #innerBtn a:hover{ text-decoration:none;}


#featuredTitle{ height:130px; z-index:1001;}
#featuredTitle #title{ width:500px; height:45px; margin:40px 0px 0px 40px;float:left;}
#featuredTitle h1{ font-size:32px;color:#000000;letter-spacing:-1px;line-height:1em;text-align:left; padding:0; font-family:Arial, Helvetica, sans-serif}

.mainCell {background-color:#FFFFFF;font-size:12px; display:block; line-height:16px; width:1000px;}
.mainCell .leftCol {width:640px;float:left;padding-right:20px; padding:0px 20px 20px 20px;  border-right:1px solid #EDEDED;}
.mainCell .shortLeft {height:500px;}
.mainCell.incsubmenu { background:#FFFFFF url(../images/elements/bg_right_col.jpg) no-repeat 680px 0px;}
.mainCell .rightCol {width:319px;float:left; padding-top:0px; }
.mainCell .rightCol .pad{ padding:0 20px;}
.mainCell .leftCol h2{ margin-bottom:20px; line-height:1.2; text-align:left;}


.sub_nav{ list-style:none;  border-top:1px solid #f5f5f5;  border-bottom:1px solid #FFFFFF; margin-bottom:40px;} 
.sub_nav.top{ border-top:none;}
.sub_nav li{ list-style:none; display:block;}
.sub_nav li.sub a{ font-size:12px; padding-left:20px; width:299px; height:25px; line-height:25px; font-weight:normal;}
.sub_nav a{ display:block; text-align:left; padding-left:10px; width:309px; height:35px; border-bottom:1px solid #f5f5f5;line-height:35px; font-size:14px; color:#333333; font-weight:bold;}
.sub_nav a.selected{background:#73489c url(../images/menu/sub_menu_selected.png) repeat-x; color:#FFFFFF; padding-left:20px; margin-left:-10px; height:40px; line-height:40px; font-size:16px; }
.sub_nav a.selected:hover{background:#73489c url(../images/menu/sub_menu_selected.png) repeat-x; color:#FFFFFF;}
.sub_nav a:hover{ text-decoration:none; background:#73489c url(../images/menu/sub_menu_hover.png) repeat-x; color:#FFFFFF;}
.sub_nav a.littleSel{ text-decoration:none; background:#73489c url(../images/menu/sub_menu_selected.png) repeat-x; color:#FFFFFF;}
.sub_nav a.noHover:hover{ background:none; cursor:default;}
.sub_nav a.noHover{ height:15px;}
.sub_nav li a.highlight{ background:#73489c url(../images/menu/sub_menu_hover.png) repeat-x; color:#FFFFFF;}

.morePoints{ padding:10px; width:260px; margin:auto;}
.morePoints li a{ display:block; padding:2px 5px;}
.morePoints strong{ font-size:16px;}
.morePoints ul li ul li{ list-style:disc; margin:3px 0px 0px 30px;}
/* Index page */

#screenShow{ position:absolute; height:295px; width:367px; margin:32px 0 0 501px;}
#screenShow .image{ height:275px;}
#screenShow .controls{ height:20px;}

#feature {background:url(../images/promo/features-file-preview-container.jpg) center no-repeat;padding:0px; height:350px; }
#feature #top{ height:250px; padding:20px 0 0 0; line-height:1.2;/*background:url(../images/promo/textPromo.png) no-repeat;*/}
#feature #top h1{ color:#000000;  position:absolute; font-size:36px; letter-spacing:-1px; text-align:center; margin:13px 0px 0px 0px;  width:500px;}
#feature #top h2{ position:absolute; font-size:20px; margin:120px 0px 0px 0px; color:#333333; width:500px; text-align:center;}
#feature #bot{ height:100px;}
#feature #bot .signupBtn{  display:block; z-index:1002;}
#feature h1 {text-align:left;margin-left:10px}

#underlay{ margin-top:15px; line-height:1.2;}
#underlay #left{ width:600px; float:left;}
#underlay #left .point{ width:285px; padding:5px; float:left; height:70px;}
#underlay #left .point .image{ float:left; width:50px;}
#underlay #left .point .text h3{ margin:0px 0px 5px 0px; padding:0;}
#underlay #left .point .text { margin-top:10px; font-size:13px; margin-left:60px;}
#underlay #right{ width:320px; float:left; margin-left:30px; margin-top:20px; }
#underlay #right .inner{ margin:10px;}
#underlay #right ul{ }
#underlay #right ul li{ margin:5px 0px; font-size:16px;}
#underlay #right ul li div.l{ float:left; width:55px; height:40px;}
#underlay #right ul li div.r{ height:40px; line-height:40px;}
#underlay #skectch{  width:250px; margin:0px 50px 0px 50px; text-align:center;}
#underlay #skectchText{ width:250px; height:50px; margin:5px 50px 0px 50px; }
#underlay #skectchText a{ font-size:16px;}

/* Features Page */
#features .leftCol .imgBox {width:640px;clear:both;text-align:justify;padding-top:30px}
#features .leftCol .imgBox .img {float:left}
#features .leftCol .imgBox .text {float:left; line-height:16px;}
#features .leftCol h2{ text-align:left;}
#features .leftCol .imgBox.imgRight .text {margin-right:20px}

#features .leftCol #whatIsEcofiling .imgBox .img {margin-top:10px;width:70px;}
#features .leftCol #whatIsEcofiling .imgBox .text {width:500px; margin-left:10px;}
#features .leftCol #whatIsEcofiling .imgBox .text p{ margin-bottom:10px;}
#features .leftCol #whatIsEcofiling .imgBox.imgRight .text {width:480px;}

#features .leftCol #mainFeatures .imgBox .img {width:300px;}
#features .leftCol #mainFeatures .imgBox .text {width:320px;}
#features .leftCol #mainFeatures .imgBox.imgRight .text {width:320px;}

#features #fullFeatureList{}
#features #fullFeatureList ul{ margin:5px 0px 5px 15px; }
#features #fullFeatureList ul li{ color:#474747; font-size:16px; font-weight:bold; padding:5px 0px 0px 0px;}
#features #fullFeatureList ul li ul {list-style:disc; display:block; }
#features #fullFeatureList ul li ul li{ color:#4F5455; font-size:12px; font-weight:normal;display:block; margin:2px 0px 2px 10px; padding:3px 0px 3px 15px; background:url(../images/elements/tick_list.png) no-repeat left center;}

#subFeaturePages p{ margin-bottom:30px; line-height:1.5;}
#subFeaturePages ul{ list-style:disc;}
#subFeaturePages ul li{ margin-left:15px;}


/* FAQ page */
.quickFAQs {margin-bottom:30px; font-size:13px;}
.quickFAQs li {padding-bottom:3px}
.quickFAQs span {color:#0066CC;cursor:pointer}
.quickFAQs div { margin-bottom:5px; margin-top:5px;}

/* Sign up page */
#pricing{}
#easySignup { height:250px; width:600px; }


#pricing #plans #right{ float:right; margin-left:40px; width:539px; padding:10px; background:url(../images/elements/pricing_bg_plans.png) no-repeat;}
#pricing #plans #right h1{ text-align:center; font-size:36px; padding:13px 0px 0px 0px; margin:0;}
#pricing #plans #right h2{text-align:center; font-size:24px;}
#pricing #plans #right h3{ text-align:center; font-size:20px; color:#000000;}
#pricing #plans #right #paid{ padding:10px 15px; width:320px; float:left;}
#pricing #plans #right #paid h3{ margin-top:20px;}
#pricing #plans #right #free{ padding:13px 13px 13px 17px; border-left:none; width:150px; float:left; margin-top:40px;}
#pricing #plans #right #paid #promoPrice{ width:300px; margin:auto;}
#pricing #plans #right ul.summary li{ list-style:none; margin:7px auto; display:block; text-align:center;}
#pricing #plans #right #free .summary{ margin:20px 7px 15px 12px;}
#pricing #plans #right #paid .summary{ margin:20px 15px 20px 5px;}
#pricing #plans #right .emph{ padding:2px 2px 2px 0px; color:#9569C9; -moz-border-radius:8px; -webkit-border-radius:8px; font-weight:bold;}

#pricing #plans #left{ padding-top:10px;}
#pricing #plans #left p{ line-height:1.5}

#pricing #plans .inner{ width:300px; margin:auto;}
#pricing #plans #totals{ width:280px; padding-top:5px; margin-top:10px; }
#pricing #plans ul{ margin:5px 13px 20px 20px; list-style:disc; font-size:14px;}
#pricing #plans ul li{list-style:disc;}
#pricing #plans .field{ margin-bottom:4px; line-height:15px; font-size:16px;}
#pricing #plans .field .title{ width:160px; float:left;  font-weight:bold; }
#pricing #plans .field .text{  margin-left:160px;}
#pricing #plans #question{ margin-top:10px; margin-left:5px;}
#pricing #plans #question .left{ float:left; font-size:16px; color:#333333; font-weight:bold; line-height:26px; margin-right:10px;letter-spacing:-1px}
#pricing #plans #question .right{ float:left;}
#pricing #plans .frmPart{ width:280px; margin-bottom:0;}
#pricing #plans #priceImage{ margin-top:0px;}

#pricing #currSelector{}
#pricing #currSelector ul{ list-style:none; margin:5px 0px 5px 0px; padding:0;}
#pricing #currSelector ul li{ list-style:none; float:left; padding:0px 20px 0px 20px; border-left:solid 1px #CCCCCC; height:14px; line-height:14px;}
#pricing #currSelector ul li a{ font-size:11px; color:#CCCCCC;}
#pricing #currSelector ul li a.selected{ color:#62B756;}
#pricing #currSelector ul li.first{ border:0;}


#pricing table#planSummary{ width:100%; font-size:14px; margin:10px 0 0 0;}

#pricing table#planSummary thead{ height:20px;}
#pricing table#planSummary thead td{ background:#62B756;}
#pricing table#planSummary tbody{}
#pricing table#planSummary .left{ width:200px;}
#pricing table#planSummary tr{ border-bottom:solid 1px #f5f5f5;}
#pricing table#planSummary .right{}
#pricing table#planSummary tbody td{  padding:5px;}


#pricing #sidePoints{ font-size:16px; line-height:16px; margin-top:50px;}
#pricing #sidePoints ul{ list-style:none;}
#pricing #sidePoints ul li{ list-style:none; font-size:12px; font-weight:normal; height:40px;  display:block; }
#pricing #sidePoints ul li .icon{ height:40px; width:40px; float:left;}
#pricing #sidePoints ul li .text{ margin-left:50px; line-height:40px;}
#pricing #sidePoints div{ margin:5px 0px 0px 0px;}


#pricing #featuresExplained { margin-top:30px;}
#pricing #featuresExplained ul { padding:0px;}
#pricing #featuresExplained ul li { float:left; display:block; width:300px; margin:0px 19px 10px 0px; height:100px; padding-bottom:15px;}
#pricing #featuresExplained ul li h3{ margin:0px 0px 5px 0px} 
#pricing #currSelect{ }

#tour{ background-position:740px 0;}
#tour .leftCol{ width:700px;}
#tour .rightCol{ width:219px;}
#tour .rightCol .sub_nav a{ width:249px;}
#tour .rightCol .sub_nav .sub a{ width:239px;}
#tour .title{ text-align:center;} 
#tour .title h2{ font-size:28px; margin-bottom:0px;} 
#tour .title h3{ font-size:18px; color:#999999; font-style:oblique; margin-top:6px; font-weight:normal;}
#tour .video{ width:550px; margin:40px auto;}
#tour .video .icon{ height:100px; width:160px; float:left; border:solid 1px #000000;}
#tour .video .text{ color:#999999; margin-left:180px;}
#tour .video .text h3{ color:#666666;}

#media{}
#media table#logos{ width:100%;}
#media table#logos td{ text-align:center; vertical-align:bottom;}
#media .boxlink { background:#FFFFFF; color:#000000;}
#media .boxlink:hover{ text-decoration:underline}
#media .item{ width:45%; float:left; margin-right:20px; height:170px;}
#media .item h2{ border-bottom:solid 1px #666666;}
#media .item ul{}
#media .item  ul li{ margin:5px 0px;}

#media p{ margin-bottom:20px;}


.sidePromo{  margin:5px 20px;}
.sidePromo h3{ color:#666666;  border-bottom:solid 1px #999999; padding-bottom:3px;}

.mainCell #orderSummary div{ padding:3px 3px 3px 0;}
.mainCell #orderSummary div strong{ font-size:13px;}
.mainCell #orderSummary td{ padding:3px 3px 3px 0px;}
.mainCell #orderSummary table { width:100%;}
.mainCell #orderSummary table .left{ text-align:left;}
.mainCell #orderSummary table .right{ text-align:right;}

#free_signup {}
#free_signup .url{ margin-left:65px;}
#free_signup .url .text{ font-weight:bold;}
#free_signup #errors{ margin:0px 0px 0px 14px; list-style:disc;}
#free_signup #errors li{ color:#990000;}

#contact .leftCol{ padding-top:0;}
#contact .fieldTA{ width:300px;}
#contact .field{ width:300px;}
#contact label{ display:inline; line-height:25px; font-weight:bold;}
#contact em{ float:right; line-height:25px; font-size:10px;}
#contact .signupBtn{ margin:10px 0px 0px 0px;}
#contact #txtComment{ height:200px; width:302px;}
#contact #rightNote{ width:200px; margin:200px 0px 0px 380px;  position:absolute;}
#contact label.error{ color:#990000; font-weight:bold; font-size:12px; margin-top:3px;}

#login{}
#login ol{ margin:10px 0px 10px 25px; list-style:upper-alpha;}
#login ul{ margin:5px 0px 5px 10px;}
#login ul li.answer{}
#login ul li.answer span{ font-weight:bold; color:#009900;}
#login #lostForm{}
#login #lostForm #email{ width:250px;}
#login #lostForm #ident{ width:252px;}
#login #lostForm .forgot,#login #lostForm .forgotInst{ display:none;}

#terms{ line-height:1.6;}
#terms ol{ margin-left:20px; list-style:decimal;}

#sitemap { background:#FFFFFF url(../images/elements/siteMapbg.jpg) no-repeat scroll 200px 0;} 
#sitemap #inner{ padding:15px;}

/**********************************
*             Global css         *
**********************************/
#pageList ul{ margin:5px 0px 5px 20px; list-style:disc;}
#pageList a{ font-size:13px;}


/**********************************
*             Error Pages         *
**********************************/
#errorpage{}
#errorpage #error_404{ height:393px; background:url(../images/assest/404Tree.jpg) no-repeat; width:680px;}


/**********************************
*             Sceen Show           *
**********************************/
#facebox { position: absolute; top: 0; left: 0; z-index: 1000; text-align: left; }
#facebox .popup { position: relative; }
#facebox table { border-collapse: collapse; border:#000000 solid 5px; }
#facebox td { border-bottom: 0; padding: 0; }
#facebox .body { padding: 5px; background: #000000; width: 370px; }
#facebox .body .content{ border:0; background:#000000;}
#facebox .loading { text-align: center; }
#facebox .image { text-align: center; }
#facebox img { border: 0; margin: 0; }
#facebox .footer {  padding-top: 10px; clear:both; }
#facebox .footer .close{ float:right; color:#FFFFFF;}
#facebox_overlay { position: fixed; top: 0px; left: 0px; height:100%; width:100%; }
.facebox_hide { z-index:-100; }
.facebox_overlayBG { background-color: #000; z-index: 99; }
* html #facebox_overlay { /* ie6 hack */ position: absolute;  height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

/**********************************
*             Bubble	         *
**********************************/
.bubble {background: transparent; margin:1em;}
.bubble span.s1 {display:block; width:0; height:0; color:#e8e8e8; overflow:hidden;
border-top:12px solid #e8e8e8; border-left:12px dotted transparent; border-right:12px dotted
transparent; margin-left:50px;}

.bubble p{ margin:0; padding:5px;}
.bubble span.s2 {display:block; width:0; height:0; color:#e8e8e8; overflow:hidden;
border-top:10px solid #e8e8e8; border-left:10px dotted transparent; border-right:10px dotted
transparent; margin-left:52px; margin-top:-15px;}
.b1, .b2, .b3, .b4, .b5, .b6, .b7 {display:block; overflow:hidden; font-size:0px;}
.b1, .b2, .b3, .b4, .b5, .b6 {height:1px;}
.b4, .b5, .b6, .b7 {background:#e8e8e8; border-left:1px solid #e8e8e8; border-right:1px solid #e8e8e8;}
.b1 {margin:0 8px; background:#e8e8e8;}
.b2 {margin:0 6px; background:#e8e8e8;}
.b3 {margin:0 4px; background:#e8e8e8;}
.b4 {margin:0 3px; background:#e8e8e8; border-width:0 5px;}
.b5 {margin:0 2px; background:#e8e8e8; border-width:0 4px;}
.b6 {margin:0 2px; background:#e8e8e8; border-width:0 3px;}
.b7 {margin:0 1px; background:#e8e8e8; border-width:0 3px; height:2px;}
.content {display:block; background:#e8e8e8; border:3px solid #e8e8e8; border-width:0 3px;
color: #333333;} 




/**********************************
*             Footer              *
**********************************/
#footer {color:#999999; width:990px;  padding:10px 5px; border-top:solid 2px #CCCCCC; margin:60px auto 40px auto; font-size:11px;
background:#FFFFFF url(../images/elements/bg_right_col.jpg) repeat-x scroll center -300px;border-top:2px solid #F5F5F5;}
#footer ul li {padding:0px;list-style:none;margin:5px 0px 5px 0px;}
#footer ul li a {color:#999999}
#footer ul li.sub a{ font-size:10px; color:#CCCCCC;}
#footer ul li a:hover {color:#c5c5c5}

#footer .column{ width:177px; float:left;}
#footer .column h5{ font-size:12px; margin-bottom:7px;}
#footer .column h5 a{ color:#999999;}
#footer .column .first{ margin-top:0px; margin-bottom:7px;}

#footer .column.large {  width:280px;}
#footer .column.right { text-align:right;}
#footer .column.spacer {  width:160px;}