@charset "utf-8";
/* CSS Document */

div.formwrap{
/*border:1px solid #666; *//* sets border of the form */
/*border:0; *//* removes border of the form */
/*background-color:#c8e5e8; */ /*light blue*/
/*font-family: "Trebuchet MS", Helvetica, sans-serif; */ /* consider tweaking with this depending on main stylesheet */
/*font-size: 85%;*//* consider tweaking with this depending on main stylesheet */
border-radius: 10px;
}

form {  /* set width in form, not fieldset */
}

div.formwrap fieldset {
/*border: #999 1px solid; *//* sets the border of the fieldset */
border: 0; /* removes the border of the fieldset */
background-color:#fff;
border-radius: 10px;
}

/* style of LEGENDs */

div.formwrap fieldset legend {
/*font-size:1.1em !important;*/
background-color:#57a8bd /*bright blue*/;
color:#fff;
padding:0.2em 0.5em 0.1em 0.5em;
font-weight:bold;
}

/* style of LABELs */

div.formwrap label {
font-size:0.9em; /* general label styling */
font-weight:normal; /* general label styling */
}

div.formwrap label.left{

}

div.formwrap input.rightlabel{ /* left float the inputs for 'reversed' radios and checkboxes */

}

div.formwrap input,
div.formwrap textarea,
div.formwrap select{
/*border:1px solid #999;*/
}

/* start tweak label margins to align vertically optimally in various browsers */

div.formwrap label,
div.formwrap input,
div.formwrap textarea,
div.formwrap select{
margin-top:5px;
}

div.formwrap label.radio{
margin-top:2px;
}

div.formwrap label.check{
margin-top:2px;
}

/* end tweak label margins to align vertically optimally in various browsers */

div.formwrap br{
clear:left;
}

div.formwrap h2 { /* for a note full width across form */
font-size: 0.9em;
padding-bottom:0.5em;
font-weight:bold !important;
}

div.formwrap p.noteafter{ /* for text to right of an input */
font-size: 0.9em;
}

div.formwrap p.noteunder { /* for a paragraph left aligned with and under inputs */
font-size: 0.9em;
}

div.formwrap fieldset img{
margin:0 0 0 160px; /* mainly for the captcha image */
}

div.formwrap input.radiocheck{
padding:0 !important;
width:20px !important;
margin:5px 0 0 5px; !important;
}

/* start for two column radios and checkboxes */
 
div.formwrap div.leftcol,
div.formwrap div.rightcol{

}

div.formwrap div.leftcol{

}

div.formwrap div.rightcol{

}

/* end for two column radios and checkboxes */
 
div.formwrap label.between{ /* for label in between two horizontal selectors */

}

div.formwrap p.check{ /* tweak for vertical alignment of checkboxes optimised for all browsers */

}

div.formwrap fieldset.hide{ /* insurance to hide hidden fields */

}

 /*styling for required elements */

div.formwrap .required{
border-top:2px solid #f66;
border-bottom:2px solid #f66;
border-left:1px solid #666;
border-right:1px solid #666;
}

div.formwrap .require{
/*color:#620039;*/
font-weight:bold;
}


/* table in a fieldset */

div.formwrap fieldset table{
/* width:100%; */
font-size:0.9em;
border:0;
background-color:#efe;
margin-left:auto;
margin-right:auto;
}

div.formwrap fieldset table tbody th{
width:145px;
font-weight:bold;
text-align:right;
background-color:#efe;
}

div.formwrap fieldset table tbody td{
background-color:#efe;
}

div.formwrap fieldset table tfoot th{
width:145px;
font-weight:bold;
text-align:right;
}

div.formwrap fieldset table tr.total th{
width:145px;
font-weight:bold;
text-align:right;
}

div.formwrap fieldset td{
width:50px;
}

div.formwrap table td.rt{
text-align:right;
}

div.formwrap table td input{
margin:0;
}

div.formwrap tr th{
background-color:#efe;
}


div.formwrap tr td input,
div.formwrap tr td select{
display:inline !important;
}

span.ooslabel{
margin-left:100px;
margin-right:5px;
}

span.ooslabel,
span.oostock{
position:relative;
top:3px;
}

div#frndsbox table{
margin:0 0 0 205px;
}

div#frndsbox table td{
border:0;	
}


@media screen and (max-width: 500px) {

  div.formwrap p.noteunder {
    margin-left: 0;
  }

  div.formwrap textarea {
    margin-left: 0;
    margin-bottom: 0.5em;
    max-width: 80vw; /* a bit of a kludge. This value is set so that screen widths down to 250px still look ok*/
  }

  div.formwrap select#heardcode option {
    /* Some of the labels in this selection are long, so reduce the font size to
       stop the select box overflowing the window width.
    */
    font-size: 70%;
  }

}