/* Controls various properties of each box in the layout, unless overwritten by
 * the box's specific use of these properties. 
 */
html, body {
    background-color: #FFF; /* This controls the page's background color */ 
    color: #333;            /* This controls the page's foreground text 
                             * color
                             */
    padding: 0;
    margin: 0;
}

/* Controls the left-hand side box, the one housing the bottons. */
#buttoncolumn {
    margin-left: -1px; /* Negative margin to make box plush with 
                        * browser? 
		        */
    padding-left: 0px; /* This shifts the buttons to the right */
    padding-top: 0px;  /* This shifts the buttons down */
    width: 260px;      /* Width of browser window */
    float: left;		 
}

/* Controls the properties of list items (buttons) in the left-hand side
 * box
 */
#buttoncolumn li {
    white-space: nowrap; /* line wraps suppressed, button text wont wrap 
                          * to next line.
                          */
    margin: 0; 
    padding: 0;
}

/* Controls the properties of unordered lists within the left-side box */
#buttoncolumn ul {
    list-style-type: none;
    text-align: center;	   /* centers the text within the botton box */
    font-size: .9em; 
    padding: 0;
    margin: 0;
}

/* Controls the anchor tag within the left-side box */
#buttoncolumn a {
    border-color: #ddd #e7f5e6 #000 #ddd;   /* top, right, bottom, left,
                                             * blackish, logo-whiteish
                                             * white, blackish
                                             */	
    background-image:  url(blue-button.jpg); 
    background-repeat: no-repeat;			
    background-position: 0% 50%;
    background-color: #999999;              /* blackish */
    padding: 2px 2px 2px 24px;              /* controls button size */ 
    text-decoration: none;                  /* Turns off link underlining */
    border: 1px solid;  
    display: block;
} 

#buttoncolumn a:link, #buttoncolumn a:visited {
    color: #000;
}

/* This code, and next code could be combined. */
#buttoncolumn a:hover, #buttoncolumn a:active {
    background-image:  url(green-button.jpg); 
    background-repeat: no-repeat;
    background-position: 0% 50%;
    background-color: #e7f5e6; /* Controls the color of botton when 
                                * hovered by mouse if image doesnt 
                                * show up. (purple) 9f6f9f was here
                                */
    color: #2D1E2D;            /* Controls color of button text */
}

/* If used, will make button of the current page always appear as though
 * pressed down. Given the color scheme, wont use this for "home" link.
 */
#uberlink a:link, #uberlink a:visited, #uberlink a:hover, #uberlink a:active {
    background-image:  url(green-button.jpg);
    background-repeat: no-repeat;
    background-position: 0% 50%;
    background-color: #9F6F9F;
    color: #2D1E2D;
}

/* Controls right-box properties */
#rightcolumn {
    /* border-left: 1px solid #006; *//* This would be the middle 
                                       * divider between left/right 
                                       * boxes if used.  
                                       */ 
    padding-left: 20px;               /* Right box text indent. 20px */
    margin-left: 260px;               /* Right box placemment. */
}

/* The header area grows with the content added to it. If no content, no 
 * space?
 */
#header {
/* 08.16.06 removed background-image. Its missing, should be replaced
   with a slice of banner
 */
/* background-image: url(bground.jpg); *//* This allegedly fills in empty
                                         * white space in the header 
                                         */ 
    /* border-bottom: 5px solid #006; *//* Horizontal border at top of
                                         * right and left boxes.	
                                         */
    background-color: #FFF;             /* Background if no image shows up
                                         * and content is present
                                         */
    margin-bottom: -3px;                /* Changing this negative pulls up
                                         * left/right boxes, but is it 
                                         * right way to handle it? 
                                         */
    color: #006;                        /* Text color */
}

/* This controls the footer properties. */
#footer {
    border-top: 1px solid #006;	
    background-color: #42638c;	
    padding: 2px 10px 0 0;
    font-size: 20px;
    color: #eeeedd;	
    text-align: center;	 
    clear: both;
}

#footer a:link, #footer a:visited {
    color: #eeeedd;
    /* text-decoration: none; */
}

/* Must be the proper way to handle this! */
#footer p {
    text-align: right;
    margin-bottom: 1px;
    /* background-color: #42638c; */
    font-size: 15px;
    padding: 0;
}

/* Shrug */
.spacer {
    clear: both;
}

ul.floatLeft {
    float: left;
    margin-top: 0px;
    margin-right: 20px;
    margin-bottom: 4px;
}

img.textLeft {
	float: right;
	margin-top: 1em;
	margin-left: 1em;
}
img.textRight {
	float: Left;
	margin-top: 1em;
	margin-right: 1em;
}

.center1 {
	margin-left: auto;
	margin-right: auto;
}

/* Color Schemes
 * #FFF    - Black
 * #333    - Black-ish
 * #ddd    - Black-ish
 * #2d1e2d - Black-ish
 * #006    - Black/Blue-ish
 * #42638c - Blue (footer)
 * #eeeedd - off-white 
 * #000    - White
 * #e7f5e6 - Light Green
 * #9f6F9F - Purple 
 */