
/*  -----------------------------------------------
    Style Sheet:
      /css/recommend/form.css
    -----------------------------------------------  */

    .framed #content,
    .facebook #content {
      padding-top: 0;
    }


/*  Show a loading screen, while the content is being set up by script.
    ----------------------------------------------- */
    #loading {
      margin: 0;
      position: absolute;
      z-index: 9999;
      top: 0;
      left: 0;
      text-indent: -9999px;
      overflow: hidden;
      background: #fff url(/img/ui/working-large.gif) no-repeat 50% 225px;
      min-width: 32px;
      min-height: 32px;
    }


/*  Recommend Form
    ----------------------------------------------- */
    #main_content {
      font-size: 11px;
      width: 710px;
      color: #000000;
      padding-bottom: 50px;
      position: relative;
      float: none;
    }
    .framed #content {
      border-top: 1px solid #fff;
    }
    .framed #main_content {
      padding-bottom: 5px;
    }
    #main_content h1 {
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      margin-top: 5px;
      margin-bottom: 20px;
      border-width: 0;
      border-style: solid;
      border-color: #E7E7E7;
      padding-bottom: 3px;
      width: 710px;
      font-size: 16px;
      color: #3f3f3f;
    }
    .framed #main_content h1 {
      margin-bottom: 5px;
    }
    #main_content fieldset {
      border: 0;
      padding: 0;
    }

    #main_content form .basicInfo,
    #main_content form .detailedInfo,
    #main_content form .image {
      margin-bottom: 1em;
      padding-bottom: 1em;
      border-width: 0 0 1px 0;
      border-style: solid;
      border-color: #E7E7E7;
    }
    #main_content form h2,
    #main_content form h3,
    #main_content fieldset legend {
      display: block;
      margin: 0;
      padding: 0;
      color: #000000;
    }
    #main_content fieldset legend {
      font-weight: bold;
      font-size: 16px;
      padding-bottom: 1em;
    }
    #main_content label {
      display: block;
    }
    #main_content label span,
    #main_content fieldset legend,
    #main_content form h2,
    #main_content form h3,
    .scriptable #main_content form .imageMain span {
      font-family: Helvetica, sans-serif;
      font-size: 11px;
      display: block;
      margin-bottom: 0.25em;
      font-weight: normal;
    }
    #main_content label.error span,
    #main_content label.error span *,
    #main_content .fieldset .fieldset.error h3,
    #main_content .fieldset .fieldset.error h3 * {
      color: #fb4a02;
    }
    #main_content label.error span em {
      font-weight: bold;
    }
    #main_content .birthday label span {
      position: absolute;
      left: -9999px;
    }
    #main_content label span em,
    .scriptable #main_content form .imageMain span em,
    .scriptable #main_content form label span.note {
      color: #8c8c8c;
      font-style: normal;
    }
    .scriptable #main_content form label span.note {
      margin-top: 0.25em;
    }
    #main_content .name.static,
    #main_content input.text,
    #main_content textarea {
      font-size: 16px;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    }
    #main_content .name.static,
    #main_content .name textarea {
      font-weight: bold;
    }
    #main_content .name.static {
      color: #909B39;
    }
    #main_content .recommendation textarea,
    #main_content .via input {
      font-size: 12px;
    }
    #main_content input.text,
    #main_content textarea {
      display: block;
      background-color: #f6f6f6;
    }
    #main_content input:focus,
    #main_content textarea:focus {
      background-color: #EAE9E6;
    }
    #main_content label.error input.text,
    #main_content label.error textarea {
      background-color: #ffede6;
    }
    #main_content label.error input:focus,
    #main_content label.error textarea:focus {
      background-color: #fee4d9;
    }
    #main_content textarea {
      height: 11em;
    }
    #main_content .name textarea {
      height: 2.5em;
    }
    #main_content input.text,
    #main_content textarea {
      width: 415px;
    }
    #main_content .via input.text {
      width: 200px;
    }
    #main_content .imageSticker input.text {
      width: 125px;
    }
    .facebook #main_content input.text,
    .facebook #main_content textarea {
      width: 257px;
    }
    .facebook #main_content .via input.text,
    .facebook #main_content .imageSticker input.text {
      width: 120px;
    }
    #main_content .imageUpload input {
      font-size: 12px;
      font-weight: normal;
      background-color: transparent;
    }
    #main_content input.checkbox {
      margin: 0;
    }

    #main_content fieldset fieldset label,
    #main_content .fieldset .fieldset label {
      float: left;
      margin-right: 0.5em;
    }
    #main_content p,
    #main_content .imageSticker {
      margin: 0 0 2em 0;
    }
    .scriptable #main_content .imageSticker {
      overflow: auto;
    }
    #main_content p.name.static {
      margin-bottom: 1em;
    }
    #main_content .imageSticker p {
      margin: 0;
    }
    #main_content fieldset fieldset p,
    #main_content .fieldset .fieldset p {
      overflow: auto;
    }
    .scriptable .advanced #main_content .basicInfo,
    .scriptable .advanced #main_content .image {
      min-height: 270px;
    }
    #main_content fieldset .imageSticker p,
    #main_content .fieldset .imageSticker p {
      overflow: visible;
      float: left;
    }
    #main_content fieldset .imageSticker p label,
    #main_content .fieldset .imageSticker p label {
      float: none;
    }
    #main_content .imageSticker .colorPicker {
      margin-top: 0.5em;
    }
    #main_content .imageSticker label span {
      position: absolute;
      left: -9999px;
    }
    #main_content .imageSticker label span.note {
      position: static;
      left: auto;
    }
    #main_content .imageChoose {
      position: relative;
    }
    #main_content .imageChoose img {
      display: block;
      max-width: 80px;
      max-height: 80px;
    }
    #main_content .imageChoose img.large {
      margin: 0;
      display: block;
      position: absolute !important;  /* !important needed for IE7 */
      left: -9999px !important;
      width: 1px;
      height: 1px;
      overflow: hidden;
    }
    #main_content .imageChoose p {
      border-width: 1px 0 0 1px;
      border-style: solid;
      border-color: #CCCCCC;
    }
    #main_content .listExisting p {
      padding: 0.5em 0;
      border-width: 1px 0 0 0;
      border-style: solid;
      border-color: #CCCCCC;
    }
    .basic #main_content .listExisting p {
      border-width: 1px 0;
      height: 150px;
    }
    /* Make the bookmarklet list box a bit shorter. */
    .basic.framed #main_content .listExisting p {
      height: 75px;
    }
    .basic.framed #main_content .imageChoose p {
      height: 110px;
      border-width: 1px;
    }


/*  List Search
    ----------------------------------------------- */
    #main_content .listExisting {
      position: relative;
    }
    #main_content .listExisting .search {
      position: absolute;
      top: -1.2em;
      right: 50px;
    }
    #main_content .listExisting .search h4 {
      color: #8C8C8C;
      text-transform: uppercase;
      font-weight: normal;
      font-size: 8px;
      margin: 0;
    }
    #main_content .listExisting .search input {
      font-size: 10px;
      position: static;
      display: inline;
      border: 1px solid #ccc;
      padding: 0 2px;
    }


/*  Checkbox / Radio button
    ----------------------------------------------- */
    #main_content .propel label,
    #main_content .wishlist label,
    #main_content .listExisting label,
    #main_content .imageChoose label,
    .scriptable #main_content .via h3,
    .scriptable #main_content .listNew h3,
    .scriptable #main_content .imageSticker h3 {
      padding-left: 19px;
      position: relative;
    }
    #main_content fieldset .propel label,
    #main_content .fieldset .propel label,
    #main_content fieldset .listExisting label,
    #main_content .fieldset .listExisting label,
    .scriptable #main_content .via h3,
    .scriptable #main_content .listNew h3,
    .scriptable #main_content .imageSticker h3 {
      margin-bottom: 0.5em;
      padding-top: 0.25em;
      line-height: 1em;
    }
    #main_content fieldset .listExisting label,
    #main_content .fieldset .listExisting label {
      float: none;
      color: #909a3a;
    }
    #main_content fieldset .listExisting label.wishlist,
    #main_content .fieldset .listExisting label.wishlist {
      color: #000000;
      padding-left: 33px;
      background-image: url(/img/recommend/search/star.png);
      background-repeat: no-repeat;
      background-position: 18px 2px;
    }
    #main_content .propel input,
    #main_content .wishlist input,
    #main_content .listExisting input,
    #main_content .imageChoose input,
    #main_content .via h3 input,
    #main_content .listNew h3 input,
    #main_content .imageSticker h3 input {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
    }
    #main_content .imageChoose input {
      top: 3px;
      left: 3px;
    }
    #main_content fieldset .imageChoose label,
    #main_content .fieldset .imageChoose label {
      background-color: #FFFFFF;
      display: block;
      position: relative;
      height: 82px;
      width: 82px;
      border-width: 0 1px 1px 0;
      border-style: solid;
      border-color: #e1e1e2;
      margin: 0;
      padding: 0;
      cursor: pointer;
      overflow: hidden;
    }
    .scriptable #main_content .imageChoose label.disabled {
      cursor: move;
    }
    #main_content .imageChoose label span {
      border-width: 1px;
      border-style: solid;
      border-color: #FFFFFF;
      width: 80px;
      height: 80px;
    }
    #main_content .imageChoose label.active span {
      border-color: #fb4b02;
    }
    #main_content .imageChoose label span.indicator {
      display: block;
      background-image: url(/img/recommend/form/main-image.png);
      background-position: 50% 0;
      width: 80px;
      height: 25px;
      border-width: 0;
      position: absolute;
      left: 1px;
      top: 56px;
    }
    
    #main_content .imageChoose span {
      position: absolute;
      top: 0;
      left: 0;
    }
    .scriptable #main_content .listExisting p {
      width: 415px;
    }
    .facebook .scriptable #main_content .listExisting p {
      width: 264px;
    }
    .scriptable #main_content .imageChoose p {
      width: 415px;
      background: #F6F6F6 url(/img/recommend/form/image-placeholder.gif);
    }
    .scriptable .basic.framed #main_content .listExisting p,
    .scriptable .basic.framed #main_content .imageChoose p {
      width: 433px;
      background: transparent none;
    }
    .scriptable .basic.facebook #main_content .listExisting p,
    .scriptable .basic.facebook #main_content .imageChoose p {
      width: 264px;
    }
    .scriptable .advanced.facebook #main_content .listExisting p,
    .scriptable .advanced.facebook #main_content .imageChoose p {
      width: 249px;
    }
    
    #main_content .save,
    #main_content .save li {
      margin: 0;
      padding: 0;
      list-style: none;
    }
    #main_content .save {
      clear: both;
      margin-bottom: 1em;
    }
    .scriptable #main_content .save,
    .scriptable #main_content .cancel {
      padding-left: 245px;
    }
    .scriptable #main_content .delete {
      position: absolute;
      bottom: 63px;
    }
    .scriptable #main_content .save input.submit,
    .scriptable #main_content .delete input.submit {
      margin-right: 2em;
      color: #000;
      cursor: pointer;
    }
    .facebook #main_content .save input.submit,
    .facebook #main_content .delete input.submit {
      margin-right: 1px;
      cursor: pointer;
    }
    .scriptable #main_content .save button {
      margin-left: 1em;
    }
    .scriptable #main_content .save li:first-child button {
      margin-left: 0;
    }
    .scriptable #main_content .save button:disabled {
      visibility: hidden;
    }
    .scriptable .advanced #main_content .save button {
      display: none;
    }
    .Firefox .step1 #main_content .save input.submit.primary,
    .Firefox .step2 #main_content .save input.submit.primary,
    .Firefox #main_content .save input.submit.secondary,
    .Firefox #main_content .delete input.submit,
    .Safari .step1 #main_content .save input.submit.primary,
    .Safari .step2 #main_content .save input.submit.primary,
    .Safari #main_content .save input.submit.secondary,
    .Safari #main_content .delete input.submit {
      border-width: 0;
      background-color: transparent;
      padding: 0;
      color: #3399FF;
      border-width: 0 0 1px 0;
      border-style: solid;
      border-color: #3399FF;
      line-height: 1em;
      font-family: Arial,Helvetica,sans-serif;
      font-size: 11px;
    }
    .scriptable #main_content .delete input.submit {
      color: #fb4a02;
      border-color: #fb4a02;
    }
    #main_content .save li {
      display: inline;
    }

    .scriptable .advanced #main_content form .basicInfo h2,
    .scriptable .advanced #main_content form .detailedInfo h2,
    .scriptable .advanced #main_content form .image h2 {
      position: absolute !important;
      left: -9999px !important;
    }


/*  Display the user's "main image" choice
    ----------------------------------------------- */
    .scriptable #main_content form .name,
    .scriptable #main_content form .recommendation,
    .scriptable #main_content form .tags,
    .scriptable #main_content form .propel,
    .scriptable #main_content form .via,
    .scriptable #main_content form .listExisting,
    .scriptable #main_content form .listNew,
    .scriptable #main_content form .imageChoose,
    .scriptable #main_content form .imageUpload,
    .scriptable #main_content form .imageSticker {
      margin-left: 245px;
    }
    .scriptable #main_content form .basicInfo,
    .scriptable #main_content form .detailedInfo,
    .scriptable #main_content form .image {
      position: relative;
    }
    .scriptable .advanced #main_content form .detailedInfo .imageMain {
      display: none;
    }
    .scriptable #main_content form .imageMain {
      position: absolute;
      left: 0;
      margin: 0;
    }
    .scriptable #main_content form .imageMain div.container {
      border-color: #CCCCCC;
      border-style: solid;
      border-width: 1px;
      width: 230px;
      height: 230px;
      background: url(/img/ui/working.gif) center no-repeat;
    }
    .scriptable #main_content form .imageMain img {
      position: static;
      width: 230px;
      height: 230px;
    }
    .scriptable #main_content form .imageMain span.emphasizer {
      display: block;
      background-image: url(/img/recommend/form/drop-here.png);
      background-repeat: no-repeat;
      width: 230px;
      height: 230px;
      border-width: 0;
      position: absolute;
      left: 1px;
      bottom: 1px;
      padding: 0;
      margin: 0;
    }
    .scriptable #main_content .imageChoose h3 {
      color: #8c8c8c;
      line-height: 1.1em;
    }
    
    /* Line wrapping looks funny in the facebook version */
    .facebook #main_content .imageChoose h3 br {
      display: none;
    }
    
    .scriptable #main_content form .imageMain span,
    .scriptable #main_content form p.name,
    .scriptable .basic #main_content form p.tags {
      padding-top: 2.2em;
    }
    .scriptable .basic #main_content form .imageChoose {
      padding-top: 1em;
    }
    
    /* Propel */
    #main_content .propel label {
      display: block;
      margin-bottom: 0.45em !important;
    }
    #main_content .propel input {
      top: 0;
    }
    #main_content .propel span strong {
      text-transform: uppercase;
      font-weight: normal;
    }
    #main_content .propel span strong strong {
      font-style: italic;
      font-weight: bold;
    }
    
    /* Note */
    #main_content .note {
      clear: both;
      color: #8c8c8c;
    }
    #main_content .propel .note {
      display: block;
    }
    
    /* Legend Title */
    .scriptable #main_content p.note {
      margin-top: -1.75em;
    }
    .scriptable #main_content .imageSticker p.note {
      display: none !important;
    }
    .scriptable #main_content form .imageMain .container.empty,
    .scriptable #main_content form .imageChoose p.empty {
      background-color: #e5e5e5 !important;;
      background-image: none !important;
      color: #b7b7b7;
      font-size: 14px;
      line-height: 1.25;
      text-align: center;
      font-weight: bold;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    }
    .scriptable #main_content form .imageMain .container.empty div {
      display: table-cell;
      vertical-align: middle;
      width: 230px;
      height: 230px;
    }
    .scriptable #main_content form .imageMain .container.empty h6,
    .scriptable #main_content form .imageMain .container.empty p {
      margin: 0.25em 0;
      font-size: 24px;
      color: #b7b7b7;
    }
    .scriptable #main_content form .imageMain .container.empty p {
      font-size: 18px;
    }
    .scriptable #main_content form .imageChoose p.empty {
      padding: 30px 0;
      border-width: 1px;
    }


/*  Transform the main sections of the form into tabs (if JavaScript is active)
    ----------------------------------------------- */
    .scriptable #main_content form {
      padding-top: 2.5em;
      position: relative;
    }
    .scriptable #main_content form a.toggle {
      position: absolute;
      top: 1em;
      right: 50px;
      z-index: 1;
      color: #FB4B02;
      text-decoration: underline;
    }
    .scriptable .advanced #main_content .basicInfo {
      border-top-width: 1px;
    }

    .scriptable .advanced #main_content form .basicInfo,
    .scriptable .advanced #main_content form .detailedInfo,
    .scriptable .advanced #main_content form .image {
      clear: both;
    }

    .scriptable .basic #main_content form .basicInfo,
    .scriptable .basic #main_content form .detailedInfo,
    .scriptable .basic #main_content form .image {
      position: absolute;
      width: 710px;
      border-width: 0 0 0 0;
      min-height: 25em;
    }

    .scriptable .basic #main_content form .basicInfo.current,
    .scriptable .basic #main_content form .detailedInfo.current,
    .scriptable .basic #main_content form .image.current {
      position: relative;
      z-index: 1;
      border-width: 1px 0 0 0;
    }
    
    .scriptable #main_content .advancedTab {
      position: relative;
      z-index: 1;
    }
    .scriptable .basic #main_content .advancedTab {
      position: absolute;
      left: -9999px;
    }

    .scriptable .basic #main_content form .basicInfo h2,
    .scriptable .basic #main_content form .detailedInfo h2,
    .scriptable .basic #main_content form .image h2,
    .scriptable #main_content .advancedTab,
    .scriptable #main_content .advancedTab h2 {
      font-family: Arial, Helvetica, sans-serif;
      color: #3f3f3f;
      font-size: 11px;
      font-weight: bold;
      line-height: 1em;
      border-width: 0;
      margin: 0;
      padding: 0;
    }

    .scriptable #main_content form .basicInfo h2,
    .scriptable #main_content .advancedTab h2 {
      left: 11px;
    }
    .scriptable .basic #main_content form .basicInfo h2,
    .scriptable .basic #main_content form .detailedInfo h2,
    .scriptable .basic #main_content form .image h2,
    .scriptable #main_content .advancedTab h2 {
      position: absolute;
      left: 11px;
      top: -2em;
      line-height: 18px;
      padding-bottom: 0;
    }

    .scriptable .basic #main_content form .basicInfo h2,
    .scriptable .basic #main_content form .detailedInfo h2,
    .scriptable .basic #main_content form .image h2 {
      cursor: pointer;
    }

    .scriptable .basic #main_content form .basicInfo h2 span,
    .scriptable .basic #main_content form .detailedInfo h2 span,
    .scriptable .basic #main_content form .image h2 span,
    .scriptable #main_content .advancedTab h2 span {
      border-color: #E7E7E7;
      border-style: solid;
      border-width: 1px 1px 0 1px;
      background-image: url(/img/recommend/form/tab-background.gif);
      
      display: block;
      padding: 0.5em 1em;
      position: relative;
      line-height: 1em;
      top: 1px;
      white-space: nowrap;  /* For Safari 4 */
    }
    .scriptable .basic #main_content form .basicInfo.current h2 span,
    .scriptable .basic #main_content form .detailedInfo.current h2 span,
    .scriptable .basic #main_content form .image.current h2 span,
    .scriptable #main_content .advancedTab h2 span {
      background-image: none;
      background-color: #FFFFFF;
      top: 0;
    }
    .scriptable #main_content .advancedTab h2 span {
      top: 1px;
    }
    
    /* The tabs are one pixel too low in Firefox. Adjust to compensate */
    .scriptable.Firefox .basic #main_content form .basicInfo h2 span,
    .scriptable.Firefox .basic #main_content form .detailedInfo h2 span,
    .scriptable.Firefox .basic #main_content form .image h2 span,
    .scriptable.Firefox #main_content .advancedTab h2 span {
      top: 0;
    }
    .scriptable.Firefox .basic #main_content form .basicInfo.current h2 span,
    .scriptable.Firefox .basic #main_content form .detailedInfo.current h2 span,
    .scriptable.Firefox .basic #main_content form .image.current h2 span {
      top: -1px;
    }
    
    /* The tabs are two pixels too low in Opera. Adjust to compensate */
    .scriptable.Opera .basic #main_content form .basicInfo h2 span,
    .scriptable.Opera .basic #main_content form .detailedInfo h2 span,
    .scriptable.Opera .basic #main_content form .image h2 span,
    .scriptable.Opera #main_content .advancedTab h2 span {
      top: -1px;
    }
    .scriptable.Opera .basic #main_content form .basicInfo.current h2 span,
    .scriptable.Opera .basic #main_content form .detailedInfo.current h2 span,
    .scriptable.Opera .basic #main_content form .image.current h2 span,
    .scriptable.Opera #main_content .advancedTab h2 span {
      top: -2px;
    }
    
    .scriptable #main_content .advancedTab label {
      position: absolute;
      top: -1.65em;
      left: 10.5em;
      padding-left: 1.5em;
      padding-top: 0.25em;
      margin-left: 1em;
      line-height: 1em;
    }
    .scriptable #main_content .advancedTab label input {
      position: absolute;
      left: 0;
      top: 0;
    }
    .scriptable .basic #main_content form p.names,
    .scriptable .basic #main_content form p.tags {
      margin-top: 0;
    }
    .scriptable .basic #main_content form .basicInfo p,
    .scriptable .basic #main_content form .detailedInfo p,
    .scriptable .basic #main_content form .image p,
    .scriptable .basic #main_content form div.fieldset div.imageMain,
    .scriptable .basic #main_content form div.fieldset div.fieldset {
      display: none;
      position: absolute !important;
      left: -9999px !important;
    }
    .scriptable .basic #main_content form .basicInfo.current p,
    .scriptable .basic #main_content form .detailedInfo.current p,
    .scriptable .basic #main_content form .image.current p,
    .scriptable .basic #main_content form div.fieldset.current div.fieldset {
      display: block;
      position: static !important;
      left: auto !important;
    }
    .scriptable .basic #main_content form div.fieldset.current div.listExisting {
      position: relative !important;
    }
    .scriptable .basic #main_content form div.fieldset div.imageMain {
      display: block;
    }
    .scriptable .basic #main_content form div.fieldset.current div.imageMain {
      left: 0 !important;
    }
    .scriptable .basic #main_content div.imageMain.hover img {
      border-color: #FB4B02;
    }
    .scriptable .basic #main_content form div.fieldset.current div.fieldset.imageChoose {
      position: relative !important;
      overflow: visible !important;
    }


/*  Replace the sticker color drop-down with a simple color picker
    ----------------------------------------------- */
    .scriptable .imageSticker select {
      position: absolute;
      left: -9999px;
    }
    .scriptable .imageSticker .colorPicker,
    .scriptable .imageSticker .colorPicker li {
      margin: 0;
      padding: 0;
      list-style: none;
    }
    .scriptable .imageSticker .colorPicker {
      width: 126px;
      height: 18px;
      background-image: url(/img/recommend/form/colors-large.png);
      background-repeat: no-repeat;
      background-position: 1px 1px;
    }
    .scriptable .imageSticker .colorPicker li {
      display: block;
      float: left;
      cursor: pointer;
    }
    .scriptable .imageSticker .colorPicker li a {
      display: block;
      width: 18px;
      height: 18px;
      text-indent: -9999px;
      overflow: hidden;
      cursor: pointer;
    }
    .scriptable .imageSticker .colorPicker li.active a {
      width: 16px;
      height: 16px;
      border: 1px solid #000000;
    }
    .scriptable .facebook .imageSticker .colorPicker {
      width: 84px;
      height: 12px;
      background-image: url(/img/recommend/form/colors.png);
    }
    .scriptable .facebook .imageSticker .colorPicker li a {
      width: 12px;
      height: 12px;
    }
    .scriptable .facebook .imageSticker .colorPicker li.active a {
      width: 10px;
      height: 10px;
    }


/*  Style the Field Tips (help bubbles)
    ----------------------------------------------- */
    .fieldTip {
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      color: #000000;
      font-size: 11px;
      width: 200px;
      margin: 0;
    }
    .fieldTip span {
      display: block;
    }
    .fieldTip .top {
      height: 15px;
      background: url(/img/recommend/form/field-tip/top.png) no-repeat;
    }
    .fieldTip .tileTop {
      height: 0;
      background: url(/img/recommend/form/field-tip/tile.png) repeat-y;
    }
    .fieldTip .mid {
      height: 35px;
      background: url(/img/recommend/form/field-tip/mid.png) no-repeat;
    }
    .fieldTip .tileBot {
      height: 0;
      background: url(/img/recommend/form/field-tip/tile.png) repeat-y;
    }
    .fieldTip .bot {
      height: 20px;
      background: url(/img/recommend/form/field-tip/bot.png) no-repeat;
    }
    .fieldTip .text {
      position: absolute;
      top: 23px;
      left: 45px;
      width: 120px;
    }


/*  Wishlist Mode
    ----------------------------------------------- */
    .scriptable .wish #main_content form {
      padding-top: 0;
    }
    .scriptable .wish #main_content .basicInfo,
    .scriptable .wish #main_content .image {
      min-height: 1px;
      border-width: 0;
    }
    .scriptable .wish #main_content .basicInfo {
      padding-top: 0;
    }
    .wish #main_content h1 {
      border-color: #E7E7E7;
      border-style: solid;
      border-width: 0 0 1px 0;
    }


/*  Framed Mode
    ----------------------------------------------- */
    .framed #branding {
      position: absolute;
      top: 15px;
      left: 15px;
    }
    .framed #branding a {
      background-image: url(/img/recommend/bookmarklet/thisnext.png);
      width: 53px;
      height: 33px;
    }
    .facebook #branding a {
      left: 5px;
    }
    .framed #main_content {
      background-color: transparent;
    }
    .framed #main_content h1 {
      padding-left: 65px;
      border-width: 0;
    }
    .framed #main_content .delete {
      bottom: 18px;
    }
    .framed #main_content .close {
      position: absolute;
      top: 15px;
      right: 50px;
      background: url(/img/recommend/item/close.gif) no-repeat right;
      padding-right: 15px;
    }
    #main_content p.wishlist {
      margin: 0;
      position: absolute;
      top: 20px;
      left: 20em;
    }
    .framed #main_content p.wishlist {
      left: 25em;
    }
    .recommend.advanced #main_content p.wishlist {
      left: -9999px;
    }
    #main_content .wishlist label {
      line-height: 1em;
      padding-top: 0.25em;
    }
    #main_content .wishlist input {
      margin: 0;
    }


/*  Framed Mode (Success)
    ----------------------------------------------- */
    .framed.success #main_content {
      min-height: 250px;
      padding-top: 150px;
    }
    .framed.success #main_content h1,
    .framed.success #main_content p {
      padding: 0;
      text-align: center;
    }
    .scriptable .framed.success .shareProduct {
      display: none;
    }


/*  Facebook Mode
    ----------------------------------------------- */
    .facebook,
    .facebook #background,
    .facebook #content {
      background-color: transparent;
      background-image: none;
      position: static;
      margin: 0;
      padding: 0;
      width: auto;
    }
    .facebook #content {
      position: relative;
      width: 526px !important;
      margin-left: auto;
      margin-right: auto;
    }
    .facebook #main_content {
      padding-left: 0;
      margin: 0;
    }
    .facebook #main_content,
    .facebook #main_content h1,
    .facebook #main_content form .basicInfo,
    .facebook #main_content form .detailedInfo,
    .facebook #main_content form .image {
      width: 526px !important;
    }
    .facebook #main_content {
      overflow: hidden;
    }
    .facebook #main_content .listExisting .sort,
    .facebook #main_content a.toggle,
    .facebook #main_content .close {
      right: 0 !important;
    }
    .facebook #main_content iframe {
      max-width: 261px !important;
    }
