/* **********************************************************************************
 * File:        threecol.css
 * Description: Defines CSS for three side-by-side, equal width columns
 *              Based on http://matthewjamestaylor.com/blog/perfect-3-column.htm
 *              Note: The following assumptions/changes were made:
 *                 - All columns are the same width (33%-34%-33%)
 *                 - Each column has 2% padding on each side
 *                 - The column colors are commented out so this CSS assumes 
 *                   all columns will be the same color which should be defined by the 
 *                   parent element
 * Revisions:   2009-12-13 [am] File created 
 * ********************************************************************************** */

/* column container */
.colmask {
   position: relative;    /* This fixes the IE7 overflow hidden bug */
   clear: both;
   float: left;
   width: 100%;           /* width of whole page */
   overflow: hidden;      /* This chops off any overhanging divs */
}
/* common column settings */
.colright,
.colmid,
.colleft {
   float:left;
   width:100%;            /* width of page */
   position:relative;
}
.col1,
.col2,
.col3 {
   float:left;
   position:relative;
   padding:0 0 1em 0;   /* no left and right padding on columns, we just make them narrower instead 
                         * only padding top and bottom is included here, make it whatever value you need 
                         */
   overflow:hidden;
}
/* 3 Column settings */
.threecol {
   /* background:#eee; */      /* right column background colour */
   background-image: url("images/darkgreen.jpg");
   background-repeat: repeat;
}
.threecol .colmid {
   right:33%;         /* width of the right column */
   /* background:#fff;   */   /* center column background colour */
   background-image: url("images/darkgreen.jpg");
   background-repeat: repeat;
}
.threecol .colleft {
   right:34%;         /* width of the middle column */
   /* background:#f4f4f4; */   /* left column background colour */
   background-image: url("images/darkgreen.jpg");
   background-repeat: repeat;
}
.threecol .col1 {
   width:30%;         /* width of center column content (column width minus padding on either side) */
   left:102%;         /* 100% plus left padding of center column */
}
.threecol .col2 {
   width:29%;         /* Width of left column content (column width minus padding on either side) */
   left:39%;         /* width of (right column) plus (center column left and right padding) plus (left column left padding) */
}
.threecol .col3 {
   width:29%;         /* Width of right column content (column width minus padding on either side) */
   left:77%;         /* Please make note of the brackets here:
               (100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
}
