.F                  { margin:0; }
.F table            { font-size:0.85em;}
.F table table      { margin:6px 0 3px 0; font-size:1em; }
.F input,select,textarea { font-size:1em; }
.F th               { white-space:nowrap; padding:5px 20px 5px 5px;  vertical-align:middle; line-height:2.2em;  background-color:#fff; vertical-align: top; text-align:right;}
.F th[colspan]    { border-top: #fff solid 1px; border-bottom: #fff solid 1px; border-right: none; }
.F td[colspan]    { border-top: #fff solid 1px; border-bottom: #fff solid 1px; border-right: none; }
.F th .Right        { float:right; text-align:right; }
.F td               { padding:5px; background-color:#fff; }
.F thead td,.F .H td{ background-color:#fff; font-weight:bold; }
.F tbody input      { width:18em; }
.F tbody input[type="checkbox"],.F tbody input[type="radio"] { width:auto; }
.F tbody .Auto      { width:auto; }
.F tbody .Amt       { width:6em; }
.F tbody .Digit     { width:2em; }
.F tbody .CC        { width:4em; }
.F tbody .Half      { width:10em; }
.F tbody textarea   { width:100%; height:12em; }
.F .Middle          { vertical-align:middle; width:auto; }
.F tfoot th         { background-color:#f0f3f7; border-right:0; border-top: #999 solid 1px; }
.F tfoot td         { background-color:#f0f3f7; border-top: #999 solid 1px; }

.F .Date            { width:6em; }

.F th.Req           { padding-right:20px; background-image:url('../images/g-required.gif'); background-position: top right; background-repeat: no-repeat ; }

.F tbody th.mid-title { text-align:left; background-color:#f0f3f7;}

/* Survey */

.S table {width:650px;} 
.S thead td {text-align:center; width:auto; }
.S tbody tr {width:auto; }
.S tbody td {text-align:center; width:4em; }
.S tbody td input { width:auto; }
.S th { width:auto; white-space:normal;}
.S tbody th {width:auto; }

.F .dob{ width: 4em;}

/* Numbered Steps */

.membership-steps {
  font-family:'Trebuchet MS', Arial, sans-serif;
  font-size:25px;
  height:55px;
  line-height: 35px;
  background-image:url(../images/g-dashed-line.gif);
  background-repeat:repeat-x;
  background-position:0 30%;  
  width:550px;
}

.membership-steps a {
  text-decoration:none;
}

.step {
  cursor: pointer;
  width:95px;
  background-image:url(../images/g-number-box.gif);
  background-repeat:no-repeat;
  background-position:50% 0;  
  text-align:center;
  float:left;
  margin:0 5px;  
}

.membership-steps .step a {
	background-image:none;
}

.membership-steps .step span {
  display: block;
  font-family:Verdana, sans-serif;
  font-size:10px; 
  line-height:25px;
}

.membership-steps .step-on {
  cursor: pointer;
  width:95px;
  background-image:url(../images/g-number-box-on.gif);
  background-repeat:no-repeat;
  background-position:50% 0;  
  text-align:center;
  float:left;
  margin:0 5px;  
  color:#fff;
}

.membership-steps .step-on span {
  display: block;
  font-family:Verdana, sans-serif;
  font-size:10px; 
  line-height:25px; 
  color:#000;
}

.membership-steps .step-on a {
  color: #fff;
}

.awards th {
	text-align:left;
}

/* signup form cc details */
div#signup_cc_details
{
  margin: 1em 3em;
  padding: 0.5em;
  border: 1px solid #cccccc;
}

div#signup_cc_details div
{
  padding: 5px 0;
}

div#signup_cc_details div label
{
  width: 100px;
}

div#signup_cc_details div label:after
{
  content: ':';
}

/* modern forms */


.b {
  padding : 0px;
  font-size:0.85em;
  float: right;  
  width : 250px;
  text-align : left;
  border : 1px solid #E30202;
  margin-top: -40px;
  


}

.b input,
.b select,
.b textarea {
  font-size:1em;  
  margin-top: 2px;
}

.b select.wide
{
	width : 220px;
}

.b th,
.b td {

  border-left:0;
  border-bottom:0;
  padding:0px 4px 0px 4px;

}

.b th {
  line-height:2em;
  text-align:left;


  color: #FFF;
}

.b thead th,
.b thead td {

   background-color : #E30202;
   padding : 5px;
  color:#fff;
  font-weight : bold;
}

.b thead tr
{
	margin: 2px;
}

.b tbody th {


  padding-right:0.0em;
  font-weight : normal;
  color : E30202;
  text-align : right;
  vertical-align : top;

}

.b tbody td {

  color: #E30202;
  padding : 4px;
}

.b tbody input {
  width:20em;
  border : 1px solid #E30202;
  background-color: #fff;
}

.b tbody input.small
{
	width : 3em;
}

.b tbody input.auto {
  width:auto;
}
.b textarea {
  width:99%;
  height:8em;
}

.b tfoot th {
  border-right:0;
}

.b tfoot
{

}

.b tfoot td input {
  margin:0.4em 0 0.4em 0;
}

.b tbody .num2 {
  width:2em;
  color: #fff;
}

.b small {
  margin-left:0.5em;
}





  .b tbody td.heading {
  background-color: #0F054E;
  color:#fff;
  /*font-weight:bold;*/
  line-height:1.6em;
}

.b input.submit
 {

  width:auto;
  border: 1px solid #000;  
  background-color: #E30202;


  

    




  color: #fff;
  

}

input.valid-form-field, textarea.valid-form-field
{
  background-image: url('../include/modules/optional/formgeneration/images/field-verified-tick.png');
  background-repeat: no-repeat;
  background-position: 100% 3px;
}

input.invalid-form-field, textarea.invalid-form-field
{
  background-color: #FFCCC8;
}

form.f div.field-validation-rules
{
  display: inline;
  white-space: nowrap;
  margin: 5px 0 0 10px;
  
  font-size: 0.8em;
  padding: 0.2em 1em;
  background-color: #f55;
  color: #fff;
  
  -webkit-border-radius: 0.5em;
  -moz-border-radius: 0.5em;
}

form.f { font-size:0.8em; width: 450px; padding:10px; margin: 1em 0; border: 1px solid #DDDDDE; line-height:1.25em;  }
form.small-label { }
 
form.f p { clear:right; padding-top:4px; }
 
form.f div { clear:right; padding:5px 0; margin: 0; }
form.f div div { clear:none; padding:0; }
#content form.f div div p { font-size:1em; margin:0 0 1em 0; }
form.f label { width:80px; display:block; float:left; margin:0 20px 0 0; font-weight: bold;  text-align: right; }
form.f input, form.f textarea { line-height:1.25em; border:#ccc solid 1px; padding:2px; font-size:1em;}  
form.f select { line-height:1.25em; border:#ccc solid 1px; font-size:1em; padding:2px 0;}  
form.f select.country { width: 250px; }  
form.f input { width:250px; }
form.f textarea { width:320px; height:9em;}
form.f textarea.large { width:450px; height:16em; }
form.f textarea.address { width: 250px; height: 2.8em; }
form.f span.note { display: inline-block; vertical-align: baseline; color: #666; font-style: italic; font-size: 0.9em; }
form.f div.note-for-previous { margin-top: -9px; width: 20em; color: #666; font-style: italic; font-size: 0.9em; }
 
form.f .field { display: block; margin: 0 0 0 100px;}
form.f div.note-for-previous { margin-left: 100px;}
form.f input.checkbox { width:auto; vertical-align:middle; border:0;}
form.f input.radio { width:auto; vertical-align:middle; border:0;}
form.f input.small, form.f select.small { width:55px; }
form.f input.medium, form.f select.medium { width:200px; }
form.f input.large, form.f select.large { width:250px; }
form.f input.checkbox-group { margin:0 0 0 100px;}
 
form.f div.inline-field label { width:80px; display:inline; float:none; margin:0 10px 0 0;}
form.f div.inline-field { margin:0 0 0 100px; color:#585757; }
form.f div.buttons,form.f p.buttons { margin: 20px 0 0 100px; }
 
form.medium-label .field { display: block; margin: 0 0 0 150px; }
form.medium-label div.note-for-previous { margin-left: 150px; }
form.medium-label {  width:510px;}
form.medium-label label { width:130px;}
form.medium-label div.inline-field label { width:55px; display:inline; float:none; margin:0 10px 0 0;}
form.medium-label div.inline-field { margin:0 0 0 150px;}
form.medium-label .checkbox-group { margin:0 0 0 150px; font-size:1em;}
form.medium-label textarea { width:320px; height:9em;}
form.medium-label div.buttons,form.medium-label p.buttons { margin: 20px 0 0 150px; }
 
form.large-label .field { display: block; margin: 0 0 0 200px; }
form.large-label div.note-for-previous { margin-left: 200px; }
form.large-label {  width:700px;}
form.large-label label { width:180px;}
form.large-label div.inline-field label { width:55px; display:inline; float:none; margin:0 10px 0 0;}
form.large-label div.inline-field { margin:0 0 0 200px;}
form.large-label .checkbox-group { margin:0 0 0 200px; font-size:1em;}
form.large-label div.buttons,form.large-label p.buttons { margin: 20px 0 0 200px; }

form.auto-label .field { display: block; margin: 0 0 0 200px; }
form.auto-label div.note-for-previous { margin-left: 200px; }
form.auto-label {  width:auto;}
form.auto-label label { width:180px;}
form.auto-label div.inline-field label { width:55px; display:inline; float:none; margin:0 10px 0 0;}
form.auto-label div.inline-field { margin:0 0 0 200px;}
form.auto-label .checkbox-group { margin:0 0 0 200px; font-size:1em;}
form.auto-label div.buttons,form.auto-label p.buttons { margin: 20px 0 0 200px; }

 
form.f input.submit, form.f a.button, form.f input.button, #content form.f input.submit, #content form.f a.button, #content form.f input.button { background-image: none; padding: 0.25em 1em; margin: 0 0.25em; border: 1px solid #C40C42; background-color: #C40C42; width: auto; cursor: pointer; color: #fff; }
form.f a.button:hover { text-decoration: none; }
form.f input.submit { background-color: #2E418A; border: 1px solid #000; color: #fff; }
 
label.rhs_label {display: inline !important; float: none !important; width: auto !important; margin:0 !important; font-weight: normal !important; text-align: left !important;}
form.f .field ul { margin: 0 0 1em 2em; padding: 0; }
form.f .field ul li { margin: 0; padding: 0; }
 
form.f table { width:28em; border:#ccc solid 1px; border-collapse: collapse;}
form.f td, th { padding:4px 6px;}
form.f table thead { background-color:#ccc;}
form.f th { text-align:left; width:60%; }
form.f tbody th {border-right:#eee solid 1px;}
form.f table tfoot { background-color:#eee;}

 
form.f div.form-section { padding-top:0; }
 
form.auto { width:auto; }
form.auto table { width:100% }
form.auto td, th { padding:2px; }
form.auto th { width:auto; }


/**** calendar colours ****/
form.f div.calendar
{
  background-color: #fff;
  border: 1px solid #5E5E5E;
}

form.f div.calendar-header
{
  background-color: #A40233;
  color: #fff;
}

form.f div.calendar-days
{
  background-color: #F2F2F2;
}

form.f div.calendar-cells a
{
  color: #000;
  border-left: 1px solid #DDDDDE; /* note: MUST be a 1px border-left */
  border-top: 1px solid #DDDDDE;  /* note: MUST be a 1px border-top */
}

form.f div.calendar-cells a:hover, form.f div.calendar-cells a.selected
{
  background-color: #A40233;
  color: #fff;
  font-weight: bold;
}

form.f div.calendar-cells a.other-month
{
  background-color: #F2F2F2;
}

form.f div.calendar-cells a.other-month:hover
{
  background-color: #F2F2F2;
}

form.f div.calendar-cells a.today
{
  background-color: #DDDDDE;
}

form.f div.calendar-cells a.today:hover
{
  background-color: #A40233;
}


/**** calendar layout ****/
form.f div.calendar
{
  display: inline;
  position: absolute;
  width: 210px;
  
  /* drop shadow in supported browsers to give "depth of field" */
  -webkit-box-shadow: 0px 4px 35px rgba(0,0,0,0.5);;
}

form.f div.calendar-header
{
  height: 20px;
}

form.f div.calendar-header a
{
  display: block;
  float: left;
  width: 20px;
  text-align: center;
  
  text-decoration: none;
  color: #fff;
}

form.f div.calendar-header a:hover
{
  font-weight: bold;
}

form.f div.calendar-header span
{
  display: block;
  float: left;
  width: 170px;
  text-align: center;
  font-size: 0.9em;
}

form.f div.calendar-days
{
  line-height: 22px;
  height: 22px;
}

form.f div.calendar-days span
{
  display: block;
  float: left;
  width: 30px;
  text-align: center;
  
  font-size: 0.9em;
  font-weight: bold;
}

form.f div.calendar-cells a
{
  display: block;
  float: left;
  width: 29px;
  line-height: 22px;
  text-align: center;
  
  text-decoration: none;
  font-size: 0.9em;
}

form.f div.calendar-cells a.other-month:hover
{
  background-color: #F2F2F2;
}

form.f div.treeselector
{
  display: inline-block;
}

form.f div.treeselector select
{
  margin: 0.5em;
}

form.f div.treeselector div.treeselect_descendants
{
  padding: 0 0 0 2em;
}

#content form.f p, #content form.f ul
{
  font-size: 1em;
}

form.auth-reset-password input
{
  border:#ccc solid 1px;
  font-size:1em;
  padding:2px 0;
}

form.auth-reset-password input.submit, form.auth-reset-password input.button
{
  width:auto;
  border: 1px solid #000;  
  margin: 0 1em 0 0;
  background-color: #c40c42 !important;
  background-image: none !important;
  padding: 0.2em 1em;
  color: #fff;
}