/*
----------------------------------------------------
Site: State Policy Network
Sheet: styles.css
Web Development Firm: www.eResources.com
CSS Coder: Matt Harris (www.focusontheclouds.com)
Date: March 29, 2010
Purpose: Main Template
----------------------------------------------------
----------------------------------------------------
*/

/* List of wrappers
#wrapadmin
#wraphdr
#wrappage
  #wrapfeature .pri .sec
  #wrapcontent .pri .sec
  #wrapfooter .pri .sec
  #wrapcopyright .pri .sec    */

/* ---------------------------------------------
Positioning
--------------------------------------------- */

body {margin: 0; padding:0;}
#wrapadmin, #wraphdr, #wrappage {
	position: relative;
	width: 959px;		/* it was 960px - fix over-width - AG - Apr 14, 2010 */
	clear: both;
	margin: 0 auto;
}
#wrapadmin, #wrappage, #wraphdr, #wrapfeature, #wrapmeta, #wrapcontent, #wrapfooter, #wrapcopyright {overflow: hidden; position: relative; z-index: 1;}

.pri {width: 620px; margin-left: 10px; clear: left; float: left;}
.sec {width: 310px; margin-right: 10px; clear: right; float: right;}
#pagenav {width: 310px; margin-right: 10px; clear: right; float: right;}

#wraphdr, #wrapprinav, #prinav {overflow: visible; z-index: 5;}
#prinav li ul li, #prinav li ul, #prinav li ul li a {z-index: 10;}

#wrapcontent {margin-bottom: 20px;}

#wrapfooter {margin: 0 10px;}
#wrapfooter .pri {width: 624px; margin: 0; clear: left; float: left;}
#wrapfooter .sec {width: 315px; margin: 0; clear: right; float: right;}

#logo {float: left; margin: 22px 0 0 15px;}
#wrapprinav {width: 530px; clear: right; float: right;}
#wraphdr {margin-bottom: 40px;}

/* ---------------------------------------------
Navigation
--------------------------------------------- */
#prinav {margin:0; padding:0; list-style:none; height: 100px;}
#prinav li {display: block; float: left; position: relative;}
#prinav li a {display: block; height: 60px}
#prinav li a {background: transparent url(/i/prinav.gif) top left no-repeat;}
#prinav li a span {display: none;}

#prinav li.contr a {background-position: 0 -80px; width: 103px;}
#prinav li.about a {background-position: -102px -80px; width: 59px;}
#prinav li.direc a {background-position: -161px -80px; width: 87px;}
#prinav li.event a {background-position: -251px -80px; width: 65px;}
#prinav li.publi a {background-position: -317px -80px; width: 109px;}
#prinav li.progr a {background-position: -427px -80px; width: 88px;}

#prinav li.contr:hover a, #prinav li.contr a:hover, #prinav li.contr a:active, #prinav li.contr a.active {background-position: 0 0;} 
#prinav li.about:hover a, #prinav li.about a:hover, #prinav li.about a:active, #prinav li.about a.active {background-position: -101px 0;} 
#prinav li.direc:hover a, #prinav li.direc a:hover, #prinav li.direc a:active, #prinav li.direc a.active {background-position: -161px 0;} 
#prinav li.event:hover a, #prinav li.event a:hover, #prinav li.event a:active, #prinav li.event a.active {background-position: -251px 0;} 
#prinav li.publi:hover a, #prinav li.publi a:hover, #prinav li.publi a:active, #prinav li.publi a.active {background-position: -317px 0;} 
#prinav li.progr:hover a, #prinav li.progr a:hover, #prinav li.progr a:active, #prinav li.progr a.active {background-position: -427px 0;} 

/* ------- Primary Nav Dropdowns ------- */

#prinav li ul {display: none; position: absolute; top: 60px; left: 0;}
#prinav li.progr ul {left: auto; right: 0;}
#prinav li ul {list-style: none; padding-left:0; margin-left: 0;}
#prinav li ul li {float: none;}
#prinav li ul li a {padding:8px; background: none; height: auto; width: 150px !important;}
#prinav li ul li a {border-top: 1px solid #bbb; background-color: #264876; color: #fff;}
#prinav li ul li a {text-transform: uppercase; font-size: 14px;}

#prinav li ul li a:hover {background: #355B8A url(/i/prinav-drop-bkgd.gif) top left repeat-x;}

#prinav li:hover ul {display: block;}

#prinav li ul {-moz-box-shadow: 3px 3px 2px rgba(0,0,0,0.5); -webkit-box-shadow: 3px 3px 2px rgba(0,0,0,0.5); box-shadow: 3px 3px 2px rgba(0,0,0,0.5);}


/* ------- Page Nav ------- */
ul.pagenav {margin: 0 0 10px 0; padding:0; list-style:none;}

#pagenav ul ul {margin:0; padding:0;}
#pagenav li {margin: 1px 0 0 0; list-style:none;}
#pagenav li a {padding: 4px 0 4px 0; display: block;}
#pagenav ul ul li a {padding: 4px 0 4px 15px;}
#pagenav ul ul ul li a{padding: 4px 0 4px 30px;}

#pagenav ul.associated ul li a {padding-top: 2px; padding-bottom: 2px;} /* AG - July 22, 2010 - added for secondary nav*/

#pagenav ul.browseby ul li a {padding-top: 2px; padding-bottom: 2px;}

#pagenav li a {display: block;}

#tHome #pagenav li {margin:0;}

/* ---------------------------------------------
Fonts, Background & Borders
--------------------------------------------- */
/* *** Fonts *** */
body, h3.title, .button, .sec .member h4  {font-family: Calibri, Arial, Sans-serif;}
h3.htitle {font-family: Calibri, Arial, Sans-serif;} /* added for fixed highlight title - AG - Apr 14, 2010 */
#tHome h3.title {overflow: hidden;} /* added to hide long title - JM - Apr 14, 2010 */
h1, h2, h3, h4, h5, h6 {font-family: Georgia, Serif; font-weight: normal;}
#tPage h1, #tPage h2, #tPage #wrapcontent .pri h3, #tPage h4, #tPage h5, #tPage h6, #tPage .pri p.meta , ul.pagenav li {font-family:  Lucida Sans Unicode, Arial, Sans-serif; font-weight: normal;}

body {font-size: 13px; color: #333;}
blockquote {margin-left: 30px; margin-right: 30px;} /* added for blockquote - JM - Apr 14, 2010 */

h3 {font-size: 17px;}
h5 {margin-bottom: 0px;} /* added to decrease spaces - JM - Apr 14, 2010 */

#tHome table tr td, #tPage table tr td {font-family: Calibri, Arial, Sans-serif; font-size: 13px;} /* added for table - JM - Apr 14, 2010 */

/* ------- Links ------- */
a img {border: none;}
a:link, a:visited {color: #12385F; text-decoration: none;}
a:hover, a:active {color: #3E709F;}

h3.title a:link, h3.title a:visited {color: #fff;}
h3.title a:hover, h3.title a:active {color: #F17338;}

/* added for highlight with long title (part 1) - AG - Apr 14, 2010 */
h3.htitle a:link, h3.htitle a:visited {color: #fff;} 
h3.htitle a:hover, h3.htitle a:active {color: #F17338;}
/* END OF added - AG - Apr 14, 2010 */

/* ------- Misc Text Styles ------- */

#tHome h3.title, #tPage h3.title {font-size: 22px; background-color: #1D436D; color: #fff; text-transform: uppercase; height: 34px; margin:0;}
#tHome h3.title, #tPage h3.title {background: transparent url(/i/bkgd-highlight-title-right.gif) top right no-repeat; clear:both;}
#tHome h3.title a, #tPage h3.title a {height: 34px; display: block;}
#tHome h3.title a, #tPage h3.title a {background: transparent url(/i/bkgd-highlight-title-left.gif) top left no-repeat; padding: 0 5px;}

/* added for highlight with long title (part 2) - AG - Apr 14, 2010 */
.highlight .htitlebtm h3.htitle {font-size: 22px; background-color: #1D436D; color: #fff; text-transform: uppercase; margin: 0; padding: 2px 5px 2px 5px;}
.highlight .htitlebtm h3.htitle {background: #1D436D url(/i/bkgd-highlight-title-top.gif) top left no-repeat;}
.highlight .htitlebtm {background: transparent url(/i/bkgd-highlight-title-bottom.gif) bottom left no-repeat; padding-bottom: 4px;}
/* END OF added - AG - Apr 14, 2010 */

#wrapadmin {font-size: 12px;}
.content {line-height: 1.2em;}

/* define font size for some heading based on old site - JM - Apr 14, 2010 */
#wrapcontent .pri .article h1, #wrapcontent .pri .article .content h1 {font-size: 20px; color: #233E63; line-height: 1.2em;}
#wrapcontent .pri .article h2, #wrapcontent .pri .article .content h2, #wrapcontent .pri .article table tr td h2 {font-size: 13px; color: #DF9F24; font-weight: bold;}
#wrapcontent .pri .article h2 {margin-bottom: 0px;}
#wrapcontent .pri .article table tr td h2 {margin-top: 0px; .margin-top: 10px;}
#wrapcontent .pri .article .content h3 {font-size: 11px; color: #333333; font-weight: bold;}
#wrapcontent .pri .article table tr td h4 {font-size: 18px; margin: 0; line-height: 1.2em;}
#wrapcontent .pri .article h5 {font-size: 14px; font-weight: bold;}
#wrapcontent .pri .article span.indexchar {font-size: 16px; font-weight: bold;}
/* END OF define - JM - Apr 14, 2010 */

#tPage h3 {font-size: 20px; color: #000;}
#tPage h3.htitle {font-size: 22px; color: #fff;} /* added for unlinked highlight title - AG - Apr 14, 2010 */
#tPage h4 {text-transform: uppercase; font-size: 18px;}

#tPage .pri .article h3 {margin: 0;}
#tPage .pri .article h4 {text-transform: none; font-size: 18px; margin: 0;}

#tPage .pri .article h3 a {color: #000;}
#tPage .pri .article h4 a {color: #333;}

/* ------- Page Backgrounds ------- */
body {background: #f2f2f2 url(/i/bkgd-shadow.gif) 50% 33px no-repeat;}
#wrappage {background-color: #fff;}

/* ------- Input & Buttons ------- */
.input, .inputtext {background: #f2f2f2 url(/i/bkgd-input.gif) top left no-repeat; padding: 2px; margin-left: 2px;} /* added .inputtext (from old site) - JM - Apr 14, 2010 */
.input, .inputtext {border: 1px solid #ccc; border-top: 1px solid #444; border-left: 1px solid #444;} /* added .inputtext (from old site) - JM - Apr 14, 2010 */
.button, .btnclickable {font-size: 12px; padding: 1px 2px;} /* added .btnclickable (from old site) - JM - Apr 14, 2010 */
select {font-family: Calibri, Arial, Sans-serif; font-size: 12px;} /* added - JM - Apr 14, 2010 */
/* added for form elements (from old site) - JM - Apr 14, 2010 */
.inputtext {
	background: none;
	margin-left: 0px;
	width: 90px;
	font-family: Arial, Sans-serif;
	font-size: 12px;
}

.btnclickable {
	font-family: Calibri, Arial, Sans-serif;
	font-size: 12px;
}

.searchbutton {
	margin-bottom: -6px;
	font-family: Calibri, Arial, Sans-serif;
	font-size: 12px;
}

.slcContent {
	font-family: Calibri, Arial, Sans-serif;
	font-size: 12px;
}

.slcContent2 {
	font-family: Calibri, Arial, Sans-serif;
	font-size: 11px;
}
/* END OF added - JM - Apr 14, 2010 */

/* ------- Admin Navigation ------- */
#wrapadmin .alert, #wrapadmin .subscribe, #wrapadmin .social {float: left; overflow: hidden; height: 33px;}
#wrapadmin .social {float: right;}

#wrapadmin .alert {
	border-right: 1px solid #fff;
	padding: 0 10px 0 10px;
	width: 381px;					/* added to hide long headline teaser - JM - Apr 14, 2010 */
									/* it was 405px - changed because there is additional button: LinkedIn - JM - Oct 14, 2011 */
}
#wrapadmin .subscribe {border-left: 1px solid #ccc; padding: 0 10px;}
#wrapadmin .social {border-left: 1px solid #fff;}
#wrapadmin .social div {border-left: 1px solid #ccc; padding: 0 6px 0 10px; height: 33px;}
#wrapadmin .welcome {padding-top: 10px; width: 422px;} /* added for welcome text - JM - Apr 14, 2010 */

#wrapadmin .social img {padding: 5px 4px 0 0;}

#wrapadmin .input {width: 110px;}

#wrapadmin a:link, #wrapadmin a:visited {color: #F17338;}
#wrapadmin a:hover, #wrapadmin a:active {color: #3E709F;}

#wrapadmin p, #wrapadmin form {margin:0;padding:0; line-height: 33px;}

/* ------- Feature Section ------- */

#wrapfeature p {color: #fff;}
#wrapfeature .sec p {margin:0;}

#wrapfeature a:link, #wrapfeature  a:visited {color: #fff;}
#wrapfeature  a:hover, #wrapfeature  a:active {color: #F17338;}

/* ------- Feature Section >> Pri ------- */

#feature {position: relative; height:286px; margin:0; padding:0; overflow:hidden;}
#feature .feature {
	background: transparent url(/i/bkgd-feature.png) bottom left no-repeat;
	width: 620px;	/* added to fix messed homepage feature layout in Opera - AG - Apr 14, 2010 */
	height: 286px;	/* added to hide long homepage feature content - AG - Apr 14, 2010 */
}

#feature ul {position: relative; margin:0; padding:0;}
#feature li {margin: 0; padding: 0; display:block; float:left;}
#feature li a.fnav {width: 16px; height: 16px; display: block;}
#feature li a.fnav:link, #feature li a.fnav:visited {background: transparent url(/i/bkgd-fnav-inactive.gif) top left no-repeat;}
#feature li a.fnav:hover {background: transparent url(/i/bkgd-fnav-active.gif) top left no-repeat;}
#feature li a.fnav:active {background: transparent url(/i/bkgd-fnav-inactive.gif) top left no-repeat;}
#feature li.active a.fnav {background: transparent url(/i/bkgd-fnav-active.gif) top left no-repeat !important;}
#feature li a span {display: none;}

#feat1 .fnav {position: absolute; left: 50px; top: 262px; z-index: 10;}
#feat2 .fnav {position: absolute; left: 70px; top: 262px; z-index: 10;}
#feat3 .fnav {position: absolute; left: 90px; top: 262px; z-index: 10;}
#feat4 .fnav {position: absolute; left: 110px; top: 262px; z-index: 10;}
#feat5 .fnav {position: absolute; left: 130px; top: 262px; z-index: 10;}

#feature .active {z-index: 2;}
#feature .feature {display: none;}
#feature .active .feature {display: block;}

#feat1:hover .feature {display:block; z-index: 5;}
#feat2:hover .feature {display:block; z-index: 5;}
#feat3:hover .feature {display:block; z-index: 5;}
#feat4:hover .feature {display:block; z-index: 5;}
#feat5:hover .feature {display:block; z-index: 5;}

#feature .feature {position: absolute; top: 0; left: 0;}
.fimg {float: right; clear: right; margin-top: 1px;}

.ftitle {
	position: absolute;
	width: 414px;
	height: 72px;				/* added - JM - May 18, 2010 */
	right: 0;
	top: 214px;
	background: transparent url(/i/bkgd-feature-trans-blue.png) top left repeat;
}
.ftitle h2 {
	margin: 0;
	padding: 10px 5px 0 5px;
	font-size: 28px;
	color: #fff;				/* added - JM - May 18, 2010 */
}
.ftitle p {margin:0; padding: 0 5px 8px 5px;}
.ftitle p a {font-weight: bold;}

.fcontent {
	margin: 40px 0 0 10px;
	
	/* added to hide long homepage feature content - AG - Apr 14, 2010 */
	height: 210px;
	width: 187px;
	overflow: hidden;
	/* END OF added - AG - Apr 14, 2010 */
}
.fcontent h3 {
	font-size: 20px;
	margin: 0;
	padding: 0;
	line-height: 22px;	/* it was 1em - to fix cut alphabet - AG - Apr 14, 2010 */
	color: #fff;		/* added for unlinked feature title - JM - Apr 14, 2010 */
}
.fcontent p {margin: 8px 0 0 0; padding: 0;}
.fcontent .meta {color: #91B6DF;}

#feature-mask {position: absolute; top:0; left: 206px; z-index: 100;}
#feature-mask {width: 414px; height: 8px; background: transparent url(/i/mask-feature-img.png) top left no-repeat;}

/* ------- Feature Section >> Sec ------- */
#news {background: #4173A3 url(/i/bkgd-spn-news.gif) 0 50px repeat-x; height: 286px;}
#news .subscribe {background: transparent url(/i/bkgd-spn-news-hdr.png) top left no-repeat;}
#news .subscribe {width: 310px; height: 50px; position: relative;}
#news .subscribe a {position: absolute; top: 28px; right: 45px; text-transform: uppercase; font-weight: bold;}

#news p.issue {font-size: 12px; text-transform: uppercase; margin: 6px 10px 0 10px;}
#news h3 {margin: 10px 10px; line-height: 1em;}

#news .links {overflow:hidden;}
#news .links p {line-height: 18px; font-size: 12px;}
#news .links .left {float: left; margin: 0 10px;}
#news .links .center {float: left; margin: 0 10px 0 0;}
#news .links .pdf {float: left; margin-left: 7px;}
#news .links .pdftext {float: left;} /* added to make all links in one row because "Read More" link is changed to "Previous Issues" - JM - Sep 30, 2010 */
#news .links .right {float: right; margin: 0 10px 0 0;}

/* ------- Subpage ------- */
#wrapmeta {border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; margin: 0 10px;}
#wrapmeta .pri {width: 610px; margin-left: 10px; clear: left; float: left;}
#wrapmeta .sec {width: 300px; margin-right: 10px; clear: right; float: right;}

/* ------- WrapMeta Styles ------- */
#wrapmeta .pri p {.margin-top: 13px;} /* added to fix "Print/Web 2.0" bar on IE (too high) - JM - Apr 14, 2010 */
#wrapmeta .pri a {display: block; float: left;}
#wrapmeta .pri div {float: left;} /* added to make Share This and Print This inline - AG - Apr 14, 2010 */
.balloon {width: 37px; height: 18px; margin: 0 10px;}
.balloon {background: transparent url(/i/bkgd-balloon.gif) top left no-repeat;}
.balloon span {margin: 1px 2px 0 7px; text-align: center; display: block;}
.print {
	padding-left: 20px;
	height: 20px;
	text-transform: uppercase;
	margin-left: 0px;			/* added to give some spaces between Share This and Print This - JM - Apr 14, 2010 */
								/* it was 10px, changed to 0 because this icon is moved to the most left because of Google+ icon - JM - Sep 28, 2011 */
	margin-right: 10px;			/* added because this icon is moved to the most left because of Google+ icon - JM - Sep 28, 2011 */
	
	background: transparent url(/i/icon-print.gif) left 1px no-repeat;
	margin-top: 10px;			/* it was 2px, changed because this icon is moved to the most left because of Google+ icon - JM - Sep 28, 2011 */
}
* html #wrapmeta .pri a.print {margin-top: 0px;} /* added to make Share This and Print This inline on IE6 - JM - Apr 14, 2010 */
.print:link, .print:visited {background-position: 0 1px;}
.print:hover, .print:active {background-position: 0 -19px;}
.print.noLeft {margin-left: 0px;} /* added if there is no Share This - JM - Apr 14, 2010 */
.googlePlusIcon {padding-top: 6px;} /* added for Google+ icon - JM - Sep 28, 2011 */

#wrapmeta .sec h4 {margin: 19px 0;} /* it was margin: 10px 0;, changed because of Share This icon changes - JM - Sep 28, 2011 */
#wrapmeta .sec h4 a {color: #333;}

/* ------- Page Nav ------- */
ul.pagenav {font-size: 16px;} /* remove text-transform: uppercase; - PS - Juun 20, 2011 */
ul.browseby ul li {font-size: 14px;} /* remove text-transform: uppercase; - PS - Juun 20, 2011 */
ul.associated {padding-bottom: 20px; border-bottom: solid 1px #CCC;} /* AG - July 22, 2010 - added for secondary nav*/
ul.browseby {border-bottom: 1px solid #ccc; padding-bottom: 20px;}


ul.pagenav a.active {color: #000;}
ul.pagenav a:link, ul.pagenav a:visited {}
ul.pagenav a:hover, ul.pagenav a:active {color: #F90;}

/* ------- Search ------- */
#search {background: #333; padding: 5px; margin-bottom: 20px;} /* AG - change margin-bottom to 20px From 10px;*/
#search  h4, #search  h4 a  {font-family: Calibri, Arial, Sans-serif;font-size: 20px;margin: 0 0 5px 0; color: #fff;}
#search form {margin:0;}
#search .input {
	width: 220px;
	margin-bottom: 5px;
	margin-left: 0px;		/* added to make search text field inline with highlight title - JM - Apr 14, 2010 */
}
#search .button {
	background: #1D436D;
	border: 2px solid #294D74;
	color: #fff;
	
	/* added to make search button inline with search text field - JM - Apr 14, 2010 */
	margin-bottom: 6px;
	.margin-bottom: 5px;
}

/* ------- More Links ------- */
a.more {padding-right: 18px; background: transparent url(/i/bkgd-more-blue.gif) right 60% no-repeat;}
#wrapadmin a.more {padding-right: 18px; background: transparent url(/i/bkgd-more-orange.gif) right 50% no-repeat;}
#wrapfeature a.more, #wrapfooter a.more {padding-right: 18px; background: transparent  url(/i/bkgd-more-white.gif) right 60% no-repeat}

/* ------- Comments ------- */
.comments {border-top: 1px solid #ccc; margin-top: 20px;}
.comments  h4{margin:10px 0 10px 0;}
.comments .odd {background-color: #f2f2f2; padding: 1px 5px;}
.comments p.meta {margin-top: 5px;}

/* ------- Highlights ------- */
#wrapcontent {margin-top:10px;}
#wrapcontent .sec {background-color: #f2f2f2;}
#wrapcontent .highlight, .spotlight, .events {margin: 0 0 20px 0;}
#wrapcontent .sec .highlight {padding: 0 5px;}

/* ------- Member Pri Column (Spotlight) ------- */
.member {overflow: hidden;}

.pri .member .list {float: left; width: 300px;}
.pri .member .list h4 {
	float: right;
	width: 250px;
	font-size: 17px;
	line-height: 1em;
	.line-height: 1.1em;	/* avoid cut "g" alphabet on IE - JM - Apr 14, 2010 */
	margin: 0;
}
.pri .member .list p.meta {float: right; width: 250px; margin: 3px 0 8px 0; font-size: 12px;}
.member .list p.logo {
	float: left;
	display: block;
	width: 40px;
	
	/* added to fix member spotlight logo that isn't top vertical aligned - JM - Apr 14, 2010 */
	margin-top: 3px;
}
.pri .member  .list .article {border-bottom: 1px solid #eee; overflow: hidden; margin: 10px 0 10px 0; clear: both;}

.pri .member  p.more-articles {
	float: left;
	.float: none;	/* added to fix "View more member publications" and "View more eCal" which are more than 1 row on IE, but only 1 row on other browsers - JM - Apr 14, 2010 */
	clear: both;
	margin: 0;
}

/* added because "View more member publications" must directly below the "Think Tank Spotlight" area - JM - Dec 16, 2010 */
.pri .member p.more-spotlight {
	float: left;
	.float: none;
	clear: both;
	margin: 0px 0px 20px 0px;
}
/* END OF added - JM - Dec 16, 2010 */

/* added because Twitter code must directly below the "Think Tank Spotlight" area - JM - Dec 16, 2010 */
.pri .member .list .twitter {
	border-bottom: 0px;
	overflow: hidden;
	margin: 0;
	clear: both;
}
/* END OF added - JM - Dec 16, 2010 */

.pri .member .feature {
	float: right;
	width: 300px;
	clear: right;		/* added because there are more than one Feature Spotlight - JM - Dec 16, 2010 */
	overflow: hidden;	/* added to hide overflow image - JM - Dec 16, 2010 */
}
.pri .member .feature h4 {font-size: 17px; margin:0;}
.pri .member .feature p.meta {margin: 3px 0 8px 0; font-size: 12px;} /* added for feature spotlight's authors/organization - JM - Apr 14, 2010 */
.pri .member .feature p {margin: 10px 0;}

/* ------- Member Sec Column (Events) ------- */
.sec .member {padding: 0 5px;}
.sec .member .article {overflow: hidden; display:block; margin-top: 10px; clear: both;}
.sec .member h4, .sec .member p.meta {width: 250px; float: right; margin:0;}
.sec .member h4 {font-size: 17px; line-height: 1em;}

/* added for Member Events on subpage (use same style with homepage) - JM - Apr 14, 2010 */
.sec .member .list h4, .sec .member .list h4 a 
{
	font-family: Calibri, Arial, Sans-serif;
	font-size: 17px;
	line-height: 1em;
	text-transform: none;
}
/* END OF added - JM - Apr 14, 2010 */

.member p.date {float: left; width: 36px; height: 36px; margin:0;}
.member p.date {color: white; text-transform: uppercase; font-size: 10px;}
.member p.date {background: transparent url(/i/bkgd-date.gif) top left no-repeat; text-align: center;}
.member p.date span {font-size: 19px; display: block; line-height: 1em; font-weight: bold;}
.sec .member .list p.logo {margin: 3px 0 0 0;}

.member .more {font-size: 12px;}
.member a.cal span {padding-right: 35px; background: transparent url(/i/icon-ecal.gif) center right no-repeat;}

/* ------- Connect ------- */
#connect p {line-height: 22px; margin: 5px 0 0 0;}
#connect .content {margin: 5px 0 0 0; overflow: hidden;}
#connect p img {float: left; margin-right: 5px;}

/* ------- Footer ------- */
#wrapfooter {background: #315E8C url(/i/bkgd-footer.gif) top left repeat-y; color: #fff;}
#wrapfooter h3 {margin: 10px 0; font-size: 22px; color: #fff;}
#wrapfooter .sec h3 {margin-left: 10px;}
#wrapfooter p {margin: 0;}

#wrapfooter .content {font-size: 12px;}
#wrapfooter .content p {line-height: 1.5em;}

#wrapfooter .pri .content {width: 290px; float: left; padding-bottom: 20px; margin-left: 10px; margin-top: 5px;}
#wrapfooter .pri #right {width: 305px; float: right;}
#wrapfooter .pri {background: #315E8C url(/i/bkgd-footer-pri.gif) top left repeat-x;}
#wrapfooter .sec {background: #466E98 url(/i/bkgd-footer-sec.gif) top left repeat-x;}
#wrapfooter .sec .content {width: 140px; margin: 0 0 10px 10px; float: left; padding-bottom: 20px;}

#wrapfooter a:link, #wrapfooter  a:visited {color: #fff;}
#wrapfooter  a:hover, #wrapfooter a:active {color: #F17338;}

#wrapcopyright p {margin: 10px 0 20px 0;}
#wrapcopyright p {font-size: 12px;}
#wrapcopyright .sec  img {float: right;}

/* added for image classes (from old site) - JM - Apr 14, 2010 */
.rightimg {
	float: right; 
	padding: 0 0 10px 10px;
}

.leftimg {
	float: left;
	padding: 0 10px 10px 0;
}
/* END OF added - JM - Apr 14, 2010 */

/* added for "Top" link (from old site) - JM - Apr 14, 2010 */
.toplink {
	background: url("/images/buttons/arrow_blue2.gif") no-repeat 0px 6px;
	padding-left: 12px;
	margin-left: 480px;
	color: #12385F;
	text-decoration: none;
	font-weight: bold;
	float: right;
	margin-right: 10px;
}

.toplink:hover {
	color: #3E709F;
}
/* END OF added - JM - Apr 14, 2010 */

/* added for Transparency Spotlight RSS highlight box (from old site) - JM - Apr 14, 2010 */
#innerright {
	background-color: #FFF;
	width: 157px;
	float: right;
	margin-left: 10px;
	padding-top: 5px;
}

#innerright .newsboxright {
	width: 158px;
	border-right: 2px solid #FFF; 
	background-color: #D8D8D8;
	border-top: 5px solid #FFF;
}

#innerright .newsboxright a {
	color: #333;
	text-decoration: none;
}

#innerright .newsboxright a:hover {
	color: #333;
	text-decoration: underline;
}

#innerright .moreitem  {
	background:url("/images/buttons/bullet.gif") no-repeat left 3px;
	padding-left:17px;
	padding-bottom: 5px;
	font-weight:bold;
	float:right;
	position: relative;
}

#innerright .newstitle {
	background: url("/images/backgrounds/newstitle_lightgrey.gif") no-repeat;
	width: 150px;
	text-align: left;
	padding: 10px 4px 5px 4px;
}

#innerright .newsbottom {
	background: url("/images/backgrounds/newsbottom_lightgrey.gif") bottom no-repeat;
	padding-bottom: 21px;
	width: 83px;
	padding-left: 75px;
}

* html #innerright .newsbottom {
	\/*IE 5.x hack*/
	padding: 0px;
	\/*IE 5.x hack*/
	width: 150px;
}

#innerright .newstitle .HLimg {
	padding: 5px 0 5px 0;
}

#innerright .newstitle .HLtitle {
	font-size: 13px;
	font-weight: bold;
	padding: 0px 5px 4px 5px;
}

#innerright .newstitle .HLsubtitle {
	font-size: 11px;
	font-weight: bold;
	font-style: italic;
	padding: 0px 5px 4px 5px;
}

#innerright .newstitle .HLcontent {
	width: 140px;
	margin-left: 5px;
}

#innerright .rssimage {
	text-align: left;
	padding: 5px 0px 3px 6px;
}

#innerright .newsboxright p.more-articles {float: left;	.float: none; clear: both; margin: 0; margin-bottom: 15px;}
#innerright .newsboxright p.more-articles a.more {color: #12385F; padding-right: 18px; background: transparent url(/i/bkgd-more-blue.gif) right 60% no-repeat;}
/* END OF added - JM - Apr 14, 2010 */

/* added for other classes from old site that are still needed - JM - Apr 14, 2010 */
.orglink {
	font-weight: bold;
}

.normalTextBold {
	font-weight: bold;
}

.thumbTitleText {
	font-size: 14px;
	font-weight: bold;
}

.requiredText {
	color: #FF0000;
}

.theabstract {
	margin-top: 5px;
}

.BBcaption {
	background-color: #19416E;
	color: #FFFFFF;	
	font-weight: bold;
	padding-top: 3px;
	padding-bottom: 4px;
}

.BBcheckbox {
	width: 18px;
	height: 20px;
}

.BBradio {
	width: 18px;
	height: 20px;
}

.blogrollitem {
	padding-top: 5px;	
	padding-bottom: 0px;
}

.rssLine {	
	border-top: 1px solid #DDDDDD;
	border-bottom: 0px;
	margin-top: 5px;
}

.rssIcon {
	padding: 3px 0px 3px 0px;
}
/* END OF added - JM - Apr 14, 2010 */

/* added for message box - JM - Apr 14, 2010 */
.info, .success, .warning, .error, .validation {
    border: 1px solid;
    margin: 10px 0px;
    padding: 15px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
}

.info {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url(../images/info.gif);
}

.success {
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image:url(../images/success.gif);
}

.warning {
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url(../images/warning.gif);
}

.error {
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url(../images/error.gif);
}

.error ul {
	margin-top: 0;
	margin-bottom: 0;
}

.validation {
    color: #D63301;
    background-color: #FFCCBA;
    background-image: url(../images/validation.gif) ;
}

.validation a {
	color: #D63301;
}
/* END OF added - JM - Apr 14, 2010 */

/* added for buttons - JM - Apr 26, 2011 */
.continuebutton {
	width: 64px;
	height: 22px;
	background: url(../images/button_continue.gif) no-repeat center bottom;
	border: none;
	cursor: pointer;
}

.cancelbutton {
	width: 50px;
	height: 22px;
	background: url(../images/button_cancel.gif) no-repeat center bottom;
	border: none;
	cursor: pointer;
}

.backbutton {
	width: 50px;
	height: 22px;
	background: url(../images/button_back.gif) no-repeat center bottom;
	border: none;
	cursor: pointer;
}
/* END OF added for buttons - JM - Apr 26, 2011 */



/*
	FLYOUT CSS
*/

#upprev_box {
    /* === upPrev Container === */
    text-align: left;
    background-color: #fff;
    bottom:0px; /* distance from window bottom edge */

    position:fixed;
    z-index:10000000;    
    width: 360px;
    padding: 10px 20px 10px 10px;
    border-top: 2px solid #000;
    border-left: 1px solid #f0f0f0;
    -moz-box-shadow: 0 4px 10px #666;
    -webkit-box-shadow: 0 4px 10px #666;
    box-shadow: 0 4px 10px #666;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Color=#cccccc, direction=270, strength=7)";
    filter: progid:DXImageTransform.Microsoft.Shadow(Color=#cccccc, direction=270, strength=7);
    _position: absolute;
    _top: 0;
}

#upprev_box h3 {
	font-size: 12px;
}

#upprev_box h6 {
    /* === "MORE IN" === */
    text-transform: uppercase;
    font-size: 10px;
    font-weight: bold;
    font-family: arial,helvetica,sans-serif;
    color: inherit;
    
    margin:0 0 5px 0;
    padding:0;   
}

#upprev_box h6 a {
    /* === Category Link === */
}
#upprev_box h6 a:hover {
    /* === Category Link: mouse over === */
}
#upprev_box h6 a:visited {
    /* Category Link: visited */
}

#upprev_box h6 .num {
    /* === "(1 of 5 ARTICLES)" === */
    font-size: inherit;
    font-weight:normal;
    font-family: inherit;
    color:#888;
}

#upprev_box .upprev_excerpt {
    /* === Container for Title, Thumbnail and Excerpt === */
    text-align:justify;
}

#upprev_box .upprev_excerpt p {
    /* === Excerpt === */
    overflow:hidden;
    margin:0
}

#upprev_box .upprev_excerpt p a {
    /* === Previous Post Link === */
}

#upprev_box .upprev_excerpt p a:hover {
    /* === Previous Post Link: mouse over === */
}

#upprev_box .upprev_excerpt p a:visited {
    /* === Previous Post Link: visited === */
}

#upprev_box .upprev_thumb {
    /* === Thumbnail Image === */
    float:left;
    margin:5px 20px 0 0;
    border: 0;
}

#upprev_box button {
    /* === Close Button === */
    border: none;
    padding: 0;
    position: absolute;
    top: 5px;
    right: 5px;
    width: 13px;
    height: 13px;
    background: #fff url('/i/close_window.gif') no-repeat 0 0;
    text-indent: -999em;
    overflow: hidden;
    cursor: pointer;
}