/****  
 Base CSS  © 2011 Keith Gravell  
 Cambridge Web Projects 01638 720655  
****/


body { 
    margin:0;
    padding:0;
    font: 12px Verdana, Arial, sans serif; 
    line-height:120%;
    background: #F5F5F5  }

p { 
    font: 13px Verdana, Arial, sans serif; 
    color: #333; 
    margin:0; padding: 4px 0; 
    line-height:140%  }

p.small { 
    font: 11px Verdana, Arial, sans serif; 
    color: #333; 
    margin:0; padding: 3px 0; 
    line-height:130% }
p.tight {
    line-height:120%;
    color: #666 }
p.emph { 
    font-size:14px; 
    color: #000; 
    line-height: 150%; 
    margin:4px 0 }
p.breadcrumb {
    font-size: 9px;
    font-weight:normal;
    letter-spacing:1.4px;
    color: #999;
    margin: 0 0 24px 0;
    padding: 0 0 0 8px;
    background: url(../images/bcrumb_bg.jpg) no-repeat }
p a {color: #148; text-decoration:none; font-weight:bold}
p a:hover  { color:#000; border-bottom: 0px; text-decoration:underline }
p.ruled { border-bottom: solid 1px #ddd; margin-top:8px; padding-bottom:8px }

ul { margin: 0; padding: 0 0 0 24px} 

li {list-style-image: url(../images/bullet.gif); padding:2px 0; line-height:140%; color:#333 }
li a:hover {color:#000; border-bottom: 0px }
li.mainlink  { 
    font: bold 14px Arial, Helvetica, san serif;
    color:#36c;
    list-style-image: url(../images/bullet.gif);
    padding: 6px 0}
li.mainlink a { color: #36C; text-decoration: none }
li.mainlink a:hover { color:#444; border-bottom: dashed 1px #444 }

h1 { 
    font: 20px Arial, Helvetica, san serif; 
    color: #149; 
    padding: 2px 2px 24px 2px }
h1 a { text-decoration:none; color:#666 }

h2, .h2 { 
    font: 16px Arial, Helvetica, san serif; 
    color: #fff; 
    display:block; width:100%;
    letter-spacing:.5px;
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    margin:0 0 8px 0; 
    padding: 6px 6px 2px 6px;
    background-color: #27C }

h3 { 
    font: bold 14px Arial, Helvetica, san serif; 
    color: #148; 
    margin:0; padding: 8px 0 0 0  }
h3 a {color: #369; text-decoration:none; border-bottom: solid 1px #cef }
h3 a:hover { color:#000; text-decoration: none; border-bottom: solid 1px #333 }

h4 {
    font: 14px Arial, Helvetica, san serif; 
    color: #159; 
    margin:0; padding: 0  }
h4 a {text-decoration:none; color: #159}
h4 a:hover { text-decoration:none; border-bottom: solid 1px #CCF; color:#36C }

h3.ruled, h4.ruled { border-top: solid 1px #ddd; margin-top:12px; padding-top:8px; clear:both }

em {margin-left:18px; font-style:normal }

img { border: 0 }

td { color: #333; vertical-align:top; padding:8px }

fieldset { border: solid 1px #69C; padding:8px; margin: 2px 0 }
legend {
     font: bold 14px Arial, Helvetica, san serif; 
     padding: 8px;
     color: #149 }


.button { 
    font-size:16px; 
    padding:8px; 
    color:#fff; 
    background:#369; 
    border:#148; border-radius:6px }
.button:hover { background:#148 }


.editthis {
    font: normal 9px/10px Verdana, Arial, Helvetica, sans-serif;
    text-align:right;
    color: #999;
    text-decoration:none;
    padding-right:12px}

.tbox {
    font: normal 14px Verdana, Arial, Helvetica, sans-serif;
    color:#333;
    padding:4px;
    border: solid 1px #ccc  }
.tbox:focus { border:solid 1px #69c}

.error { color:Red }

.drop {
   font: 14px Verdana, Helvetica, sans-serif;
   color:#000;
   border: solid 1px #ddd;
   padding:6px }

.editbutton {
    position: absolute;
    left:6px }

.caption { 
    font: oblique 14px Georgia, serif;
    color: #369; }

.faq { width:98%}
.faq h2 { color: #148; font: bold 16px/16px Arial, Helvetica, sans-serif; padding: 10px 0 6px 0; background-color: #eee}
.faq h4 {
    cursor:pointer; 
    font:  14px Arial, Helvetica, sans-serif;
    color: #148; 
    line-height: 130%; 
    margin-bottom:8px }
.faq div {
    display:none;
    width: 660px;
    background-color: #fcfcfe;
    border: solid 1px #eee;
    padding: 3px 8px;
    margin-bottom:18px }

.accordian div { 
    display:none; 
    border-left: solid 3px #eef5ff;
    padding: 3px 12px;
    cursor:pointer }
.accordian h4 { 
    font: bold 16px Arial, Helvetica, sans-serif;
    padding: 6px; 
    background-color: #eef5ff; 
    cursor:pointer;
    color:#369; }
.accordian li { color:#999 }
.accordian li a {font-weight: 400; font-size:14px; padding:2px; color:#369}

/*************** FORMs **********************/

.form-group, .form-group-hidden { 
    width:98%; 
    min-height:1px; 
    margin: 4px; 
    display:inline-block  }
.form-group-hidden { display:none }

.form-label { 
    margin:0;
    width: 40%;
    float:left;
    font-size: 13px;
    font-weight:600;
    padding: 6px 12px;
    color:#666;
    text-align:right;
}
.form-label-wide {
    width:90%;
    margin:0;
    float:left;
    font-size: 13px;
    font-weight:600;
    padding: 2px 10px;
    margin-bottom:6px;
    color:#666;
    text-align:left;
}
.form-label .prompt, .form-label-wide .prompt { 
    font-size:12px; 
    font-weight: 400;
    font-family: 'Droid Serif', serif;
    color: #369;
}
.form-input {
    float:left;
    width:56%;
    font-size: 13px;
    font-weight: 400;
    color: #333;
    text-align:left;
}
.form-input-wide {
    float:left;
    font-size:13px;
    color: #333;
    padding:8px;
}
fieldset.reveal {margin: 8px 20px 8px 16px}

.setleft { padding-right:30px; padding-left:30px }

fieldset { 
    padding:12px; 
    margin: 6px; 
    background-color: #FFFFFC; 
    border: solid 1px #9CF }
legend {
    font-weight: 600; 
    padding: 4px;
    color: #07B }
.action-bar { 
    border: solid 1px #ddd;
    border-radius:3px;
    background-color: #f9f9f9;
    margin: 16px 6px;
    padding:10px;
}


input[type=button], button,  .button { 
    font-size:16px; 
    padding:8px; 
    color:#fff; 
    background:#36C; 
    border:#148; border-radius:3px }
input[type=button]:hover, button:hover, .button:hover { background:#148 }

.button-cancel { background: #CCC; margin-left:36px }
.text-button { display:inline-block; background: #36C; padding:2px; border-radius:3px }
.text-button a { color:#fff; text-decoration:none }
.text-button a:hover { background: #148 }

select { 
    font-size:14px; 
    color:#444;
    padding:4px;
    margin-bottom:4px; 
    width: 280px; 
    border: solid 2px #def }
option { 
    color:#666;
}

input[type=text], 
input[type=password] 
{ 
    font-size: 14px;
    color: #000;
    width: 240px;
    padding:5px;
    margin:2px;
    border: solid 2px #def;
    border-radius:4px;
}
input[type=text].short-text { width: 96px; }
input[type=text]:disabled { border: none; opacity:0.7 }

input[type=number] {
    font-size: 14px;
    color: #000;
    width: 50px;
    padding:5px;
    margin:0;
    border: solid 2px #def;
    border-radius:4px;
}
input[type=text]:focus, input[type=number]:focus, input[type=password]:focus { border: solid 2px #9CF }

input[type=radio] { text-align:left; margin: 8px }
/* input[type=checkbox] { margin:0 8px;  } */

input[type=checkbox] {
   /* All browsers except webkit*/
     transform: scale(1.5);
  /* Webkit browsers*/
    -webkit-transform: scale(1.5);

    margin:6px 8px;
    vertical-align:middle;
    opacity:0.7; 
}

.choice-button a { 
    display: block;
    width: 220px;
    font-size:14px; 
    padding:6px; 
    text-align:center;
    line-height:40px;
    color:#fff; 
    text-decoration:none;
    background:#37e; 
    border:#148; 
    border-radius:6px }
.choice-button a:hover { background: #36C; }
 


/***   Validate.js error formatting  ***/
label.error { 
    color: red; 
    font-size:13px; 
    font-weight:600;
    display:block; 
}
input.error, select.error { 
    border: solid 1px red; 
    color:red; 
    font-weight:400;
}
.error { font-weight:600; color:red; padding-left: 8px } 


/***   Form Placeholder formatting  ***/
::-webkit-input-placeholder { /* WebKit browsers */
    color:    #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #999;
    opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #999;
    opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #999 !important;
}