/* Fieldset for form containment */

/* All TN forms styles */

fieldset {
  padding: 0 5px 5px;
  margin: 0 0 15px;
}

.formBlock {
  padding: 10px;
  clear: both;
}

.fieldWrapper {
  padding: 10px;
  border-bottom: 1px solid white ;
  clear: both;
}

.fieldWrapper label {
  font-size: 13px;
  float:left;
  margin-right:10px;
  padding: 0;
  text-align:right;
  width:25%;
  margin-bottom: 5px;
  display: block;
}

.fieldWrapper  input[type="text"],
.fieldWrapper  textarea {
  display: block;
  margin-bottom: 5px;
  width: 60%;
}

.fieldWrapper  select {

}

.fieldWrapperWithError {
  background-color: #DF2429;
}

.fieldWrapperWithError label {
  color: white; 
}

ul.errorlist {
  color: #efd3d4;
  list-style: none;
  list-style-image: none;
  margin: 0;
  padding: 0;
}
ul.errorlist li {
  list-style: none;
  list-style-image: none;
  margin: 0 10px 10px;
  padding: 2px 0;
}

.form-controls {
  padding: 15px 10px 0;
  clear: both;
}


/* inline forms */

.fieldset-inline-form {
  margin-top: 10px;
  padding-right: 0;
  clear: both;
}

.fieldset-inline-form legend {
  text-transform: capitalize;
  margin: -3px 0 0 0;
  padding: 0;
  background-color: #f7f7f7;
  border: 1px solid #ccc;
  font-weight: normal;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

.fieldset-inline-form legend :first-child {
    border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
}

.fieldset-inline-form legend :last-child {
    border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    padding-right: 12px !important;
}

.fieldset-inline-form legend a,
.fieldset-inline-form legend span {
  padding: 1px 7px;
  display: inline-block;
}

.fieldset-inline-form legend a,
.fieldset-inline-form legend a:link,
.fieldset-inline-form legend a:hover,
.fieldset-inline-form legend a:visited {
  color: #0093e0;
  text-decoration: none !important;
}

.fieldset-inline-form legend span {
  background-color: white;
}

/* Form handles for inline content */

#formhandle-StatusUpdate  { 
    background-image: url(../images/icons/statusupdate.png);
    background-position: 6px 3px;
    background-repeat: no-repeat;
    padding-left: 25px;
}

/*#formhandle-Document  { 
    background: url(../images/icons/document.png) 0 0 no-repeat;
    margin-left: 6px;
    padding-left: 15px;
}
*/
#formhandle-File  {
    background-image: url(../images/icons/upload.png);
    background-position: 6px 3px;
    background-repeat: no-repeat;
    padding-left: 25px;
}

#formhandle-Task  {
    background-image: url(../images/icons/task.png);
    background-position: 6px 3px;
    background-repeat: no-repeat;
    padding-left: 25px;
}


ul.inline-form {
  margin: 0;
  padding: 0;
  position: relative;
  top: 5px;
}

ul.inline-form li {
  list-style: none;
  padding: 0;
  margin: 0 0 10px;
}

ul.inline-form li {
  display: inline;
  padding: 0 10px 0 0;
  margin: 0;
}

ul.inline-form li label {
  width: 50%;
  vertical-align: top;
  margin-top: 1em;
  display: none;
}

ul.inline-form textarea {
    width: 530px;
    padding: 5px;
    margin-bottom: 10px;
}

.noleftcol ul.inline-form textarea {
    width: 712px;
}

ul.inline-form select {
  background-color: #efefef;
}

/* For resource widget cohabitation (the textarea is displayed only after upload) */

#form-File ul.inline-form textarea {
  display: none;
  width: 418px !important;
  height: 88px;
}

.noleftcol #form-File ul.inline-form textarea {
  width: 600px !important;
}


/* edit forms */

.edit-form fieldset {
   border: none;
   background-color: #f7f7f7;
   padding: 5px 0 10px;
   margin: 10px 0 0 0;
   clear: both;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;
}

.edit-form legend {
   /* not used for now */
}

.edit-form h2 {
   font-size: 16px;
   padding: 0 10px 8px;
}

/* specific for forms with some fields inline (ex: search for invite in community) */

.two-blocks-form .formBlock {
    padding: 0;
    width: 50%;
    float: left;
    clear: none;
}

.three-blocks-form .formBlock {
    padding: 0;
    width: 33%;
    float: left;
    clear: none;
}

.three-blocks-form .formBlock input[type="submit"] {
    position: relative;
    top: -5px;
}

.formBlock label {
  font-size: 13px;
  padding: 0 10px 0 0;
  text-align: right;
}

/* forms using results inside (eg: invite users grid) */

.resultsInFormBlock {
    padding: 0 10px;
    clear: both;
}
.tnGrid {         
    border-spacing: 1px;
    /* IMPORTANT : the grid is shown by javascript tn.js > gridStyle */
    display: none;
}

/* rows are added in js, depending on grid class */
.tnGridRow {
    /* possible js fix needed for IE<=7 in future */
    display: table-row;
}

.tnGridItem {
    height: auto;
    width: auto;
    /* possible fix needed for IE<=7 in future */
    display: table-cell;
    vertical-align: top;
    padding: 4px;
    border: 1px solid #F7F7F7;
    cursor: pointer;
}

.tnGridItem:hover {
    border-color: #AAA;
}

.tnGrid .itemSelected {
    background-color: white;
    border-color: #333;
}

.tnGridItem .thumbnail-account-part {
    margin: 0 !important;
}

.tnGridItem a,
.tnGridItem a:hover {
    text-decoration: none !important;
}

.tnGridItem input[type="checkbox"],
.tnGridItem input[type="radio"] {
    display: none;
}


/* Our great resource widget */

.resource-widget {
    margin-left: 150px;
}

/* permissions select list too large sometimes */

select.permissions-widget {
    max-width: 200px;
}

#form-protect-unload-message {
    display: none;
}

.permission-description {
    display: none;
}

/* Inline Comment forms */
.comment-form {
  padding: 0 5px 0 0;
}

.comment-form ul.inline-form textarea {
    width: 461px;
    padding: 5px;
}

/*                                                  */
/*                   Form Tooltips                  */
/*                                                  */

.hint {
  display:none;
  position: absolute;
  right: 150px;
  width: 200px;
  margin-top: -25px;
  border: 1px solid #c93;
  padding: 10px 12px;
  background-color: #ffc;
}

.hint .hint-pointer {
    position: absolute;
    left: -10px;
    top: 5px;
    width: 10px;
    height: 19px;
    background: url(../images/tooltip-pointer.gif) left top no-repeat;
}

