/* stuff specifically relating to /involved/about/ */

/* following used on all about the association pages */
#content p { text-indent: 20px; }
/* end css used on all about the association pages */

/* index page of the about the assocation section */
#contactholder { height: 298px; margin: 0px 0px 10px 0px; background: url('../images/involved/about/map.jpg') no-repeat top right; }
div.contact { width: 220px; padding-bottom: 10px; }
div.contact strong { font-weight: bold; display: block; }
/* end index page formatting */  

/*  BOD page formatting
   There is a very specific process to changing the BOD page due to javascript.
   The content div in the back bone structure is 650px tall. This works fine
   for some tabs of the BOD page, but other tabs are a lot taller. To make sure
   there isnt a whole ton of white empty space below the short pages all of the
   sections need overflow: hidden  to make the page NOT auto-expand to 3000px
   tall.

   Also then you must set the height of section to 650px default so it looks
   normal.

   Now the tricky part is, if you change the content of the BOD lists, then
   the height of the pages will change. You have to go into /scripts/bod.js
   and adjust the height until it looks good with the design.
*/
#bodlinks { width: 535px; display: block; padding: 2px 0px; }
#bodlinks a
{
    min-width: 50px;
    max-width: 120px;
    height: 18px;
    font-size: 14px;
    padding: 2px 5px;
    color: #585956;
    text-align: center;
    text-decoration: none;
}
#bodholder { position: relative; width: 535px; max-height: 650px; }
#bodinfo { position: absolute; top: 0px; left: 0px; }
#bodmembers { position: absolute; top: 0px; left: 0px; height: 650px; overflow: hidden; visibility: hidden; }
#bodpresidents { position: absolute; top: 0px; left: 0px; height: 650px; overflow: hidden; visibility: hidden; }
#bodexecdirs { position: absolute; top: 0px; left: 0px; height: 650px; overflow: hidden; visibility: hidden; }
#bodboard { position: absolute; top: 0px; left: 0px; height: 650px; overflow: hidden; visibility: hidden; }
table { margin-left: 10px; width: 550px; }
td { vertical-align: top; }
table.staff td { width: 25%; }
td.left { padding-left: 15px; }
/* some tables have 2 cols, some have 3. so inner and inner 2 manage the difference between them.
   later on this will be replaced with a less stupid system */
td.inner { width: 65%; padding-left: 35px; }
td.inner2 { width: 25%; padding-left: 35px; }
/* end bod page formatting */


/* history page */
span.caption { text-decoration: italics; width: 400px; display: block; margin: 0px auto; }
img.histimg { display: block; margin: 0px auto; }
/* end history page */