body {
 background-color: #BBBEF7;
 color: black;
 text-align: center;
 font-family: Arial, "Times New Roman", Times, serif;
}

div#header {
background-color: #A27EDC;
width: 600px; 
margin: 0px auto;
padding: .2em;
border-top: 1px solid #8D09B3;
border-left: 1px solid #8D09B3;
border-right: 1px solid #8D09B3;
}

div#header a {
text-decoration: none;
border: 0px;
}

#logo-image {
border: 0px;
}

div#main-container {
position: relative;
background-color: #8951D1;
border-top: 2px solid  #A160F7;
border-left: 1px solid  black;
border-right: 1px solid black;
border-bottom: 2px solid black;
width: 760px;
margin: 0px auto;
padding-top: .5em;
padding-left: 0px;
padding-right: 0px;
padding-bottom: 0px;
}

div#main-content-wrapper2{
 margin: 0px auto;
 width: 750px;
 border: 0px;
 text-align: left;
}

div#main-content-wrapper{
 background-color: #A27EDC;
 margin: 0px auto;
 width: 100%;
 border: 0px;
}

div#main-content{
 padding: .5em;
}

div#main-content-bottom{
 background-color: #A27EDC;
}

a:link {
 color: #D3CAF4;
 border-top: 0px;
 border-left: 0px;
 border-right: 0px;
 border-bottom: 1px dashed;
 text-decoration: none;
}

a:visited {
 color: #52188B;
 border-bottom: 1px solid #A160F7;
 text-decoration: none;
}

a:hover {
text-decoration: none;
background-color: #AF96F4;
}

div#top-cap {
background-color: #A27EDC;
width: 730px; 
margin: 0px auto;
text-align: center;
border-top: 1px solid #A160F7;
padding: 0px;
}

div#navigation_container{
 position: relative;
 width: 760px;
 text-align: center;
 margin: auto;
}

div#navigation_caption {
width: 740px;
text-align: center;
margin: 0px auto;
background-color:  #8D09B3;
background-image: url(pics/nav-caption-background.jpg);
background-repeat: repeat;
}

div#navigation {
width: 760px;
text-align: center;
margin: 0px auto;
height: 2.5em;
font-weight: bold;
font-size: medium;
padding: 0px;
background-color: #8D09B3;
}

div#navigation a {
display: block;
background-color: transparent;
text-decoration: none;
text-align:center;
border: 0px;
font-weight: bold;
color: #A27EDC;
font-size: medium;
margin: 2px;
height: 2.5em;
}

div#navigation a:hover {
background-color: #BC92FF;
color: blue;
margin: 2px;
height: 2.5em;
}

div#navigation a span {
 visibility: hidden;
 position: absolute;
 top: 0em;
 left: 25px;
 width: 700px;
 background-color: transparent;
 font-size: .8em;
}

div#navigation a:hover span {
 visibility: visible;
 z-index: 90;
 color: white;
 background-color: transparent;
 text-align: center;
}

div#navigation a:active {
 background-color: white;
}

#navigation table{
 font-size: medium;
 width: 760px;
 padding: 0px;
 margin: 0px auto;
 border-collapse: collapse;
 border-spacing: 0px;
/*  height: 1em; */
 vertical-align: middle;
}
#navigation table h2{
 font-size: medium;
 padding: 0px;
 margin: 0px;
}

#navigation table td{
 padding: 0px;
 margin: 0px;
 vertical-align: middle;
}

#navigation table td.nav_break{
 border-right: 1px solid #A27EDC;
}

div#bottom-contact-info-wrapper2 {
 margin-top: 1em;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 1em;
 text-align: center;
 width: 300px;
 border: 0px;
 background-color: #A27EDC;
}

div#bottom-contact-info-wrapper {
 margin: 0px auto;
 text-align: center;
 width: 100%;
 border: 0px;
 background-color: #A27EDC;
}

span#contact_us_span{
 font-weight: bold;
}

div#bottom-contact-info-bottom{
 background-color: #A27EDC;
}

div#footer {
background-color: #A27EDC;
width: 730px; 
margin: 0px auto;
text-align: center;
padding: 0px;
border-right: 1px solid black;
border-bottom: 2px solid black;
border-left: 1px solid black;
}

div.spacer{
 margin: 0px;
 padding: 0px;
 border: 0px;
 font-size: 1px;
 line-height: 1px;
 clear: both;
}

.error{
 border: 1px dashed black;
 background-color: #FF7878;
 padding: .2em;
}

/* the following CSS was snatched from http://www.albin.net/CSS/roundedCorners/ . thank you!
*/

/* In the CSS below, the numbers used are the following:
    1px: the width of the border
    3px: a fudge factor needed for IE5/win (see below)
    4px: the width of the border (1px) plus the 3px IE5/win fudge factor
    14px: the width or height of the border image
*/
.roundedBorderTL, .roundedBorderTR, .roundedBorderBL, .roundedBorderBR {
    width: 14px;
    height: 14px;
    padding: 0px;
    border: 0px;
    z-index: 99;
}
.roundedBorderTL, .roundedBorderBL { float: left; clear: both; }
.roundedBorderTR, .roundedBorderBR { float: right; clear: right; }
.roundedBorderTL { margin: -1px 0px 0px -1px; }
.roundedBorderTR { margin: -1px -1px 0px 0px; }
.roundedBorderBL { margin: -14px 0px 0px 0px; }
.roundedBorderBR { margin: -14px 0px 0px 0px; }
/* IE5-5.5/win needs the border scooted to the left or right by an
   additional 3px! Why? */
.roundedBorderTL {
    margin-left: -4px;
    ma\rgin-left: -1px;
}
html>body .roundedBorderTL {
    margin-left: -1px;
}
.roundedBorderTR {
    margin-right: -4px;
    ma\rgin-right: -1px;
}
html>body .roundedBorderTR {
    margin-right: -1px;
}
.roundedBorderBL {
    margin-left: -3px;
    ma\rgin-left: 0px;
}
html>body .roundedBorderBL {
    margin-left: 0px;
}
.roundedBorderBR {
    margin-right: -3px;
    ma\rgin-right: 0px;
}
html>body .roundedBorderBR {
    margin-right: 0px;
}
/* To get around a known bug in IE5/win, apply the
   border (no margin, padding or positioning) to the
   content class and apply whatever positioning you
   want to the contentWrapper class. */
.roundedContent {
    margin: 0px;
    padding: 0px;
    border: 1px solid black;
}
.roundedContentWrapper {
    /* position this div however you want, but
       keep its padding and border at zero */
    padding: 0px;
    border: 0px;
}