body {
	text-align:center; /* centers the layout in IE */
    font-size: small;
    font-family: Arial, Helvetica, sans-serif;
    behavior:url("csshover.htc");
}

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

/* Layout ------------------------------------------------------------*/

div#mainwrapper {
    width:776px; 
    margin-left:auto; 
    margin-right:auto; 
	text-align:left; /* stops elements inheriting the body's text-center */
    background-color:#fff; /* this b/g color is visible below the center col content div  */
}

div#header {
    width:776px;
    background-color:#fff;
    height:100px;
    margin-top: 10px; /* white space on top of page */
    padding-bottom: 5px; /* white space above navbar */
    white-space: nowrap;
} 


div#columnwrapper {
    float: left;
    width: 772px;
    border-left: 2px solid #ff3333; /* red border along the sides */
    border-right: 2px solid #ff3333;
    padding-top: 15px; /* white space below menu */ 
}

div#leftcolumn {
    float:left;
    /*width:180px;*/
    /* for 2 or 3 column page, set by php
    margin-left:-626px;
    margin-left:-776px;*/
    background-color:#fff;
}

div#content {
    float:left;
    /* for 2 or 3 column page, set by php
    width:476px;
    width:626px;
    margin-left:210px;*/
    display:inline; /* display inline is hack fix for IE */
    background-color:#fff;
}

div#rightcolumn {
    float:left; 
    width:140px;
    padding-top: 10px;
}

div#footer {
    width:772px;
    background-color:#fff; 
    padding-top: 30px;
    font-size: .8em;
    border-left: 2px solid #ff3333;
    border-right: 2px solid #ff3333;
    border-bottom: 5px solid #ff3333;
    text-align: center;
    float:left; 
/* float:left ensures the footer background displays correctly - below the container divs, not the header */
}

/* no-extra-markup clearing method devised by Tony Aslett - www.csscreator.com */
.clearfix:after {
    content: ".";              /* the period is placed on the page as the last thing before the div closes */
	display: block;          /* inline elements don't respond to the clear property */ 
    height: 0;                  /* ensure the period is not visible */
    clear: both;               /* make the container clear the period */
    visibility: hidden;	     /* further ensures the period is not visible */
}

/*.clearfix {display: inline-block;}  a fix for IE Mac, kills validation */

/* next a fix for the dreaded Guillotine bug in IE6 */
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* end of "no-extra-markup" clearing method */


/* navbar menu -------------------------------------------------------*/

#navbar ul {
    width:776px;
    margin: 0;
    padding:10px 0;
    /*white-space:nowrap;*/
    list-style-type: none;
    color: #fff;
    background-color: #ff3333;
    text-align: center;
    font-size: 10pt;
    /*overflow: hidden;*/
}

#navbar li {
    display: inline;
}

#navbar a {
    text-decoration: none;
    color: #fff;
    padding: 2px 3px;
}

#navbar a:hover {
    color: #fff;
    text-decoration: underline;
}


/* breadcrumbs--------------------------------------------------------*/
#breadcrumbs {
    width: 772px;
    background-color: #ccc;
    height: 15px;
    border-left: 2px solid #ff3333;
    border-right: 2px solid #ff3333;
}

#breadcrumbs ul {
    margin: 0 0 0 10px;
}

#breadcrumbs li {
    float:left; 
	list-style-type:none;
    font-size: .9em;
    padding-top: 1px;
}

#breadcrumbs li a {
    color: #666;
    text-decoration:none;
} 

#breadcrumbs li a:hover {
    text-decoration:underline;
    color: #000;
}


/* Presentation ------------------------------------------------------*/

div#header img {
    border: 0;
}

div#leftcolumn p {
    margin: 2px 0;
}

div#leftcolumn .leftbox {
    margin:0px 5px 0px 10px; /* set white space between leftbox and centerbox here!*/
}

div#content .leftbox {
    margin:0px 10px 0px 5px; /* set white space between leftbox and centerbox here!*/
}

div#contactimg {
    text-align: center;
}

div#contactimg img {
    margin-bottom: 30px;
    border: 1px solid #666;
}

div#contactus p {
    margin: 8px 0px;
}

div#contactus a {
    font-size: 1em;
}

div#contactus h2 {
    font-size: 1.2em;
    color: #000;
    background-color: #eee;
    margin-top: 10px;
    border: 1px solid #666;
}

div#contactus .contitle {
    color: #990000;
}

.calitem {
    padding: 10px 5px;
    border-bottom: 1px solid #666;
}

.calitem img {
    border: 0;
    margin: 0px 2px;

}

.calitem a {
    text-decoration: none;
    font-size: .9em;
    color: #000099;
}

.calitem a:hover {
    color: #990000;
}

.calitem h4 a {
    font-size: 1.1em;
}

.openall {
    text-align: center;
    background-color: #666;
    padding: 2px 0px;
}

.openall a {
    font-size: .9em;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

.calintro p {
    padding: 5px 2px;
}

.leftbox .calintro a {
    font-size: 1em;
}

.leftbox .mini {
    font-size: .8em;
}

.homestyle {
    border: 1px solid #666;
    background-color: #ccc;
}

.homestyle .checkit {
    padding: 0px 5px;
}

.homestyle .checkit h4 a {
    font-size: 1.1em;
    color: #333399;
    font-weight: bold;
    text-decoration: none;
}

.homestyle .checkit h4 a:hover {
    color: #990000; 
    text-decoration: underline;
}

.leftbox h2 {
    background-color: #333399;
    font-size: 1.4em; 
    text-align: center;
    color: #fff;
    padding: 4px 4px 8px 4px;
    border-bottom: 1px solid #eee;
}

div#leftcolumn .leftbox h1 {
    background-color: #ccc;
    color: #000;
    font-size: 1.4em;
    text-align: center;
    padding: 6px 6px;
    border: 1px solid #666;
    margin-bottom: 5px;
}

.leftbox h5 {
    font-size: .9em;
    padding: 0px 0px 10px 5px;
}

.leftbox h5 a {
    color: #666;
}

.leftbox h5 a:hover {
    color: #990000;
}

.leftbox h3 {
    font-size: 1em;
    background-color: #eee;
    border-top: 3px solid #fff;
    border-bottom: 3px solid #fff;
    padding: 5px;
}

.leftbox h4 {
    font-size: 1em;
    color: #ff3333;
    font-weight: bold;
}

.leftbox p a {
    font-size: .9em;
    color: #333;
    text-decoration: none;
}

.leftbox p a:hover {
    text-decoration: underline;
    color: #990000;
}


div#leftcolumn .linkboxes ul {
    list-style-type: none;
    text-align: center;
    margin-left: 15px;
}
    
div#leftcolumn .linkboxes li {
    display: block;
    width: 100px;
    background-color: #333399;
    margin: 10px;
    padding: 5px;
    font-size: 10pt;
}

div#leftcolumn .linkboxes li:hover {
    background-color: #ff3333;
}

div#leftcolumn .linkboxes li a {
    text-decoration: none;
    color: #fff;
}

div#leftcolumn .linkboxes li a:hover {
    text-decoration: underline;
}

div#centerbox {
    margin: 0px 10px 0px 10px; /* margins must be 10px for 1 col view */ 
    padding: 10px;
}

div#centerbox a {
    color: #333399;
    text-decoration: none;
}

div#centerbox a:hover {
    color: #ff3333;
    text-decoration: underline;
}

div#centerbox p {
    margin: 0px 0px 10px 0;
    padding-top: 5px;
}

div#centerbox h2 {
    font-size: 1.3em;
    color: #ff3333;
}

div#centerbox h4 {
    font-size: 1em;
    font-weight: bold;
    margin: 10px 0px 3px 0px;
}

div#centerbox h3 {
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0px 3px 0px;
    border-bottom: 1px solid #666;
    background-color: #eee;
    padding: 2px 2px;
}

div#centerbox ul {
    padding-left: 20px;
}

div#centerbox .video {
    border: 5px solid #ff3333;
    margin: 10px 20px 5px 20px;
    
}

div#centerbox .center {
    text-align: center;
}

div#rightcolumn img {
    border: 1px solid #666;
    margin-bottom: 15px;
}

/* Forms -------------------------------------------------------------*/

div#formcon {
    width:500px;
    margin-left:30px;
    margin-top: 10px;
}

div#formcon form {
    border-top: 1px solid #CCC;
/*    border-bottom: 1px solid #CCC;*/
    margin-top: 10px;
}

div#formcon div.clearfix {
    /*border: 1px solid #CCC;*/
    padding:10px 0px;
    vertical-align:top;
} /* adds the line above each section and provides vertical spacing */

div#formcon form label {
    width:200px;
    float:left;
    color: #000066;
    margin:0 10px;
    font-size: .95em;
} /* this is the text label on the left of each input */

/*some extra styles for the checkbox and radio button sets*/	
div#formcon div.buttongroup {
    float:left;
    margin:0px 0px 0px 40px;
    padding:0px;
}

div#formcon div.buttongroup div {
    margin-bottom:5px;
} /* wrapper for the INPUT and its text - margin-bottom sets the vertical distance between buttons */

div#formcon div.buttongroup input {
    margin-right:5px;
} /* set the distance between button and its label text */

/* postions the submit button by selecting a div with attribute type SUBMIT - IDWIMIE */
/*div#formcon input[type="submit"] {
    display:block; 
    margin-left:auto; 
    margin-right:10px;
}*/

div#formcon .submit {
    float: right;
    margin-right: 10px;
}

/* BigForm -----------------------------------------------------------*/
div#bigform {
    margin-top: 15px;
    border: 1px solid #666;
    padding: 10px;
    background-color: #ccc;
}

div#bigform table {
    width: 100%;
    padding-top: 20px;
}

div#bigform td {
    background-color: #eee;
    padding: 3px;
    font-size: 10pt;
}

div#bigform input, select, textarea {
    border: 1px solid #000;
    font-size: 10pt;
}

div#bigform .center {
    text-align: center;
}

div#bigform td {
    width: 25%;
    vertical-align: top;
}

div#bigform .workshops {
    margin: 0;
    padding: 0;
    border: 1px solid #666;
}

/* Generic -----------------------------------------------------------*/

.tdright {
    text-align: right;
}