/* Inkspot CSS    */
/* Simon Woodman  */
/* s.j.woodman@ncl.ac.uk */
/* September 2008 */

/* Basic Elements */
html {
  margin: 0;
  padding: 0;
  height: 100%
}

body {
  font: 12px / 14px Arial, Helvetica, sans-serif;
  color: #444444;
  margin: 0;
  padding: 0;
  line-height: 1.5em;
  height: 100%;
}

p {
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  font-weight: normal;
  color: #FF6600;
}

a:hover {
  text-decoration: underline;
}

h1 {
  margin: 0;
  font-size: 16px;
  color: #FF6600;
  text-align: left;
  padding-top: 2px;
  font-weight: normal;
}

h2 {
  font-size: 14px;
  color: #3399FF;
  padding-left: 5px;
  padding-right: 5px;
  font-weight: normal;
}

h2 a {
  font-size: 14px;
  color: #3399FF;
  padding-left: 5px;
  padding-right: 5px;
  font-weight: normal;
}

/**********************/
/* Structure of page */
/**********************/
#maincontainer {
  width: 900px; /*Width of main container*/
  margin: 0 auto; /*Center container on page*/
}

#topsection {
  height: 85px;
}

#topsection img {
  margin-top: -38px;
  width: 450px;
  cursor: pointer;
  float: left;
}

#contentwrapper {
  float: left;
  width: 100%;
}

#contentcolumn {
  margin: 0 180px 5px 0px; /*Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth*/
}

.rightcolumn {
  float: left;
  width: 180px;
  margin-left: -180px;
}

#footer {
  clear: both;
  width: 900px;
  background: #DDDDDD none repeat scroll 0 0;
  text-align: center;
  bottom: 0px;
}

#footer a {
  color: #555555;
  font-weight: normal;
}

/*****************/
/* Grey Boxes    */
/*****************/

.solidgreybox {
  border: #ddd 3px solid;
  padding-bottom: 0;
  background: #DDDDDD no-repeat scroll 0 0;
}

.greybox {
  margin: 0 0 5px 0;
  border: #ddd 3px solid;
  text-align: justify;
}

.greybox .greyboxtop {
  height: 20px;
  margin: -10px 0 -10px 0;;
  padding: 0 0 5px 10px;
  background: #dddddd;
  color: #3399FF;
  font-size: 16px;
}

.greybox .greyboxtop img {
  float: right;
  padding-top: 5px;
}

.greybox .greyboxtop .cellmenuright {
  float: right;
  margin-right: 10px;
  margin-top: 4px;
  color: #408DDF;
  font-size: 12px;
}

.rightcolumn .greybox {
  margin-left: 5px;
}

.rightcolumn .greybox .greyboxtop {
  cursor: pointer;
}

.greybox .greyboxbody {
  margin-bottom: -10px;
  padding: 15px 10px 10px 10px;
}

/*********************/
/* Header Bar        */
/*********************/

.header {
  width: 100%;
  height: 20px;
  padding-top: 1px;
  background: #DDDDDD none repeat scroll 0 0;
}

.headertext {
  float: right;
  font-size: small;
}

.header a {
  padding-left: 10px;
  padding-right: 10px;
  color: #444444;
  font-weight: bold;
}

#searchbox {
  padding-top: 10px;
  float: right;
}

.yui-button#searchButton button {

  background: url(../images/silk/icons/magnifier.png) center center no-repeat;
}

/*****************/
/* Rounded Boxes */
/*****************/

b.bt, b.bt b, b.bb, b.bb b {
  display: block;
  height: 10px;
  font-size: 1px;
  background: url(../images/i/grey.gif) no-repeat;
  position: relative
}

b.bt {
  top: -3px;
  left: -3px
}

b.bt b {
  background-position: 100% -10px;
  left: 6px
}

b.bb {
  background-position: 0 -20px;
  top: 3px;
  left: -3px
}

b.bb b {
  background-position: 100% -30px;
  left: 6px
}

b.st, b.st b, b.sb, b.sb b {
  display: block;
  height: 10px;
  font-size: 1px;
  background: url(../images/i/grey_filled.gif) no-repeat;
  position: relative
}

b.st {
  top: -3px;
  left: -3px
}

b.st b {
  background-position: 100% -10px;
  left: 6px
}

b.sb {
  background-position: 0 -20px;
  top: 3px;
  left: -3px
}

b.sb b {
  background-position: 100% -30px;
  left: 6px
}

/*****************/
/* Header Tabs   */
/*****************/

#nav {
  border-top: 15px;
  background-color: #fff;
  padding-top: 5px;
  list-style: none;
  clear: both
}

#navigation li {
  float: right;
  font-size: .9em;
  letter-spacing: 0;
  list-style: none;
  margin: 0;
  padding-left: 1px
}

#navigation a {
  background: #3399FF url(../images/side-left-blue.png) left top no-repeat;
  color: #FFF;
  padding-left: 8px;
  text-decoration: none;
  font-weight: bold;
}

#navigation a span {
  background: url(../images/side-right-blue.png) right top no-repeat;
  padding-bottom: 5px;
  padding-right: 8px;
  padding-top: 5px
}

#navigation a, #navigation a span {
  display: block;
  float: none
}

#navigation a:hover, #navigation li a.active {
  background: #FF6600 url(../images/side-left-orange.png) left top no-repeat;
  color: #fff;
  padding-left: 8px
}

#navigation a:hover span, #navigation li a.active span {
  background: url(../images/side-right-orange.png) right top no-repeat;
  padding-right: 8px
}

#navigation  a.inactive {
  background: #999999 url(../images/i/tablg.gif) left top no-repeat;
  color: #fff;
  padding-left: 8px
}

#navigation a.inactive span {
  background: url(../images/i/tabrg.gif) right top no-repeat;
  padding-right: 8px
}

/*********************************/
/*      User profile             */
/*********************************/

.profilePicture {
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
}

.profileForm p {
  width: 400px;
  clear: both;
}

.profileForm p label {
  float: left;
  padding: 5px;
}

.profileForm p input, .profileForm p textarea, .profileForm p select {
  float: right;
  margin: 5px;
  font: 12px / 14px Arial, Helvetica, sans-serif;
  color: #666666;
}

.yui-skin-sam   #profileButtonContainer .yui-button {
  margin: 0 .25em 5px 10px;
  padding: 0 0;
  float: right;
  clear: both;
}

.yui-skin-sam   #profileButtonContainer .yui-button .first-child {
  margin: 0 -1px;
  padding: 0 0em;
}

.yui-skin-sam   #profileButtonContainer  .yui-button button {
  width: 100%;
  padding: 3px;
}

.yui-skin-sam  #profileButtonContainer .yui-button a {
  width: 247px;
  padding-left: 15px;
}

.emailButton {
  background: transparent url(../images/silk/icons/email.png) no-repeat 10px;
}

.editButton {
  background: transparent url(../images/silk/icons/user_edit.png) no-repeat 10px;
}

.makeConnectionButton {
  background: transparent url(../images/silk/icons/user_add.png) no-repeat 10px;
}

.breakConnectionButton {
  background: transparent url(../images/silk/icons/user_delete.png) no-repeat 10px;
}

#profileButtonContainer {
  float: right;
  clear: right
}

/******************************/
/* List of Items with details */
/******************************/

.itemListElement {
  padding: 5px 0 5px 0;
  overflow: auto;
  clear: both;
}

.itemListElement .itemListRight {
  width: 500px;
  float: right;
}

.itemListElement .itemListFull {
  width: 620px;
  float: right;
}

.itemListLeft {
  padding-right: 15px;
}

.itemListLeftTop {
  float: right;
  padding-right: 20px;
  text-align: right;
}

.itemListLeftBottom {
  padding-top: 5px;
  font-size: 11px
}

.itemListLeftBottom img {
  vertical-align: top;
}

.itemListDivider {
  height: 1px;
  background-color: #dddddd;
  width: 500px;
  float: right;
  margin: 10px 5px 10px 0;
}

.itemListDividerFull {
  height: 1px;
  background-color: #dddddd;
  width: 685px;
  float: right;
  margin: 10px 5px 10px 0;
}

.itemListElement p {
  margin-top: 0px;
  padding: 5px 0 5px 0;
}

.itemListPitcure {
  width: 50px;
  height: 50px;
  float: left;
  border: none;
}

.unread {
  background-color: AliceBlue;
}

.itemListTitleRight {
  float: right;
  padding: 0 5px;
}

.itemListTitleLeft {
  padding: 0 5px;
}

.itemListTitleLeft a {
  color: #3399FF;
  font-weight: normal;
  font-size: 14px;
}

.itemListBody {
  padding: 5px;
}

/*******************/
/** Message Thread */
/*******************/

.messageRecipients {
  clear: none;
  float: right;
  font-size: 11px;
  padding-right: 5px;
  padding-top: 5px;
  width: 500px;
}

.messageTitle {
  color: #FF6600;
  float: right;
  font-size: large;
  padding-bottom: 5px;
  padding-right: 5px;
  width: 500px;
}

/***************/
/* Big Buttons */
/***************/

/********/
/* Misc */
/********/

.padTop5 {
  padding-top: 5px;
}

.width100 {
  width: 100%;
}

.smallLink {
  font-size: 10px;
  font-weight: normal;
}

.yui-skin-sam .filechooser .bd, #linkPanel .bd {
  overflow: auto;
  padding: 4px;
  background-color: #ffffff;
}

.filterItemLink {
  padding-top: 3px;
  padding-bottom: 3px;
}

.newscell {
  padding-left: 5px;
  padding-right: 5px;
  text-align: left;
}

.logon {
  text-align: center;
  margin-top: -10px;
  font-size: 16px;
  color: #3399FF;
}

.rule{
border-top:1px dotted;
margin:10px -2px 10px -12px;
padding-right:0;
}

.blue {
  color: #3399FF;
}

.overflowAuto {
  overflow: auto;
}

.pointer {
  cursor: pointer;
}

.margin-tbtwo {
  margin: 18px 0;
}

.helpLink {
  float: right
}

.helpLink img {
  border: none;
  padding: 2px 5px 0 0;
}

/********************/
/* Workflow Details */
/********************/

.workflowDesc {
  width: 400px;
  padding-bottom: 5px;
}

.workflowDetails {
  float: right;
  width: 250px;
}

.workflowDetails ul {
  list-style: none;
}

.workflowDetails ul li {
  padding: 5px 0 5px 0;
}

.workflowDetails img {
  vertical-align: top;
}

.yui-skin-sam   #workflowButtonContainer .yui-button {
  margin: 0 .25em 5px 10px;
  padding: 0 0;
  float: right;
  clear: both;
}

.yui-skin-sam   #workflowButtonContainer .yui-button .first-child {
  margin: 0 -1px;
  padding: 0 0em;
}

.yui-skin-sam   #workflowButtonContainer  .yui-button button {
  width: 206px;
  padding: 3px;
}

.yui-skin-sam  #workflowButtonContainer .yui-button a {
  width: 206px;
  padding-left: 15px;
}

.viewWorkflowButton {
  background: transparent url(../images/silk/icons/magnifier.png) no-repeat 10px;
}

.editWorkflowButton {
  background: transparent url(../images/silk/icons/cog_edit.png) no-repeat 10px;
}

.deleteButton {
  background: transparent url(../images/silk/icons/delete.png) no-repeat 10px;
}

.saveButton {
  background: transparent url(../images/silk/icons/disk.png) no-repeat 10px;
}

.openButton {
  background: transparent url(../images/silk/icons/page_go.png) no-repeat 10px;
}

.downloadButton {
  background: transparent url(../images/downarrow.png) no-repeat 0;
}

.addUsersButton {
  background: transparent url(../images/silk/icons/lock_add.png) no-repeat 10px;
}

.makePublicButton {
  background: transparent url(../images/silk/icons/lock_open.png) no-repeat 10px;
}

.makePrivateButton {
  background: transparent url(../images/silk/icons/lock.png) no-repeat 10px;
}

.subscribeButton {
  background: transparent url(../images/silk/icons/plugin_add.png) no-repeat 10px;
}

.unsubscribeButton {
  background: transparent url(../images/silk/icons/plugin_delete.png) no-repeat 10px;
}

.openAppButton {
  background: transparent url(../images/cog.png) no-repeat 10px;
}

.workflowTags {
  padding: 5px 0 0 23px;
}

.workflowTags a {
  font-size: 11px;
}

/********************/
/* Data Properties  */
/********************/

#dataProperties ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#dataProperties ul li {
  padding: 2px 0 2px 0;
  overflow: hidden;
}

#dataProperties ul li img {
  vertical-align: bottom
}

.attachFilesButton {
  background: transparent url(../images/silk/icons/attach.png) no-repeat 10px;
}

.rightcolumn ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#rightcolumn ul li {
  padding: 2px 0 2px 0;
}

/* Effects for showing a preview of JPG etc. */
.apple_overlay {

/* initially overlay is hidden */
  display: none; /* growing background image */
  background-image: url(../images/white.png);
  /*
      width after the growing animation finishes
      height is automatically calculated
  */
  width: 640px; /* some padding to layout nested elements nicely  */
  padding: 35px; /* a little styling */
  font-size: 11px;
}

/* default close button positioned on upper right corner */
.apple_overlay div.close {
  background-image: url(../images/close.png);
  position: absolute;
  right: 5px;
  top: 5px;
  cursor: pointer;
  height: 35px;
  width: 35px;
}

/******************************************************/
/* Icons for the History Section of the Property Page */
/******************************************************/
#historySummary ul li{
  padding-left: 20px;
}

.historyREAD {
  background: url('../images/silk/icons/page.png') no-repeat;
}
.historyWRITE {
  background: url('../images/silk/icons/page_edit.png') no-repeat;
}
.historyREAD_BY_WORKFLOW {
  background: url('../images/silk/icons/cog.png') no-repeat;
}
.historyWRITE_BY_WORKFLOW {
  background: url('../images/silk/icons/cog_edit.png') no-repeat;
}
.historyWORKFLOW_START {
  background: url('../images/silk/icons/control_play_blue.png') no-repeat;
}
.historyWORKFLOW_COMPLETE {
  background: url('../images/silk/icons/control_stop_blue.png') no-repeat;
}
.historySHARE {
  background: url('../images/silk/icons/page_go.png') no-repeat;
}
.historyMAKE_FRIEND {
  background: url('../images/silk/icons/user_go.png') no-repeat;
}
.historyMAKE_GROUP {
  background: url('../images/silk/icons/group_add.png') no-repeat;
}
.historyJOIN_GROUP {
  background: url('../images/silk/icons/group_go.png') no-repeat;
}
.historyREGISTER {
  background: url('../images/silk/icons/user_add.png') no-repeat;
}
.historyLOGIN {
  background: url('../images/silk/icons/user.png') no-repeat;
}

