/***********************************************************************
 (New) CSS for Webfactory components (toolbar, edit buttons/frames etc.)
 ***********************************************************************/


/************************/
/* Edit-mode components */
/************************/
a.editControl,
a.editControl img.editControlIcon,
div.editControls img.editControlIcon {
  background-color: transparent !important;
  border: none;
  margin: 0px ! important;
  padding: 0px ! important;
  text-decoration: none !important;
  position: static;
}

div.editControls img.editControlIcon {
  height: auto !important;
  padding-top: 1px !important;
}

div#page.webfactoryAction div#main-left,
div#page.webfactoryAction div#main-right {
  display: none;
}

div.confirmActionFrame,
div.confirmActionFrameManager,
div.confirmActionFrameUser {
  border: solid red 1px;
  margin: 2% auto;
  padding: 5px 10px 10px 10px;
  width: 40%;
}

div.confirmActionFrameUser {
  border: none;
}

div.editControls {
  background-color: transparent;
  margin: 0px;
  padding: 1px !important;
  padding: 0px 1px 0px 1px;
  text-align: left;
  vertical-align: middle;
}

div#page.editFrame div.editFrame {
  border: solid red 1px !important;
  _display: inline-block;
}

div.editFrame {
  border: solid red 1px;
}

div.editFrameForm {
  border: solid red 1px;
  display: block;
  margin: 0% auto 2% auto;
  padding: 5px 10px 10px 10px;
  width: 80%;
}

div.formButtonRow {
  margin: 20px 0px 0px 0px;
}

div.managerActionFrame {
  border: solid red 1px;
  display: block;
  margin: 2% 10% 2% 10%;
  padding: 10px;
  width: 80%;  
}

div#page.webfactoryAction div#main-content {
  left: 0px;
  width: 98%;
}

div.smallEditFrameForm {
  margin: 2% 25% 2% 25%;
  width: 50%;  
}

input.text.inline {
  display: inline !important;
  width: auto !important;
}

div.thumbImageEdit {
  background-color: transparent;
}

div.userActionFrame {
  border: none;
  display: block;
  margin: 5%;
  padding: 10px;
  width: 75%;
}

div.webfactoryControls {
  clear:left;
}

form#generic-form div.editFrame {
  _display:inline-block;
}

span.webfactoryControls img {
  border: none ! important;
}

span.webfactoryControls {
  display: block;
  position: absolute;
  top: 0px;
  z-index: 100;
}

table.formLayout {
  margin: 20px 0px 0px 0px;
  width: 100%;
}

th.checkboxColumn {
  width: 20px;
}

th.column {
  text-align: left;
}

div.normalMode tr.inlineEdit td {
  border-color: red;
  border-style: solid;
  border-width: 1px 0px 1px 0px;
}

div.normalMode tr.inlineEdit td.first {
  border-left-width: 1px;
}

div.normalMode tr.inlineEdit td.edit {
  border-right-width: 1px;
  padding-right: 0px;
}

*.managerActionTitle {
  background-color: transparent;
  color: red;
}

*.error,
*.warning,
*.required,
*.unconfiguredMessage {
  color: red;
}

*.addKeywordIcon,
*.changeKeywordIcon,
*.removeKeywordIcon {
  color: red;
  font-weight: bold;
}

*.labelExplanation,
*.generalNote {
  display: block;
  font-style: italic;
  font-weight: normal;
}

*.instruction {
}

*.message {
  display: block;
  margin-top: 0px;
  text-align: right;
}

/***********
 inline help
 ***********/
a.explanation {
  background-image: url(/images/explanation_icon.gif);
  background-position: top right;
  background-repeat: no-repeat;
  padding-right: 6px;
}

a.helpLink {
  background-image: url(/images/webfactory_help.gif);
  background-position: center right;
  background-repeat: no-repeat;
  color: #cc3333;
  display: block;
  font-weight: bold;
  padding-right: 22px;
  text-align: right;
}

a.helpSectionClose {
  background-image: url(/images/icon_close.gif);
  background-position: 2px 0.2em;
  background-repeat: no-repeat;
  color: #000000;
  padding: 2px 2px 2px 20px;
  text-align: left;
}

a.helpSectionClose:hover {
  color: #000000;
  text-decoration: none;
}

div.helpSection {
  background-color: #ffffff;
  border-style: outset;
  border-width: 2px;
  margin-left: 5px;
  padding: 5px;
  width: 70%;
}

img.helpSectionIcon {
  display: block;
  float: right;
}

pan.helpLinkText {
  display: none;
}

p.explanation {
  background-color: #e8d1b7;
  border-color: black;
  border-style: solid;
  border-width: 1px;
  color: black;
  padding: 5px;
}

ul.helpList li img {
  vertical-align: bottom;
}

/**********************/
/* WebFactory toolbar */
/**********************/
div#webfactory-tabs {
  overflow: hidden;
  width: auto;
}

div#webfactory-tabs a.webfactoryTabSelected {
  background-image: url(/images/light_tab.gif);
  color: #000000;
  display: block;
  font-weight: normal;
  height: 27px;
  line-height: 26px;
  text-align: center;
  text-decoration: none;
  width: 96px;
}

div#webfactory-tabs a.webfactoryTab {
  background-image: url(/images/dark_tab.gif);  
  color: #000000;
  display: block;
  font-weight: normal;
  height: 27px;
  line-height: 26px;
  text-align: center;
  text-decoration: none;
  width: 96px;
}

div#webfactory-tabs li {
  float: left;
}

div#webfactory-tabs li#tab-jamkit,
div#webfactory-tabs li#tab-help,
div#webfactory-tabs li#tab-logout {
  float: right;
}

div#webfactory-tabs li.tabHolder {
  list-style-image: none;
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

div#webfactory-tabs ul {
  list-style-image: none;
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

div#webfactory-toolbar {
  background-color: #cccccc;
}

div#webfactory-toolbar-show {
  left: 0px;
  position: absolute;
  top: 0px;
  visibility: hidden;
  z-index: 5000;
}

div#webfactory-toolbar-show a:link,
div#webfactory-toolbar-show a:visited,
div#webfactory-toolbar-show a:hover {
  background-color: transparent;
  color: #000000;
  padding: 1px;
  text-decoration: none;
}

div#tools {
  background-color: #cccccc;
  background-image: url(/images/toolbar_slice.gif);
  color: red;
  height: 37px;
  width: 100%;
  padding-top: 8px;
  clear: both;
}

div#tools a.toolbarButton {
  border-width: 0px;
  cursor: pointer;
  height: 28px;
  margin: 0px;
  padding: 0px;
  text-decoration: none;
  width: 28px;
}

div#tools ul.tools-collection {
  display: inline;
  list-style-image: none;
  list-style-type: none;
  margin: 0px;
  padding: 0px;
  background-image: url(/images/toolbar_divider.gif);
  background-position: top left;
  background-repeat: no-repeat;
  padding-right: 2px;
  padding-left: 10px;
  float: left;
  display: inline;
}

div#tools ul.tools-collection li {
  display: inline;
  background-image: none;
  list-style-image: none;
  list-style-type: none;
  padding: 0px;
  margin: 0px;
}

div#tools ul#tools-collection-object_navigation,
div#tools ul#tools-collection-user {
  background-image: none;
  padding-left: 0px;
}

div#tools ul#tools-collection-workflow {
  float: right;
  border-right: none;
  background-image: none;
  padding-left: 0px;
  padding-right: 4px;
}

div#tools a:hover,
div#tools a img {
  background-color: transparent;
}

img.toolbarButton {
  cursor: pointer;
}

*.siteMode div#tools-collection-two {
  float: left;
}

*.siteMode img {
  margin: 0px 5px 0px 5px;
}

*.siteMode div#tools-collection-one img {
  margin-right: 0px;
}

/******************
 Preview mode rules
 ******************/
div#page.editFrame {
  border: none;
}

div.normalFrame div.editControls,
div.normalFrame p.unconfiguredMessage,
div#page.normalMode div.editControls,
div#page.normalMode p.unconfiguredMessage {
  display: none;
}

div#page.normalMode div.editFrame {
  border: none;
}

div#show-toolbar-button-holder {
  left: 0px;
  position: absolute;
  top: 0px;
  z-index: 5000;
}

div#show-toolbar-button-holder.buttonHide {
  /* Must work in reverse to normal hide/show. */
  visibility: hidden;
}

div#show-toolbar-button-holder.buttonShow {
  /* Must work in reverse to normal hide/show. */
  visibility: visible;
}

*.cssHide {
  display: none !important;
}

*.cssShow {
  display: block;
}


/*******************************
 generic form configuration page
 *******************************/
div#generic-form-settings {
  background-color: #fcfcfc;
  border: 1px solid #eeeeee;
  margin: 13px 0px 13px 0px;
  padding: 5px;
}

div#generic-form-settings div.formButtonRow {
  text-align: right;
}

body.GenericForm form.genericFormSetting fieldset {
  border: 1px solid #cccccc;
  padding: 5px;
}



/* Temporary style to display the old page-reloading preview method */
div#show-toolbar-button-holder a:link,
div#show-toolbar-button-holder a:visited,
div#show-toolbar-button-holder a:hover {
  background-color: #dddddd;
  border: 2px outset #dddddd;
  color: black;
  display: block;
  padding: 3px;
  text-decoration: none;
  width: 77px;
}

/* old toolbar styles */
div#tab-collection-one li {
 float: left;
}

div#tab-collection-two li {
 float: right;
}

div#tools-collection-one {
 float: left;
}

div#tools-collection-two {
 float: right;
}

div#tools img.separator {
 position: relative;
 background-color: #bbbbbb;
 margin: 0px 2px 0px 2px;
 vertical-align: middle;
 top: -11px !important;
 top: -10px;
}

