/* Copyright (c) 2004-2010 Pearl Crescent, LLC. */

body { margin: 0px; padding: 0px; max-width: 900px; }
body, td.mainText { font-family: sans-serif; background-color: rgb(255, 255, 255); }
td.mainText { height:350px; }
td.mainText a { text-decoration: none; color: rgb(46, 150, 255); }
td.mainText a:hover { text-decoration: underline; }
td.mainText a[name] { text-decoration: none; color: black; }
td.mainText a:visited { color: rgb(0, 89, 179); }
td.mainText div.centerColumn { float: left; width: 473px; }
td.linkMargin { font-family: sans-serif; background-color: rgb(46, 150, 255);
                width: 160px; vertical-align: top; }
td.footerMargin { font-family: sans-serif; background-color: rgb(46, 150, 255);
                  width: 160px; vertical-align: bottom; }
td.topbar { background-color: rgb(0, 89, 179); text-align: right; }
td { vertical-align: top; }
#navbar { padding: 8px; width: 900px;
          font-weight: bold; font-size: smaller; text-align: center; }
#navbar a { margin: 0 2em; text-decoration: none; color: black; }
#navbar a:hover { text-decoration: underline; }
#navbar a.selected { color: rgb(0, 89, 179); }

.tourbar { padding: 4px 4px 14px 4px;
          font-weight: bold; font-size: smaller; margin: 0px 10px 0px 171px; }
td.mainText .tourbar a { text-decoration: underline; }
.tourbar a { margin: 0 4px; color: black; }
.tourbar .selected { font-weight: bold; margin: 0 4px; color: rgb(0, 89, 179);
                     font-size: 115%; }

table.features { margin-left: auto; margin-right: auto;
                 border-spacing: 0px; border-collapse: collapse; }
table.features td { font-size: 10pt; }
table.features tr.first-row { background-color: rgb(46, 150, 255); }
table.features tr.first-row th { padding: 4px 6px 2px 6px; }
table.features th, table.features td { text-align: center; padding: 3px;
                                       border: 1px solid rgb(96,96,96); }
table.features td.feature-mark { font-weight: bold; vertical-align: middle;
                                 background-color: rgb(255, 255, 224); }
.left { text-align: left !important }
.centered { margin-left: auto; margin-right: auto; }
.nodecoration { text-decoration: none !important; color: black; }

div.dateheader { color: gray; font-size: smaller; font-weight: bold;
                 margin: 2px; }
div.datetext { margin: 3px 3px 15px 20px; }
#layout { border: medium none; width: 900px; text-align: left; }
div.finePrint { font-size: 70%; margin: 5px }
div.linkHeading { font-size: smaller; font-weight: bold;
                  margin: 0px 0px 10px 0px  }
div.marginText { font-size: smaller; }
div.linkText { font-size: smaller; margin: 5px 0px 5px 10px; }
div.linkText a:link { color: black; }
div.linkText a:visited { color: rgb(64, 64, 64); }
div.linkFooter { font-size: smaller; text-align: center; }
div.linkFooter a { margin-right: 20px; }
div.heading { font-weight: bold; margin-bottom: 4px; }
div.contactInfo { margin-top: 5px; margin-left: 20px; }
div.testimonial, div.offer { font-size: smaller; padding: 10px;
                  background-color: rgb(240, 240, 240);
                  border: 1px solid rgb(46, 150, 255); }
div.testimonial { margin: 10px 75px; }
div.offer { margin-left: 40px; border-style: dotted; }

div.productIcon { width: 57px; height: 57px; margin-right: 7px; float: left;
                  background-position: center top;
                  background-repeat: no-repeat; }

div.productIcon.cluetracker { background-image: url("../images/cluetracker-icon.png") }
div.productIcon.pagesaver { background-image: url("../products/pagesaver/images/pagesaver-icon.gif") }

div.actionItem, div.step { margin: 0px 10px 10px 10px; }
.top, .t1, .t2, .t3, .t4 { display: block; overflow: hidden; font-size: 1px; }

.actionItem .t2, .actionItem .t3, .actionItem .t4 {
                  background-color: rgb(255, 255, 224);
                  border-left: 2px solid rgb(46, 150, 255);
                  border-right: 2px solid rgb(46, 150, 255); }
.actionItem .top { background-color: rgb(46, 150, 255); }
.actionItem .t1 {  background-color: rgb(46, 150, 255); }
.actionItem .t4 {  border-left: 3px solid rgb(46, 150, 255);
                   border-right: 3px solid rgb(46, 150, 255); }

.step { width: 165px; position: absolute; left: 0px; }
.step .t2, .step .t3, .step .t4 {
                  background-color: rgb(255, 255, 224);
                  border-left: 2px solid rgb(255, 181, 107);
                  border-right: 2px solid rgb(255, 181, 107); }
.step .top { background-color: rgb(255, 181, 107); }
.step .t1 {  background-color: rgb(255, 181, 107); }
.step .t4 {  border-left: 3px solid rgb(255, 181, 107);
             border-right: 3px solid rgb(255, 181, 107); }
.stepBody { margin-left: 175px; }
.nextStep { padding-left: 18px; font-size: smaller; display: block;
            background-position: 5px; background-repeat: no-repeat;
            background-image: url("../images/small-right-arrow.png"); }

.productad {
      width: 310px;
      position: relative; /* So we can position badges */
      cursor: pointer; }
.productad a { color: black !important; }
.productad .t2, .productad .t3, .productad .t4 {
                  background-color: rgb(168, 212, 255);
                  border-left: 2px solid rgb(46, 150, 255);
                  border-right: 2px solid rgb(46, 150, 255); }
.productad .top { background-color: rgb(46, 150, 255); }
.productad .t1 {  background-color: rgb(46, 150, 255); }
.productad .t4 {  border-left: 3px solid rgb(46, 150, 255);
                  border-right: 3px solid rgb(46, 150, 255); }
.appstore-badge-left {
  position: absolute;
  left: 0px;
  bottom: 0px;
  border-style: none;
}
.appstore-badge {
  position: absolute;
  right: 0px;
  bottom: 0px;
  border-style: none;
}
.getfirefox-badge {
  position: absolute;
  right: 10px;
  bottom: 10px;
  border-style: none;
}
.top { margin: 0px 4px; height: 1px; }
.t1 { margin: 0px 2px; height: 1px; }
.t2 { margin: 0px 1px; height: 1px; border-width: 0px 4px; }
.t3 { margin: 0px 1px; height: 1px; }
.t4 { margin: 0px; }
.actionItem .actionItemBody { border-left: 2px solid rgb(46, 150, 255);
      border-right: 2px solid rgb(46, 150, 255);
      background-color: rgb(255, 255, 224);
      background-repeat: no-repeat;
      background-image: url("../images/right-arrow.png");
      background-position: 5px; }
.stepnumber { float: left; color: rgb(255, 181, 107); margin: 4px;
              font-size: 16pt; font-weight: bold; }
.step .actionItemBody { display: block; vertical-align: middle;
      background-color: rgb(255, 255, 224);
      border-left: 2px solid rgb(255, 181, 107);
      border-right: 2px solid rgb(255, 181, 107); }
.step .description { background-color: white; font-size: smaller;
      padding: 5px; }
.productad .actionItemBody { display: block; vertical-align: middle;
      background-color: rgb(168, 212, 255);
      border-left: 2px solid rgb(46, 150, 255);
      border-right: 2px solid rgb(46, 150, 255); }
.productad .description { background-color: rgb(168, 212, 255);
      padding-bottom: 4px;
      font-size: smaller; height: 94px; margin: 7px 20px 0px 20px; }
.actionItemBody { display: block; cursor: pointer; }
.actionLabel { color: black; 
               margin-left: 22px; padding: 8px 7px; display: block; }
.productadLabel { color: black; font-weight: bold;
                  text-align: center; padding: 4px 4px; display: block; }

div.listExplanation { font-weight: normal; margin: 3px 3px 10px 0px; }
ul.advantages li { font-weight: bold; }
ul.mainlist li { margin-bottom: 5px; }
ul.mainlist ul { padding-left: 25px; margin-top: 3px; }
ul.mainlist ul li { margin-bottom: 0px; }

/* Pages with no sidebar: */
body.nosidebar { margin: 0px; }
body.nosidebar .pagetitle { font-size: 14pt; margin: 6px 0px 0px 20px;
          max-width: 720px;
          width:expression(document.body.clientWidth > 720? "720px": "100%" ); }
body.nosidebar .pageheader { width: 100%; max-width: 740px; border: 0px;
          width:expression(document.body.clientWidth > 740? "740px": "100%" ); }
body.nosidebar .pageoverview { margin-top: 12px; margin-left: 20px;
          max-width: 700px;
          width:expression(document.body.clientWidth > 700? "700px": "auto" ); }
.hoverdecoration a { color: rgb(0, 89, 179); text-decoration: none; }
.hoverdecoration a:hover { text-decoration: underline; }

/* unused */
headerClass { background-color: rgb(255, 255, 255); color: rgb(0, 0, 153); font-weight: bold; }
/* padding/margin: top right bottom left */