﻿/************************ SITE WIDE STYLES ************************/

html, body { height:100%; }
body 
{
    margin:0px;
    font-family:Verdana, Arial;
    font-size:68.75%;
    color:#333333;
    background:#f8f8f8 url('../whiteimages/body_bg.jpg') top left repeat-y;
    height:100%;
	padding-left:45px; 
}


a 
{
    color:#333333;
}

img 
{
    border:0;
}

img#ngenLogo 
{
    display:block;
    position:absolute;
    z-index:100;
    top:25px;
    left:8px;
    margin:0;
    padding:0;
    border:0;
}


/************************* END SITE WIDE STYLES ********************/


/************************* STRUCTURAL ******************************/


/* LEFT COLUMN DIV */

#left_column 
{
  float: left;
  width:190px;
  /* PROBLEM PADDING */
  padding-left:47px;
  padding-bottom:100px;
  margin-right:31px;
}

* html #left_column
{
    padding-left:20px;
    margin-right:1px;
}

#left_column ul#leftNav
{
    margin:150px 0 0 0;
    list-style-type:none;
}


#joinNgen
{
    position:relative;
    z-index:1;
    padding-left:5px;
}

* html #joinNgen 
{
    margin-left:20px;
}


/****** SIGN IN ******/


.signInTop 
{
    background:url('../whiteimages/signin_top.jpg') no-repeat bottom;
    width:212px;
}

* html .signInTop 
{
    width:198px;
    margin-left:25px;
}

.signInHeader 
{
    position:relative;
    margin:0 0 0px -12px;
    width:200px;
}

.signInMiddle 
{
    background:url('../whiteimages/signin_middle.jpg') repeat-y;
    min-height:45px;
    height:auto !important;
    height:45px; /* IE6 needs this */
    width:212px;
    padding:0px 0 5px 0;
    font-size:1.0em;
    color:#333333;
    font-family:Verdana;
    font-weight:bold;
}

.signInMiddle p 
{
    padding:3px 0 5px 0;
    margin:0;
    text-transform:none;
}

* html .signInMiddle
{
    width:205px;
    margin-left:18px;
}

.signInContent 
{
    padding-left:12px;
}

.signInContent input { font-size:1em; }
 
.signInBottom 
{
    background:url('../whiteimages/signin_bottom.jpg') no-repeat;
    width:212px;
    height:20px;
}

* html .signInBottom
{
    width:205px;
    margin-left:18px;
}
     
.signInButton 
{
    padding-bottom:2px;
    padding-top:5px;
}
         
.signInLink a
 {
    font-family:Arial;
    color:#333333;
    text-decoration:underline;
    font-size:1.0em;
    font-weight:normal;
    text-transform:none;
}

.signInField 
{
    background-color:#ff5a00;
    border:1px solid #ffa777;
    margin: 3px 0 3px 0;
    padding:3px 2px 3px 7px;
    width:172px;
    color:#ffffff;
    font-weight:bolder;
    font-family:Arial;
}

#signInError
{
   width:170px;
   height:32px;
   margin-bottom:5px;
   color:Red;      
}

/****** END SIGN IN ******/



/* LEFT COLUMN DIV */

#wrapper_2col
{
    background:#f8f8f8 url('../whiteimages/wrapper_2col.jpg') top left no-repeat;             
    position:relative;
}

#wrapper_3col
{
    background:#f8f8f8 url('../whiteimages/wrapper_3col.jpg') top left no-repeat;              
    width:950px;
    position:relative;
}


#pageContent
{
    background:url('../whiteimages/footer_bg.jpg') no-repeat bottom left;
    padding:52px 0 60px 0px;
    position:relative;
    z-index:50;
    left:-49px; /* to correctly line up the background images */    
    width:958px;
}

#wrapper_2col #pageContent
{
    left:-49px;
    width:958px;
}

* html #wrapper_2col #pageContent 
{
    margin-left:0px;
    width:958px;
}

/* CENTER COLUMN */


#centerColumn 
{
    float: left;
}

#wrapper_2col #centerColumn 
{
    width: 690px;
    margin:2px 0 0 0px;
    padding:0 0 90px 0px;
    min-height:620px;
    height:auto !important;
}

* html #wrapper_2col #centerColumn 
{
    margin-left:0px;
    width:710px;
}

#wrapper_3col #centerColumn 
{
    width: 423px;
    margin:2px 0 0 0px;
    padding-bottom:30px;
    min-height:718px;
    height:auto !important;
}

* html #wrapper_3col #centerColumn 
{
    margin-left:1px;
    margin-right:9px;
    width:445px;
    overflow:hidden;
}

.normalBackground
{
    background:url(../whiteimages/twocolumn_bg.jpg) top left no-repeat;
}

* html .normalBackground 
{
    margin-left:22px;
    margin-top:1px;
}

#wrapper_3col #centerColumn .normalBackground 
{
    background:url(../whiteimages/threecolumn_bg.jpg) top left no-repeat;
}

.homeBackground
{
    background:url(../whiteimages/threecolumnhome_bg.png) top left no-repeat;
    width:428px;
}

/* png hacks for IE 5.5+ */

/* the 'src' is relative to the html page and not the css */

* html .homeBackground

{
    background:none;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='whiteimages/threecolumnhome_bg.png', sizingMethod='crop');
    margin-left:21px;
}


/* RIGHT COLUMN CSS */

#rightColumn
{
    width: 257px;
    float: left;
    margin:177px 0 0 9px;
    background:url(../whiteimages/right_col_middle.jpg) repeat-y top left;
}

* html #rightColumn 
{
    margin-left:0px;
}

#rightColumnContent
{
    min-height:550px;
    height:auto !important;
    height:550px;
    padding: 5px 10px 15px 10px;
    margin-top:-170px;
    position:relative;
    background:url(../whiteimages/right_col_bottom.jpg) bottom left no-repeat;
}

/* END RIGHT COLUMN CSS */


/* FOOTER CSS */

#footerContent
{
    text-align:center;
    clear:both;
    padding-top:20px;
    position:absolute;
    bottom:10px;
    left:auto;
    width:98%;
 }
    
#footerContent a
{
    font-family:Arial, Verdana;
    color:#333333;
}
   
/* END FOOTER CSS */ 



/************************* END STRUCTURAL ******************************/


/************************* LEFT SIDE NAVIGATION ******************************/

ul#leftSideNavigation {
	margin:0;
	padding:67px 0 20px 2px;
	display:block;
	list-style-type:none;
}


* html ul#leftSideNavigation  
{
    padding-left:27px;
}

ul#leftSideNavigation li a {
	display:block;
	height:25px;
	width:188px;
	background-image:url(../whiteimages/Nav_template_March_2009.gif);
	background-repeat:no-repeat;
	text-indent:-90000em;
}

/* Background Position varies for every image */

/* STATIC STATE - Every nav item is exactly 25px away from the start of the next one
thus our increments will be in 25px */

li#navHome a { background-position:0 0; }
li#navAbout a { background-position:0 -25px; }
li#navForum a { background-position:0 -50px; }
li#navEvents a { background-position:0 -75px; }
li#navCareers a { background-position:0 -100px; }
li#navMediaGallery a { background-position:0 -125px; }
li#navFAQ a { background-position:0 -150px; }
li#navContact a { background-position:0 -175px; }
li#navClubMembers a { background-position:0 -200px; }
li#navResources a { background-position:0 -225px; }



/* STATIC STATE - Every nav item is exactly 25px away from the start of the next one
thus our increments will be in 25px */

/* HOVER STATE - Every hover item is exactly 188px to the right of itself */

li#navHome a:hover,
li#navHome a.activeNavItem { background-position:-188px 0; }

li#navAbout a:hover,
li#navAbout a.activeNavItem { background-position:-188px -25px; }

li#navForum a:hover,
li#navForum .activeNavItem { background-position:-188px -50px; }

li#navEvents a:hover,
li#navEvents a.activeNavItem { background-position:-188px -75px; }

li#navCareers a:hover,
li#navCareers a.activeNavItem { background-position:-188px -100px; }

li#navMediaGallery a:hover,
li#navMediaGallery a.activeNavItem { background-position:-188px -125px; }

li#navFAQ a:hover,
li#navFAQ a.activeNavItem { background-position:-188px -150px; }

li#navContact a:hover,
li#navContact a.activeNavItem { background-position:-188px -175px; }

li#navClubMembers a:hover,
li#navClubMembers a.activeNavItem { background-position:-188px -200px; }

li#navResources a:hover,
li#navResources a.activeNavItem { background-position:-188px -225px; }


/* About Page */
/*****************************************************************/

ul#aboutNav {
	margin:0;
	padding:10px 0 0 30px;
	height:1px;
	list-style-type:none;
	display:block;
}
	
ul#aboutNav li {
	float:left;
	padding:0;
    margin:0;
}

ul#aboutNav li a 
{
    display:block;
	height:25px;
	background-image:url(../whiteimages/about_nav.gif);
	background-repeat:no-repeat;
	text-indent:-90000em;
    margin-bottom:-10px;
}
	
li#navHistory a { width:104px; background-position:0 0 }
li#navCommittee a { width:130px; background-position:-104px 0; }
li#navSponsors a {width:116px; background-position:-234px 0; }

li#navHistory a:hover,
li#navHistory a.activeNavItem { background-position:0 -25px;}


li#navCommittee a:hover,
li#navCommittee a.activeNavItem { background-position:-104px -25px;}

li#navSponsors a:hover,
li#navSponsors a.activeNavItem { background-position:-234px -25px;}




/* Events Pages */
/*****************************************************************/

ul#eventsNav {
	margin:0;
	padding:10px 0 0 110px;
    height:1px;
    list-style-type:none;
    display:block;
}

ul#eventsNav li {
	float:left;
}

ul#eventsNav li a {
	display:block;
	height:25px;
	background-image:url(../whiteimages/events_nav.gif);
	background-repeat:no-repeat;
	text-indent:-90000em;
}

li#navCal a { width:120px; background-position:0 0; }
li#navPhotos a { width:143px; background-position:-130px 0px; }

li#navCal a:hover,
li#navCal a.activeNavItem {  background-position:0 -25px; }

li#navPhotos a:hover,
li#navPhotos a.activeNavItem { background-position:-130px -25px; }


/* Careers Page */
/*****************************************************************/

ul#careersNav {
	margin:0;
	padding:10px 0 0 85px;
	height:1px;
    list-style-type:none;
    display:block;
}

ul#careersNav li {
	float:left;
}

ul#careersNav li a {
	display:block;
	height:25px;
	background-image:url(../whiteimages/careers_nav.gif);
	background-repeat:no-repeat;
	text-indent:-90000em;
}

li#navProfiles a { width:120px; background-position:0 0; }
li#navJobDesc a { width:143px; background-position:-130px 0px; }

li#navProfiles a:hover,
li#navProfiles a.activeNavItem {  background-position:0 -25px; }

li#navJobDesc a:hover,
li#navJobDesc a.activeNavItem { background-position:-130px -25px; }

.headingUl 
{
    border-bottom:1px solid #e3e3e3;
    width:380px;
    margin-left:30px;
    margin-top:10px;
}

.headingUlHome
{
    border-bottom:1px solid #e3e3e3;
    width:390px;
    margin:2px 5px 5px 2px;
    line-height:1px;
}

* html .headingUl 
{
    margin-top:0px;
    padding:0;
}


/************************* END LEFT SIDE NAVIGATION ******************************/



/************************* CONTENT ******************************/

/* inside the center column */


/* COMMITTEE CSS */

.committeeBg {
    width:422px;
    min-height:176px;
    height:auto !important;
    height:176px;
    background:url(../whiteimages/committee_tile.png) no-repeat top left;
    padding-top:30px;
    float:left;
    position:relative;
    top:-10px;
}

* html .committeeBg {
    background:none;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='whiteimages/committee_tile.png', sizingMethod='crop');
}

.memberPhoto {
    width:120px;
    height:135px;
    background:url(../whiteimages/memberPhotoBg.png) no-repeat top left;
    margin:0 auto;
}

* html .memberPhoto {
    background:none;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='whiteimages/memberPhotoBg.png', sizingMethod='crop');
}

.memberPhoto img {
    position:relative;
    top:7px;
    left:-1px;
}

.memberContainer {
    float:left;
    width:210px;
    text-align:center;
}

.memberTitle
{
    text-align:center;
    padding:0px 10px;
    width:185px;
}


   
/* END COMMITTEE CSS */




/* SPONSORS CSS */


.sponsorsTable
{
    width:100%;
    text-align:center;
    font-family:Arial;
}

.sponsorsTable td 
{
    padding-bottom:40px;
    text-align:center;
    vertical-align:baseline;
}
/* END SPONSORS CSS */


.contentCopy 
{
    padding:5px 18px 35px 18px;
    background: url(../whiteimages/home_panel_bottom.gif) no-repeat bottom;
    margin-top:8px;
}

/* png hacks for IE 5.5+ */

/* the 'src' is relative to the html page and not the css */

* html .contentCopy

{
    height:290px;
    padding:10px 25px 15px 30px;
    margin:5px 0 0px -13px;
}

.tblImages th {
    
}

#contentHeader
{
    padding: 8px 0 0 10px;
}

#columnHeader 
{
    padding: 8px 0 0 10px;
}


#contentCopyInner 
{
    padding:5px 18px 0 20px;
}

.contentCopyInnerClass
{
    padding:5px 18px 0 20px;
}

hr 
{
    color:#dbdbdb;
}

#scrollingDiv 
{
    width:97%;
    margin:10px 5px 0 15px;
    height:800px;
    padding-right:5px;
    overflow:auto;
}

* html #scrollingDiv 
{
    width:95%;
}  

.alphaList 
{
    padding-left:60px;
    list-style-type:lower-alpha;
}

/* LATEST POST CSS */

#postContainer 
{
    padding:0 7px 0 5px;
}

.post
{
    font-weight:bold;
    max-width:220px;
    width:auto !important;
    padding: 2px 3px 4px 4px;
    margin-left:5px;
} 

.post a 
{
    color:#ffffff;
}

.postFooter 
{
    padding-left:8px;
    padding-bottom:4px;
    color:#666666;
}

/* END LATEST POST CSS */


/* COMING EVENTS CSS */

#eventsContainer 
{
    margin:10px 0 0 0;   
}

#eventsHeader 
{
   position: relative;
   top: 5px;
   left: 2px;   
}

#eventsImage 
{
    padding:11px 0 0 10px;
    height:145px;
    background:url(../whiteimages/eventsmenu_tile.jpg) no-repeat;
}

h2.subHeading 
{
    font-size:1.1em;
    font-family:Verdana;
    color:#333333;
    padding:5px 0 0 0;
    margin:0;
    text-transform:uppercase;
}

h2.subHeadingGrey 
{
    color:#666666;
    font-size:1.1em; 
    padding:2px 0 0 0;
    margin:0;
}


/* END COMING EVENTS CSS */

/* INDEX PAGE CSS */

#flashPlayer 
{
    padding:20px;
    z-index:450;
    position:relative;
}


.photovideoHeader 
{
    background:url(../whiteimages/photosvideostop_tile.jpg) no-repeat;
    width:455px;
    height:105px;
    position:relative;
    left:-15px;
}

.photovideoHeader img {
    position:relative;
    top:10px;
    left:-1px;
    z-index:1;
}

.photovideo 
{
    background:url(../whiteimages/photosvideos_tile.jpg) no-repeat bottom left;
    width:413px;
    min-height:150px;
    height:auto !important;
    height:150px;
    position:relative;
    margin:0 0 0 -15px;
    z-index:0;
    padding:10px 10px 5px 25px;
}

.photovideocontainer {
    position:relative;
    top:-50px;
    margin-bottom:-30px;
}

.pvCell 
{
    background:url(../whiteimages/photo_tile.png) no-repeat;
    padding:4px 2px 0px 4px;
    width:132px;
    height:83px;
    vertical-align:top;
}

.pvCell img
{
	position:relative;
}

/* png hacks for IE 5.5+ */

/* the 'src' is relative to the html page and not the css */

* html .pvCell 

{
    background:none;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='whiteimages/photo_tile.png', sizingMethod='crop');
}

.eventPhotosNew .pvCell 
{
    padding:4px 0 0 4px;
}

.pvCellEmpty
{
    padding:4px 8px 0px 4px;
    width:132px;
    height:83px;
}

.pvMore 
{
    padding:10px 5px 0 0;
}

/* END INDEX PAGE CSS */


/* CAREER PROFILE CSS */

.careerLi 
{
    line-height:14px;
    height:20px;
}

#careerContainer 
{
    margin:0;
}

#careerHeader 
{
    position:relative;
    top:10px;
}

#careerImage 
{
    padding:12px 0 5px 10px;
    height:140px;
    background:url(../whiteimages/profilemenu_tile.jpg) no-repeat;
}


.profileList 
{
    list-style-image: url(../whiteimages/profile_bullet.jpg);
    line-height:16px;
    padding: 0 0 10px 20px;
    margin:0;
}

.profileList li
{
    line-height:14px;
    height:20px;
}

.returnLink 
{
    margin-top:-30px;
    float:right;
}

.profileHeader 
{
    padding-top:14px;
}

.profileBg 
{
    background:url(../whiteimages/profile_tile_lrg.png) no-repeat;
    width:421px;
    padding:0px 20px 0 14px;
}


/* END CAREER PROFILE CSS */

/* EVENTS CSS */

.dropDownGrey 
{
    width:140px;
}

.eventBg 
{
    background:url(../whiteimages/event_tile.jpg) no-repeat;
    width:422px;
    height:152px;
}

.eventBg2
{
    background:url(../whiteimages/event_tile2.jpg) no-repeat;
    width:422px;
    height:152px;
}

.eventHeader 
{
    padding: 13px 26px 5px 5px;
    width:228px;
    min-height:42px;
    border-bottom: 1px solid #f4f4f4;
}

.eventCopy 
{
    height:60px;
}

.eventCopy p 
{
    padding:4px 22px 4px 3px;
    margin:0;
}

.eventBgImage
{
    padding: 20px 0 0 19px;
    height:121px; 
}

.eventFooter 
{
    padding-left: 3px;
    height:38px;
}

.eventMore 
{
    width:200px;
    padding:0px 20px 0 5px;
}

.eventDarkGrey 
{
    background:url(../whiteimages/event_tile_dark.jpg);
    border-top:1px solid #d6d6d6;
    border-bottom:1px solid #d6d6d6;
    height:50px;
    width:395px;
    margin:10px 10px 0 20px;
      
}

.eventLightGrey 
{
    background:url(../whiteimages/event_tile_light.jpg);
    border-bottom:1px solid #d6d6d6;    
    height:50px;
    width:395px;
    margin:10px 10px 0 20px;
}

.subHeadGrey
{
    color:#666666;
    font-size:1.1em;
}

.eventLinks
{
     line-height:16px;
     padding-right:5px;
     width:100px;
}

/* END EVENTS CSS */

/* EVENT DETAILS CSS */

.eventDetail 
{
    background:url(../whiteimages/eventdetails_tile.jpg) no-repeat;
    padding:15px 5px 0 18px;
}

.eventDetailsImage {
    padding:11px 0 0 10px;
    margin-left:-10px;
    height:153px;
    width:237px;
    background:url(../whiteimages/eventsmenu_tile.png) no-repeat;
    vertical-align:top;
    float:left;
}

/* png hacks for IE 5.5+ */

/* the 'src' is relative to the html page and not the css */

* html .eventDetailsImage

{
    background:none;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='whiteimages/eventsmenu_tile.png', sizingMethod='crop');
    margin-left:-5px;
}

.eventDetailsLocation 
{
    height:130px;
    padding-top: 10px;
    padding-right:12px;
}

/* EVENT DETAILS CSS */

/* EVENT PHOTOS CSS */

.eventPhotos 
{
    background:url(../whiteimages/eventphoto_tile.jpg) no-repeat;
    padding:12px 0px 0 0px;
    width:420px;
    height:252px;
}

.eventPhotosNew
{
    background:url(../whiteimages/eventphoto_tile.jpg) no-repeat;
    padding:15px 5px 0 12px;
    width:400px;
    height:260px;
}

.eventPhotosNew .pvCellEmpty
{
    padding:4px 0 0 4px;
}

.eventPhotos h2
{
    padding-left:17px;
}

.eventPhotosNew h2
{
    padding-left:6px;
}

.eventCell
{   
    background:url(../whiteimages/photo_tile.png) no-repeat;
    height:83px;
    padding: 0 0 0 4px;
}


/* EVENT PHOTOS EXPANDED CSS */

.expandTable 
{
    margin-top:6px;
}

.eventPhotosExpand 
{
    background:url(../whiteimages/eventphotoexpand_tile.jpg) no-repeat;
    padding:15px 5px 0 17px;
}


/* END EVENT PHOTOS CSS */

/* EVENT VIDEOS CSS */

.eventVideo 
{
    background:url(../whiteimages/videos_tile.jpg) no-repeat;
    padding:10px 10px 0 17px;
}

.eventFlash 
{
    padding-top:10px;
    padding-left:5px;
}

/* END EVENT VIDEOS CSS */




/* png hacks for IE 5.5+ */

/* the 'src' is relative to the html page and not the css */

* html .profileBg
{
    background:none;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='whiteimages/profile_tile_lrg.png', sizingMethod='crop');
}

.profileBg img 
{
    float:left;
    padding-right:10px;
}

.profileImage 
{
   margin-top:16px;
   margin-left:1px;
}
    
/* END CAREER PROFILE CSS */

/* JOB DESCRIPTION CSS */

.descriptionBg 
{
    background: url(../whiteimages/description_tile.jpg) no-repeat;
    width:420px;
    height:273px;
}

.descriptionBg td 
{
    padding:15px 20px 0 18px;
}

.descriptionBg p 
{
    padding-bottom:8px;
    margin:0;
}

/* END JOB DESCRIPTION CSS */

/* JOIN NGEN CSS */

#joinHeader 
{
    padding:20px;
}

#joinBg 
{
    /*background:url(../whiteimages/join_tile.jpg) no-repeat;*/
    padding:20px 20px 10px 20px;
}

#joinBg ul 
{
    margin:0;
    padding:10px 5px 0 18px;
}

.register
{
    padding-top:0;
}

/* JOIN NGEN CSS */


.rightColumnCopy 
{
    padding: 0 10px 0 8px;
}

.eventsButton 
{
    padding:12px 0 0 0;
}

.careerItemBold
{
	font-weight: bold;
}

/* gotta love the clearfix */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */