html, body{ 
 font: .85em verdana, arial, sans-serif;
 margin:0; 
 padding:0; 
 text-align:center; 
 background-color:#226622;
}

a:visited {
  color:#000000;
  }
a:hover {
  color:#cc0000;
  text-decoration:none;
  }
#main_wrapper{ 
 width:870px; 
 text-align:left;  
 margin-left:auto; 
 margin-right:auto;
 background-color:#dddddd;
} 
 
#header{
 position:relative; 
 margin: 5px 0 10px 0;
 background-color:#ECECEC; 
 width:100%;
} 
#leftcol{
 width:155px;
 float:left; 
 position:relative; 
}

#twocols{
 width:712px; 
 float:right; 
 position:relative; 
  }
 
#rightcol{
 width:270px; 
 float:right; 
 position:relative; 
 background-color: #FFFFFF;
 padding:10px;
 text-align:center;
 }
 
#maincol{
 background-color: #FFFFFF;  
 float: left; 
 display:inline; 
 position: relative; 
 width:400px;
 padding:10px;
 }
 
#stretch {
  width:670px;
  float:right;
  position:relative;
  background-color:#ffffff;
  margin-right:10px;
  padding:10px;
  }

#footer{
 margin: 10px 0 5px 0;
 background-color:#ECECEC; 
 clear:both;
 text-align:center;
 } 
 
p {
  text-indent:1.5em;
  margin-top:.8em;
  }
  
.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
.crossword .title {
  font:1.5em Verdana, sans-serif;
  color:#000000;
  text-align:center;
  }
.crossword .text {
  font:.9em Verdana, sans-serif;
  color:#000000;
  }
.box {
  margin:2px;
  padding:2px;
  width: 180px;
  background-color:#e6e6e6;
  border: 1px dotted #000000;
  }
.google * .radio {
  color:#fff;
  }
.google * td {
  width:1px;
  }

.head a:visited {
  color:#000000;
  }
.head a:hover {
  text-decoration:none;
  color:#000000;
  }
.head a {
  color:#448844;
  }
.head .banner_m {
  background:url(images/banner_m.gif);
  background-repeat:no;
  width:410px;
  padding-left:20px;
  }
.head form {
  margin:0;
  padding:0;
  }
.space {
  width:130px;
  }
.head #notice {
  background-color:#c00;
  color:#ffffff;
  text-align:center;
  }
.head #notice a {
  color:#ffffff;
  }
img {
  border:none;
  }
.rightbox {
  width: 250px;
  margin:2px;
  padding:2px;
  border:1px dotted #000000;
  }
.rightpromo {
  width:200px;
  margin:10px 22px 5px 22px;
  border:0;
  text-align:center;
  }

.school table {
  width:400px;
  }
.small * td{
  width:167px;
  }

.float_left {float:left;}
.float_right {float:right;}  
.clearfix{display: inline-block;}

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

/*printer styles*/ 
/* @media print{ 
/*hide the left column when printing*/ 
/*#leftcol{display:none;} 

/*hide the right column when printing*/ 
/*#rightcol{display:none;} 
/*#twocols, #maincol{width:100%; float:none;}
}*/


/**
*Layout Hints
*These simple tips may save you from having to use complicated hacks on your site. Make sure to also check out the links in the Layout Hints box.
*Column Padding
* The box model is handled incorrectly by some browsers, which causes padding and borders to be added to an elements width. So applying padding directly to a column will change the way the widths are calculated and could mess up the floated columns. To get around this problem apply margin to the children of the column instead. 
*
*    #maincol p{margin:1em;}
*    
*Overflowing Content in Fluid Layouts
*   To avoid content escaping or overflowing the columns there are a couple of things you can do.
*
*        * Make sure the content fits within the column at different window sizes or resolutions, images and long text such as urls could be a problem here.
*        * Avoid setting fixed widths or 100% widths with margin, padding or borders on block level elements within the column (p, div, ul ).
*
*/