/*
=======================================================

FREEBASE SUGGEST

This file is part of the freebase-suggest jQuery plugin.

It is maintained by Metaweb Technologies, Inc. and
available for use under a Creative Commons License.

Author: Kai Conragan (kai@metaweb.com)

    GLOSSARY
    
    .fbs-pane       : Outermost container for result list <div>
    .fbs-subpane    : Inner container for result list <div>
    .fbs-list       : Contained by .fbs-subpane, this is the actual results list <ul>
    .fbs-item       : Individual item in results list <li>
    .fbs-flyout-pane : Outermost container for flyout on specific object <div>

=======================================================
*/

/*
-------------------------------------------------------
Freebase Suggest Reset
-------------------------------------------------------

reset all Freebase Suggest elements to insure consisten cross-browser rendering

*/

.fbs-reset,
.fbs-reset h1,
.fbs-reset h2,
.fbs-reset h3,
.fbs-reset h4,
.fbs-reset h5,
.fbs-reset h6,
.fbs-reset p,
.fbs-reset img,
.fbs-reset dl,
.fbs-reset dt,
.fbs-reset dd,
.fbs-reset ol,
.fbs-reset ul,
.fbs-reset li {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}

/*
-------------------------------------------------------
Freebase Suggest Chrome
-------------------------------------------------------

You can change the colors of Freebase Suggest by overriding
the following rules. We recommended that you copy/paste the
below rules into your own stylesheet to customize.

*/

.fbs-pane,
.fbs-flyout-pane,
li.nomatch,
a.fbs-more-link,
li.fbs-selected,
.fbs-flyout-images,
#fbs-topic-image { 
    background: #fff; 
}


.fbs-suggestnew { 
    color: #fff;
}

.fbs-pane,
.fbs-flyout-pane,
.fbs-flyout-subtitle,
.fbs-topic-properties strong { 
    color:  #666;
}

h3.fbs-topic-properties,
.fbs-flyout-pane p { 
    color: #444;
}

.fbs-item-name,
li.fbs-help-on-focus,
li.nomatch,
.fbs-nomatch-text,
.fbs-flyout-pane h3,
.fbs-properties-header { 
    color: #333;
}

.fbs-pane,
.fbs-flyout-pane { 
    border: 1px solid #bbb;
}

.fbs-flyout-pane {
    border-color: #ccc;
}

.fbs-list,
.fbs-list-icons,
.fbs-flyout-content,
.fbs-attribution, 
.fbs-header { 
    background-color: #f5f5f5;
}

.fbs-header { background: #fefefe; }

li.fbs-help-on-focus,
li.nomatch { 
    border-bottom: 1px solid #e5e5e5;
}

.fbs-item-name {
    border: 1px solid #f5f5f5;
}

h1#fbs-flyout-title,
li.fbs-selected .fbs-item-name { 
    color: #f60;
}

li.fbs-selected .fbs-item-name {
    border-color: #f60;
}

.fbs-item-type { 
    color: #777;
}

.fbs-nomatch-text {
    border-bottom: 1px solid #e5e5e5;
    background: #f8f8f8;
}

.fbs-suggestnew { 
    background: #999;
}


#fbs-flyout-title .fbs-flyout-label { 
    color: #aaa;
}

/* topic image */
#fbs-topic-image,
.fbs-flyout-images {
    border: 1px solid #a9a9a9;
}

.fbs-suggestnew-button,
.fbs-flyout-pane { 
    border: 1px solid #9a9a9a;
}

ul.fbs-list,
.fbs-flyout-content,
.fbs-attribution,
li.fbs-item, 
.fbs-header {
    border: 1px solid #e5e5e5;
}

.fbs-header { border-bottom: 0; }

li.fbs-item {
    border-top: 0;
    border-right: 0;
    border-left: 0;
}

.fbs-attribution {
    border-top: 0;
}

/*
-------------------------------------------------------
Freebase Suggest Typography
-------------------------------------------------------

    establish base typography size by:
    1. Setting parent div to font-size 16px;
    2. Setting inner div to font-size 62.5%, giving us a 10px baseline
    3. Setting global style rules
*/

.fbs-pane,
.fbs-flyout-pane {
    font-size: 16px;
    font-family: Helvetica Neue, Arial, Helvetica, sans-serif;
}

ul.fbs-list,
.fbs-flyout-content,
.fbs-attribution,
div.fbs-header {
  font-size: 62.5%;
}


/* insure <strong> displays bold */
.fbs-pane strong,
.fbs-flyout-pane strong {
  font-weight: bold;
}

/*
-------------------------------------------------------
Freebase Suggest Structure
-------------------------------------------------------
*/

ul.fbs-list,
.fbs-flyout-content,
.fbs-attribution {
    margin: 2px;
}

.fbs-flyout-content { margin-bottom: 0; }
.fbs-attribution    { margin-top: 0; }

.fbs-pane        { width: 325px; } /* results list container */
.fbs-flyout-pane { width: 319px; margin-left: 3px; } /* flyout container, 3px narrower on each side to create drawer appearance */

ul.fbs-list {    
    max-height: 320px;  
    overflow: auto;
    overflow-x: hidden;
    border-bottom: 0;
}

.fbs-flyout-content,
.fbs-attribution {
  padding: 5px;
}

.fbs-flyout-content:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
  

/*
-------------------------------------------------------
Freebase Suggest Results List
-------------------------------------------------------
*/

/* each .fbs-item is a single returned result */
li.fbs-help-on-focus,
li.nomatch {
    padding: 6px 8px 7px 6px;
    font-size: 1.4em;
    line-height: 1;
}

/* show more results */
li.fbs-more { padding: 0; background: transparent;}

a.fbs-more-link {
    display: block;
    padding: 4px;
    font-weight: bold;
    font-size: 12px;
}

.fbs-more .fbs-help {
    display: none;
}

.fbs-header {
    font-weight: bold;
    padding: 4px 6px;
    margin: 2px 2px -2px 2px;
}


.fbs-item-alias,
.fbs-item-type,
.fbs-item-name {
    display:block;
    overflow: hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.fbs-item-name {
    padding: 5px 8px 4px 6px;
    font-size: 1.4em;
    line-height: 1;
}

/* result name */
.fbs-item-name strong {
    font-weight: bold;
}

/* hover state of .fbs-item */
li.fbs-selected { 
    cursor: pointer;
}

/* what the object is */
.fbs-item-type  {
    font-size: 0.9em;
}

/* also known as */
.fbs-item-alias {
    float: right;
    max-width: 40%;
    vertical-align:bottom;
}
.fbs-item-alias:before { content:'...'; }

/*
-------------------------------------------------------
Freebase Suggest No Results
-------------------------------------------------------
*/

li.nomatch {
    padding: 0;
}

.fbs-nomatch-text {
    display: block;
    font-weight: bold;
    line-height: 1;
}

.fbs-nomatch-text,
.nomatch h3,
ul.fbs-search-tips {
    padding: 6px 8px 7px 6px;
}

.nomatch h3 {
    font-weight: bold;
}

ul.fbs-search-tips li {
  list-style: disc;
  margin-left: 1.6em;
  margin-bottom: 0.3em;
}

/*
-------------------------------------------------------
Freebase Suggest Create New
-------------------------------------------------------
*/

/* suggest new container */
.fbs-suggestnew {
    padding: .4em .3em .5em 8px;
}

.fbs-suggestnew-button {
    cursor: pointer;
    padding: 0.2em 0.3em;
    margin-left: 0px !important;
    max-width: 17em;
}

.fbs-suggestnew-description { margin-bottom: 0.6em; }

/* (Shift + Enter) */
.fbs-more-shortcut,
.fbs-suggestnew-shortcut {
  margin-left: 0.4em;
  font-size: 90%;
}

/*
-------------------------------------------------------
Freebase Suggest Flyout Elements
-------------------------------------------------------
*/

/* the object title */
h1#fbs-flyout-title {
    font-size: 1.4em;
    font-weight: bold;
    margin-bottom: 0.5em;
    margin-top: 0.3em;
}

/* denotes topic, type, view, base, etc. */
#fbs-flyout-title .fbs-flyout-label {
    font-weight: normal;
}

/* Image for single topic result */
#fbs-topic-image {
    float: left;
    padding: 1px;
    margin-right: 5px;
    margin-bottom: 5px;
}

/* Image pair for views/base/etc. */
.fbs-flyout-images {
    float: left;
    margin: 0 10px 0 0;
    padding: 1px 0 1px 1px;
}

.fbs-flyout-images img {
    float:left;
    margin-right: 1px;
}

.fbs-flyout-subtitle {
    font-size: 1.1em;
    margin-bottom: 0.5em;
}

.fbs-flyout-pane h3 {
    font-size: 1em;
    line-height: 1.4;
    margin-bottom: 0.25em;
}

.fbs-properties-header {
    font-size: 1em;
    font-weight: bold;
    margin: 0.5em 0;
}

h3.fbs-topic-properties {
    font-size: 1.2em;
    font-weight: bold;
}

.fbs-topic-properties strong {
    display: block;
    font-size: 0.8em;
}

.fbs-flyout-pane p {
  font-size: 1.2em;
  line-height: 1.4;
}

/* this class is applied with fbs-topic-flyout when a thumbnail is present
   in order to provide a fixed margin on text to prevent poor text wrapping
   around thumbnail
*/
p.image-true,
h3.image-true,
h1.image-true { margin-left: 85px; }

.fbs-meta-info { margin-left: 110px; }

/* generic flyout list */
.fbs-flyout-list li {
    font-size: 1em;
    margin-left: 15px;
}

#fbs-domain-flyout #fbs-flyout-title { margin-bottom: 0.5em; }

/*
-------------------------------------------------------
Freebase Suggest Attribution
-------------------------------------------------------
*/

.fbs-attribution {
    padding-right: 72px; /* accommodate attribution background image */
    background-image: url(http://suggest.freebaseapps.com/fbs-attribution);
    background-repeat: no-repeat;
    background-position: center right;
    min-height: 15px;
}

.fbs-flyout-types {
    font-style: italic;
    line-height: 1; 
    font-size: 1.2em;
}



/*
---------------------------
text expand
----------------------------
*/
.fbs-icon-text-expand {
    background:transparent url(http://www.freebase.com/resources/images/templates/topic/icon-text-input-expand-contract.gif) no-repeat scroll 0 0;
    border:0 none;
    margin:0;
    padding:1px 6px;
    vertical-align: bottom;
}
.fbs-icon-text-collapse {
    background:transparent url(http://www.freebase.com/resources/images/templates/topic/icon-text-input-expand-contract.gif) no-repeat scroll 0 -25px;
    border:0 none;
    float:right;
    height:16px;
    margin:3px 3px 0 0;
    padding:0;
    width:16px;
}

.fbs-expand-pane {
    border:2px solid #006EE9;
    width:250px;
}

.fbs-expand-textarea {
    min-height:200px;
    height:200px;
    width:250px;
    border:0 none;
    margin:0;
}
.fbs-expand-toolbar {
    background:#F2F2F2 none repeat scroll 0 0;
    border-top:1px solid #CCCCCC;
    color:#818181;
    font-size:0.9em;
    min-height:20px;
}
.fbs-expand-charcounter {
    padding:5px 25px 5px 10px;
}
/*

-------------------------------------------------------
Freebase SuggestIE Hacks
-------------------------------------------------------
We can't use conditional comments so we have to resort
to inline Internet Explor fixes

*/

* html .fbs-list,
* html .fbs-list-icons { height: expression( this.scrollHeight > 410 ? "410" : "auto" ); /* sets max-height for IE */ }

* html .fbs-item-alias,
* html .fbs-item-type,
* html .fbs-item-name {
    width : 253px !important;
}

* html .fbs-item-name{ width: 100%; }
* html .fbs-item-alias { display:none; }

* html .fbs-flyout-content:after { height: 1px; }

/*
----------------------------
Temporary hacks
----------------------------
these are just to force some
design changes before we can fully
update the templates.
*/

.fbs-item-type,
.unicode {
  display:none;
}

/* -------------------------------------------------------------- 
   
   
   == STRUCTURE: ========================
    * Page margins:          30px
    * Body width:            950 px
    * Number of columns:     24
    * Column width:          30 px
    * Margin width:          10 px
    * Total Page Width:      1010px
   ======================================
   
   This is a stylesheet with generic classes that can
   be used to prototype templates within the existing
   grid structure on www.freebase.com

   By default, the grid is 950px wide, with 24 columns 
   spanning 30px across, and a 10px margin between columns.
   Each page also has a 30px left and right page margin,
   resulting in a total page width of 1010px.

   If you need fewer or more columns, use this formula to calculate
   the new total width: 

   Total width = (number_of_columns * column_width) - margin_width
   
   ** NOTE: THIS IS FOR PROTOTYPING ONLY. THESE STYLES SHOULD NOT
      BE USED IN OUR PRODUCTION ENVIRONMENT.
      
   For any questions related to this stylesheet, please talk to me.
   
   -- Kai (kai@metaweb.com)
   
-------------------------------------------------------------- */

/* Add this class to #content if you want a visual representation of our grid */
.showgrid {  background: url(/freebase_grid_overlay_png) repeat-y; }
.showgrid #content { background: transparent; }

#content { width: 95em; }

/* Columns
-------------------------------------------------------------- */

/* Sets up basic grid floating and margin. */
div.c-1, div.c-2, div.c-3, div.c-4, div.c-5, div.c-6, div.c-7, div.c-8, div.c-9, div.c-10, div.c-11, div.c-12, div.c-13, div.c-14, div.c-15, div.c-16, div.c-17, div.c-18, div.c-19, div.c-20, div.c-21, div.c-22, div.c-23, div.c-24 {float:left;margin-right: 10px;}

/* The last column in a row needs this class. */
div.last { margin-right: 0; }

/* Use these classes to set the width of a column. */
.c-1  { width: 30px;}
.c-2  { width: 70px;}
.c-3  { width: 110px;}
.c-4  { width: 150px;}
.c-5  { width: 190px;}
.c-6  { width: 230px;}
.c-7  { width: 270px;}
.c-8  { width: 310px;}
.c-9  { width: 350px;}
.c-10 { width: 390px;}
.c-11 { width: 430px;}
.c-12 { width: 470px;}
.c-13 { width: 510px;}
.c-14 { width: 550px;}
.c-15 { width: 590px;}
.c-16 { width: 630px;}
.c-17 { width: 670px;}
.c-18 { width: 710px;}
.c-19 { width: 750px;}
.c-20 { width: 790px;}
.c-21 { width: 830px;}
.c-22 { width: 870px;}
.c-23 { width: 910px;}
.c-24, div.c-24 { width: 950px; margin: 0; }


/* Add these to a column to append empty cols. */
.append-1  { padding-right: 40px;}
.append-2  { padding-right: 80px;}
.append-3  { padding-right: 120px;}
.append-4  { padding-right: 160px;}
.append-5  { padding-right: 200px;}
.append-6  { padding-right: 240px;}
.append-7  { padding-right: 280px;}
.append-8  { padding-right: 320px;}
.append-9  { padding-right: 360px;}
.append-10 { padding-right: 400px;}
.append-11 { padding-right: 440px;}
.append-12 { padding-right: 480px;}
.append-13 { padding-right: 520px;}
.append-14 { padding-right: 560px;}
.append-15 { padding-right: 600px;}
.append-16 { padding-right: 640px;}
.append-17 { padding-right: 680px;}
.append-18 { padding-right: 720px;}
.append-19 { padding-right: 760px;}
.append-20 { padding-right: 800px;}
.append-21 { padding-right: 840px;}
.append-22 { padding-right: 880px;}
.append-23 { padding-right: 920px;}


/* Add these to a column to prepend empty cols. */
.prepend-1  { padding-left: 40px;}
.prepend-2  { padding-left: 80px;}
.prepend-3  { padding-left: 120px;}
.prepend-4  { padding-left: 160px;}
.prepend-5  { padding-left: 200px;}
.prepend-6  { padding-left: 240px;}
.prepend-7  { padding-left: 280px;}
.prepend-8  { padding-left: 320px;}
.prepend-9  { padding-left: 360px;}
.prepend-10 { padding-left: 400px;}
.prepend-11 { padding-left: 440px;}
.prepend-12 { padding-left: 480px;}
.prepend-13 { padding-left: 520px;}
.prepend-14 { padding-left: 560px;}
.prepend-15 { padding-left: 600px;}
.prepend-16 { padding-left: 640px;}
.prepend-17 { padding-left: 680px;}
.prepend-18 { padding-left: 720px;}
.prepend-19 { padding-left: 760px;}
.prepend-20 { padding-left: 800px;}
.prepend-21 { padding-left: 840px;}
.prepend-22 { padding-left: 880px;}
.prepend-23 { padding-left: 920px;}


/* Use these classes on an element to push it into the 
   next column, or to pull it into the previous column.  */

.pull-1  { margin-left: -40px;}
.pull-2  { margin-left: -80px;}
.pull-3  { margin-left: -120px;}
.pull-4  { margin-left: -160px;}
.pull-5  { margin-left: -200px;}
.pull-6  { margin-left: -240px;}
.pull-7  { margin-left: -280px;}
.pull-8  { margin-left: -320px;}
.pull-9  { margin-left: -360px;}
.pull-10 { margin-left: -400px;}
.pull-11 { margin-left: -440px;}
.pull-12 { margin-left: -480px;}
.pull-13 { margin-left: -520px;}
.pull-14 { margin-left: -560px;}
.pull-15 { margin-left: -600px;}
.pull-16 { margin-left: -640px;}
.pull-17 { margin-left: -680px;}
.pull-18 { margin-left: -720px;}
.pull-19 { margin-left: -760px;}
.pull-20 { margin-left: -800px;}
.pull-21 { margin-left: -840px;}
.pull-22 { margin-left: -880px;}
.pull-23 { margin-left: -920px;}
.pull-24 { margin-left: -960px;}

.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12, .pull-13, .pull-14, .pull-15, .pull-16, .pull-17, .pull-18, .pull-19, .pull-20, .pull-21, .pull-22, .pull-23, .pull-24 {float:left;position:relative;}


.push-1  { margin: 0 -40px 1.5em 40px;}
.push-2  { margin: 0 -80px 1.5em 80px;}
.push-3  { margin: 0 -120px 1.5em 120px;}
.push-4  { margin: 0 -160px 1.5em 160px;}
.push-5  { margin: 0 -200px 1.5em 200px;}
.push-6  { margin: 0 -240px 1.5em 240px;}
.push-7  { margin: 0 -280px 1.5em 280px;}
.push-8  { margin: 0 -320px 1.5em 320px;}
.push-9  { margin: 0 -360px 1.5em 360px;}
.push-10 { margin: 0 -400px 1.5em 400px;}
.push-11 { margin: 0 -440px 1.5em 440px;}
.push-12 { margin: 0 -480px 1.5em 480px;}
.push-13 { margin: 0 -520px 1.5em 520px;}
.push-14 { margin: 0 -560px 1.5em 560px;}
.push-15 { margin: 0 -600px 1.5em 600px;}
.push-16 { margin: 0 -640px 1.5em 640px;}
.push-17 { margin: 0 -680px 1.5em 680px;}
.push-18 { margin: 0 -720px 1.5em 720px;}
.push-19 { margin: 0 -760px 1.5em 760px;}
.push-20 { margin: 0 -800px 1.5em 800px;}
.push-21 { margin: 0 -840px 1.5em 840px;}
.push-22 { margin: 0 -880px 1.5em 880px;}
.push-23 { margin: 0 -920px 1.5em 920px;}
.push-24 { margin: 0 -960px 1.5em 960px;}

.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12, .push-13, .push-14, .push-15, .push-16, .push-17, .push-18, .push-19, .push-20, .push-21, .push-22, .push-23, .push-24 {float:right;position:relative;}

/* Misc classes and elements
-------------------------------------------------------------- */

/* Use a .box to create a padded box inside a column.  */ 
.box { 
  padding: 1.5em; 
  margin-bottom: 1.5em; 
  background: #E5ECF9; 
}

/* Use this to create a horizontal ruler across a column. */
hr {
  background: #ddd; 
  color: #ddd;
  clear: both; 
  float: none; 
  width: 100%; 
  height: .1em;
  margin: 0 0 1.45em;
  border: none; 
}

hr.space {
    color: #fff;
    background: #fff;
}

/* Border on right hand side of a column. */
div.border {
  padding-right:4px;
  margin-right:5px;
  border-right: 1px solid #eee;
}

/* Border with more whitespace, spans one column. */
div.colborder {
  padding-right:28px;
  margin-right:25px;
  border-right: 1px solid #eee;
}

p {
  margin-bottom: 1.5em;
}

img.left {float:left;margin:0 1.5em 1.5em 0;padding:0;}
img.right {float:right;margin:0 0 1.5em 1.5em;}
/* @override http://tippify.freebaseapps.com/recommend_css */

/*
--------------------------------------
GLOBAL RESET
--------------------------------------
 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

caption, th, td {
    text-align: left;
    font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
}

blockquote, q {
    quotes: "" "";
}

strong { font-weight: bold; }

/*
--------------------------------------
GLOBAL TYPE SIZES
--------------------------------------
 */

/*
    Default browser types size is 16px (assuming the user has not customized their settings).
    Assuming this default, we set the body to a font size of 62.5%, which effectively
    resets our default type size to 10px. From here, we can think of font-size in terms of
    pixels, but set font-size in ems. For example, 1em = 10px, 0.9em = 9px, 1.2em = 12px.
*/

h1, h2, h3, h4, h5, h6 {font-weight:normal;}

p  {font-size: 1.2em;}
h1 {font-size:2em;line-height:1;margin-bottom:0.5em;}
h2 {font-size:2em;margin-bottom:0.75em;}
h3 {font-size:1.5em;line-height:1;margin-bottom:1em;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}

body {
  font-size: 62.5%; /* 10px */
  line-height: 1.5;
/*  background: #191816 url(/img/body-bg) repeat-x; */
  background: #33312D;
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;;
  color: #666;
}

/*
--------------------------------------
GLOBAL CLASSES
--------------------------------------
 */

a:link {
  color: #1C6B8A;
  text-decoration: none;
  cursor: pointer;
}
a:visited {
    color: #5c8aa3;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}

/*  Generic class for self-clearing block level elements with floated children */
.clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clear { min-height: 1%; zoom: 1; }


/*
-------------------------
Header
-------------------------
*/

#header {
  margin: 0 auto;
  width:  96em;
  position: relative;
  min-height: 68px;
}

#header a {
  color: #BBB5A9;
}

#logo {
  text-indent: -9999px;
  background: url(/img/tippify-logo-red) no-repeat;
  width: 122; height: 65px;
  position: absolute;
  top: 21px;
  z-index: 1;
  left: 30px;
}

#logo a {
  display: block;
  width: 140px;
  height: 67px;
  color: #333;
  text-decoration: none;
}

#user-session {
  position: absolute;
  right: 10px;
  bottom: 5px;
  font-size: 1.2em;
  color: #ececec;
}

#nav-account {
  position: absolute;
  height: 33px;
  left: 150px; top: 35px;
  background: #fff;
  padding: 0 1em;
  -moz-border-radius-topright: 10px;
  -webkit-border-top-right-radius: 10px;
}

#nav-account li {
  float: left;
  padding-right: 1em;
  margin: 0.8em 0.5em 0 0.5em;
  list-style: none;
  border-right: 1px solid #333;
}

#nav-account li.last {
  border: 0;
}

#nav-account li a {
  display: block;
  font-size: 1.4em;
  font-weight: bold;
  color: #333;
}

#nav-global,
.site-search {
  display: none;
}

/*
-----------------
Structure
-----------------
*/

body {
    text-align: center;
}

#content {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  text-align: left;
  background: #fff;
  width: 90em;
  margin: 0 auto 2em auto;
  padding: 2em 3em;
}

.ie #content {
    width: 96em;
}

.ie #header {
    height: 68px;
}

.ie .topic-input {
    height: 1%;
}

.ie .current-selection {
    width: 11em;
}

#content-main {
  float: left;
  width: 60em;
  margin-right: 3em;
  text-align: left;
}

#content-sub {
  float: left;
  width: 27em;
}

.fbs-item,
.fbs-flyout-pane {
  text-align: left;
}

.fbs-pane,
.fbs-expand-pane,
.fbs-flyout-pane {
  z-index: 2000;
}

.freebase-attribution {
  display: inline-block;
  margin: 1em auto;
  text-align: left;
  color: #f8f8f8;
  font-size: 1.2em;
}

.ie .freebase-attribution {
  width: 40em;
}

.freebase-attribution a {
  color: #cf7e47;
}

/*
-------------------
Message Classes
-------------------
*/

.sys-message {
  padding: 1em;
  font-size: 1.4em;
  color: #666;
  border-top: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
  background-color: #FFFCEB;
}

/*
-------------------
Logged-in Homepage
-------------------
*/

/* recommendation form */

#user-recommends {
  display: block;
  margin: 1em 0 0.5em;
  font-size: 2.6em;
  color: #2F3B41;
  min-height: 30px;
  line-height: 1.9;
}

#user-recommends img {
    float: left;
    margin-right: 10px;
    border: 1px solid #a9a9a9;
    padding: 1px;
}

#recommend-form {
  position: relative;
  padding: 2em;
  background: #CF7E47;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
}

#recommend-bubble {
  display: block;
  position: absolute;
  left: 57px;
  top: -11px;
  width: 19px; height: 16px;
  background : url(/img/tastely-sprite_png) no-repeat;
}

#username, .topic-input {
  float: left;
  padding: 5px 4px;
  width: 325px;
  border: 0;
  border: 2px solid #C2733E;
  font-size: 14px;
  color: #999;
  margin-top:0;
}

#topic-field.valid .topic-input {
  color: #444;
}

#topic-field.valid .dropdown .current-selection {
  color: #444;
}

.ghost-text {
  color: #999;
}

#username.focus {
  color: #333;
}

.topic-input {
  width: 387px;
}

#recommends-label, .comment-label {
  font-size: 14px;
  color: #fff;
  padding-left: 5px;
}

#comment-field {
  margin-top: 1em;
}

.comment-label {
  display: block;
  margin-bottom:  0.2em;
  font-size:  1.4em;
  color: #fff;
  padding-left: 0;
}

#rec-comment-counter {
  float: right;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.4em;
  margin-right: 10px;
  margin-top:  0.2em;
  color: #fff;
  padding-left: 0;
}

textarea.comment {
  width: 550px;
  padding: 4px;
  border: 2px solid #C2733E;
}

textarea.rec-comment {
  width: 550px;
  background-color: transparent;
  border: 0px;
}

textarea.rec-comment.editing {
  background-color: white;
  border: 1px;
}

#username-field {
  margin-bottom: 2em;
}

.dropdown {
  float: left;
  background: #fff;
  position: relative;
  margin-right: 5px;
}

.dropdown select {
  width: 11em;
  opacity: 0;
  filter: alpha(opacity=0); /* die IE */
  position: absolute;
  left: 0;
  top: 0.5em;
  font-size: 1.4em;
}

.current-selection {
  display: block;
  font-size: 1.4em;
  line-height: 1;
  color: #999;
  width: 9.4em;
  padding: 0.45em 0.8em 0.5em 0.8em;
  background: #fefefe url(/select-arrows) no-repeat 9.4em 0.35em;
  border: 2px solid #C2733E;
}

.unicode {
  float: right;
  margin: 5px 5px 0 2px;
  font-size: 8px;
  font-family: monospace;
}

/*
-----------------------------------------
Logged-in homepage news stream
-----------------------------------------
*/

.index #topic-title {
  margin-left:0;
  margin-bottom: 0;
}

.index .lead {
  margin-top: 0.5em;
  margin-bottom: 1em;
}

#current-recommendations {
  padding: 3.5em 0;
}

.index #current-recommendations {
  padding: 0;
}

.ie .sample-recommendations {
  clear: left;
  zoom: 1;
  overflow: hidden;
}

.ie #sample-recommendations,
.ie #save-recommendations {
  zoom: 1;
  clear: left; 
}

#sample-recs-header {
  color: #666;
  font-weight: bold;
  margin-bottom: 1em;
  padding: 0.4em 0 0.6em;
  border-top: 1px solid #a9a9a9;
  border-bottom: 1px solid #a9a9a9;
}

#current-recommendations.loading {
  background: url(/img/horizontal-loader-lrg) no-repeat 10px 10px;
}

#current-recommendations .more-link {
  display: block;
  clear: both;
  margin-top: 1em;
  border: 1px solid #ececec;
  text-align: center;
  background: #f8f8f8;
  font-size: 1.4em;
  padding: 0.4em;
}

#current-recommendations .more-link:hover {
  text-decoration: none;
  background: #f1f1f1;
}

#recommendation-list {
  position: relative;
  clear: left;
}

.optional-label {
  font-size: 0.7em;
  color: #ccc;
}

.recommendation-item,
.comment-item {
  clear: left;
  position: relative;
  padding: 1em;
  border-bottom: 1px solid #ececec;
  min-height: 9em;
}

.ie .recommendation-item {
  height: 9em;
}

.recommendation-item:hover, .recommendation-item.hover {
  background-color: #f8f8f8;
}

.index #current-recommendations .recommendation-item {
  background: #eefafe;
  border-left: 1px solid #ececec;
  border-right: 1px solid #ececec;
}

.rec-tools {
  position: absolute;
  right: 5px;
  top: 1em;
  visibility: hidden;
}

div#current-recommendations div.recommendation-item:hover .rec-tools,
div#current-recommendations div.recommendation-item.hover .rec-tools
{
  visibility: visible;
}

.rec-tools a, .rec-tools span {
  float: left;
  font-size: 1.1em;
  margin-left:5px;
  min-height: 16px;
}

.rec-tools a {
  padding-left: 19px;
  background: url(/img/icons_png) no-repeat;
}

a.rec-tool-delete {
  background-position: 0 -88px;
}

a.rec-tool-edit {
  background-position: 0 -132px;
}

.ie .rec-tool-edit {
  display: none;
}

.recommendation-type {
  display: block;
  font-size: 1.2em;
  text-transform: lowercase;
  color: #999;
  margin-bottom: 0.3em;
}

.recommendation-type strong {
  color: #666;
}

.recommendation-item h4 {
  font-size: 1.4em;
  margin-bottom: 0;
}

.recommendation-item p,
.comment-item  p {
  font-size: 1.3em;
  color: #333;
  margin-top: 0.5em;
  padding-left: 15px;
}

.recommendation-item p:after,
.comment-item p:after {
  content: "\201D";
}

.recommendation-item p.old-empty-blurb {
  background: #fffceb;
  border-top: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
  padding: 0.3em;
  font-size: 1.4em;
}

.recommendation-item p.empty-blurb:after {
  content: "";
}

.recommendation-item img,
.comment-item img {
  float: left;
  border: 1px solid #999;
  padding: 2px;
  background: #fff;
  margin-right: 15px;
}

.recommendation-blurb {
  position: relative;
}

.left-quote {
  position: absolute;
  left: 5px; top: 0;
  font-size: 2.1em;
  font-family: Georgia, 'Times New Roman', serif;
  color: #999;
  line-height: 1;
}

.right-quote {
  font-family: Georgia, 'Times New Roman', serif;
  color: #999;
  font-size: 1.8em;
  line-height: 0;
}

.recommendation-item h4,
.recommendation-item .recommendation-blurb {
  margin-left: 75px;
}

.comment-item .recommendation-blurb {
  margin-left: 4em;
  margin-top: -0.6em;
}

.recommendation-timestamp {
  color: #999;
  margin-left: 90px;
}

.recommendation-meta-info {
  font-size: 1.2em;
  margin-left: 4.6em;
  color: #8C8C8C;
}

/*
---------------------
Stream Filters
---------------------
*/

#recommend-list-header {
  position: absolute;
  right: 5px;
  top: 5px;
  height: 3em;
}

.ie #recommend-list-header {
  text-align: right;
}

.filter-group {
  float: left;
  position: relative;
  margin-right: 0.5em;
  min-width: 6em;
}

.ie .filter-group {
  width: 10em;
}

.filter-group h4 {
    margin: 0.3em 0 0 0;
    width: 99%;
    text-transform: capitalize;
}

.filter-group h4 a {
  display: block;
  background: url(/img/select-arrows) no-repeat right top;
  border: 2px solid #ececec;
  color: #777;
  cursor: pointer;
  height: 12px;
  line-height: 12px;
  margin: 0 0 10px 10px;
  overflow: hidden;
  padding: 3px 4px;
  width: 8em;
} 

.ie .filter-group h4 a {
  height: 2em;
}

.ie .filter-header a {
    padding-right: 25px;
}

.filter-group h4 a:hover {
  color: #555;
  text-decoration: none;
}
.filter-group h4 a.filter-group-selected {
  background: #33312D;
  color: #fff;
  text-decoration: none;
}

ul.filters {
  display: none;
  position: absolute;
  z-index: 1;
  margin: 0;
  top: 0em;
  left: 0;
  width: 15em;
  background: #33312D;
  list-style-type: none;
}

.ie ul.filters li.filter-param {
  zoom: 1;
}

.ie #type-filters {
  margin-left: -4em;
}

.ie #type-filters,
.ie #people-filters {
  margin-top: -7em;
}

ul.filters li input {
  display: none;
}

ul.filters li label {
  display: block;
  color: #fff;
  padding: 0.5em 1em 0.5em 20px;
  border-bottom: 1px solid #43403A;
}

.ie ul.filters li label {
    height: 1em;
}


label.selected {
  background: url(/img/checkmark_png) no-repeat 5px center;
}

ul.filters li label:hover,
ul.filters li label.hover
{
  cursor: pointer;
  background-color: #43403a;
}

/* Vizualization buttons */

#view-type {
  margin-top: 0.3em;
}

#view-type li {
  float: left;
  list-style: none;
}

#view-type li input {
  display: none;
}

#btn-view-stream label,
#btn-view-gallery label {
  display: block;
  text-indent: -9999px;
  text-align: left;
  width: 45px;
  height: 23px;
  background: url(/img/viz-toggle_png) no-repeat;
}

#btn-view-stream label:hover,
#btn-view-gallery label:hover {
  cursor: pointer;
}

/* Stream View */
#btn-view-stream label:hover { background-position: 0 -23px; }
#btn-view-stream label.selected { background-position: 0 -46px;}

/* Gallery View */
#btn-view-gallery label { background-position: -45px 0; }
#btn-view-gallery label:hover { background-position: -45px -23px; }
#btn-view-gallery label.selected { background-position: -45px -46px; }


/*
-----------------------------
Side column 
-----------------------------
*/

#user-profile {
  background: #8BA4A2;
  padding: 1.5em;
}

#user-profile a {
  color: #F7FCEF;
}

#user-profile img {
  float: left;
  border: 1px solid #ccc;
  padding: 1px;
  background: #fff;
  margin-right: 10px;
}

#user-profile h4 {
  font-size: 1.4em;
  margin-top: 1em;
  margin-bottom: 0;
  color: #F7FCEF;
}

.module {
  margin: 1.25em;
}

.module .view-all {
  font-size: 1.1em;
  font-weight: bold;
  clear: both;
  display: block;
  margin-top: 0.3em;
  margin-left: 5px;
}

#user-rss,
#twitter-publish {
  clear:both;
  font-size: 1.2em;
  background: url(http://www.freebase.com/resources/images/chrome/icons-misc.png) no-repeat 0 0.75em;
  border-top: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
  padding: 0.9em 0 0.8em 20px;
  line-height: 1;
  min-height: 16px;
}

#twitter-publish {
  background: url(/twitter_favicon) no-repeat 0 0.75em;
}

.module-header,
#topic-recommendations-header {
  background: #33312D;
  color: #fff;
  font-size: 1.2em;
  line-height: 1;
  padding: 0.5em;
  margin-bottom: 0;
}

.module-content,
#user-recs ul,
.topic #recommendation-list {
  background: #fff url(/img/tippify-sprite) no-repeat 5px -28px;
}

.ie .module-content {
  zoom: 1;
}

#user-recs .module-header {
    border: 0;
}

#user-recs ul {
  padding-top: 1em;
}

#user-recs li {
  padding: 0 0.5em;
  list-style: none;
  font-size: 1.4em;
  color: #333;
  border-bottom: 1px solid #ececec;
}

#user-recs .count {
  font-size: 18px;
  font-family: Georgia, Times New Roman, serif;
  color: #cf7e47;
  padding-right: 3px;
}

/*
---------------------
Following Users list
---------------------
*/

.users-list {
  padding-top: 1em;
  margin-left: 4px;
  list-style: none;
}

.users-list li {
  float: left;
  padding: 1px;
  background: #fff;
  border: 1px solid #a9a9a9;
  margin: 0 4px 4px 0;
}

.users-list li img {
    display: block;
}

/*
----------------------
User Profile Template
----------------------
*/

#user-overview {
  position: relative;
  padding: 2em;
  margin: 2em 0 3em 0;
  position: relative;
  background: #CF7E47;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
}

#user-overview img {
  float: left;
  margin-right: 10px;
  border: 1px solid #3f3c37;
  background: #fff;
  padding: 1px;
}

#user-overview p {
  font-size: 1.4em;
  color: #fff;
  margin-bottom: 0em;
}

#user-overview #user-name {
  font-size: 1.8em;
  color: #fff;
  text-shadow: #333 0px 1px 1px;
  margin: 0.1em 0 0;
}

#profile-bubble {
  display: block;
  position: absolute;
  width: 16px; height: 14px;
  left: 30px; bottom: -10px;
  background: url(/img/tastely-sprite_png) no-repeat 0 -14px;
}

#user-overview button {
    margin-top: 0.2em;;
}

#user-overview a {
  color: #ece8d0;
  border-bottom: 1px dotted;
}

#user-overview a:hover {
  border-bottom: 1px solid;
  text-decoration: none;
}

/* tabs */
.ui-tabs .ui-tabs-hide {
     display: none;
}

.ui-tabs-nav {
  margin-top: 2.5em;
  padding: 0.1em 1em;
  border-bottom: 1px solid #C5CCC7;
}

.ui-tabs-nav li {
    display: inline;
    font-size: 1.5em;
}

.ui-tabs-nav li a {
  background: #C5CCC7;
  padding: 0.3em 0.5em;
  border: 1px solid #C5CCC7;
  border-bottom: 0;
  color: #666;
}

li.ui-state-active {
  background: #fff;
  border-bottom: 1px solid #fff;
}

li.ui-state-active a {
    position: relative;
    top: 0.1em;
    padding-top: 0.4em;
    background: #fff;
}

.ui-state-active a:hover {
  text-decoration: none;
}

#user-about {
  padding-top: 0.8em;
  list-style: none;
  font-size: 1.2em;
}

#user-about li {
  border-bottom: 1px solid #C5CCC7;
  padding: 0.5em;
}

.prop-title {
  font-weight: bold;
  text-transform: capitalize;
}

/*
-----------------------------
Global Topic Page Styling 
-----------------------------
*/

.topic #content-main {
  width: 63em;
}

.topic #content-sub {
  width: 24em;
  }

#topic-title {
  margin-top: 0.9em;
  font-size: 2.1em;
  color: #cf7e47;
  margin-bottom: 0.7em;
  margin-left: 13px;
}

.byline {
  font-size: 1.4em;
  color: #666;
  margin:0;
}

#topic-summary {
  padding: 1em;
  border: 3px solid #e2e3dc;
  background: #fbfcf0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  margin-bottom: 1em;
  min-height: 100px;
}

.topic-summary-image {
  float: left;
  width: 160px;
}

.topic-summary-content-wrapper {
  margin-left: 160px;
}

.ie .topic-summary-content-wrapper {
  width: 43em;
}

.topic-summary-image .topic-tmb {
  display: block;
  margin: 0 auto;
  border: 1px solid #a9a9a9;
  background: #fff;
  padding: 1px;
  margin-right: 15px;
  margin-bottom: 15px;
}

#topic-summary .blurb {
  color: #333;
  font-size: 1.3em;
  margin-bottom: 1em;
}

.component-header {
  margin-top: 1em;
  font-size: 1.6em;
  color: #666;
  padding-bottom: 5px;
  padding-left: 10px;
  border-bottom: 2px solid #666;
}

.component {
  clear: both;
  margin-bottom: 2em;
}

/* property table */

.property-table {
  width: 100%;
  font-size: 1.2em;
  color: #333;
}

.property-table th {
  vertical-align: top;
  font-weight: bold;
  text-align: left;
  border-top: 1px solid #D2D9D4;
  padding: 0.7em 0.4em;
  width: 17%;
}

.property-table td {
  padding: 0.7em 0.4em;
  border-top: 1px solid #D2D9D4;
}

/* gallery component */

.topic-gallery-item {
  float: left;
  width: 48%;
  margin: 0 1% 1em 1%;
  min-height: 70px;
}

.member-gallery-item {
  float: left;
  width: 31%;
  margin: 0 1% 1em 1%;
  min-height: 50px;
  margin-bottom: 1em;
}

.member-gallery-item h4 {
  font-size: 1.4em;
  margin-bottom: 0;
}

#content-sub .topic-gallery-item {
  float: none;
  width: 99%;
}

.topic .comment-item {
  min-height: 4em;
}

.ie .comment-item .user-tmb {
  position: absolute;
  left: 0;
  top: 1em;
}

.topic-gallery-item img,
.member-gallery-item img {
  float: left;
  padding: 1px;
  border: 1px solid #a9a9a9;
  margin-right: 5px;
  margin-bottom: 5px;
}

.topic-gallery-item h4 {
  font-size: 1.4em;
  margin-bottom: 0;
  color: #333;
}

.property-table .property-details {
  font-size: 0.9em;
}

.property-table .topic-gallery-item {
  width: 32%;
  min-height: 50px;
  margin-bottom: 0.5em;
}

.topic #topic-recommendations-header {
  margin-top: 2em;
  clear: both;
}

#topic-actions {
  border: 2px solid #c4d5cb;
  background: #ebf8f5;
  padding: 1em;
  text-align: center;
  font-size: 1.2em;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  margin-bottom: 1em;
}

#topic-remove-bookmark, #topic-add-bookmark {
  display: block;
  background: #d8cfcd url(/img/1px-vert-sprite_png) repeat-x 0 -200px;
  border:1px solid #ACA3A1;
  color: #666;
  padding:0.5em 1em;
  line-height: 1;
  margin: 0 auto 0.4em;
  width: 70%;
  font-size: 12px;
  font-weight: bold;
}


a#topic-remove-bookmark:hover, a#topic-add-bookmark:hover,
#btn-topic-recommend:hover,

{
  color: #222;
  cursor: pointer;
}

.person-summary {
  min-height: 13em;
}

.ie .person-summary {
  height: 13em;
}

.person-summary img {
  float: left;
  top: 1em; left:10px;
  border: 1px solid #a9a9a9;
  padding: 1px;
  background: #fff;
  margin-left: 10px;
}

.person-summary p,
.person-summary .blurb,
.person-summary h3 {
  margin-left: 110px;
}

.person-summary .blurb,
.person-summary .blurb p {
    font-size: 1.2em;
}

.freebase-infobox {
  font-size:1.2em;
  text-align:center;
  padding: 1em;
}


/* Weblinks */

.album-weblinks .weblink a {
  font-size: 1em;
}

.album-weblinks {
  list-style-type: none;
  margin-bottom: 0.5em;
  margin-top:3px;
  float: left;
}

.album-weblinks li {
  width:100%;
}

#weblinks-header {
  font-size:1.3em;
  font-weight: bold;
  border-bottom:1px solid #666666;
  padding:8px 5px;
}

#weblinks {
    list-style-type: none;
    margin-bottom: 0.5em;
    margin-top:3px;
}

#weblinks li {
    display: inline-block;
    width:100%;
}

.weblink a {
    display: block;
    padding: 0.3em 0.4em 0.3em 35px;
    border-bottom: 1px solid #ececec;
    font-size: 1.2em;
    background: url(/img/weblinks-sprite_png) no-repeat 8px 4px;
}

.weblink.last a {
    border-bottom:0px;
}
.weblink a:hover {
    text-decoration: none;
    background-color: #f8f8f8;
}

/* Specific Icons for URI templates */

.weblink-wikipedia-topic-en_id a    { background-position: 8px -547px;} /* Wikipedia */
.weblink-nytimes-topic-uri a        { background-position: 8px -272px; } /* NY Times */
.weblink-imdb-topic-name_id a,
.weblink-imdb a      { background-position: 8px -179px; } /* IMDB */
.weblink-film-actor-netflix_id a,
.weblink-netflix a     { background-position: 8px -225px; } /* Netflix */
.weblink-tv-tv_program-thetvdb_id a { background-position: 8px -409px;} /* TheTVDB */
.weblink-internet-social_network_user-twitter_id a     { background-position: 8px -363px;} /* Twitter */
.weblink-user-narphorium-people-nndb_person-nndb_id a  { background-position: 8px -455px;} /* NNDB */
.weblink-book-written_work-isfdb_id a,
.weblink-book-literary_series-isfdb_id a { background-position: 8px -597px; }
.weblink-tv-tv_program-tvrage_id a { background-position: 8px -642px; } /* TV Rage */
.weblink-lastfm a { background-position: 8px -686px; }
.weblink-google a { background-position: 8px -738px; }
.weblink-amazon a { background-position: 8px -317px; }
.weblink-freebase a { background-position: 8px -784px; }
/*
-------------------
Marketing Homepage
-------------------
*/

.index #topic-title {
  font-size: 2.6em;
  margin-bottom: 1em;
}

#lead-header,
#lead-header-save,
.index #user-recommends {
  font-size: 2.1em;
  color: #404F56;
  font-weight: normal;
  margin-left: 25px;
  margin-bottom: 20px;
}

.index #user-recommends {
  line-height: 1.5;
}

#lead-header-save {
 margin-bottom: 0;
  margin-left: 0;
}

p.lead {
  margin: 2em 0;
  font-size: 1.5em;
  line-height: 2;
  color: #404F56;
}

.lead strong {
  color: #cf7e47;
}

#signup-lead-header {
  font-weight: bold;
  color: #cf7e47;
}

#signup-lead-header + p.lead {
  margin-top: 0;
}

#recommend-container {
  position: relative; /* to position save button */
}

a#save-recommendations {
  display: block;
  text-align: center;
  background: #FFFFCC;
  color: #222;
  padding: 0.3em 0.8em;
  text-decoration: none;
  font-size: 15px;
  border: 1px solid #ececec;
  border-bottom: 0;
  margin-top: 10px;
}

a#save-recommendations:hover {
  background: #E7F0F0;
}

.index p.lead {
  line-height: 1.4;
}

a#save-recommendations em {
  color: #cf7e47;
}

/* marketing copy */
.callout-module {
  padding: 1em 1.5em;
  background: #C5CCC7;
  border: 1px solid #C5CCC7;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
}

#marketing-login {
  margin: 2.5em 0;
}

.callout-module h3 {
  font-size: 1.4em;
  margin-bottom: 0.8em;
}

.callout-module p {
  margin-bottom: 0;
  font-size: 1.1em;
}

.callout-module h3,
.callout-module p {
  color: #131B20;
}

.big_button {
  margin-top: 1em;
  background: #d8cfcd url(/img/1px-vert-sprite_png) repeat-x 0 -200px;
  border:1px solid #ACA3A1;
  color: 666#;
  font-size:12px;
  padding:0.5em 1em;
}

.ie .big_button {
  line-height: 1;
  padding-top: 0.7em;
}

.big_button:hover {
  color:  #333;;
  cursor: pointer;
  background: #d8cfcd url(/img/1px-vert-sprite_png) repeat-x 0 -200px;
}

.marketing-copy {
  border: 0;
  padding: 1em 1.5em;
}

.marketing-copy h4 {
  font-size: 1.4em;
  font-weight: bold;
  margin-bottom: 0.4em;
  color: #cf7e47;
}

.marketing-copy h4#twitter-header span {
  padding-right: 20px;
  background: url(/twitter_favicon) no-repeat center right;
}

.marketing-copy p {
  color: #333;
  margin-bottom: 1em;
}

#btn-signup {
  padding: 0.7em;
  font-size: 1.4em;
  color: #fff;
  background: #cf7e47;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

#btn-signup:hover {
  text-decoration: none;
}

.gallery-entry {
  float: left;
  width: 98px;
  min-height: 120px;
  text-align:center;
  line-height: 1;
}

.gallery-entry img {
  display: block;
  margin: 0 auto;
  border: 1px solid #a9a9a9;
  padding: 1px;
  background: #fff;
}

.gallery-entry h4 {
  margin-top: 0.3em;
  line-height: 1.1;
}

/*
---------------------
Twitter Publish Page
---------------------
*/

.share .lead {
  margin: -2em 0 0 0;
  line-height: 1.8
}

.sample-tweet {
  border-bottom: 1px dashed rgb(210, 218, 218);
  border-top: 1px dashed rgb(210, 218, 218);
  line-height: 1.1em;
  padding: 0.7em 0px 0.6em 0px;
  position: relative;
}

.sample-tweet img {
  display: block;
  height: 50px;
  left: 0px;
  margin: 0px 10px 0px 5px;
  overflow: hidden;
  position: absolute;
  width: 50px;
}

.twitter-body {
  display:block;
  line-height:1.1;
  margin-left: 65px;
  min-height: 50px;
  width: 420px;
}

.twitter-text {
  color: #333333;
  font-family: 'Lucida Grande', sans-serif;
  font-size: 1.4em;;
}

.twitter-timestamp {
  color: #999999;
  font-family: georgia;
  font-size: 1.1em;
  font-style: italic;
  margin: 3px 0 0;
}

.twitter-timestamp > a {
  color: #999999;
}

#twitter-publish-form {
    background: #eaf2f3;
    padding: 1em;
    border: 1px solid #ccc;
    margin: 1em 0 2em 0;
}

#twitter-publish-form label {
  font-size: 1.4em;
  display: block;
  margin-bottom: 0.3em;
}

.share h3 em {
   font-weight: bold;
}

/*
---------------------
Find Users List
---------------------
*/

#find-users-title,
.find-people #content h1 {
  margin-top: 0.9em;
  font-size: 2.1em;
  color: #cf7e47;
  margin-bottom: 1em;
}

.find-people .ui-tabs-nav {
  margin-top: 5em;
  margin-bottom: 3em;
}
  

.user-list-full {
  list-style: none;
}

.user-list-full li {
  position: relative;
  padding: 1em 0 1em 0;
  margin-top: 1em;
  border-top: 1px solid #ececec;
  min-height: 5em;
}

.user-list-full li h3,
.user-list-full li p {
  margin-left: 65px;
}
 
.user-list-full .follow-user {
float: right;
  margin-left: 10px;
}

.user-list-full .follow-user .following-button {
  border-color: #999;
}

.user-list-full li a.user-tmb {
  position: absolute;
  left: 0; top: 1em;
  padding: 1px;
  border: 1px solid #a9a9a9;
  margin-right: 10px;
  margin-bottom: 10px;
}

.user-tmb img {
  display: block;
}

.user-list-full li h3 {
  margin-bottom: 0.2em;
  font-size: 1.6em;
}

.user-list-full li p {
  font-size: 1.2em;
  margin-bottom: 0;
}

.user-list-full .user-meta-info {
    font-size: 11px;
    color: #999;
}

/*
-----------------------
Find People Form
-----------------------
*/

#search-people-form {
  float:right;
}

#invite-friends-email-form {
  width: 56em;
  padding: 2em;
  background: #f8f8f8;
  margin-bottom: 2em;
}

#invite-friends-email-form label {
  display: block;
  font-weight: bold;
  font-size: 1.4em;
  color: #666;
  margin-bottom: 0.2em;
}  

#invite-friends-email-form fieldset {
  margin-bottom: 2em;
}

#full_name {
  width: 560px;
}

.sample-email {
  padding: 2em;
  width: 56em;
  border: 2px solid #999;
}

.sample-email p {
  font-size: 1.4em;
}

/*
-------------------
New User Callout
-------------------
*/

#new-user-callout,
.system-message {
  background: #eaf2f3;
  padding: 1em;
  border: 1px solid #ccc;
  margin-top: 1em;
}

#new-user-callout h2 {
  color: #333;
  font-weight: bold;
  font-size: 1.8em;
  margin-bottom: 0.5em;
}

.system-message p strong{
    color: #cf7e47;
}

#new-user-callout p,
.system-message p {
  font-size: 1.6em;
  margin-bottom: 0.6em;
}

#join-callout {
    display: block;
    font-size: 1.2em;
    margin-bottom: 0.5em;
    margin-top: 20px;
    color: #333;
}

#join-callout strong {
  font-weight: bold;
}

#join-callout a {
    float: left;
    margin-top: -0.3em;
    margin-right: 5px;
    background:#CF7E47 none repeat scroll 0 0;
    color:#FFFFFF;
    line-height: 1.2;
    padding: 0.4em 0.7em;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}



/*
----------------------
Not Following Callout
----------------------
*/

#empty-bookmark {
  margin-top: 2em;
}

#not-following {
  padding-top: 3em;
  margin-bottom: -3em;
}

#not-following h3,
#empty-bookmark h3,
#empty-recommendations h3 {
    color: #CF7E47;
    font-size: 1.6em;
}

#not-following p,
#empty-bookmark p,
#empty-recommendations p {
    font-size: 1.4em;
    margin-bottom: 0.8em;
}

#not-following input {
    border: 0;
    font-size: 1.4em;
    color: #888;
    padding: 0;
    margin: 0;
}


/*
-----------------------
Help Template 
-----------------------
*/  

.help .lead { 
    margin-bottom: 1em;
}  

.faq  {
    margin-left: 1.5em; 
}

.faq li {
    margin-bottom: 1em;
}

.faq h3 {
    color: #333;
    font-weight: bold;
    font-size: 1.4em;
    margin-bottom: 0.4em;
}

.faq li p {
    font-size: 1.4em;
}

/*
-----------------------
Rec Detail
-----------------------
*/

.rec #content-main {
  width: 70em;
  float: none;
  margin: 3em auto 0;
  border: 3px solid #e2e3dc;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}

.rec #content-main .user-tmb {
  float: left;
  margin-right: 10px;
  padding: 1px;
  border: 1px solid #a9a9a9;
}

/* User Recommendation component */

#user-recommendation {
  border: 2px solid #cccccc;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  background:url(/img/bg-rec_png) top left repeat-x #eefafe;
  padding: 2em 2em 1.5em;
  margin-top:2em;
}

.user-rec-right {
  margin-left: 55px;
}

#user-recommendation .user-tmb img {
  padding:1px;
  border: 1px solid #ccc;
  float:left;
  margin-right:10px;
  background:#fff;
}

h1.rec-user-tag {
  font-size:1.4em;
  font-weight:bold;
  color:#797979;
}

.rec-user-tag a {
  color:#cf945e;
}

#user-recommendation p {
  font-weight: bold;
  color: #424242;
}

 #user-recommendation .dtreviewed, 
.additional-info {
  font-weight:bold;
  color:#a9a9a9;
  font-size:1.2em;
}

.additional-info {
  font-weight: bold;
  margin-left: 10px;
}

.rec #content-main h1 {
  font-size: 2.1em;
  line-height: 1.3;
  margin-bottom: 0;
}

.rec #content-main .description {
  font-size: 2.4em;
  line-height: 1.2;
  margin-top: 0.5em;
  color: #333;
}

.rec #topic-summary {
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  margin-bottom: 0;
}

.rec #content-main .nickname {
  color: #CF7E47;
}

.rec #topic-summary h4 {
  font-size: 1.8em;
  margin-bottom: 0.3em;
  color: #666;
}

.rec #topic-summary .topic-summary-image {
  width: 100px;
  text-align: center;
}

.rec #topic-summary .topic-summary-content-wrapper {
   margin-left: 100px;
}

.rec #topic-summary .blurb {
  font-size: 1.3em;
}

.rec .wikipedia-attribution {
  font-size: 11px;
  margin-top: 1em;
}

.rec #rec-actions {
  border: 0;
  background: #fff;
  padding: 0;
  text-align: center;
  font-size: 1.8em;
  margin-top: 0.5em;
}

#rec-actions strong {
  color: #CF7E47;
}

/* IE fixes for autocomplete */

.ie .fbs-pane {
  width: 27em;
  background: #fff;
}

.ie .fbs-list {
  width: 99.5%;
}

.ie .fbs-suggestnew-button {
  width: 16em;
}

li.fbs-help-on-focus {
  padding: 1em;
  font-size: 1.2em;
  list-style:none;
}

.fbs-help-on-focus em {
  font-style: normal;
}

.ie .fbs-more .unicode {
  display:none;
}

/*
.dropdown-choices {
  position: absolute;
  left: 0; top: 0;
  margin: 0;
  list-style: none;
  border: 1px solid #a9e9fb;
  border-bottom: 0;
}

.dropdown-choices li {
  background: #eefafe;
  border-bottom: 1px solid #a9e9fb;
  padding: 4px 4px 4px 20px;
  margin: 0;
}

.dropdown-choices li label {
  margin-top: 0;
}

.dropdown-choices input[type="radio"] {
  display: none;
}

*/