/*
#e0e0e0 light grey
#696969 dark grey
*/

/* ARCHITECURE */

*{
margin:0px;
padding:0px;
}


body {
  font-family: "Helvetica", "Trebuchet MS", Arial, Calibri, Tahoma, Impact, sans-serif;
  margin: 0px;
  padding: 0px;
}

/* TYPOGRAPHY */

 h1,h2{
  letter-spacing: -1.9px;
  color: #3366CC;
  font-weight:400;
}

h1{  
    margin: 0px 5px 15px 5px;
    font-size:2.5em;
}

h2{
  font-size: 2.0em;
  line-height: 1.1em;
}

h1 span, h2 span{
color: #696969;
}

/* review this */

h3{
  font-weight:400;
  font-size: 1.4em;
  color: #696969;
  margin:6px 0px;
}

p, ul.paraList li{
font-size: 1.0em;
line-height: 1.5em;
margin: 8px 0px;
color: #696969;
}

a.inline
{
    border-bottom:2px dotted #3366CC;
    color:#696969;
    text-decoration:none;
}

a.inline:hover{
color:#3366CC;
}

a.btn{
  color: #FFFFFF;
  text-decoration: none;
  padding: 7px 9px;
  background: #3366CC;
  display: inline-block;
  text-align: center;
  margin: 10px 0px 10px 0px;
}

a.btn:hover{
background: #696969;
}

#content{
  width: 950px;
  min-height: 1000px;
  margin: 30px auto 30px auto; /* my addition */
  overflow: hidden;
}

#logo{
  width: 950px; /*comp. for padding in content*/
  height: 158px;
  background-image: url('logo.jpg');
}

#article{
float:left;
width: 475px;
padding:10px 10px 10px 15px;
}

#sidebar{
float:left;
clear:none;
width:190px;
PADDING: 10px 0px 0px 10px;
}

.large{
  float: left; 
  width: 300px;
  padding: 6px;
  margin: 0px 16px 0px 16px;  
}


/* change to navigation */
#left{
float:left;
clear:none;
}

#main {
  width:700px;
  float:right;
}

#overview{
  margin: 10px 0 0 0;/*keeps all in line*/
  clear:both; /* ensures on a line by itself */
}

#intro,#blog{
float:left;
}

#intro{
width:500px;
}

#blog{
width: 190px;
margin:20px 0px 0px 10px;
}


/*
#twitter{
float:right;
background-image:url('twitterBird.jpg');
width: 200px;
height: 200px;
border-left: 1px solid #e0e0e0;
margin: 10px 0 0 0;
padding: 0 0 0 15px;
}

#tweet{
overflow:hidden;
}

#tweet ul{
list-style:none;
margin: 0;
padding:0;
}

#tweet li{
font-size: 1.0em;
margin:0;
padding:0;
}

#tweet li a{
  color: #3366CC;
  text-decoration: none;
  float:right;
  font-weight: bold;
}

span.twitterPrefix{
font-size: 1.2em;
color: #696969;
}

span.twitterTime{
border-bottom: 1px solid #eee;
}

span.twitterStatus{
font-size: 1.0em;
color: #3366CC;
font-weight: 600;
}
*/


#services{
width: 700px;
clear:both;
}

#largeService{
float:left;
width:700px;
clear:none;
}

#serviceList{
width:250px;
float:right;
}

#assorted{
border-top: 1px solid #eee;
width: 700px;
float:right;
}


#volunteer{
 background-image: url('volunteer.jpg');
/*background-repeat: none;*/
  margin: 10px 16px 0 16px; 
clear:none;
padding: 6px;
width: 300px;
height: 358px;
float:left;
}

/*
#update{
background-image: url('bat.jpg');
background-repeat: none;
clear:none;
padding: 3px;
width: 350px;
height: 330px;
float:right;
}
*/
/*
#advert{
 width: 235px;
 height: 580px;
background-color: #3366CC;
clear:both;
}
*/


/* ARTICLE stuff*/



table.timetable{
width: 350px;
margin:0 0 0 25px;
}

table.timetable td{
font-size: 1.3em;
color: #3366CC;
background-color: #e0e0e0;
margin: 0 0 0 0;
text-align: center;
}

/* general List */

ul.genList{
list-style: square;
margin:0px 0px 0px 20px;
}
ul.genList li{
font-size: 1.0em;
color: #696969;
line-height:1.5em;
}
ul.genList li span.listTitle{
font-size: 1.3em;
text-transform:uppercase;
color:#3366CC;
}

/* paraList */


ul.paraList{
list-style:square;
color:#3366cc;
}

ul.paraList{
text-indent:20px;
}





/* interest area - you might be interested in...*/



/* BLOG stuff */


#gallery{
float:right;
width: 190px;
padding: 0 0 0 15px;
clear: both;
}

/* keep these */

.post{
padding: 12px;
border-top: 2px dotted #3366CC;
width:450px;
}

.post img{
padding: 4px;
border:1px solid #e0e0e0;
clear:both;
}

blockquote{
font-style:oblique;
line-height:1.5;
font-size: 1.0em;
padding: 12px;
background: #3366CC;
color:#FFFFFF;
}



/* download */

#download, #updated, #interest, #quote{
border-left: 1px solid #e0e0e0;
padding: 0 0 0 15px;
margin:10px 0px 10px 0px;

}

#download p.download{
  color: #fff;
  text-decoration: none;
  padding: 7px 9px;
  background: #3366CC;
}


#advertGallery{
width:235px;
}

#advertGallery img{
margin:10px 0px 10px 0px;
border-top: 4px solid #3366CC;
border-bottom: 4px solid #696969;
}

/* quote */


#quote #openQuote{
width: 64px;
height: 64px;
background-image: url(openq.gif);
}

#quote #closeQuote{
width: 64px;
height: 64px;
background-image: url(closeq.gif);
float: right;
clear:both;
}

#quote p.quoted{
display:block;
font-style: italic;
font-size: 1.2em;
}

#quote p.person{
color: #3366CC;
}


div.service {
padding: 0px 0px 10px 0px; /* bottom */
clear:both;
border-bottom: 1px solid #e0e0e0;
}


/* NAVIGATION */

/* BATS */

#nav {
  float: left;
  width: 235px;
}

#nav p.define{
font-size: 1.2em;
font-style: italic;
}

#nav h2.BADP{
   color: #3366CC;
}


#navBATS ul {
 list-style: none;
}

#navBATS li {
list-style: none; /* or will show */
/*display: block;*/
font-size: 1.3em;
margin: 10px 0 0 0px;
border-left: 4px solid #3366CC;
}

#navBATS li.service{
width: 220px;
float:right;
}

#navBATS li.heading{
padding:0;
list-style: none; /* or will show */
/*display: block;*/
font-size: 1.3em;
margin: 10px 0 0 -38px;
width: 220px;
border-left: 4px solid #3366CC;
}

#navBATS li a {
  display:block;
  color: #3366CC;
  text-decoration: none;
  padding: 7px 6px;
  background-color: #e0e0e0;
}

#navBATS li a.active{
  color: #FFFFFF;
  background-color: #3366CC;
}

#navBATS li a:hover {
  color: #FFFFFF;
  background-color: #3366CC;
}

#navBlogBATS{
list-style:none;
}

#navBlogBATS li{
list-style: none; /* or will show */
/*display: block;*/
font-size: 1.0em;
margin: 10px 0 0 0px;
}

#navBlogBATS li a {
  display:block;
  color: #3366CC;
  text-decoration: none;
  padding: 7px 6px;
  background-color: #e0e0e0;
}

#navBlogBATS li a.active{
  color: #FFFFFF;
  background-color: #3366CC;
}

#navBlogBATS li a:hover {
  color: #FFFFFF;
  background-color: #3366CC;
}


/* BADP #E80000 */
/*
#nav #navBADP ul {
 // margin: 10px 0 0 0;
  padding: 0;
  list-style: none;
}

#nav #navBADP li {
  display: block;
  font-size: 1.3em;
  margin: 10px 0 0 -38px;
  //border-left: 4px solid #C00000;
  border-left: 4px solid #3366cc;
  width: 235px;  
}

#nav #navBADP li a {
  //color: #C00000;
  color:#3366CC;
  display:block;
  text-decoration: none;
  padding: 7px 6px;
  background-color: #e0e0e0;
}

#nav #navBADP li a.active{
  color: #FFFFFF;
  //background-color: #C00000;
  background-color: #3366CC;

}

#nav #navBADP li a:hover {
  color: #FFFFFF;
  //background-color: #C00000;
  background-color: #3366cc;
}
*/
#info{
padding: 10px 0px 0px 10px;
width: 235px;
clear: both;
}

/* Footer*/

#footer,#header {
  width: 950px;
  clear: both;
  background-color: #3366CC;
}
/*
#footer{margin:0;background-color:#3366CC;color:#FFFFFF;padding:10px 0px 10px 0px;width:940px;}
#footer a{color:#aaa;font-weight:400;}
.bottomLeft{float:left; width:400px;}
.bottomRight{float:right;} 
#footer  ul{list-style:none; margin:0; padding: 0;}
*/

#footer p, #header p{
padding:9px 10px;
color:#FFFFFF;
text-align:center;
}

/* IMAGES */

.large img, .small img{
  /* absolutely no margins */
  border-top: 3px solid #3366CC;
  border-bottom: 3px solid #3366CC;
  clear:both;

}

.image{
padding: 4px;
border: 1px solid #e0e0e0;
}

.small{
border: 1px solid #e0e0e0;
margin: 5px 0px 5px 0px;
}



table{
margin: 5px 0px 5px 20px;
width: 435px;
}
td{
text-align:center;
}
tr{
color:#696969;
}
th{
padding: 6px 7px;
background-color: #3366CC;
color: #FFFFFF;
}


/* FORMS */



form.contact{
  width: 480px;
}

label, legend{
    color:#696969;
}

legend{
    font-size:1.2em;
}


label{
  font-size: 1.0em;
  margin:5px;
}


input.field, textarea.field, select{
  display: block;
  font-size: 1.0em;
  color: #696969;
  margin: 5px;
  padding: 7px 9px;
  background-color: #FFFFFF;
  border: 1px solid #3366CC;
}
textarea{
resize:none;
}

input[type = "checkbox"]{
margin:5px;
color: #3366cc;
}

input[type="radio"]{
color: #3366cc;
border: 1px solid #3366cc;
margin: 0px 10px 0px 0px;
}

fieldset{
border: 2px solid #3366cc;
margin: 20px 0px 20px 0px;
padding:10px;
}

p.terms{
font-size: 0.8em;
}


input.button{
  font-size: 1.0em;
  color: #FFFFFF;
  background-color: #3366CC;
  padding: 7px 9px;
  border:none;
}