/* Drag & Drop */


*.active-droppable {
  background: url(../images/pentagon-tile.jpg) repeat !important;
  min-height: 1em;
}
*.active-droppable div.warning { background: transparent }
*.active-droppable.drop-hover {
  background: url(../images/pentagon-tile-active.jpg) repeat !important;
}
*.active-sortable {
  background: url(../images/pentagon-tile.jpg) repeat !important;
  min-height: 1em;
}
*.active-sortable div.warning { background: transparent }
*.active-sortable.drop-hover {
  background: url(../images/pentagon-tile-active.jpg) repeat !important;
}

*.ui-sortable.empty {
  background: url(../images/pentagon-tile.jpg) repeat;
  min-height: 3em;
  min-width; 6em;
}
*.ui-droppable.empty {
  background: url(../images/pentagon-tile.jpg) repeat;
  min-height: 3em;
  min-width; 6em;
}
*.placeholder {
  background: url(../images/pentagon-tile-active.jpg) repeat !important;
  min-height: 3em;
  min-width: 6em;
}
*.ui-sortable-placeholder {
  background: url(../images/pentagon-tile-active.jpg) repeat !important;
  min-height: 3em;
  min-width: 6em;
}

*.ui-draggable span.handle {
  position: absolute;
  right: 32px;
  top: 50%;
  background: url(../images/icons/small/move.gif) no-repeat;
  cursor: move;
  display: block;
  width: 16px;
  height: 16px;
  text-indent: -5000px;
  outline: 0;
  margin: -8px 2px 2px 2px;
}
*.ui-sortable span.handle {
  position: absolute;
  right: 32px;
  top: 50%;
  background: url(../images/icons/small/move.gif) no-repeat;
  cursor: move;
  display: block;
  width: 16px;
  height: 16px;
  text-indent: -5000px;
  outline: 0;
  margin: -8px 2px 2px 2px;
}
*.ui-draggable-dragging {
  background-color: #f0f0f0;
  border: thick solid #90CAFC;
  padding: 0.3em 1.3em;
  list-style: none;
  margin: 0;
}
*.ui-draggable-dragging a.show {
  display: none !important;
}
*.ui-draggable-dragging a.edit {
  display: none !important;
}
*.ui-draggable-dragging a.index {
  display: none !important;
}
*.ui-draggable-dragging a.association { display: none !important; }


body div.warning {
  padding: 0.5em;
  margin: 0.5em;
  overflow: hidden;
}
body div.warning.empty {
  min-height: 8em;
}
body div.error {
  width: 33%;
  min-width: 30em;
  max-width: 90%;
  margin: 1em auto;
}
body div.error div.ui-state-error {
  padding: 1em;
}
body div.grid {
  position: relative;
}
body div.grid.empty {
  height: 8em;
}
body div.page_margins div.page div.rendering {
  position: relative;
  clear: both;
}
body div.page_margins div.page div.rendering.fake {
  height: 8em;
}
body div.page_margins div.page div.rendering.fake span.message {
  font-size: 130%;
  padding: 0.7em;
  background-color: #f0f0f0;
  position: relative;
  top: 23%; left: 42%;
}
body div.page_margins div.page div.grid.hover { background: #aaa;}
body div.page_margins div.page div.grid .grid.hover { background: #bbb;}
body div.page_margins div.page div.grid .grid .grid.hover { background: #ccc;}
body div.page_margins div.page div.grid .grid .grid .grid.hover { background: #ddd;}
body div.page_margins div.page div.rendering.hover { background: url(../images/pentagon-tile.jpg) repeat #90CAFC;}


div#toolbox div.frame {
  text-align: left;
}
div#toolbox li > div.grid.preview {
  width: 18em;
  height: auto;
  min-height: 2em;
  border: 0.3em solid #f0f0f0;
  float: left;
}
div#toolbox dd > div.grid.preview {
  width: 18em;
  height: auto;
  min-height: 2em;
  border: 0.3em solid #f0f0f0;
  float: left;
}
div#toolbox div.grid.preview {
  min-height: 6em;
  background-color: #eee;
  outline: 1px solid #f0f0f0;
  margin: 4px -2px;
}
div#toolbox div.grid.preview *.grid { min-height: 5em; background-color: #ccc}
div#toolbox div.grid.preview *.grid .grid { min-height: 4em; background-color: #aaa}
div#toolbox div.grid.preview *.grid .grid .grid { min-height: 3em; background-color: #999}
div#toolbox div.grid.preview:hover { outline-color: #90CAFC; }
div#toolbox div.grid.preview span.label {
  text-align: center;
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -0.7em;
  width: 100%;
  color: #222222;
}
div#toolbox div.grid.preview.active {
  outline-color: #222222;
}
div#toolbox div.grid.preview.active > span.label {
  font-weight: bold;
}

form label {
  float: left;
  text-align: left;
  display: block;
  font-weight: bold;
}
form select {
  float: right;
  background-color: #f1f5f6;
  color:  #222222;
  border-color: #777777;
  border-style: none solid;
  border-width: 1px;
}
form select option {
  background-color: inherit;
}
form span.date select {
  float: none;
}
form span.datetime select {
  float: none;
}
form textarea {
  background: #f1f5f6 url(../images/input-bg.jpg) no-repeat;
  color:  #222222;
  border-color: #777777;
  border-style: solid none;
  border-width: 1px;
}
form input {
  float: right;
}
form input[type="text"] {
  width: 75%;
  background: #f1f5f6 url(../images/input-bg.jpg) no-repeat;
  color:  #222222;
  border-color: #777777;
  border-style: none none solid none;
  border-width: 1px;
  padding: 0.3em 0.3em 0;
}
form input[type="password"] {
  width: 75%;
  background: #f1f5f6 url(../images/input-bg.jpg) no-repeat;
  color:  #222222;
  border-color: #777777;
  border-style: none none solid none;
  border-width: 1px;
  padding: 0.3em 0.3em 0;
}
form input#search_term {
  float: left;
  clear: both;
}
form ul.define_options img.add.option {
  margin: 0.1em;
  cursor: pointer;
  float: right;
}
form ul.define_options li {
  float: left;
  clear: left;
  position: relative;
}
form ul.define_options li.dummy { display: none }
form ul.define_options li img.remove.option {
  margin: 0.1em;
  cursor: pointer;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
}
form ul.define_options li *.name {  float: left; width: 33%; }
form ul.define_options li *.type {  float: left; width: 26%; }
form ul.define_options li *.default {  float: left; width: 33%; }
span.title {
  font-weight: bold;
}

/* 
 * If we show a record  place the show icon on the right
 * */
di.record dd {
  position: relative;
  padding-right: 25px !important;
}
di.record a.show {
  right: 0.3em;
}
di.record a.edit {
  right: 0.3em;
}

/* If we edit an association   place the add/remove icons on the left */
di.association dd {
  width: 100% !important;
  margin: 0 !important;
  position: relative;
}
di.association.one ul.list.hover > li {
  display: none;
}
di.association ul.list {
  margin: 5%;
  padding: 2.5%;
  width: 85%;
  list-style: none;
}
di.association ul.list li {
  position: relative;
}
di.association ul.list li a.show {
  right: 0.3em;
}
di.association ul.list li a.edit {
  right: 0.3em;
}

div.live_search {
  position: relative;
  clear: both;
  width: 90%;
  margin: 5%;
}
div.live_search input.search_term {
  float: left;
  margin: 3% 3%;
  width: 94%;
}
div.live_search.polymorphic input.search_term {
  width: 60%;
}
div.live_search select.polymorph_search_url {
  float: left;
  width: 28%;
  margin: 3% 3%;
}
div.live_search div.search_results {
  clear: both;
  width: 94%;
  margin: 3%;
}
div.live_search div.search_results ul {
  width: 94%;
  margin: 0;
  padding 3%;
}

/* here was div.node */
ul.list {
  clear: both;
  margin: 0;
}
ul.list a {
  /* position: absolute; */
}
ul.list a.show {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
ul.list a.index {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
ul.list a.edit {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
ul.list a.toggle_live_search {
  float: left;
  text-indent: -5000px;
  width: 16px; height: 16px;
  background: transparent url(/images/icons/small/search.gif) no-repeat scroll right;
  position: absolute;
  top: -1.7em;
  right: 0;
}
ul.list a.association {
  position: absolute;
  display: none !important;
  top: 50%;
  margin-right: 16px;
  margin-top: -8px;
  right: 0.7em;
}
ul.list img.icon {
  margin: 0 6px 0 0;
  float: left;
  width: 16px;
}
ul.list li {
  position: relative;
  text-align: left;
  padding: 0.3em;
  margin: 1px;
  list-style: none;
}
ul.list li.image img {
  float: left;
}
ul.list li.image span.title {
  float: left;
  padding: 0.7em;
}
dl {
  clear: both;
  margin: 0;
}
dl a {
  /* position: absolute; */
}
dl a.show {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
dl a.index {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
dl a.edit {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
dl a.toggle_live_search {
  float: left;
  text-indent: -5000px;
  width: 16px; height: 16px;
  background: transparent url(/images/icons/small/search.gif) no-repeat scroll right;
  position: absolute;
  top: -1.7em;
  right: 0;
}
dl a.association {
  position: absolute;
  display: none !important;
  top: 50%;
  margin-right: 16px;
  margin-top: -8px;
  right: 0.7em;
}
dl img.icon {
  margin: 0 6px 0 0;
  float: left;
  width: 16px;
}
dl li {
  position: relative;
  text-align: left;
  padding: 0.3em;
  margin: 1px;
  list-style: none;
}
dl li.image img {
  float: left;
}
dl li.image span.title {
  float: left;
  padding: 0.7em;
}
ul.tree {
  clear: both;
  margin: 0;
}
ul.tree a {
  /* position: absolute; */
}
ul.tree a.show {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
ul.tree a.index {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
ul.tree a.edit {
  position: absolute;
  right: 0.3em;
  top: 50%;
  margin-top: -8px;
  display: none !important;
}
ul.tree a.toggle_live_search {
  float: left;
  text-indent: -5000px;
  width: 16px; height: 16px;
  background: transparent url(/images/icons/small/search.gif) no-repeat scroll right;
  position: absolute;
  top: -1.7em;
  right: 0;
}
ul.tree a.association {
  position: absolute;
  display: none !important;
  top: 50%;
  margin-right: 16px;
  margin-top: -8px;
  right: 0.7em;
}
ul.tree img.icon {
  margin: 0 6px 0 0;
  float: left;
  width: 16px;
}
ul.tree li {
  position: relative;
  text-align: left;
  padding: 0.3em;
  margin: 1px;
  list-style: none;
}
ul.tree li.image img {
  float: left;
}
ul.tree li.image span.title {
  float: left;
  padding: 0.7em;
}

li:hover > a.show {
  display: block !important;
}
li:hover > a.index {
  display: block !important;
}
li:hover a.edit {
  display: block !important;
}
li:hover > a.association {
  display: block !important;
}
di:hover > * > a.show {
  display: block !important;
}
di:hover > * > a.index {
  display: block !important;
}
di:hover > * a.edit {
  display: block !important;
}
di:hover > * > a.association {
  display: block !important;
}
li:hover > div.node > a.show {
  display: block !important;
}
li:hover > div.node > a.index {
  display: block !important;
}
li:hover > div.node a.edit {
  display: block !important;
}
li:hover > div.node > a.association {
  display: block !important;
}

ul.records.tree {
 margin: 0;
  list-style: none;
}
ul.records.tree.tree_root {
  clear: both;
  padding: 0;
}
ul.records.tree a.show { top: 8px; }
ul.records.tree li {
  position: relative;
  font-weight: normal;
  padding-left: 16px;
}


div.busy {
  position: absolute;
  top: 0; left: 0;
  bottom: 0; right: 0;
  margin: 0;
  paddding: 0;
  display: none;
  background: url(/images/transparent.png);
  z-index: 5;
  text-align: center;
}
div.busy span.message {
  position: absolute;
  top: 23%;
  background: transparent;
  left:0; right: 0;
  text-align: center;
  font-size: 230%;
  line-height: 100%;
  color: #f0f0f0;
}
div.busy img.status {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -85px 0 0 -125px;
}


*.ui-widget *.ui-button {
  padding: 0px 8px;
  font-size: 13px;
  line-height: 19px;
  display: block;
  height: 18px;
  float: left;
  text-decoration: none;
  margin: 0 2px 0 0;
  cursor: pointer;
}
*.ui-widget *.ui-button span { display: block; margin: 1px; }
*.ui-widget *.ui-icon-button {
  padding: 0px;
  width: 19px;
}
*.ui-widget *.ui-icon-button:focus {
  padding: 0;
}
*.ui-widget *.ui-icon-button:hover {
  padding: 0;
}
*.ui-widget *.ui-dialog-titlebar span.buttons a {
  position: static; /* undo jquery ui-dialog-titlebar-close */
}
*.ui-widget *.ui-dialog-titlebar span.buttons.left {
  float: left;
  margin: 0 0 0 -0.7em;
}
*.ui-widget *.ui-dialog-titlebar span.buttons.left a {
  float: left;
  margin: 0;
}
*.ui-widget *.ui-dialog-titlebar span.buttons.right {
  float: right;
  margin: 0;
}
*.ui-widget *.ui-dialog-titlebar span.buttons.right a {
  float: right;
  margin: 0;
}

div.minimized {
  position: fixed;
  bottom: 0;
  right: 0;
  padding: 0.7em;
  min-width: 15em;
  max-width: 42%;
}