card.css

.card-frame {
  margin: 1px 0;
  padding: 0 !important;
  -moz-border-radius: 8px;
  border-radius: 8px;
  border: 1px solid #aaa;
  border-bottom: 2px solid #ccc;
  border-right: 2px solid #ccc;
  width: 100%;  /*needed for ie6, or..?*/
  margin: 0;
  background: #fff;
  padding: 0;
}

html>body .open-view {
  width: auto;  /* so non-ie browsers do better with image floats */
}
.card-slot,
.ALL {
  overflow: hidden;
  white-space: normal;
}

.card-slot > form >.instruction,
.card-slot > .instruction {
  background: #eee;
}

/*----- header ---------*/

.card-header {
  background: #8AB;
  padding: 5px 12px;
  margin: 0;
  text-align: left;
  overflow: hidden;
}
.card-header,
.card-header a,
.card-header h1 {
  color: #333
}
.card-header h1 {
  display: inline;
}
h1.card-title {
  padding: 2px 0;
  white-space: nowrap;
  margin-right: 5px;
}
.card-menu-link {
  display: inline-block;
  float: right;
}
.closed-view .card-menu-link  {
  float: none;
}
.card-menu {
  display: none;
  position:absolute;
  z-index: 1;
}
.card-menu .ui-menu-icon {
  float: left;
  margin-right: 5px;
}
.card-menu .ui-menu-item {
  text-align: right;
  white-space: nowrap;
}
.card-menu .ui-menu-item a {
  color: #333;
}
.card-header .toggler {
  display: inline-block;
  position: relative;
  top: 2px;
}
.name-editor input {
  width: 100%;
}
.name-editor.known-name input {
  border: 3px solid #c22;
}

.ui-menu .ui-menu-item {
  padding: 2px 0;
}

.navbox-item-label {
  color: #777;
  font-size: 10px;
  float: left;
  width: 50px;
  padding: 3px 0 3px 25px;
  position: relative;  
}
.navbox-item-label > a.ui-icon {
  padding: 0;  
}
.cardtype {
  font-style: italic;
  font-size: 10px;
}
.current {
  background: #bbb;
  padding-bottom: 5px !important;
}


/*-------------  TABS -------*/

/* -------- view tab / content ----------------- */

.faint {
  color: #bbc;
}
.joint {
  color: #960;
}
a.wanted-card {
  color: #900
}
a.external-link,
.closed-content a.external-link {
  color: #729;
  background: url(external_link.png) center right no-repeat;
  padding-right: 13px !important;
}
a.email-link {
  color: #979
}
.missing-view a {
  color: #99b;
  display: inline;
  font-variant: small-caps;
}
.missing-view a:hover {
  color: #069;
  background: #ffc;
}


/* note:   ".card-slot .content-view div not(.editor)" was not working properly and was breaking nested block elements.
   without it nested divs in content-view areas probably won't highlight  */


/* ---------- edit tab / new / inline editing--------*/

.new-current-revision-id,
.editor .revision-navigation,
.editor .autosave-alert {
  display: none
}
fieldset {
  margin: 5px 1px;
  clear: both;
  float: none !important;
  display:block;
  border: 0;
}
fieldset > .button-area,
fieldset > .editor {
  float: right;
  width: 70%;
  padding: 3px;
}
fieldset > .button-area {
  padding: 0 3px;
}
fieldset > .editor > input {
  margin-left: 0;
}
fieldset > legend {
  white-space: inherit;
  float:left;
  text-align:right;
  width: 25%;
  padding: 3px;
  margin: 0;
}
fieldset > legend > .instruction {
  text-align: right;
  padding: 3px 0;
}
.button-area input,
.button-area button {
  margin-right: 2%;
}


/* for IE */
div.content-view {
  display: inline;
}
.conflict-view {
  text-align: left;
  background: #ffc;
  border: 1px solid grey;
  padding: 10px;
  margin-top: 12px;
}

/* ---------- changes tab -------*/


.revision-header {
  padding: 4px;
  text-align: center;
}
.revision-title {
  font-weight: bold;
}
.revision-content {
  margin: 0px 1px;
  padding: 10px 5px;
  background: #ffd;
}
.autosave-alert {
  font-weight: bold;
}
.revision-navigation {
  border-bottom: 1px solid silver;
}
.revision-navigation span {
   margin: 0px 10px
}
ins.diffmod,
.diffins {
  background: #aea;
}
del.diffmod,
.diffdel {
  background: #eaa;
}

/*-------options tab ------*/

/*--settings (new) --*/

.options-set-label {
  font-size: 1.1em;
  color: #000;
  padding: 5px 0;
}
.options-set-content {
  padding: 0 0 30px 10px;
}

/*--permissions (old) --*/

.small {  /* this is a crappy class name */
  font-size: 10px;
  display: block;
  margin: 2px;
  line-height: 13px
}
.new-account-link {
  text-align: center;
}



/*------------- multiple tabs / misc -----*/


.card-notice {
  background: #fff;
  font-weight: bold;
  font-style: italic;
  text-align: center;
  color: #009;
  display: none;
  margin: 0 0 4px 0;

}
.help.content {
  padding: 10px;
  margin-top: 5px;
  color: #444;
}
.card-body {
  display: block;
  padding: 5px 12px;
  min-height: 25px;
}
.instruction {
  border-left: 0;
  border-right: 0;
}
.hidden,
.denied {
  display: none;
}


/* -----   CONTEXTS  -------------------------------*/


/*----------recent changes -----------*/

body#wagn .card-slot.recent-changes h2 {
  margin-top: 15px;
}
.last-update {
  color: #666;
/*  margin-right: 5px; */
}


/*-------------- STATES -----------*/

/*-----------  open cards -------*/

  /* means content view */
.content-content {
  display: inline;
  padding: 0;
}

.titled-view > .card-header {
   background: inherit;
   padding: 0;
}

/*------------- closed cards -------*/

.closed-view {
  width: 100%;  /*needed for ie6, or..?*/
  background: #fff;
  overflow: hidden;
  white-space: nowrap !important;
  border: 0;
  border-bottom: 1px solid #ccc;
  -moz-border-radius: 0 !important;
  border-radius: 0 !important;
  padding: 0;
  margin: 1px 0 0 0;
}
.closed-view .card-header {
  vertical-align: middle;
  display: inline-block;
  line-height: 15px;
  -moz-border-radius: 0 6px 6px 0;
  border-radius: 0 6px 6px 0;
  margin-right: 4px;
}
.closed-content,
.closed-content tr,
.closed-content td,
.closed-content p,
.closed-content h1,
.closed-content h2,
.closed-content h3,
.closed-content h4,
.closed-content h5,
.closed-content h6,
.closed-content ul,
.closed-content li,
.closed-content pre,
.closed-content ol,
.closed-content hr,
.closed-content div,
.closed-content span,
.closed-content a,
.closed-content blockquote {
  display: inline !important;
  margin: 0 6px 0 0;
  padding: 0px !important;
  border: 0px !important;
  font-size: 11px !important;
  white-space: nowrap !important;
  float: none !important;
}
.closed-content a {
  margin: 0px;
}
.closed-content img {
  height: 16px;
  width: auto;
  float: none;
  padding: 0px;
}
.closed-content br,
.closed-content hr,
.closed-content input,
.closed-content textarea,
.closed-content object {
  display: none !important;
}
/*----------- Change View ---------*/

.change-view {
  padding: 5px 0px;
  border-bottom: 1px dotted grey;
  clear: both;
}
.change-view .change-card{
  font-weight: bold;
  float: left;
}
.change-view .last-update {
  float:right;
  text-align: right;
}
.change-view .last-edited {
  color: #7a7;
}
.change-view .last-editor {
  white-space: nowrap;
}



/* CARDTYPE_SPECIFIC ------------------------------*/


/*---------- ( Richtext )-------------*/

.table-of-contents {
  background: #eee;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 4px;
  margin: 5px 20px 20px 20px;
}
.table-of-contents h5 {
  margin: 0px 0px 0px 40px;
}
.table-of-contents ol {
  list-style-type: upper-roman;
}
.table-of-contents ol ol {
  list-style-type: upper-alpha;
  padding-left: 25px
}

/*-------------( Pointer )--------*/
ul.pointer {
  margin: 0px;
  padding: 0px;
}
.pointer-list-editor {
  margin: 0px;
  padding: 0px;
}
.pointer-list-editor input {
  margin-right: 10px;
  width: 65%;
}
.pointer-list-editor li {
  list-style: none;
  white-space: nowrap;
}
.pointer-list-editor .pointer-item-delete {
  margin-left: 4px;
  vertical-align: middle;
  display: inline-block;
  position: relative;
  bottom: 2px;
}


/*-------------( Phrase)-----------*/

.phrasebox {
  width: 98%;
}

/*---------( Search ) ---------- */

.search-no-results:after {
  content:'0 results';
}
.search-count {
  float: right;
  color: #bbc;
}



/*---------(Search & Pointer) --------*/

div.pointer-list,
div.search-result-list {
  list-style: none;
  padding: 5px 0;
  margin: 0;
}
div.pointer-list .pointer-item,
div.search-result-list .search-result-item {
  margin: 0;
}
.search-result-item.item-link,
.pointer-item.item-link,
.search-result-item.item-name,
.pointer-item.item-name {
  display: block;
  text-indent: -15px;
  padding-left: 15px;
}
.radio-option-description,
.checkbox-option-description {
  margin-left: 40px;
}

/*-----------( Image ) -----------*/

/*
.open-view .TYPE-image .content {
  padding: 5px;
}
*/

/*-----------( Toggle ) -----------*/

.TYPE-toggle .content {
  font-style: italic;
}

/*------------( Layout, Plain Text ) ------------*/

/*
.RIGHT-Xcontent > .content,
.RIGHT-Xdefault> .content 
*/
.TYPE-layout > .content,
.TYPE-plain_text > .content {
  white-space: pre-wrap
}

.content.card-editor {
  white-space: normal;
}

/*----------- (Account Request)--------------*/

.invite-links {
  padding: 10px;
  margin-top: 10px;
  border: 1px solid #66b;
}
.invite-links a {
  font-style: normal;
  font-weight: bold;
  margin-right: 20px;
}

/*------- permissions ------------------*/

.perm-group h5 {
  margin-top: 0px;
}


/*---------- comment-box -------------------------------------- */
.comment-box textarea {
    margin-bottom:5px;
}
.comment-box input {
  padding: 0px;
  font-size: 12px;
}
.comment-box {
    background: #cce;
    padding: 8px;
    margin: 0px;
}
.ui-icon {
  background-image: url('images/ui-icons_454545_256x240.png')
}
.ui-loader {
  display: none;
}
.template-editor-main {
  float: left;
  width: 85%;
}
.template-editor-left,
.template-editor-right {
  float: left;
  width: 5%;
  text-align: center;
  font-size: 3em;
  line-height: 2em;
}
.template-editor-close {
   float: right;
}
.template_link-view {
  display: inline;
}