/* 
 * volunteers.css, 2.0 2009-Oct-19
 *
 * (c) 2007 Computer History Museum		http://www.computerhistory.org
 *
 * Edit according to styleguide
 *
 */


/* MAIN LAYERS AND ELEMENTS 
-------------------------------------------------------------- */
h3.volunteer { display: block; font-size: 1.05em; line-height: 3.25em; margin: 0; padding-bottom: 25px; padding-left: 5px; font-weight: bold; color: #000000; font-family:Georgia, "Times New Roman", Times, serif; position: relative; } 
h3.volunteer img { position: absolute; top: -5px; }
img.quotation { margin-bottom: 30px; } 

div#announcements {	width: 684px; margin: 0 0 50px 26px; position: relative; overflow: hidden; }


/* INTRO BLOCK AND ITS ELEMENTS 
-------------------------------------------------------------- */
div#intro { width: 684px; margin: 0 0 30px 26px; padding-top: 20px; position: relative; overflow: hidden; display: block; }
div#intro img.image { border: 0; padding: 0; position: relative; top: -25px; left: 0; }
div#intro p.description { position: relative; top: -15px; }



/* PITCH BLOCK AND ITS ELEMENTS 
-------------------------------------------------------------- */
div#pitch { width: 684px; margin: 0 0 30px 26px; position: relative; overflow: hidden; display: block; }
ul#pitch_main_navi { width: 315px; padding-right: 10px; float: left; }
ul#pitch_main_navi li { display: block; margin-bottom: 10px; font-size: 85%; }
ul#pitch_main_navi li span.title { color: #000000; font-family: Georgia, "Times New Roman", Times, serif; display: block; font-size: 110%; }
div#main_show { width: 356px;  padding: 20px 0 0; float: right; position: relative; }
div#main_show div.navi { top: 227px; right: 0px; }/* position and dimensions of the navigator */



/* OPPORTUNITIES BLOCK AND ITS ELEMENTS 
-------------------------------------------------------------- */
div#opportunities { margin: 0 0 30px 26px; display:block; width:682px; height:420px; position:relative; overflow: hidden; border: 1px solid #e9e9e9; }
div.section { float: left; height:420px; width: 682px; padding: 0; }


#opport  {padding: 20px 20px 0 0; display: block; height: 400px }
#opport_main { position:relative; overflow:hidden; height: 400px; width: 470px; float: right; }/* main vertical scroll for SIG */


ul#opport_navi {  display: block; width: 175px; height: 375px; border-right: solid 1px #e9e9e9; padding: 0 0 10px 0; float: left; }
ul#opport_navi li { display: block; }
ul#opport_navi li.title { display: block; margin-bottom: 10px; padding-left: 15px; color: #22589d; font-size: 1.4em; font-family: Georgia, "Times New Roman", Times, serif;  }
ul#opport_navi li a.title { background: url(/volunteers/images/bullet.jpg) 14px 7px no-repeat; cursor:pointer; display: block;  padding: 6px 0 4px 35px; }
ul#opport_navi li a.active { cursor: default !important; background-color: #f8f8f8; }




/* SCROLLING LAYERS AND TABS ELEMENTS 
----------------------------------------------------------------------------------------------------------- */

.pages { position:absolute; height:20000em; }	/* root element for pages */
.page { height: 400px; width:470px; position: relative; }	/* single page */
.scrollable { position:relative; overflow:hidden; width: 470px; height: 395px; float: left; }	/* root element for horizontal scrollables */
.scrollable .items { width:20000em; position:relative; clear:both; }	/* root element for scrollable items */
.item { float:left; cursor:pointer; width:470px; padding-bottom: 10px; }	/* single scrollable item */
.item img { width: 464px; height:261px; padding: 1px; border: #c8eac7 1px solid; padding: 1px; }

div.navi { height:30px; text-align: center; position: absolute; top: 270px; right: 0px; background-color: #ffffff; }/* position and dimensions of the navigator */
div.navi a { width:9px; height:9px; float:left; margin:3px; background: #999999; display:block; font-size:1px; background: url(/volunteers/images/navi-default.jpg) 0 0 no-repeat; }/* items inside navigator */
div.navi a:hover { background: url(/volunteers/images/navi-hover.jpg) 0 0 no-repeat; }/* mouseover state */
div.navi a.active { width:11px; height:11px; margin: 2px; background: url(/volunteers/images/navi-active.jpg) 0 0 no-repeat; } 	/* active state (current page state) */

.scroll { position:relative; overflow:hidden; width: 356px; float: left; }	/* root element for horizontal scrollables */
.scroll .images { width:20000em; position:relative; clear:both; }	/* root element for scrollable items */
.img { float:left; cursor:pointer; width:356px; }	/* single scrollable item */
.img img { width: 352px; height:198px; padding: 1px; border: #c8eac7 1px solid; padding: 1px; }

.scrollable p.description { font-size: .9em; }
.scrollable .imagecaption { font-size: .8em; font-style: normal; color: #333333; line-height: 1.4em; padding-right: 170px; cursor: default !important; }
.scrollable .imagecredit { font-size: .7em; font-style: italic; color: #999999; line-height: 1.1em; padding-right: 170px; cursor: default !important; }
.scroll .imagecaption { font-size: .8em; font-style: normal; color: #333333; line-height: 1.4em; padding-right: 140px; cursor: default !important; }
.scroll .imagecredit { font-size: .7em; font-style: italic; color: #999999; line-height: 1.1em; padding-right: 140px; cursor: default !important; }


/* LOGIN PAGE LAYERS AND ELEMENTS 
----------------------------------------------------------------------------------------------------------- */

div#logininfo { display: block; width: 200px; padding: 10px 10px 20px 20px; float: right; border-left: 1px solid #e9e9e9; }
div#login { /*border: 1px solid #e9e9e9;*/ padding-top: 10px; }
.login { background: url(/volunteers/login/images/login-bg1.jpg) repeat-y; }