.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.clear {
 clear: both;
 height: 0px;
}

/* Main Text Definitions */

body {
 background: #bf80bf;
 background-image: url(../images/bg_page.jpg);
 background-repeat: repeat-x;
 color: #fff;
 font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
 margin: 0;
}

h2, h3, h4 {
 color: #a767b0;
 font-weight: normal;
}
h1 {color: #71287b; font-weight: normal; clear: both; font-size: 140%; margin-bottom: 8px;}
h2 {font-size: 120%; margin-top: -4px; margin-bottom: 8px;}
h3 {font-size: 100%; margin-bottom: 6px;}
h4 {font-size: 100%; margin-bottom: 3px;}

a img {border: 0;}
a {color: #bf80bf;}
a:hover {color: #71287b;}
a img {border: 0;}

p {margin-top: 0;}

/* Generic Layout Definitions */
#container {width: 800px; margin: 30px auto; font-size: 70%; background: #fff;}
#logo {float: left; width: 325px; height: 77px;}
#topnav {float: right; padding-top: 10px;}
#navigation {float: left; width: 800px; background: #FCF8FC;}
#main {float: left; width: 800px; margin-top: 12px;}

#hpcontent {float: left; width: 276px; margin-left: 23px; display: inline; padding: 20px 12px 12px 12px; background: url(../images/bg_content.jpg); background-repeat: no-repeat; color: #a767b0;}
#hpimage {float: left; width: 450px; text-align: center;}

#image {float: left; width: 363px; text-align: center;}
#content {float: left; width: 389px; padding: 12px; background: url(../images/bg_content.jpg); background-repeat: no-repeat; color: #a767b0;}
#intro {margin-top: 20px;}
#quizContent {padding: 0 23px; color: #bf80bf;}

#footer {clear: both; text-align: right; padding: 6px 5px 6px 0; width: 795px; color: #d7a7d7;}
#footer img {margin-bottom: -6px;}
/* Page layout */
#strapline {float: left; width: 302px; padding: 5px 0 5px 23px;}

/* Navigation Definitions */

/* Top navigation */
#topnav ul {
 float: left;
 list-style: none;
 padding: 0;
 margin: 0;
} 
#topnav ul li {
 float: left;
 margin-right: 16px;
 display: inline;
}
#topnav ul li a {
 float: left;
 color: #a767b0;
 text-decoration: none;
}
#topnav ul li a:hover {
 color: #71287b;
}


/* Main navigation */
#navigation ul {
 list-style: none;
 float: right;
 display: inline;
 padding: 0;
 margin: 0 20px 0 0;
} 
#navigation ul li {
 float: left;
 margin-right: 9px;
 display: inline;
}
#navigation ul li a {
 float: left;
 color: #a767b0;
 padding: 8px 0;
 text-decoration: none;
}
#navigation ul li a:hover {
 color: #71287b;
}

#navigation ul li.on a {
 color: #71287b;
}

/* Sub  navigation */
#content ul {
 list-style: none;
 padding: 0;
 margin: 0 0 20px 0;
} 
#content ul li {
 margin: 2px 0;
}
#content ul li a {
 color: #BF80BF;
 text-decoration: none;
}
#content ul li a:hover {
 color: #71287b;
 text-decoration: none;
}
#content ul li.on a {
 color: #71287b;
}


/* Footer navigation */
#footer a {
 color: #d7a7d7;
 text-decoration: none;
 margin: 0 12px;
}
#footer a:hover {
 color: #a767b0;
}
#footer a.credit {margin: 0;}




/* Forms */

FORM {
 padding: 0;
 margin: 0;
 border: 0;
}


textarea {
 font-size: 95%;
 font-family: verdana, arial, helvetica, sans-serif;
 width: 250px;
 height: 80px;
}


p.formRow {
 margin-top: 0px;
 margin-bottom: 4px;
}
.formLabel {
 width: 200px;
}
.fmField {
 width: 150px;
 font-size: 90%;
 color: #bf80bf;
 border: 1px solid #bf80bf;
}
.fmFieldLrg {
 width: 350px;
 font-size: 90%;
 color: #bf80bf;
 border: 1px solid #bf80bf;
}
.fmFieldSml {
 width: 60px;
 font-size: 90%;
 color: #bf80bf;
}
select {
 font-size: 90%;
 color: #bf80bf;
}
.fmButton {
 background: #bf80bf;
 color: #fff;
 font-weight: bold;
 border: 0;
}

/* BLOG STYLES */
#blog_content {float: left; width:505px; margin-left: 25px; margin-right: 20px; display: inline; color: #a767b0;}
#blog_sidebar {float: right; width: 200px; margin-top: 40px; color: #a767b0; padding-right: 20px;}
#blog_content h1.title {font-weight: bold; color: #BF80BF; font-size: 160%; border-bottom: 0;}
#blog_content h1 {font-weight: bold; border-bottom: 1px solid #BF80BF;}
#blog_content .post {border-bottom: 1px dashed #BF80BF;}
#blog_sidebar p {margin-top: 0; margin-bottom: 3px;}