/*********
 * Forms *
 *********/

form input,
form select
{
  color:            inherit;
  background-color: #fff;
  border:           1px solid #aaa;
  font-family:      Helvetica, Arial, sans-serif;
  font-size:        1em;
  outline:          none;
  padding:          5px;
  margin:           0;
}

form input[type='image']
{
  border:           none;
  padding:          0;
}

form select
{
  padding:          0;
}



/*** Regular Button ***/
button,
.button
{
  background:       #eeeeee url('../images/buttonbg.png') repeat-x bottom;
  border:           1px solid #aaa;
  color:            rgb(14, 59, 104);
  cursor:           pointer;
  font-family:      Helvetica, Arial, sans-serif;
  font-size:        1em;
  outline:          none;
  padding:          5px 10px;
  margin:           0;
  text-decoration:  none;
}

button:hover,
.button:hover
{
  background:       #ffffff url('../images/buttonbg-hover.png') repeat-x bottom;
  border-color:     #bbb;
  text-decoration:  none;
}

button:active,
.button:active
{
  background:       #dddddd url('../images/buttonbg-down.png') repeat-x bottom;
  border-color:     #999;
  text-decoration:  none;
}



/*** Cancel Button ***/
button.cancel
{
  background:       #ffcccc url('../images/buttoncancelbg.png') repeat-x bottom;
  border-color:     #b99;
  color:            #d00;
}

button.cancel:hover
{
  background:       #ffdddd url('../images/buttoncancelbg-hover.png') repeat-x bottom;
  border-color:     #caa;
}

button.cancel:active
{
  background:       #ffaaaa url('../images/buttoncancelbg-down.png') repeat-x bottom;
  border-color:     #a88;
}



/*** Form Table ***/
form > table
{
  border:           none;
  border-collapse:  collapse;
  border-top:       1px solid #aaa;
  /*border-bottom:    1px solid #aaa;*/
  margin:           1em 0 0 0;
  width:            700px;
}

/* table cells */
form > table > tbody > tr > th,
form > table > tr > th,
form > table > tbody > tr > td,
form > table > tr > td
{
  border:           none;
  padding:          0 0 1em 0;
  text-align:       left;
  vertical-align:   top;
  width:            500px;
}

/* table header cells */
form > table > tbody > tr > th,
form > table > tr > th
{
  font-weight:      bold;
  padding-right:    20px;
  text-align:       right;
  width:            180px;
}

form > table > tbody > tr:first-child > th,
form > table > tr:first-child > th,
form > table > tbody > tr:first-child > td,
form > table > tr:first-child > td
{
  padding-top:      1em;
}



/*** input styling ***/
form > table input[type='text'],
form > table input[type='password']
{
  color:            #000;
  width:            488px;
}

form > table input[type='checkbox'],
form > table input[type='radio']
{
  border:           none;
  display:          inline;
  margin-top:       9px;
  padding:          0;
}

form > table input.date-element
{
  margin:           0 0.5em 0 0;
  width:            50px;
  text-align:       center;
}

form > table textarea
{
  color:            inherit;
  background-color: #fff;
  border:           1px solid #aaa;
  font-family:      Helvetica, Arial, sans-serif;
  font-size:        1em;
  height:           100px;
  outline:          none;
  padding:          5px;
  margin:           0;
  width:            488px;
}

form > table select
{
  color:            #000;
  margin-top:       4px;
  width:            498px;
}

/* fields in focus */
form > table input[type='text']:focus,
form > table input[type='password']:focus,
form > table textarea:focus
{
  border-color:     #f60;
}



/*** special text field ***/
form > table div.text-field
{
  background-color: #fff;
  color:            inherit;
  font-family:      Helvetica, Arial, sans-serif;
  font-size:        1em;
  margin:           0;
  outline:          none;
  padding:          0;
  position:         relative;
}

/* should be type="text" or "password" */
form > table div.text-field > input
{
  width:            auto;
}

form > table div.text-field.money > input
{
  padding-left:     16px;
  width:            100px;
}

/* text-field overlay (max-width of 16px) */
form > table div.text-field div.text-field-overlay
{
  left:             0;
  max-width:        16px;
  overflow:         hidden;
  padding:          6px 0 0 6px;
  position:         absolute;
  top:              0;
}



/*** form element labels ***/
form > table label
{
  display:          inline;
  font-weight:      bold;
  /*padding-top:      6px;*/
}

form > table th > label
{
  display:          block;
  padding:          6px 0 0 0;
}

form > table input + label
{
  display:          inline;
}



form > table p
{
  padding:          6px 0 0 0;
}

form > table p + p
{
  padding:          0;
}



form > table br + input,
form > table br + select
{
  margin-top:       0.5em;
}

form > table input.date-element + input.date-element
{
  display:          inline;
  margin:           0 0.5em 0 0.5em;
}

span#username-available
{
  padding-left:     20px;
  visibility:       hidden;
}



/* login error message */
#login-error
{
  padding-left:     20px;
  visibility:       hidden;
}



/*** list that contains table forms ***/
ol.table-form-list,
ul.table-form-list
{
  border-bottom:    1px solid #aaa;
  margin:           1em 0 0 0;
  position:         relative;
}

ol.table-form-list > li,
ul.table-form-list > li
{
  border-top:       1px solid #aaa;
  list-style:       none;
  overflow:         hidden;
  padding:          0.5em 0;
  position:         relative;
}

ol.table-form-list ol,
ol.table-form-list ul,
ul.table-form-list ol,
ul.table-form-list ul
{
  margin-left:      0;
}

ol.table-form-list ol > li,
ol.table-form-list ul > li,
ul.table-form-list ol > li,
ul.table-form-list ul > li
{
  background-color: #eee;
  border:           none;
  list-style:       none;
  margin-bottom:    2px;
  padding:          5px;
}

ol.table-form-list > li:after,
ul.table-form-list > li:after
{
  clear:            both;
  content:          "";
  display:          block;
}

ol.table-form-list > li.drag,
ul.table-form-list > li.drag
{
  background-color: #ccc;
  opacity:          0.5;
  position:         absolute;
  width:            100%;
  z-index:          100000;
}

ol.table-form-list > li.placeholder,
ul.table-form-list > li.placeholder
{
  padding:          0;
}

ol.table-form-list > li div.handle,
ul.table-form-list > li div.handle
{
  background:       url('../images/grab.png') repeat top left;
  cursor:           move;
  display:          inline-block;
  height:           1em;
  margin:           0 4px 0 0;
  width:            16px;
}

ol.table-form-list > li span.rank,
ul.table-form-list > li span.rank
{
  display:          none;
}



/*** Sub Table ***/
ol.table-form-list > li table,
ul.table-form-list > li table
{
  border-top:       1px solid #ccc;
  border-bottom:    none;
  margin:           0.5em 0 0 0;
  width:            680px;
}

ol.table-form-list > li table > tbody > tr > th,
ul.table-form-list > li table > tbody > tr > th,
ol.table-form-list > li table > tr > th,
ul.table-form-list > li table > tr > th
{
  padding-right:    20px;
  text-align:       right;
  width:            160px;
}



img.loader
{
  display:          none;
  float:            right;
  padding:          6px 0 0 0;
}