body {
  color:#555;
  font-family: Helvetica, "Helvetica Neue", Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: normal;
  text-align:left;
  text-transform: normal;
  letter-spacing: normal;
  line-height: 28px;
  background-color:#fff;
  margin:0px;
  padding:0px;
}

a {
  text-decoration:underline;
  color:#ec497c;
}

a:active {
  color:#000;
}

em {
  font-style:normal;
  color:#9ccd39;
}

h3 {
  color:#3e3e3e;
  font-size:16px;
}

p {
  line-height:22px;
}

p.tall {
  font-size:17px;
  line-height:28px;
}

p.small {
  font-size:12px;
}

img {
  display:block;
}

/* 

*::-moz-selection{
  background:transparent;
}

*::selection {
  background:transparent;
}

*/

/* ------------------------------------------------ */
/*    MAIN CONTAINERS                               */
/* ------------------------------------------------ */

#navigation-container {
  width:100%;
  height:41px;
  background-color:#c7e76c;
  overflow:hidden;
}

#navigation {
  position:relative;
  width:925px;
  height:41px;
  margin:0 auto;
}

#container {
  width:985px;
  margin:0 auto;
}

#header {
  position:relative;
  width:985px;
  background: #fff url(assets/site-bg-top.png) no-repeat bottom center;
  padding-bottom:7px;
}

#content {
  position:relative;
  width:985px;
  background: #fff url(assets/site-bg-mid.png) repeat-y;
}

#footer {
  position:relative;
  width:985px;
  line-height:22px;
  min-height:100px;
  color:#8b8689;
  background: #fff url(assets/site-bg-bot.png) no-repeat bottom center;
  overflow:hidden;
}

body.plans #content #footer {
  position:relative;
  width:985px;
  line-height:22px;
  min-height:100px;
  font-size: 12px !important;
  color:#8b8689;
  background: transparent;
  overflow:hidden;
}

body.plans #content #footer p {
  margin: 0;
  font-size:12px !important;
}

/* ------------------------------------------------ */
/*    NAVIGATION STYLES                             */
/* ------------------------------------------------ */

#navigation ul.left { float:left; }
#navigation ul.left li { margin:0 5px 0 0; }

#navigation ul.right { float:right; }
#navigation ul.right li { margin:0 0 0 5px; }

#navigation > ul li { float:left; height:41px; }

/* widths: 111, 131, 81 .. 122, 85, 85, 85, 74 */

#navigation ul li.tour        {  background: transparent url(assets/navigation-sprites.png) no-repeat -23px   0px;  }
#navigation ul li.plans       {  background: transparent url(assets/navigation-sprites.png) no-repeat -142px  0px;  }
#navigation ul li.signup      {  background: transparent url(assets/navigation-sprites.png) no-repeat -282px  0px;  }
#navigation ul li.manifesto   {  background: transparent url(assets/navigation-sprites.png) no-repeat -498px  0px;  }
#navigation ul li.team        {  background: transparent url(assets/navigation-sprites.png) no-repeat -624px  0px;  }
#navigation ul li.blog        {  background: transparent url(assets/navigation-sprites.png) no-repeat -713px  0px;  }
#navigation ul li.help        {  background: transparent url(assets/navigation-sprites.png) no-repeat -801px  0px;  }
#navigation ul li.signin      {  background: transparent url(assets/navigation-sprites.png) no-repeat -891px  0px;  }

#navigation ul li a { text-indent:-50000px; }

#navigation ul li.tour a      {  display:block; background:none; height:41px; width:111px; }
#navigation ul li.plans a     {  display:block; background:none; height:41px; width:131px; }
#navigation ul li.signup a    {  display:block; background:none; height:41px; width:81px;  }
#navigation ul li.manifesto a {  display:block; background:none; height:41px; width:122px; }
#navigation ul li.team a      {  display:block; background:none; height:41px; width:85px;  }
#navigation ul li.blog a      {  display:block; background:none; height:41px; width:85px;  }
#navigation ul li.help a      {  display:block; background:none; height:41px; width:85px;  }
#navigation ul li.signin a    {  display:block; background:none; height:41px; width:74px;  }

#navigation ul li.tour a:hover      {  background: transparent url(assets/navigation-sprites.png) no-repeat -23px   -41px;  }
#navigation ul li.plans a:hover     {  background: transparent url(assets/navigation-sprites.png) no-repeat -142px  -41px;  }
#navigation ul li.signup a:hover    {  background: transparent url(assets/navigation-sprites.png) no-repeat -282px  -41px;  }
#navigation ul li.manifesto a:hover {  background: transparent url(assets/navigation-sprites.png) no-repeat -498px  -41px;  }
#navigation ul li.team a:hover      {  background: transparent url(assets/navigation-sprites.png) no-repeat -624px  -41px;  }
#navigation ul li.blog a:hover      {  background: transparent url(assets/navigation-sprites.png) no-repeat -713px  -41px;  }
#navigation ul li.help a:hover      {  background: transparent url(assets/navigation-sprites.png) no-repeat -801px  -41px;  }
#navigation ul li.signin a:hover    {  background: transparent url(assets/navigation-sprites.png) no-repeat -891px  -41px;  }

#navigation ul li.tour a:active      {  background: transparent url(assets/navigation-sprites.png) no-repeat -23px   -82px;  }
#navigation ul li.plans a:active     {  background: transparent url(assets/navigation-sprites.png) no-repeat -142px  -82px;  }
#navigation ul li.signup a:active    {  background: transparent url(assets/navigation-sprites.png) no-repeat -282px  -82px;  }
#navigation ul li.manifesto a:active {  background: transparent url(assets/navigation-sprites.png) no-repeat -498px  -82px;  }
#navigation ul li.team a:active      {  background: transparent url(assets/navigation-sprites.png) no-repeat -624px  -82px;  }
#navigation ul li.blog a:active      {  background: transparent url(assets/navigation-sprites.png) no-repeat -713px  -82px;  }
#navigation ul li.help a:active      {  background: transparent url(assets/navigation-sprites.png) no-repeat -801px  -82px;  }
#navigation ul li.signin a:active    {  background: transparent url(assets/navigation-sprites.png) no-repeat -891px  -82px;  }


/* ------------------------------------------------ */
/*    HEADER STYLES                                 */
/* ------------------------------------------------ */


.tour-teaser, .tour-video {
  position:relative;
  width:927px;
  margin:0 auto;
}

.tour-teaser {
  height:248px;
}

.tour-video {
  height:315px;
}

.tour-teaser img, .tour-video img {
  margin:0 auto;
}

#container.tour .tour-video {
  margin-top: 15px;
}

/* ------------------------------------------------ */
/*    CONTENT STYLES                                */
/* ------------------------------------------------ */

.columns {
  position:relative;
  width:884px;
  margin:0 auto;
  padding:20px 0 30px 0;
  overflow:hidden;
}

.columns.one h2 {
  margin:10px 12px 5px 18px;
}

.columns.one:first-child {
  margin-top: 0px;
}

.columns.one {
  margin-top: 30px;
}

.columns.one p {
  position:relative;
  float:left;
  padding:0 22px 0 22px;
  overflow:hidden;
}

.columns.two {
  padding:20px 0;
}

.columns.two .column {
  position:relative;
  float:left;
  width:402px;
  padding:0 20px 0 20px;
  overflow:hidden;
}

.columns.three {
  position:relative;
  width:884px;
  margin:0 auto;
  overflow:hidden;
}

.columns.three .column.dual {
  position:relative;
  float:left;
  width:632px;
  margin:0;
  overflow:hidden;
}

.columns.three .column.sidebar {
  position:relative;
  float:left;
  width:252px;
  margin:0;
  overflow:hidden;
}

.columns.three.teaser {
  width:924px;
  padding:0;
  margin-top: -30px;
}

#container.tour .columns.three.teaser {
  margin-bottom: 15px;
}

.columns.three.teaser .column {
  float:left;
  width:308px;
  padding:0;
}

.columns.three.teaser .column ul {
  margin:0px 0px 0px 12px;
  padding: 10px 0 10px 30px;
  width: 255px;
  background: #e4e4e4;
}

.columns.three.teaser .column ul.white {
  background: #fff;
}

.columns.two .column {
  position:relative;
  float:left;
  width:402px;
  padding:0 20px 0 20px;
  overflow:hidden;
}

.columns.four .column {
  position:relative;
  float:left;
  width:293px;
  margin:0 10px;
  overflow:hidden;
}


.columns.four {
  position:relative;
  width:904px;
  margin:0 auto;
  overflow:hidden;
}

.columns.four .column {
  position:relative;
  float:left;
  width:206px;
  margin:0 10px;
  overflow:hidden;
}

.columns h2 {
  position:relative;
  margin:5px 0 10px 0;
  text-align:center;
}


.feature {
  display:block;
  overflow:hidden;
  margin:0 0 20px 0;
}

.feature > img {
  display:block;
  float:left;
  margin:5px 0 0 5px;
  border: 1px solid #e4e4e4;
}

.feature > p {
  display:block;
  float:right;
  width:320px;
  margin:0 25px 5px 0;
}

/* ------------------------------------------------ */
/*    PLANS STYLES                                  */
/* ------------------------------------------------ */

body.plans {
  background: #fff url(assets/plans-bg.png) repeat-x;
}

body.plans #content {
  width:960px;
  background: none;
  padding-left: 30px;
}


body.plans #content .column.plans {
  position:relative;
  float:left;
  width:670px;
}

body.plans #content .column.plans .header {
  position:relative;
  height:80px;
  text-indent:-5000px;
  background:url(assets/try-freckle-for-free.png) no-repeat;
  overflow:hidden;
  margin: 20px 0 4px 0;
  left:-14px;
}

body.plans #content .column.plans .shoutout {
  position:relative;
  padding:10px 20px;
  margin:5px 30px 5px 0;
  font-size:17px;
  color:#3b3b3b;
  background-color:#ffffdc;
  overflow:hidden;
}

body.plans #content .column.plans .shoutout a {
  color:#3b3b3b;
}

body.plans #content .column.plans .whichplanisright {
  position:relative;
  height:44px;
  margin:40px 30px 5px 0;
  text-indent:-5000px;
  border-bottom:1px solid #cacaca;
  background:url(assets/pick-free-trial.png) no-repeat;
  overflow:hidden;
}

body.plans #content .column.plans .plan {
  position:relative;
  margin:0 30px 0 0;
  padding:10px 5px 13px 20px;
  color:#555;
  border-bottom:1px solid #ededed;
  overflow:hidden;
  -webkit-text-stroke: 0.5px transparent;
}

#tooltip {
  position: absolute;
  width: 380px;
  padding: 10px;
  background: #fff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 0 5px 30px rgba(0,0,0,0.25);
  -moz-box-shadow: 0 5px 30px rgba(0,0,0,0.25);
  box-shadow: 0 5px 30px rgba(0,0,0,0.25);
  font-size: 12px;
  line-height: 15px;
}

body.plans #content .column.plans .plan:hover {
  background-color:#f4fce4;
  color: #444;
}


body.plans #content .column.plans p {
  font-size: 16px;
  margin-right: 25px;
}

body.plans #content .column.plans .plan p {
  font-size:14px;
  line-height:1.2em;
}

body.plans #content .column.plans .plan h3 {
  font-size:20px;
  color:#555;
}

body.plans #content h2 {
  font-size: 18px;
  font-weight: bold;
  -webkit-text-stroke: 0.5px transparent;
}

body.plans #content .column.plans .plan .minutessaved {
  position:absolute;
  top:22px;
  left:200px;
  width:250px;
  font-size: 17px;
  text-align:right;
  font-weight:normal;
  letter-spacing: 1px;
  cursor:pointer;
}

body.plans #content .column.plans .plan .minutessaved span {
  position:relative;
  top:-1px;
  font-weight:normal;
  font-size:10px;
  padding-bottom:1px;
  border-bottom: 1px solid #888;
}

body.plans #content .column.plans .plan a.signup {
  position:absolute;
  display:block;
  top:22px;
  left:490px;
  width:125px;
  height:37px;
  background:url(assets/plans-signup-button.png) no-repeat 0px -41px;
  text-indent:-5000px;
}

body.plans #content .column.plans .plan a.signup:hover,
body.plans #content .column.plans .plan a.signup.selected {
  background:url(assets/plans-signup-button.png) no-repeat 0px -3px;
}

body.plans #content .column.plans .plan.free {
  color:#777;
  padding:20px 5px;
  font-size:14px;
  line-height:1.4em;
}

body.plans #content .column.plans .plan.free:hover {
  background: transparent;
  cursor: auto;
}

body.plans #content .column.plans .plan.free a {
  color:#777;
}

body.plans #content .column.plans .notsureyet {
  display:block;
  margin:30px 30px 20px 0;
  padding:0 0 0 5px;
  clear:both;
  overflow:hidden;
}

body.plans #content .column.plans .notsureyet a {
  color: #555;
}

body.plans #content .column.plans .notsureyet .left {
  float:left;
  width:290px;
  overflow:hidden;
}

body.plans #content .column.plans .notsureyet .right {
  float:right;
  width:345px;
  overflow:hidden;
}

body.plans #content .column.plans .notsureyet ul {
  font-size:13px;
  list-style: inside url(assets/plans-main-listitem.png);
  overflow:hidden;
}

body.plans #content .column.plans .notsureyet ul li {
  margin:0;
  padding:0;
  line-height:24px;
}

body.plans #content .column.plans .howdoesitwork {
  margin:20px 30px 30px 0;
  padding:15px;
  background-color:#f0f0f0;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
}

body.plans #content .column.plans .howdoesitwork p {
  font-size:15px;
  margin-top:1em;
}

body.plans #content .column.plans .howdoesitwork p.first {
  margin-top: 3px;
}

body.plans #content .column.plans .howdoesitwork h3 {
  margin-bottom: 0px;
  margin-top: 10px;
}

body.plans #content .column.plans .howdoesitwork h2 {
  color: rgb(62, 62, 62);
  font-size: 22px;
  margin-bottom: 0px;
}

body.plans #content .column.plans .howdoesitwork ul {
  margin: 15px 0 0 25px;
  list-style: url(assets/plans-sidebar-listitem.png);
}

body.plans #content .column.sidebar {
  position:relative;
  width:290px;
  background:url(assets/plans-sidebar-bg.png) no-repeat;
  overflow:hidden;
}

body.plans #content .column.sidebar .logo {
  position:relative;
  width:290px;
  height:130px;
  text-indent:-5000px;
  background:url(assets/plans-sidebar-logo.png) no-repeat;
  overflow:hidden;
}

body.plans #content .column.sidebar h1.dontforget {
  position:relative;
  width:290px;
  height:60px;
  text-indent:-5000px;
  background:url(assets/plans-sidebar-dontforget.png) no-repeat;
  overflow:hidden;
}

body.plans #content .column.sidebar h2.whatpeoplesay {
  position:relative;
  width:290px;
  height:32px;
  text-indent:-5000px;
  background:url(assets/plans-sidebar-whatpeoplesay.png) no-repeat;
  overflow:hidden;
}

body.plans #content .column.sidebar ul {
  padding:10px 10px 20px 40px;
  color:#676767;
  list-style: inside url(assets/plans-sidebar-listitem.png);
}

body.plans #content .column.sidebar ul li {
  margin:0;
  padding:0;
  line-height:24px;
}

body.plans #content .column.sidebar p.quote {
  padding:5px 10px 10px 40px;
  font-style:italic;
  color:#676767;
}

body.plans #content .column.sidebar p.quote span {
  display:block;
  font-size:13px;
  font-style:normal;
  text-align:right;
}


/* ------------------------------------------------ */
/*    SHOUTOUT STYLES                               */
/* ------------------------------------------------ */

.try-freckle {
  width:875px;
  height:73px;
  background:url(assets/tour-box.png) 0 0 no-repeat;
  z-index:100;
  margin:0 auto;
  position:relative;
  cursor:pointer;
}

.try-freckle:hover {
  background:url(assets/tour-box.png) 0 -73px no-repeat;
}

.try-freckle .perfect-for {
  display:block;
  width:985px;
  z-index:200;
  font-size:14px;
  line-height:1.5;
  float:left;
  margin:13px 0 0 15px;
}

.try-freckle .perfect-for .emphasized {
  font-size:17px;
}

.try-freckle .perfect-for img,
a.tour-link img {
  position:relative;
  display:inline;
  vertical-align:text-bottom; /* baseline/sub/super/top/text-top/middle/bottom/text-bottom/length/%; */
}

.try-freckle .perfect-for img {
  top:-2px;
}

a.tour-link img {
  top:-4px;
}

a.tour-link {
  background:#afedf8;
  padding:5px 15px;
  font-size:18px;
  color:#e3437f;
  font-weight:bold;
  -webkit-border-radius:17px;
  -moz-border-radius:17px;
  position:absolute;
  right:15px;
  top:17px;
}

a.tour-link:hover,
.try-freckle:hover a.tour-link {
  background:#94e8f7;
}

.main-actions {
  position:relative;
  height:80px;
  top:-19px;
  left: 12px;
  margin-bottom:-25px;
}

a.try-link-start,
a.try-link-tour {
  display:block;
  width:974px;
  height:80px;
  text-indent:-5000px;
}

a.try-link-start {
  position:absolute;
  background: transparent url(assets/shoutout-tryfreckle.png) no-repeat;
}

a.try-link-tour {
  background: transparent url(assets/shoutout-tryfreckle.png) no-repeat;
  position:relative;
  left: 12px;
}

.infoline {
  width:927px;
  height:41px;
  margin:20px auto 0 auto;
  text-align:center;
  overflow:hidden;
}

.infoline img {
  display:inline;
}

.infoline span {
  position:relative;
  top:-16px;
}

.infoline.blue {
  color:#1b809a;
  background: #fff url(assets/infolines-bg.png) no-repeat 0px 0px;
}

.infoline.blue a {
  color:#1b809a;
  text-decoration:underline;
}

.infoline.green {
  color:#4f830a;
  background: #fff url(assets/infolines-bg.png) no-repeat 0px -51px;
}

.infoline.green a {
  color:#4f830a;
  text-decoration:underline;
}

.infoline.blue a:active,
.infoline.green a:active {
  color:#555;
}


.quote {
  display:block;
  overflow:hidden;
  margin:0 0 10px 0;
}

.quote .quote-box {
  display:block;
  overflow:hidden;
  background: #fff url(assets/quotebox.png) no-repeat center top;
}

.quote .quote-box span {
  display:block;
  overflow:hidden;
  height:20px;
  background: #fff url(assets/quotebox.png) no-repeat center bottom;
}

.quote .quote-box > p {
  display:block;
  margin:15px 20px 5px 20px;
  font-size:15px;
  line-height:24px;
}

.quote a {
  color:#505050;
}

.quote > img {
  display:block;
  float:left;
  margin:5px 0 0 25px;
}

.quote > p {
  display:block;
  float:right;
  width:173px;
  margin:8px 0 5px 0;
  font-size:13px;
  line-height:20px;
}

/* ------------------------------------------------ */
/*    FOOTER STYLES                                 */
/* ------------------------------------------------ */

#footer a {
  color:#656565;
}

#footer a:active {
  color:#ec497c;
}

#footer a {
  color:#656565;
}

#footer > p {
  margin:0 0 0 50px;
}

#footer ul {
  display:block;
  margin:0;
  padding:0;
  overflow:hidden;
}

#footer ul li {
  display:block;
  margin:0;
  padding:0;
  overflow:hidden;
}


/* ------------------------------------------------ */
/*    HELPER STYLES                                 */
/* ------------------------------------------------ */

ul.blue-dot li {
  margin:0 0 0 20px;
  line-height:23px;
  list-style-image:url(assets/blue-dot.png);
  list-style-type:circle;
  list-style-position: outside;
}

ul.grey-dot li {
  margin:0 0 0 5px;
  line-height: 23px;
  list-style-type: disc;
  list-style-position: outside;
}


#charge_20_or_more {
  border: 1px solid #96c64e;
  padding: 5px 10px 5px 40px;
  background: 10px center no-repeat url(assets/dollar.png);
  font-size: 16px;
  margin: 15px 25px 0 0;
  -webkit-text-stroke: 0.5px transparent;
}

#charge_20_or_more a {
  color: #555;
}



#signin-dialog {
  display: none;
  position: absolute;
  top: 50px;
  margin-left: 176px;
  left: 50%;
  background-color: #75d9eb;
  z-index: 1000;
  width: 312px;
  -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
  -moz-box-shadow:  0px 2px 4px rgba(0, 0, 0, 0.5);
  -o-box-shadow:  0px 2px 4px rgba(0, 0, 0, 0.5);
  box-shadow:  0px 2px 4px rgba(0, 0, 0, 0.5);
  border-radius: 10px;
}
#signin-dialog.visible {
  display: block;
}
.signin.active {
  background: transparent url(http://letsfreckle.com/stylesheets/assets/navigation-sprites.png) no-repeat -891px  -41px !important;
}

#signin-form {
  width: 250px;
  margin-top: 10px;
}

#signin label {
  display: block;
  margin-bottom: -5px;
  width: 200px;
  padding-top: 4px;
  padding-right: 10px;
  color: #0F90A7;
}
#signin input {
  font: 20px/20px 'Lucida Grande', Calibri, Arial;
  margin-top: 5px;
  width: 250px;
  padding: 2px;
  border: 0;
}
#signin {
  background: no-repeat 25px 25px url(http://asset1.letsfreckle.com/images/signin/signin.png);
  height: 190px;
  padding: 70px 30px 100px 30px;
  color: #fff;
}

#signin #submit_arrow {
  cursor: pointer;
  height: 47px;
  left: -13px;
  position: absolute;
  top: 285px;
  width: 300px;
}

#signin .left {
  background: url("https://asset1.letsfreckle.com/images/signin/arrow-left.png") no-repeat scroll 0 0 transparent;
  float: left;
  height: 47px;
  width: 13px;
}
#signin .middle {
  background: repeat-x url(https://asset1.letsfreckle.com/images/signin/arrow-middle.png);
  height: 31px;
  text-transform: uppercase;
  font-family: "American Typewriter", "Constantia", "Verdana", monospace;
  font-weight: normal;
  font-size: 18px;
  line-height: 16px;
  padding-top: 16px;
  padding-left: 30px;
  padding-right: 10px;
  float: left;
}
#signin .right {
  background: no-repeat url(https://asset1.letsfreckle.com/images/signin/arrow-right.png);
  height: 47px;
  width: 26px;
  float: left;
}

fieldset {
  padding-top: 7px;
}

fieldset input {
  width: auto;
}

fieldset label {
  display: inline;
}

