/* Scrollable */
/* 
    root element for the scrollable. 
    when scrolling occurs this element stays still. 
*/ 
div.scrollable { 
 
    /* required settings */ 
margin-top:1em; 
margin-left:.4em;   
position:relative; 
    overflow:hidden; 
    width: 440px; 
    height:380px; 
} 
 div.scrollable h1 { 
    border-bottom:none;
	font-size:145%;
	color:#fff;
	width:100%;
	background: url(/alumni/images/highlight/top.gif) no-repeat top left;
	padding:10px 0 10px 20px;
margin:0;

} 
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a super large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
div.scrollable div.items { 
    /* this cannot be too large */ 
    width:20000em; 
    position:absolute; 
} 
 
/* 
    a single item. must be floated on horizontal scrolling 
    typically this element is the one that *you* will style 
    the most. 
*/ 
div.scrollable div.items div { 
    float:left;
    background: url(/alumni/images/highlight/bottom.gif) no-repeat bottom left;
} 
div.scrollable div.items div p { 
	margin:0 10px 10px 10px;
	line-height: 120%;
	width: 420px;
} 
div.scrollable div.items div h4 { 
	margin:10px 0 0 10px;
	line-height: 120%;
}

/* you may want to setup some decorations to active item */ 
div.items div.active {  
    background-color:#fff; 
}
/* position and dimensions of the navigator */
div.navi {
	margin-left:178px;/* adjust this to center the navigator */
	width:200px;
	height:20px;
}


/* items inside navigator */
div.navi a {
	width:12px;
	height:12px;
	float:left;
	margin:3px;
	background:url(/homecoming/images/2009/navigator-blue2.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
div.navi a:hover {
	background-position:0 -12px;      
}

/* active state (current page state) */
div.navi a.active {
	background-position:0 -12px;     
} 
.arrows {
	margin:0 0 0 325px;
}
/* prev, next, prevPage and nextPage buttons */
a.prev, a.next {
	display:block;
	width:20px;
	height:20px;
	background:url(/homecoming/images/2009/left-new.png) no-repeat;
	float:left;
	margin:0px 0 0 150px;
	cursor:pointer;
	font-size:1px;
}
a.next {
	background-image:url(/homecoming/images/2009/right-new.png);
	clear:right;
        margin: -20px 0 0 273px;
        display:block;
	width:20px;
	height:20px;
	float:left;
	cursor:pointer;
	font-size:1px;
}
a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover {
	background-position:0px -20px;		
}
#defaultLayout #sideContent {
	float: left;
	width: 240px;
	padding: 0;
	margin: 1em 0 0 0; 
	_margin-right: -3px; /* Fix "IE 6 Duplicate Character Bug" with margin-right: -3px */
	background:transparent; /* Faux-column color equals 220 pixels */
}
#defaultLayout #sideContent .secondary_content {
	background:transparent url(/alumni/images/highlight/sidebar-bg.gif) top left repeat-y;
border-top: 5px solid #FFD81A;
width:100%;
padding-left:10px;
margin-bottom:15px;
}
#defaultLayout #sideContent .secondary_content h5{
	width:100%;
	padding: 5px 10px 0 0;
	font-size:120%;
	color: #98002E;
	font-weight:bold;

}
#defaultLayout #sideContent .secondary_content p{
	font-size:92%;
}
#alumni-news {
	width: 100%;
	margin-top:1em;
	border-top: 5px solid #FFD81A;
}
#alumni-news h5{
	padding:5px 0 0 0;
	margin:0;
}
#alumni-news p{
	padding:5px 0 0 0;
	font-size:92%;
}

/*---------------------------------------------------------------------------------------------
    TAB STYLES - Based on Dan Cederholm's Simplified CSS Tabs Trick
  --------------------------------------------------------------------------------------------- */

#tabs {width: 675px; background:url(http://www.calvin.edu/alumni/images/uKnightcropped60.gif) top left no-repeat;margin-left:10px;}

.tabnav {
	height: 60px;
	margin: 0;
	padding: 5px 0 0 100px;
	width: 700px;
	top: 0;
	_top: 1px; /* show to IE, hide from other browsers */
}

.tabnav li {
	margin: 0; 
	padding: 0;
	display: inline;
	list-style-type: none;
}

.tabnav a {
	float: left;
	background: #eeeeee;
	line-height: 12px;
	padding: 5px 5px 5px 5px;
	margin-right: 4px;
	border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
	text-decoration: none;
	color: #333333;
}

.tabnav a:hover {
	background: #dedcdc;
     
	color:#333333;
}
/* Welcome bar */

#value-statement {
   width:720px;
   background:#f0f5fa;
   border-bottom:1px solid #d6e4f1;
margin:0 0 1em 0;
   }
#value-statement h4 {
  padding:20px 10px 0px 0px;
   }
#value-statement p {
margin-top:-20px; 
font-size:90%; 
padding:-10x 10px 0 0;
   }
#value-statement img {
   float:right;
   padding:0;

   }

/* Masked Gallery http://plugins.jquery.com/project/mbmaskedgallery */
#masked {
	float: right;
	width: 300px;
	padding: 0;
	margin: 20px 0 10px 10px;
}
#masked h4 {
font-size:120%;
font-weight:bold;
	padding:5px 0 0 45px;
}
/* Liquid Round http://www.search-this.com/2007/02/12/css-liquid-round-corners/ */

.liquid-round-left {
	float:left;
	width:250px;
	padding: 0;
	margin: 0 10px 10px 0;
}
.liquid-round-right {
	float:right;
	width:300px;
	padding: 0;
	margin: 0 0 10px 10px;
}
.liquid-round {
width:100%;
margin:10px auto;
background:#fff url(/alumni/images/images/welcome-leftside.gif) repeat-y left top;
}


.top {
width:100%;
height:30px;
background: url(/alumni/images/images/welcome-top.gif) no-repeat left top;
}
.top span {
display:block;
position:relative;
height:30px;
background: url(/alumni/images/images/welcome-top-right.gif) no-repeat right top;
}
.center-content {
clear:both;
position:relative;
background: url(/alumni/images/images/welcome-rightside.gif) repeat-y right top;
padding:1px 20px 1px 25px;
margin:-1px 0 -10px 0;
}

.center-content .column-left {
  float:left;
width: 48%;
}
.center-content .column-right {
	float:right;
    width: 48%;
}
.center-content .value-statement p{
font-size:170%;
color: #000000;
}
.center-content .column-right p {
font-color: #333333;
}
.bottom {
clear:both;
height:20px;
background: url(/alumni/images/images/welcome-bottom.gif) no-repeat left bottom;
}
.bottom span {
display:block;
position:relative;
height:20px;
background: url(/alumni/images/images/welcome-bottom-right.gif) no-repeat right top;
}


#container {
	margin: 150px auto;
	width:50%;
    border:1px solid #ccc;
    background: #eee;
}
#container h1 {
   font-size: 150%;
   font-family: Arial, Helvetica, sans-serif; 
   color: #003366;
}
#container p {
   font-size: 100%;
   font-family: Arial, Helvetica, sans-serif;
   color: #003366;
}
/* COLOR PALETTE
------------------------------------------------------------------------------------------------
#B3AC68 - Olive green
#A59E60 - Dark olive green
#98002E - Calvin maroon
#003366 - Midnight sky Blue
#F7EDD4 - Cream
#D7DAC3 - Sand
*/
/* AUTO-SELECTING NAVIGATION http://24ways.org/advent/auto-selecting-navigation */
body.home #navbar li.home,
body.active #navbar li.active,
body.chapters #navbar li.chapters,
body.c-wire #navbar li.c-wire,
body.groups #navbar li.groups,
body.informed #navbar li.informed,
body.jc #navbar li.jc,
body.services #navbar li.services,
body.travel #navbar li.travel,
body.networking #navbar li.networking,
body.news #navbar li.news,
body.association #navbar li.association,
body.support #navbar li.support,
body.profiles #navbar li.profiles,
body.contact #navbar li.contact { font-weight: bold;  background-color: #ddd;}

/* NAVIGATION LISTS
------------------------------------------------------------------------------------------------ */
/* First List */
#navbar ul { margin: 0; padding: 0; list-style-type: none; line-height: normal;}
#navbar ul li { margin: 0; padding: 10px 0 10px 40px;  line-height: normal;}
#navbar ul li:hover  {  background-color: #ddd;}

/* Second List */
#navbar ul li ul { margin: 0; padding: 0; list-style-type: none; line-height: normal;}
#navbar ul li ul li { margin: 0; padding: 5px 5px 0 20px; font-weight: normal; background: none; line-height: normal;}
#navbar ul li ul li:hover  { background: none; background-color: #ddd;}

/* Third List */
#navbar ul li ul li ul { margin: 0; padding: 0; list-style-type: circle; line-height: normal; font-size: 85%;}
#navbar ul li ul li ul li { margin: 0; margin-left: 20px; padding: 5px 5px 0 0; font-weight: normal; background: none; line-height: normal;}
#navbar ul li ul li ul li:hover  { background: none; background-color: #ddd;}

/* Avoid the jQuery Superfish fly-out menu effect by switching to an ordered list <OL> */
#navbar ul li ol li { margin: 0; padding: 10px 0 0 20px; font-weight: normal; background: none; line-height: normal; background-color: none;  border: none;}
#navbar ul li ol li:hover  { background: none; background-color: #ddd;}

/* Social Media Table */
#navbar table {
	margin:20px 0 0 40px;
	border: none;
}
#navbar .assistance {
	margin:20px 0 0 20px;
	text-transform:none;
	padding:0 0 0 10px;
}

/* Global Navigation */
#global_nav {
	float: right;
margin-top:-25px;
text-indent: 0px;
}

#global_nav a {
	color: #fff;
	text-decoration: none;
}
#global_nav a:hover {
	color:#fff;
	text-decoration: underline;
}
#global_nav ul {
margin-top:0;
	margin-right: 15px;
	padding: 0;
	background: transparent url(/alumni/images/navigation_bullet.png) 0 60% no-repeat;
}
#global_nav ul li {
	float: right;
	color: #FFF;
	margin-left:0;
	list-style:none;
	padding-left: 13px;
    padding-top:0;
	background: transparent url(/alumni/images/navigation_bullet.png) 0 60% no-repeat;
}

#global_nav ul li.first {

	padding-left: 0;
	margin-left: none;
	background-image: none;	
}
#global_nav ul li a {
	padding: 0 10px 5px 5px;
	font-size:12px;
}

/* Superfish v1.4.1 by Joel Birch http://users.tpg.com.au/j_birch/plugins/superfish/vertical-example/

-----------------------------------------------------------------------------------------------*/
.nav, .nav * {
	margin:0;
	padding:0;
}
.nav {
	line-height:1.0;
	margin-bottom:2.60em;
	width: 9.45em;
}
.nav ul {
	background:#B3AC68; /* Gold, IE6 needs this*/
	width: 9.45em;
}
.nav li {
	background: url(alumni/images/bg-border-navbar.gif) left bottom repeat-x;
	float: left;
	list-style:none;
	position:relative;
	width: 200px;
	z-index:999;
}
.nav a {
	display:block;
	padding: 0;
	text-decoration:none;
	width:7.45em;
}
.nav li ul {
	top:-999em;
	position:absolute;
	width:11.25em;
}
.nav li ul li {
	border-top: 1px dotted #ffffff !important;
	border-right: none;
	border-bottom: none;
	border-left: 1px solid #ffffff;
	padding: .25em 0 .73em 0;
	line-height: normal;
	background-color: #eee !important; /* Light gray */
}
.nav li ul li a {
	padding: .25em 0 .73em 0;
}
.nav li:hover,
.nav li.sfHover,
.nav a:focus, .nav a:hover, .nav a:active {
	background-color: #ddd !important; /* Gray on hover */
}
.nav li:hover ul, /* pure CSS hover is removed below */
ul.nav li.sfHover ul {
	left:240px;
	top:-1px;
}
.nav li:hover li ul,
.nav li.sfHover li ul {
	top:-999em;
}
.nav li li:hover ul, /* pure CSS hover is removed below */
ul.nav li li.sfHover ul {
	left:240px;
	top:-1px;
}
.nav li li:hover li ul,
.nav li li.sfHover li ul {
	top:-999em;
}
.nav li li li:hover ul, /* pure CSS hover is removed below */
ul.nav li li li.sfHover ul {
	left:9.45em;
	top:-1px;
}
/*following rule negates pure CSS hovers
so submenu remains hidden and JS controls
when and how it appears*/
.superfish li:hover ul,
.superfish li li:hover ul,
.superfish li li li:hover ul {
	top: -999em;
}
.nav li li {
	background-color: #ddd;
	width:9.45em;
}
.nav li li li {
	background-color: #ddd;
}
.nav li li a {
	padding-right:0;
	width:7.45em;
}
/* BOXES */
div.box {
	background: none;
	float:right;
	border: #993333 solid 1px;
	width: 320px;
	margin: 0;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

.box h3 {
	background: none; 
	padding: .5em 1em;
	margin: 0;
	border-bottom: 1px solid #993333;
	color: #BC6D50;
	font-size: 120%;
	font-weight: bold;
}

.box ul {
	margin: 0;
	padding: 1em;
	list-style: none;
}
.box p {
	margin: 0;
	padding: 1em;
}

.box ul li {
	margin-bottom: 1em;
	list-style: none;
}

.box img {
	padding: 1em 1em 0 1em;
}
/* Individual profile <table> containing photo, bio and description */

.bio { /* Table positioning */
	text-align: left;
	padding: 0px;
	margin-bottom: -30px;
	margin-top:-50px;	
	z-index: auto;
	visibility: visible;
	color: #cc9966;
	vertical-align: text-bottom;
}

.bio h2 { /* Individual's name */
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #993333;
	font-size: 150%;
	margin-bottom: -0.5em;
	font-weight: bold;
}

.bio img { /* Individual's bio photo, 114x143 pixels */
	margin: 0px 8px 0px 50px;
	padding: 4px;
	border: 1px solid #cc9966;
	border-bottom-color: #993333;
	border-right-color: #993333;
	background: #ffffff;
}


.uknight { font-weight:bold;color:#98002E;font-size:105%;}
.jqueryselector { float:right;}

/* Calvin Nameplate */

#signup-calvin { 
	float: right;
	display: block;
	padding: 0;
	margin: 20px 20px 0 0;	/* UPDATE */
	width: 100px;
	height: 25px;
	background: transparent url(http://www.calvin.edu/alumni/images/sign-up-rollover.gif) no-repeat right top; /* Calvin logo */
	border: none;
	text-indent: -9000px; /* Move text link off-screen */
	text-decoration: none;
}

#signup-calvin a {
	display: block;
	width: 100px;
	height: 25px;
	background: transparent url(http://www.calvin.edu/alumni/images/sign-up-rollover.gif) no-repeat left top; /* Calvin logo */
	border: none;
}

#signup-calvin a:hover {
	display: block;
	width: 100px;
	height: 25px;
	background: transparent url(http://www.calvin.edu/alumni/images/sign-up-rollover.gif) no-repeat right top; /* Calvin logo */
	border: none;
}
#learnmore-calvin { 
	float: right;
	display: block;
	padding: 0;
	margin: 28px 20px 0 0;	/* UPDATE */
	width: 125px;
	height: 28px;
	background: transparent url(/alumni/images/Learn-more-rollover.gif) no-repeat right top; /* Calvin logo */
	border: none;
	text-indent: -9000px; /* Move text link off-screen */
	text-decoration: none;
}
#learnmore-calvin a {
	display: block;
	width: 125px;
	height: 28px;
	background: transparent url(/alumni/images/Learn-more-rollover.gif) no-repeat left top; /* Calvin logo */
	border: none;
}

#learnmore-calvin a:hover {
	display: block;
	width: 125px;
	height: 28px;
	background: transparent url(/alumni/images/Learn-more-rollover.gif) no-repeat right top; /* Calvin logo */
	border: none;
}
.check li {
	list-style-image: url(/alumni/images/check-red.gif);
}

/* Footer Promo */

#footer-promo {
	width: 400px;
	clear:both;
	height: 65px;
	overflow:hidden;
	margin:0 0 0 0;
	padding:0;
}


#footer-promo-1 {
    float:left;
	width:60px;
	height: 60px;
	overflow:hidden;
	background: transparent;
}
#footer-promo-1 .gutter{
    padding:10px 10px 0 10px;
}

#footer-promo-2 {
	float:left;
	width:80px;
	height: 65px;
	overflow:hidden;
	background: transparent;
}
#footer-promo-2 .gutter{
    padding:10px 10px 0 20px;
}
#footer-promo-3 {
	float:left;
	width:60px;
	height: 65px;
	overflow:hidden;
	background: transparent;
}
#footer-promo-3 .gutter{
    padding:10px 15px 0 10px;
}
#footer-promo-4 {
	float:left;
	width:80px;
	height: 65px;
	overflow:hidden;
	background: transparent;
}
#footer-promo-4 .gutter{
    padding:10px 15px 0 20px;
}