html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
pre, a, abbr, acronym, address, code, del, dfn, em, img,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline; }

body {
  line-height: 1.5; }

blockquote, q {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
  quotes: "" ""; }
  blockquote:before,
  blockquote:after,   q:before,
  q:after {
    content: ""; }

th, td, caption {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

table {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle; }

a img {
  border: none; }

body {
  height: 100%;
  position: relative;
  font-family: helvetica, arial, sans-serif;
  font-size: 14px;
  background: #f2f2f2 url('../../images/body_bg.png') repeat-x left top;
  color: black;
  padding: 0 10px 40px; }

* {
  text-shadow: rgba(0, 0, 0, 0.01) 0 0 0; }

a {
  color: #84000f;
  outline: none; }
  a.negative {
    color: #d7000a; }
  a.disabled {
    color: !grey;
    text-decoration: none;
    cursor: default; }
  a:hover {
    text-decoration: none; }

h2 {
  font-size: 22px;
  margin: 0 0 1em;
  font-weight: bold; }

h3 {
  font-size: 20px;
  margin: 0 0 0.66em;
  color: #404040; }
  h3 strong {
    color: black; }

p {
  color: #404040; }
  p.more {
    margin: 0 0 10px; }
  p.pagination {
    overflow: hidden; }
    p.pagination a {
      font-weight: bold;
      text-decoration: none;
      display: block;
      padding: 0 10px;
      height: 22px;
      line-height: 22px;
      border-radius: 3px;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      border: 1px solid #efefef;
      border-right: 1px solid #dfdfdf;
      border-bottom: 1px solid #dfdfdf; }
      p.pagination a:hover {
        background: #d77f89; }
      p.pagination a b {
        display: block; }
      p.pagination a.previous {
        float: left; }
        p.pagination a.previous b {
          float: left;
          border: 5px solid transparent;
          border-left: none;
          border-right: 8px solid silver;
          margin: 5px 5px 0 0; }
      p.pagination a.next {
        float: right; }
        p.pagination a.next b {
          float: right;
          border: 5px solid transparent;
          border-right: none;
          border-left: 8px solid silver;
          margin: 5px 0 0 5px; }

label {
  color: gray; }

input, select, textarea {
  font-family: helvetica, arial, sans-serif;
  font-size: 12px; }

em {
  font-style: oblique; }

hr {
  height: 0;
  border: none;
  border-top: 1px solid silver;
  margin: 0 0 1.5em; }

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

html[xmlns] .clearfix {
  display: block; }

* html .clearfix {
  height: 1%; }

#cards_controller.real_card {
  padding: 0; }
  #cards_controller.real_card #preview_controls {
    border-bottom: 1px solid gray;
    background: #d9d9d9 url('../../images/card_preview_controls_bg.png') repeat-x top left;
    overflow: hidden;
    text-align: center;
    height: 74px; }
    #cards_controller.real_card #preview_controls div.page_width {
      overflow: hidden;
      width: 950px; }
    #cards_controller.real_card #preview_controls h1 {
      float: left;
      padding: 35px 15px 0 0;
      border-right: 1px solid #dfdfdf;
      position: relative;
      top: -13px; }
      #cards_controller.real_card #preview_controls h1 a {
        font-size: 32px;
        letter-spacing: -2px;
        line-height: 1;
        font-weight: bold;
        color: black;
        text-decoration: none; }
        #cards_controller.real_card #preview_controls h1 a:hover {
          color: #b00015; }
        #cards_controller.real_card #preview_controls h1 a img {
          height: 29px;
          display: block;
          float: left;
          margin-right: 5px; }
    #cards_controller.real_card #preview_controls div.tweet_preview {
      display: block;
      float: left;
      padding: 10px 15px 0;
      border-right: 1px solid #dfdfdf; }
      #cards_controller.real_card #preview_controls div.tweet_preview label {
        display: block;
        clear: right;
        font-size: 14px;
        color: #404040;
        line-height: 1;
        text-align: left;
        margin: 0 0 3px; }
      #cards_controller.real_card #preview_controls div.tweet_preview textarea {
        width: 460px;
        padding: 3px;
        height: 30px;
        border: 1px solid #e5e5e5;
        border-top: 1px solid #bfbfbf;
        border-left: 1px solid #bfbfbf;
        background: white;
        margin: 0;
        text-align: left;
        font-size: 14px; }
    #cards_controller.real_card #preview_controls form {
      display: block;
      float: left;
      padding: 22px 0 0 15px; }
      #cards_controller.real_card #preview_controls form a.button.submit {
        margin-right: 1px; }
  #cards_controller.real_card div.attributions {
    font-size: 12px;
    text-align: center;
    color: gray;
    margin: 5px 0 0; }
    #cards_controller.real_card div.attributions div {
      display: inline; }
  #cards_controller.real_card #card {
    padding: 40px; }
    #cards_controller.real_card #card h2 {
      margin-top: 12px;
      text-align: center; }
    #cards_controller.real_card #card div.shadow_side>div {
      width: 650px; }
    #cards_controller.real_card #card div.shadow_side div.top {
      border-bottom: 1px solid #FFFFFF;
      min-height: 0;
      padding: 12px 0 0; }
      #cards_controller.real_card #card div.shadow_side div.top div.card_header {
        margin-top: -24px; }
    #cards_controller.real_card #card div.shadow_side div.bottom {
      min-height: 0;
      padding: 0; }
  #cards_controller.real_card #footer {
    width: 650px;
    margin-bottom: 240px; }

#nav {
  margin-bottom: 30px; }
  #nav ul {
    padding: 5px 5px;
    background: #efefef;
    overflow: hidden;
    border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom: 1px solid #dfdfdf; }
    #nav ul li {
      list-style: none;
      display: block;
      float: left; }
      #nav ul li.logout {
        float: right; }
      #nav ul li a {
        display: block;
        line-height: 1;
        padding: 5px; }
        #nav ul li a:hover {
          background: white;
          border-radius: 3px;
          -moz-border-radius: 3px;
          -webkit-border-radius: 3px; }

#home_controller.index #nav {
  margin-bottom: 40px; }
#home_controller.index #masthead {
  margin-bottom: 36px; }
  #home_controller.index #masthead #logo h1 a {
    font-size: 48px; }
    #home_controller.index #masthead #logo h1 a img {
      height: 43px;
      float: left;
      margin-right: 10px; }
  #home_controller.index #masthead #logo p.tagline {
    font-size: 18px;
    margin-left: 60px; }
  #home_controller.index #masthead #pitch {
    font-size: 22px; }
    #home_controller.index #masthead #pitch a {
      display: block; }

#masthead {
  margin-bottom: 26px;
  overflow: hidden; }
  #masthead #logo {
    float: left;
    width: 50%; }
    #masthead #logo h1 a {
      font-size: 32px;
      letter-spacing: -2px;
      line-height: 1;
      font-weight: bold;
      color: black;
      text-decoration: none; }
      #masthead #logo h1 a:hover {
        color: #b00015; }
      #masthead #logo h1 a img {
        height: 29px;
        display: block;
        float: left;
        margin-right: 5px; }
    #masthead #logo p.tagline {
      font-size: 14px;
      margin-left: 39px; }
  #masthead #pitch {
    float: right;
    font-size: 18px;
    width: 50%;
    text-align: right; }
    #masthead #pitch a {
      display: none; }

h2 img.avatar {
  height: 33px;
  width: 33px;
  vertical-align: middle;
  position: relative;
  top: -3px; }

#footer {
  margin-top: 40px;
  padding: 0 0 20px;
  overflow: hidden; }
  #footer * {
    color: silver; }
  #footer a {
    color: #a0a0a0; }
    #footer a:hover {
      color: gray; }
  #footer #copyright {
    display: inline;
    margin: 0 10px 0 0;
    color: #404040; }
    #footer #copyright a {
      color: #404040; }
  #footer #legal {
    display: inline; }
    #footer #legal li {
      display: inline;
      padding: 0 10px;
      border-left: 1px solid silver;
      color: gray; }
  #footer p.number_of_birthdays {
    margin-top: 10px;
    color: gray; }
    #footer p.number_of_birthdays strong {
      color: #404040;
      font-weight: bold; }
  #footer #search {
    float: right; }
    #footer #search label {
      width: auto;
      float: none;
      text-align: left;
      margin: 0;
      color: gray; }
    #footer #search input[type="text"] {
      color: #404040; }
    #footer #search a.button {
      color: white; }

div.page_width {
  width: 810px;
  margin: 0 auto;
  position: relative;
  display: inline-block; }
  div.page_width:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }

html[xmlns] div.page_width {
  display: block; }

* html div.page_width {
  height: 1%; }

#home_controller.index #recent_cards {
  overflow: hidden;
  padding: 10px;
  background: #dfdfdf;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  width: 790px;
  border-bottom: 1px solid #cfcfcf; }
  #home_controller.index #recent_cards h2 {
    float: left;
    margin-right: 10px; }
  #home_controller.index #recent_cards ul.comments {
    float: right;
    background: transparent;
    margin: 0;
    width: 635px; }
    #home_controller.index #recent_cards ul.comments li {
      background: transparent;
      overflow: hidden;
      margin: 0; }
      #home_controller.index #recent_cards ul.comments li a.more {
        text-decoration: none;
        display: block;
        padding-right: 21px;
        background: url('../../images/icons/arrow.png') no-repeat right center;
        font-size: 12px; }
      #home_controller.index #recent_cards ul.comments li a.avatar {
        width: 32px;
        height: 32px;
        float: left;
        margin-right: 5px;
        display: block;
        background: white;
        overflow: hidden;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px; }
      #home_controller.index #recent_cards ul.comments li b.tail {
        border: 5px solid transparent;
        border-right: 7px solid white;
        border-left: none;
        margin: 11px 0 0;
        float: left;
        height: 0;
        width: 0;
        display: block; }
      #home_controller.index #recent_cards ul.comments li blockquote {
        float: left;
        padding: 5px 10px;
        margin: 0;
        width: 510px;
        background: white;
        border: 1px solid #cfcfcf;
        border-top: none;
        border-left: none;
        font-size: 16px; }

ul.designs {
  overflow: hidden;
  margin: 0 26px 10px 24px; }
  ul.designs li {
    display: block;
    float: left;
    margin: 0 5px 10px; }
    ul.designs li a {
      overflow: hidden;
      border: 5px solid #dfdfdf;
      background: white;
      border-radius: 5px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      display: block;
      width: 160px;
      height: 115px;
      filter: alpha(opacity=75);
      opacity: 0.75;
      -moz-opacity: 0.75; }
      ul.designs li a:hover {
        filter: alpha(opacity=100);
        opacity: 1;
        -moz-opacity: 1; }
      ul.designs li a img {
        width: 100%; }
    ul.designs li.selected a {
      filter: alpha(opacity=100);
      opacity: 1;
      -moz-opacity: 1; }

#cards_controller #new_card div.selected_card {
  border: 5px solid #dfdfdf;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  width: 120px;
  height: 89px;
  overflow: hidden; }
  #cards_controller #new_card div.selected_card img {
    display: block;
    width: 100%; }
#cards_controller #new_card #card_recipient_screen_name {
  width: 383px; }
#cards_controller #new_card #card_message {
  float: left;
  width: 400px; }
#cards_controller ul.instructions {
  margin: 0 0 1.5em 1.5em; }
  #cards_controller ul.instructions li {
    color: #404040; }

#message_character_counter {
  float: left;
  color: gray;
  margin-left: 5px;
  display: block;
  font-size: 16px; }
  #message_character_counter.overflow {
    color: #d7000a; }

#loading_recipients {
  color: gray; }
  #loading_recipients img {
    margin-right: 5px;
    vertical-align: middle;
    top: -2px; }

form p {
  line-height: 28px; }
  form p.submit {
    margin-bottom: 0; }
form div.complex_field {
  line-height: 28px;
  margin: 0 0 1.5em; }
form label {
  display: block;
  float: left;
  text-align: right;
  margin-right: 10px;
  font-size: 16px; }
  form label.description {
    line-height: 1;
    margin-top: 5px;
    font-size: 12px;
    float: none;
    text-align: left; }
form input[type=text] {
  background: white;
  font-size: 16px;
  padding: 5px 3px 0;
  height: 21px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf; }
  form input[type=text].twitter_username {
    background: white url('../../images/twitter_favicon.png') no-repeat 3px center;
    padding-left: 20px; }
  form input[type=text].is_blank {
    color: silver; }
form textarea {
  padding: 5px 3px;
  font-size: 16px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf;
  margin: 0; }
form.lw40 label {
  width: 40px; }
  form.lw40 label.description {
    width: auto;
    margin-left: 50px; }
form.lw40 p.indent {
  margin-left: 50px; }
form.lw80 label {
  width: 80px; }
  form.lw80 label.description {
    width: auto;
    margin-left: 90px; }
form.lw80 p.indent {
  margin-left: 90px; }
form.lw120 label {
  width: 120px; }
  form.lw120 label.description {
    width: auto;
    margin-left: 130px; }
form.lw120 p.indent {
  margin-left: 130px; }
form.lw160 label {
  width: 160px; }
  form.lw160 label.description {
    width: auto;
    margin-left: 170px; }
form.lw160 p.indent {
  margin-left: 170px; }

a.button {
  display: inline-block;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background: #98000e url('../../images/button_highlight_bg.png') repeat-x left -100px;
  color: white;
  text-shadow: -1px -1px 0px #84000f;
  border: 1px solid #84000f;
  text-decoration: none;
  padding: 0 10px;
  line-height: 27px;
  font-size: 16px;
  height: 26px;
  box-shadow: 2px 2px 4px silver;
  -webkit-box-shadow: 2px 2px 4px silver;
  -moz-box-shadow: 2px 2px 4px silver; }
  a.button:hover {
    background: #a61a26 url('../../images/button_highlight_bg.png') repeat-x left top; }
  a.button.login {
    background-image: url('../../images/sign_in_with_twitter_small.png');
    background-repeat: no-repeat;
    background-position: 10px center;
    padding-left: 31px; }
  a.button.large {
    font-size: 18px;
    line-height: 31px;
    height: 29px; }
  a.button.negative {
    background: #d7000a;
    border-color: #a10007;
    text-shadow: -1px -1px 0px #a10007;
    filter: alpha(opacity=50);
    opacity: 0.5;
    -moz-opacity: 0.5; }
    a.button.negative:hover {
      filter: alpha(opacity=100);
      opacity: 1;
      -moz-opacity: 1; }
  a.button.neutral {
    background: #b0b0b0 url('../../images/button_neutral_highlight_bg.png') repeat-x left top;
    border-color: gray;
    text-shadow: 1px 1px 0px white;
    color: #404040; }
    a.button.neutral:hover {
      background-color: #cfcfcf;
      color: black; }

div.content {
  width: 730px;
  padding: 40px;
  margin-bottom: 20px;
  background: white;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-bottom: 1px solid #dfdfdf; }

#steps {
  margin-bottom: 30px;
  position: relative; }
  #steps div.get_started {
    position: absolute;
    left: 0;
    top: -50px;
    width: 150px;
    z-index: 20; }
    #steps div.get_started span {
      display: block;
      border-radius: 3px;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      text-align: center;
      padding: 5px;
      font-weight: bold;
      color: white;
      font-size: 16px;
      text-transform: uppercase;
      background: #b00015; }
    #steps div.get_started b.arrow {
      display: block;
      height: 0;
      width: 0;
      border: 15px solid transparent;
      border-top: 10px solid #b00015;
      border-bottom: none;
      position: relative;
      left: 60px; }
  #steps ol {
    overflow: hidden; }
    #steps ol li {
      display: block;
      float: left;
      width: 33%;
      list-style: none; }
      #steps ol li span {
        display: block;
        font-size: 22px;
        color: black;
        line-height: 30px;
        filter: alpha(opacity=33);
        opacity: 0.33;
        -moz-opacity: 0.33; }
        #steps ol li span b {
          font-size: 16px;
          display: block;
          float: left;
          height: 30px;
          width: 30px;
          color: white;
          background: url('../../images/steps_bg.png') no-repeat center center;
          line-height: 30px;
          text-align: center;
          text-shadow: -1px -1px 0px #84000f;
          margin-right: 5px; }
      #steps ol li.current span {
        filter: alpha(opacity=100);
        opacity: 1;
        -moz-opacity: 1; }

#pages_controller.sample #sample_card {
  float: left;
  width: 396px;
  border: 1px solid silver;
  padding: 1px;
  background: white;
  position: relative; }
  #pages_controller.sample #sample_card img {
    width: 100%; }
  #pages_controller.sample #sample_card ol.steps li {
    position: absolute;
    font-size: 16px;
    display: block;
    float: left;
    height: 30px;
    width: 30px;
    color: white;
    background: url('../../images/steps_bg.png') no-repeat center center;
    line-height: 30px;
    text-align: center;
    text-shadow: -1px -1px 0px #84000f; }
    #pages_controller.sample #sample_card ol.steps li.step_1 {
      left: 325px;
      top: 59px; }
    #pages_controller.sample #sample_card ol.steps li.step_2 {
      left: 217px;
      top: 325px; }
    #pages_controller.sample #sample_card ol.steps li.step_3 {
      left: 187px;
      top: 636px; }
#pages_controller.sample #text {
  margin-left: 420px; }
  #pages_controller.sample #text p {
    font-size: 22px;
    color: black;
    margin-bottom: 1em; }
  #pages_controller.sample #text ol.steps {
    font-size: 20px;
    margin-bottom: 1.5em; }
    #pages_controller.sample #text ol.steps li {
      display: block;
      list-style: none;
      margin-bottom: 0.75em; }
      #pages_controller.sample #text ol.steps li b {
        font-size: 16px;
        display: block;
        float: left;
        height: 30px;
        width: 30px;
        color: white;
        background: url('../../images/steps_bg.png') no-repeat center center;
        line-height: 30px;
        text-align: center;
        text-shadow: -1px -1px 0px #84000f;
        margin-right: 5px; }
      #pages_controller.sample #text ol.steps li strong {
        color: black;
        display: block;
        font-weight: normal;
        margin-left: 35px;
        font-size: 20px; }
      #pages_controller.sample #text ol.steps li small {
        color: #404040;
        display: block;
        margin-left: 35px;
        font-size: 14px;
        line-height: normal; }
  #pages_controller.sample #text a.button {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 2px;
    line-height: normal;
    height: auto;
    padding: 10px 20px;
    display: block;
    text-align: center; }
    #pages_controller.sample #text a.button small {
      font-weight: normal;
      letter-spacing: 1px;
      font-size: 12px;
      display: block; }

div.styled_select {
  height: 28px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf;
  position: relative;
  display: inline-block;
  background: white; }
  div.styled_select span {
    font-size: 20px;
    background: url('../../images/icons/control-270.png') no-repeat right center;
    display: block;
    margin: 0 3px 0 0;
    padding: 0 26px 0 3px;
    position: absolute;
    left: 0;
    right: 0;
    top: -1px;
    white-space: nowrap; }
  div.styled_select select {
    border: none;
    height: 23px;
    padding: 3px;
    font-size: 20px; }
    div.styled_select select option {
      background: white;
      padding: 3px;
      font-size: 20px;
      display: block; }

div.styled_checkbox {
  display: inline-block;
  height: 18px;
  width: 18px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf;
  background: white;
  margin-right: 3px; }
  div.styled_checkbox span {
    display: block;
    height: 18px;
    width: 18px; }
    div.styled_checkbox span.checked {
      background: url('../../images/icons/tick.png') no-repeat center center; }

p.flash {
  font-size: 16px;
  color: black;
  padding: 10px 10px 10px 31px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  margin: 0 0 20px;
  color: black;
  line-height: normal;
  position: relative;
  z-index: 25; }
  p.flash.error {
    background: #f9bfc0 url('../../images/icons/exclamation-red-frame.png') no-repeat 10px center; }
  p.flash.notice {
    background: #cabff0 url('../../images/icons/information-frame.png') no-repeat 10px center; }
  p.flash.confirmation {
    background: #caeec0 url('../../images/icons/tick.png') no-repeat 10px center; }

#errorExplanation {
  color: black;
  padding: 10px 10px 10px 31px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  margin: 0 0 20px;
  color: black;
  background: #efbfc2 url('../../images/icons/exclamation-red-frame.png') no-repeat 10px 10px; }
  #errorExplanation h2 {
    font-size: 14px;
    margin: 0; }
  #errorExplanation p {
    font-size: 12px;
    margin-bottom: 0;
    color: black; }
  #errorExplanation ul {
    margin-left: 19px; }
    #errorExplanation ul li {
      font-size: 12px;
      background: url('../../images/icons/exclamation-small-red.png') no-repeat left center;
      padding-left: 21px;
      list-style: none; }

#card {
  margin-bottom: 2em;
  width: 666px;
  position: relative; }
  #card div.shadow_top {
    width: 664px;
    height: 16px;
    margin: 0 auto;
    background: url('../../images/card_shadow_top.png') no-repeat center bottom; }
  #card div.shadow_side {
    background: url('../../images/card_shadow_sides.png') repeat-y center top; }
    #card div.shadow_side>div {
      width: 590px;
      margin: 0 auto;
      background: #E5E5E5 url('../../images/card_bg.jpg') no-repeat center top; }
    #card div.shadow_side div.content {
      padding: 18px 30px 30px; }
    #card div.shadow_side div.top {
      border-bottom: 1px solid #FFFFFF;
      min-height: 448px;
      padding: 18px 30px 29px; }
      #card div.shadow_side div.top div.card_header {
        min-height: 448px;
        padding: 18px 30px 29px; }
    #card div.shadow_side div.bottom {
      border-top: 1px solid #F2F2F2;
      min-height: 448px;
      padding: 29px 30px 30px; }
      #card div.shadow_side div.bottom div.card_footer {
        min-height: 448px;
        padding: 29px 30px 30px; }
        #card div.shadow_side div.bottom div.card_footer h3 {
          margin-left: 55px;
          color: black; }
        #card div.shadow_side div.bottom div.card_footer form p, #card div.shadow_side div.bottom div.card_footer form div.complex_field {
          margin: 0 0 1.5em 55px;
          overflow: hidden; }
        #card div.shadow_side div.bottom div.card_footer form label {
          display: block;
          float: none;
          margin: 0 0 5px;
          line-height: 1;
          font-size: 14px;
          text-align: left; }
        #card div.shadow_side div.bottom div.card_footer form textarea {
          float: left; }
  #card div.shadow_bottom {
    width: 664px;
    height: 17px;
    margin: 0 auto;
    background: url('../../images/card_shadow_bottom.png') no-repeat center top; }
  #card img.card_design {
    display: block;
    margin: 0 auto;
    width: 100%; }
  #card p.submit {
    margin-bottom: 0; }

ul.cards {
  margin: 0 0 15px 50px; }
  ul.cards li {
    list-style: none;
    margin: 0 0 5px; }
    ul.cards li div.meta {
      color: silver;
      float: right;
      font-size: 12px;
      position: relative;
      top: 1px; }
    ul.cards li a.title {
      text-decoration: none; }
      ul.cards li a.title img.avatar {
        height: 20px;
        width: 20px;
        display: inline-block;
        vertical-align: middle;
        position: relative;
        top: -2px; }
    ul.cards li ul.comments {
      margin: 5px 0 10px 40px; }
      ul.cards li ul.comments li {
        margin: 0 0 5px;
        padding: 0;
        border: none; }
        ul.cards li ul.comments li a.avatar {
          height: 20px;
          width: 20px; }
        ul.cards li ul.comments li b.tail {
          margin-top: 2px; }
        ul.cards li ul.comments li blockquote {
          margin-left: 30px;
          padding: 1px 5px;
          min-height: 18px; }
        ul.cards li ul.comments li small {
          margin-left: 30px; }

div.date {
  float: left;
  width: 40px; }
  div.date * {
    line-height: 1;
    text-align: center; }
  div.date div.month {
    text-transform: uppercase;
    color: white;
    font-size: 10px;
    padding: 3px 0 1px;
    background: #b00015;
    border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-bottom: 1px solid silver; }
  div.date div.day {
    font-size: 18px;
    font-weight: bold;
    padding: 2px;
    border-bottom: 1px solid silver; }
  div.date div.year {
    background: #dfdfdf;
    font-size: 10px;
    padding: 2px;
    border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px; }

ul.comments {
  margin: 0 0 20px; }
  ul.comments li {
    margin: 0 0 10px;
    display: block;
    list-style: none; }
    ul.comments li a.avatar {
      display: block;
      float: left;
      width: 40px;
      height: 40px;
      overflow: hidden; }
      ul.comments li a.avatar img {
        height: 100%;
        width: 100%; }
    ul.comments li b.tail {
      border: 8px solid transparent;
      border-right: 10px solid #d2d2d2;
      border-left: none;
      display: block;
      width: 0;
      height: 0;
      margin: 12px 0 0 5px;
      float: left; }
    ul.comments li blockquote {
      padding: 10px;
      background: #d2d2d2;
      border-radius: 3px;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      margin-left: 55px;
      font-size: 12px;
      min-height: 20px; }
    ul.comments li small {
      overflow: hidden;
      font-size: 10px;
      margin: 3px 0 0 55px;
      display: block;
      color: gray; }
      ul.comments li small span.from {
        float: left; }
      ul.comments li small span.created_at {
        float: right; }
    ul.comments li div.thanks_invite {
      border: 1px solid #9bbf91;
      background: #caeec0 url('../../images/icons/tick.png') no-repeat 10px center;
      padding: 10px 10px 10px 31px;
      line-height: 1;
      margin: 4px 0 10px 55px;
      border-radius: 3px;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px; }
      ul.comments li div.thanks_invite strong {
        color: black; }
      ul.comments li div.thanks_invite a {
        color: #218f03; }

#card_picker p.select_occasion {
  margin-bottom: 20px; }
  #card_picker p.select_occasion label {
    display: block;
    float: left;
    margin-right: 5px;
    font-size: 20px; }
#card_picker p.continue {
  margin: 10px 0 0;
  text-align: center; }
#card_picker div.main_picker {
  overflow: hidden;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border: 1px solid #dfdfdf;
  background: white; }
  #card_picker div.main_picker #preview {
    width: 568px;
    padding: 20px;
    border-right: none; }
    #card_picker div.main_picker #preview #preview_link {
      border: 5px solid transparent;
      overflow: hidden;
      display: block;
      border-radius: 3px;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      background: white; }
      #card_picker div.main_picker #preview #preview_link img {
        width: 100%;
        display: block; }
  #card_picker div.main_picker div.cards {
    padding: 0;
    background: #dfdfdf;
    border-left: none;
    width: 120px;
    height: 510px;
    float: right;
    overflow-y: auto;
    overflow-x: hidden;
    border-bottom: 1px solid silver;
    margin: 0 0 -1px; }
    #card_picker div.main_picker div.cards ul {
      margin: 0;
      padding: 0; }
      #card_picker div.main_picker div.cards ul li {
        display: block;
        padding: 10px;
        border-left: 1px solid silver;
        border-bottom: 1px solid silver;
        background: #dfdfdf;
        margin: 0; }
        #card_picker div.main_picker div.cards ul li.selected {
          border-left: 1px solid transparent;
          background: white; }
        #card_picker div.main_picker div.cards ul li a {
          overflow: hidden;
          background: white;
          display: block;
          width: 80px;
          height: 60px;
          border: 3px solid transparent;
          border-radius: 3px;
          -moz-border-radius: 3px;
          -webkit-border-radius: 3px; }
          #card_picker div.main_picker div.cards ul li a img {
            width: 100%;
            display: block; }

/* 
 * div.carousel */

#easter_egg {
  position: absolute;
  right: 10px;
  z-index: 900px;
  text-align: right; }

div.ac_results {
  box-shadow: 2px 2px 4px silver;
  -webkit-box-shadow: 2px 2px 4px silver;
  -moz-box-shadow: 2px 2px 4px silver;
  border: 1px solid #bfbfbf; }
  div.ac_results li {
    padding: 3px;
    font-size: 14px;
    line-height: 1;
    border-bottom: 1px solid silver;
    background: white;
    line-height: 24px; }
    div.ac_results li img {
      float: left;
      height: 24px;
      width: 24px;
      display: block;
      margin-right: 5px; }
    div.ac_results li span.name {
      font-weight: bold;
      margin-right: 5px; }
    div.ac_results li span.screen_name {
      color: gray; }
    div.ac_results li span strong {
      color: black;
      background: #ffc000;
      padding: 0 1px;
      border-radius: 2px;
      -moz-border-radius: 2px;
      -webkit-border-radius: 2px; }
    div.ac_results li.ac_over {
      background-color: #b00015; }
      div.ac_results li.ac_over span.name {
        color: white; }
      div.ac_results li.ac_over span.screen_name {
        color: #ebbfc4; }

body.admin div.page_width {
  width: 950px; }
body.admin div.content {
  padding: 0;
  width: 950px;
  background: none;
  border: none; }
body.admin #page_title {
  overflow: hidden;
  margin: 0 0 20px; }
  body.admin #page_title h2 {
    margin: 0; }
  body.admin #page_title #page_actions {
    float: right; }
    body.admin #page_title #page_actions a.add img {
      margin: 4px 5px 0 0;
      float: left; }
body.admin table {
  border: 1px solid #d2d2d2;
  border-right: none;
  border-bottom: none;
  background: white;
  width: 100%;
  line-height: normal; }
  body.admin table td {
    border: 1px solid #d2d2d2;
    border-top: none;
    border-left: none;
    padding: 5px;
    vertical-align: top; }
    body.admin table td.design div.thumbnail {
      float: left;
      width: 54px;
      height: 34px;
      overflow: hidden;
      border: 3px solid transparent;
      border-radius: 3px;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px; }
      body.admin table td.design div.thumbnail img {
        width: 100%; }
    body.admin table td.design strong, body.admin table td.design small {
      display: block;
      margin-left: 65px; }
    body.admin table td.actions {
      width: 1%;
      white-space: nowrap; }
      body.admin table td.actions a {
        display: inline-block;
        height: 16px;
        line-height: 16px;
        font-size: 12px;
        padding: 3px 3px 3px 21px; }
        body.admin table td.actions a.edit {
          background: url('../../images/icons/pencil.png') no-repeat 3px center; }
        body.admin table td.actions a.remove {
          background: url('../../images/icons/minus-circle.png') no-repeat 3px center; }
        body.admin table td.actions a:hover {
          background-color: #b00015;
          color: white;
          border-radius: 3px;
          -moz-border-radius: 3px;
          -webkit-border-radius: 3px; }
  body.admin table th {
    border: 1px solid #d2d2d2;
    border-top: none;
    border-left: none;
    padding: 5px;
    font-weight: bold; }
  body.admin table small {
    display: block;
    font-size: 12px;
    color: gray; }
  body.admin table span.pagination {
    float: right; }
body.admin form #design_accent_colour {
  text-transform: uppercase; }
body.admin form div.styled_select {
  height: 26px; }
  body.admin form div.styled_select span {
    color: black;
    font-size: 16px; }
  body.admin form div.styled_select select {
    height: 27px; }
    body.admin form div.styled_select select option {
      font-size: 16px; }
body.admin form #design_accent_colour {
  float: left;
  margin-right: 5px; }
body.admin form b.accent_colour {
  display: inline-block;
  height: 26px;
  width: 26px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf;
  background: gray; }
body.admin form div.thumbnail {
  margin: 10px 0 0 170px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf;
  width: 79px;
  height: 59px;
  overflow: hidden; }
  body.admin form div.thumbnail img {
    width: 100%; }

div.content p {
  margin-bottom: 1.5em; }
  div.content p strong {
    color: black; }
  div.content p a.avatar {
    display: inline-block;
    height: 24px;
    width: 24px; }
    div.content p a.avatar img {
      width: 100%;
      vertical-align: middle;
      position: relative;
      top: -1px; }

#invites_controller h3 a.avatar {
  display: inline-block;
  height: 28px;
  width: 28px; }
  #invites_controller h3 a.avatar img {
    width: 100%;
    vertical-align: middle; }
#invites_controller #friends {
  border: 1px solid silver; }
  #invites_controller #friends div.header {
    padding: 5px 10px;
    background: #dfdfdf;
    border-bottom: 1px solid silver; }
    #invites_controller #friends div.header label {
      line-height: 28px;
      margin: 0;
      color: #404040;
      width: auto;
      display: inline;
      font-size: 14px;
      text-align: left;
      float: none; }
      #invites_controller #friends div.header label.selection_message {
        float: right; }
        #invites_controller #friends div.header label.selection_message span {
          font-weight: bold;
          color: black; }
    #invites_controller #friends div.header span.loading {
      color: #404040; }
      #invites_controller #friends div.header span.loading img {
        position: relative;
        top: 2px;
        margin-right: 5px; }
  #invites_controller #friends ul {
    height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 5px 0 0 5px; }
    #invites_controller #friends ul li {
      width: 33%;
      display: block;
      float: left;
      overflow: hidden; }
      #invites_controller #friends ul li div.container {
        margin: 0 5px 5px 0;
        height: 24px;
        padding: 5px;
        background: #e7e7e7;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        position: relative;
        line-height: normal; }
        #invites_controller #friends ul li div.container img.avatar {
          display: block;
          float: left;
          height: 24px;
          width: 24px;
          background: white; }
        #invites_controller #friends ul li div.container div.styled_checkbox {
          float: left;
          position: relative;
          margin-right: 5px;
          top: 2px; }
        #invites_controller #friends ul li div.container strong {
          display: block;
          margin: 0 21px 0 55px;
          font-size: 12px;
          white-space: nowrap; }
        #invites_controller #friends ul li div.container small {
          display: block;
          padding-top: 1px;
          margin: 0 21px 0 55px;
          font-size: 10px;
          color: gray;
          white-space: nowrap;
          overflow: hidden; }
#invites_controller #dm_preview label {
  line-height: 1;
  font-size: 14px;
  width: auto;
  float: none;
  margin: 0 0 5px;
  text-align: left; }
#invites_controller #dm_preview div.message {
  padding: 5px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf;
  background: #efefef;
  margin: 0;
  font-size: 14px;
  line-height: normal; }

#embed_preview #preview_container {
  height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0 0 1.5em;
  border: 1px solid #dfdfdf; }
  #embed_preview #preview_container #card {
    width: auto;
    margin: 0;
    padding: 20px 0; }
#embed_preview label {
  display: block;
  font-size: 14px;
  color: #404040;
  line-height: 1;
  text-align: left;
  margin: 0 0 3px; }
#embed_preview textarea {
  padding: 3px;
  border: 1px solid #e5e5e5;
  border-top: 1px solid #bfbfbf;
  border-left: 1px solid #bfbfbf;
  background: white;
  margin: 0;
  text-align: left;
  font-size: 16px; }