@charset "utf-8";
/*
NOTES:
-4782C6 - blue background of header
-39689E - dark blue of links, top of join oacs box on advantages page
-DFE8F4 - light blue background of right column
-A2B5CD - blue page wrapper border
-086CA2 - blue top and right border of main nav
-CCCCCC - gray used in navMain
-EBEBEB - gray background of footer
-F5F5F5 - gray button background
-CCC    - gray background of "built by logic one web"
-cc3333 - red of splash
-
*/

/*BEGIN - GENERAL STYLES ------------------------------------------------------------*/
html {background:repeat-x #DCDCDC url(/images/backgroundGradient.gif);}

body {
	margin:0 auto 5px auto;
	padding:0;
	/*removes the border around the viewport in old versions of ie*/
	border:0;
	/*Lucida Grande is for mac osx & Lucida is for UNIX*/
	font-family:"Lucida Grande", Lucida, Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;
	/*16*1.125=18*/
	line-height:1.125em;
	/*min width of layout, does not work in ie6 and older*/
	min-width:975px;
	/*max width of layout, does not work in ie6 and older*/
	max-width:1080px;}

a:link {color:#39689E; text-decoration:underline;}
a:visited {color:#39689E; text-decoration:underline;}
a:hover {color:#FFF; text-decoration:none; background-color:#39689E;}
a:active {color:#FFF; text-decoration:underline; background-color:#39689E;}
/*added modal class to keep link form staying lit up in IE6 and IE7*/
a.modal:active {color:#39689E; text-decoration:underline; background-color:#FFF; }

h1 {font-size:1.4em; font-weight:normal; margin:.4em 0 .2em 0; padding:0;}
h2 {font-size:1.2em; line-height:1.1em; font-weight:normal; margin:.8em 0 .2em 0; padding:0;}
h3 {font-size:1.2em; font-weight:normal; margin:.8em 0 .2em 0; padding:0;}

p {margin:.4em 0 .8em 0; padding:0;	font-size:.8em;}

img {margin:0; padding:0; border:0;}

address {font-style:normal;}

hr {color:#39689E;}
/*END - GENERAL STYLES --------------------------------------------------------------*/





/*BEGIN - GENERIC CLASSES -----------------------------------------------------------*/
.displayInline {display:inline;}
br.clear, div.clear, .clear {clear:both;}
.floatLeft {float:left;}
.floatRight {float:right;}
.italicBoldFont {font-style:italic; font-weight:bold;}
/*no hover over images*/
a.noHover:hover {background:none; border:none;}
.fontSizePoint8em {font-size:.8em;}
.fontSize1em {font-size:1em;}
.textAlignRight {text-align:right;}
.colorRed {color:#FF0000;}
/*END - GENERIC CLASSES -------------------------------------------------------------*/





/*BEGIN - IMAGE CLASSES & IDS -------------------------------------------------------*/
/*paypal logo on online-application page*/
#paypalImage {float:right; margin:0; padding:0;}

/*add this, can't change this class because i think "add this" site might rely on the class name staying as is.*/
.addthis_button {float:right; padding:20px 0 0 0;}

/*ocrm logo on home page*/
#ocrmImage {float:right; padding:15px 0 0 25px;}

/*stock photo of people on about us page*/
#peopleImage {float:right; padding:5px 0 0 10px;}
/*END - IMAGE CLASSES & IDS ---------------------------------------------------------*/





/*BEGIN - LISTS ---------------------------------------------------------------------*/
/*print icon css*/
ul.iconPrint {list-style:none; margin:0; padding:7px 2% 0 0; font-size:.8em; position:relative; float:right;}
ul.iconPrint li {padding:0 0 0 25px; margin:.2em 0;}
li.printer {background: url(/images/printer.png) left top no-repeat;} 
/*need print link to be white instead of blue*/
ul.iconPrint a:link {color:#FFF; text-decoration:underline; font-weight:bold;}
ul.iconPrint a:visited {color:#FFF; text-decoration:underline; font-weight:bold;}

/*ul*/
/*need position:relative on all the ul's because of an IE6 bug having to do with floats that makes the images not show*/
ul.userAdd1 {list-style:none; margin:0; padding:0 10px 0 10px; font-size:.8em; position:relative;}
ul.userAdd2, ul.help, ul.file {list-style:none; margin:0; padding:0; font-size:.8em; position:relative;}
ul.checkmark1 {list-style:none; margin:0; padding:0 0 0 25px; font-size:.8em; position:relative;}
ul.checkmark2 {list-style:none; margin:0; padding:10px 0 0 0; font-size:.8em; position:relative;}
ul.arrowRight {list-style:none; margin:0; padding:0; font-size:1.1em; position:relative;}
ul.bulletBlack {list-style:none; margin:0; padding:0 15px 0 0px; font-size:1em; position:relative;}

/*li*/
ul.userAdd1 li, ul.userAdd2 li, ul.checkmark1 li, ul.bulletBlack li, ul.file li, ul.checkmark2 li {padding:0px 0 0px 25px;}
/*added margin to create more space. added 1px padding to get underline of links to show up.*/
ul.arrowRight li {padding:1px 0 1px 25px; margin:1em 0;}
ul.help li {padding:1px 0 1px 25px; margin:1em 0;}

/*li images*/
ul.userAdd1 li, ul.userAdd2 li {background: url(/images/user_add.gif) left top no-repeat;}
ul.userAdd2 li.noBullet {list-style:none; background:none;}
ul.checkmark1 li, ul.checkmark2 li {background: url(/images/tick.png) left top no-repeat;}
ul.bulletBlack li {background: url(/images/bullet_black.png) left top no-repeat;}
ul.help li {background: url(/images/help.png) left top no-repeat;}
ul.arrowRight li {background: url(/images/arrow_right.gif) left top no-repeat;}
ul.file li.webFile {background: url(/images/page.png) left top no-repeat;}
ul.file li.wordFile {background: url(/images/page_white_word.png) left top no-repeat;}
ul.file li.pdfFile {background: url(/images/page_white_acrobat.png) left top no-repeat;}
ul.file li.xlsFile {background: url(/images/page_white_excel.png) left top no-repeat;}
/*END - LISTS -----------------------------------------------------------------------*/





/*BEGIN - CUSTOM CLASSES & IDS ------------------------------------------------------*/
#loadDiv {display:none;}
/*iePageWrapper & pageWrapper are needed to center website in ie6*/
#iePageWrapper {text-align:center;}
#pageWrapper {border:2px solid #A2B5CD; clear:both; width:98%; margin:0 auto; text-align:center;}

/*column 1 padding to allow right column content to be moved up and red splash image into col1 div*/
#columnLeftPadding {padding-left:3%;}

.headlineText {font-size:1.1em; font-weight:bold;}
/*cfuniform wrap div*/
.formDivWrap {width:90%; margin:10px auto; font-size:.8em;}
/*form messages*/
.formSubmitMessage {background:#C8FFBF; border:1px solid #A2EF95; border-width:1px 0; margin:20px auto; padding:7px; width:80%;}
.formSubmitMessage p {margin:0; padding-left:20px; background:#C8FFBF url(/cfuniform/commonassets/images/uni-form/icon-success.gif) no-repeat;} 
.formSubmitMessageError {
	background:#FFDFDF url(/cfuniform/commonassets/images/uni-form/uf_error.png) !important;
	border:1px solid #DF7D7D;
	border-width:1px 0;
	margin:20px auto;
	padding:7px;
	width:80%;}
.formSubmitMessageError p {margin:0; padding-left:20px;	background:url(/cfuniform/commonassets/images/uni-form/icon-error.png) no-repeat;}
.formSubmitMessageNeutral {
	background:#FFFCDF url(/cfuniform/commonassets/images/uni-form/uf_focused.png) !important;
	border:1px solid #000;
	border-width:1px 0;
	margin:20px auto;
	padding:7px;
	width:80%;}
.formSubmitMessageNeutral p {margin:0; padding-left:4px;}

/*drop cap classes*/
/*line-height for ie and padding for ff are used to adjust the space above the Drop Cap*/
.dropCapDivW p:first-child:first-letter{float:left;font-size:2.8em;margin-right:4px; font-family:Georgia,"Times New Roman",Times,sans-serif; font-weight:bold; line-height:.9em; padding-top:3px;}
.dropCapDivW p:first-child:first-line{font-variant:small-caps;}

/*rss*/
/*rss table displayed in right column for all pages*/
.rssTable {width:100%; font-size:.7em; margin-bottom:1em;}
.rssTable td {padding:4px 5px 0 0; vertical-align:top; line-height:1.2em; text-align:left;}
/*rss style for stories on individual pages*/
#rssStoryTitle {font-size:1.1em;}
#rssStoryDate, span#rssStoryDescription {font-size:.8em;}
#rssStoryDescription p {font-size:1em;}

/*search-results.cfm style*/
/*search results row css*/
div.searchResultRow {clear:both;}
div.searchResultRow div.rowPercentage {float:left;}
div.searchResultRow div.rowSearchLink {float:left; width:85%;}
/*to clear search result page legend and move message down on page*/
#searchResultMsgDiv {clear:both; margin-top:75px;}

/*apply these classes to items that should only be displayed for print*/
.forPrintInline, .forPrintBlock {display:none;}

/*"or" text of "join oacs" box on membership advantages page*/
#orText {text-align:center; font-size:1.1em; font-weight:bold;}

/*modal windows*/
.modalWindow {background:#ECECEC; width:700px; padding:30px 10px;}

/*add this*/
#addthis {float:right; padding:10px 10px 0 0; font-size:.7em;}
div#addthis a:link {color:#39689E; text-decoration:underline;}
div#addthis a:visited {color:#39689E; text-decoration:underline;}
div#addthis a:hover {color:#39689E; text-decoration:underline; background:none;}
div#addthis a:active {color:#39689E; text-decoration:underline; background:none;}

/*END - CUSTOM CLASSES & IDS --------------------------------------------------------*/





/*BEGIN - ABOVE PAGE (PRINT & SEARCH) -----------------------------------------------*/
#abovePage {width:98%; margin:0 auto;}

/*google search form*/
#cse-search-box {float:right; padding:5px 20px 5px 0;}
/*END - ABOVE PAGE (PRINTER & SEARCH) -----------------------------------------------*/





/*BEGIN - HEADER --------------------------------------------------------------------*/
#header {clear:both; float:left; width:100%; height:220px; border-top:5px solid #39689E; background:repeat-x url(/images/bannerTile.jpg);}
#headerWrapper {width:100%; height:203px; background: no-repeat url(/images/bannerImageLeft.jpg);}

/*splash left*/
#splashDiv {
	float:left;
	width:100%;
	height:17px;
	margin:0;
	padding:0;
	border:0;
	text-align:left;
	background:repeat-x url(/images/redTileWhite.png) #FFF;}
/*splash right*/
#splashRightColumnDiv {
	float:right;
	height:17px;
	width:25%;
	background:repeat-x url(/images/redTileBlue.png) #DFE8F4;
	/*needed this for ie6 to get rid of line*/
	font-size:1px;}
	
/*main navigation, height is 33px = 30 is height of menu and 3 is height of border*/
#navMain {padding:0; margin:170px 0 0 0; list-style:none; height:30px; position:relative; z-index:500; font-family:arial, verdana, sans-serif;  float:left; clear:left;  background:#086CA2; border-top:#086CA2 3px solid; border-right:#086CA2 2px solid;}
#navMain li {float:left; margin-right:1px;}
#navMain li a {display:block; float:left; height:30px; line-height:30px; background:#DFE8F4; color:#000; text-decoration:none; font-size:13px; font-weight:bold; padding:0 22px 0 12px;}
#navMain table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}
/* Default link styling */
/* Style the list OR link hover. Depends on which browser is used */
#navMain li a:hover {z-index:200; position:relative; color:#000; background-color:#CCCCCC;}
#navMain li:hover {position:relative; z-index:200;}

#navMain li:hover > a {color:#000; background:#CCCCCC;}
#navMain li:hover > a.sub {color:#000; background-color:#CCCCCC;}

#navMain li.current a {color:#FFF; background:#086CA2;}

#navMain li a.sub {background: #DFE8F4 url(/images/downArrowBlack.gif) no-repeat right center;}
#navMain li.current a.sub {color:#FFF; background:#086CA2 url(/images/downArrowWhite.gif) no-repeat right center;}

#navMain :hover ul {left:0; top:30px; width:200px; background:#DFE8F4;}

/* keep the 'next' level invisible by placing it off screen. */
#navMain ul, 
#navMain :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#navMain :hover ul :hover ul
{left:200px; top:-1px; background:#DFE8F4; white-space:nowrap; width:100px; z-index:200; height:auto;}

#navMain :hover ul li {margin:0; border-top:1px solid #39689E;}
#navMain :hover ul li a {width:200px; padding:0; text-indent:10px; background:#DFE8F4; color:#000; height:30px; line-height:30px;}
#navMain :hover ul li a.fly {background:#DFE8F4 url(/images/rightArrowBlack.png) no-repeat right center;}

#navMain :hover ul :hover {background-color:#CCCCCC; color:#000;}
#navMain :hover ul :hover a.fly {background-color:#CCCCCC; color:#000;}

#navMain :hover ul li.currentsub a {background:#086CA2; color:#FFF;}
#navMain :hover ul li.currentsub a.fly {background:#086CA2 url(/images/rightArrowWhite.png) no-repeat right center; color:#FFF;}

#navMain :hover ul :hover ul li a {width:100px; padding:0; text-indent:10px; background:#DFE8F4; color:#000;}
#navMain :hover ul :hover ul :hover {background-color:#CCCCCC; color:#000;}

#navMain :hover ul :hover ul li.currentfly a,
#navMain :hover ul :hover ul li.currentfly a:hover {background:#086CA2; color:#FFF;}
/*END - HEADER ----------------------------------------------------------------------*/





/*BEGIN - BODY ----------------------------------------------------------------------*/
/* column container */
.colmask {
	/*fixes the IE7 overflow hidden bug*/
	position:relative; 
	clear:both; 
	float:left;
	/*width of whole page*/
	width:100%;
	/*chops off any overhanging divs*/
	overflow:hidden;}
/*common column settings*/
.colright, .colmid, .colleft, .colleftSearch {float:left; width:100%; position:relative;}
.col1, .col1BottomLeftLogo, .col1Search, .col2 {
	float:left;
	position:relative;
	padding:0 0 1em 0;
	overflow:hidden;
	/*added by me, need content to shift left since all content was centered in ie wrapper div*/
	text-align:left;
	/*added to allow the whole background logo to display on short content pages*/
	min-height:400px;}
/*2 Column (right menu) settings*/
.rightmenu {
	/*right column background color*/
	background:#DFE8F4;}
.rightmenu .colleft {
	/*right column width*/
	right:25%;
	/*left column background color*/
	background:#FFF;
	border-right:#39689E thin dashed;}
.rightmenu .colleftSearch {
	/*right column width*/
	right:0%;
	/*left column background color*/
	background:#FFF;
	border-right:#39689E thin dashed;}
.rightmenu .col1, .rightmenu .col1BottomLeftLogo {
	/*was 71*/ /*left column content width (left column width minus left and right padding)*/
	width:73%;
	/*was 27*/ /*(right column width) plus (left column left padding)*/
	left:25%;}
.rightmenu .col1Search {
	/*was 71*/ /*left column content width (left column width minus left and right padding)*/
	width:97%;
	/*was 27*/ /*(right column width) plus (left column left padding)*/
	left:0%;}
/*watermark logo displayed in main content area*/
.rightmenu .col1BottomLeftLogo {background:url(/images/transparentLogo.gif) bottom left no-repeat #FFF;}
.rightmenu .col2 {
	/*right column content width (right column width minus left and right padding)*/
	width:21%;
	/*was 31*/ /*(right column width) plus (left column left and right padding) plus (right column left padding)*/
	left:29%;}
/*END - BODY ------------------------------------------------------------------------*/





/*BEGIN - FOOTER -----------------------------------------------------------------*/
#footer {clear:both; float:left; width:100%; border-top:1px solid #355C66; padding:0; margin:0; background:#EBEBEB;}
#footer p {padding:5px; font-size:.6em; margin:0; text-align:center;}
span#logicOneBuiltBy {float:left; border-right:1px solid #355C66; margin:0; padding:0; background:#CCC;}
div#navAndCopyright {text-align:center; margin:0 auto; padding:10px 0;}

/*navFooter*/
div#navFooter {overflow:hidden; position:relative; padding:0; font-size:.7em;}
div#navFooter ul {
   clear:left;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   left:50%;
   text-align:center;}
div#navFooter ul li {
   display:block;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   right:50%;
   border-right:#000 1px solid;}
div#navFooter ul li#lastFooterLink {border-right:none;}
div#navFooter ul li a {display:block; margin:0 0 0 1px; padding:1px 10px; color:#000; text-decoration:none; line-height:1.3em;}
div#navFooter ul li a:hover {color:#000; background:none; text-decoration:underline;}
div#navFooter ul li a.currentFooter, div#navFooter ul li a.currentFooter:hover {font-weight:normal; text-decoration:underline; color:#000;}

/*logic one web link style*/
a#logic:link {color:#024A68; text-decoration:underline;}
a#logic:visited {color:#024A68; text-decoration:underline;}
a#logic:hover {background:#A62000; color:#FFF; text-decoration:none;}
a#logic:active {background:#A62000; color:#FFF; text-decoration:none;}
/*END - FOOTER -------------------------------------------------------------------*/





/*BEGIN - MISCELLANEOUS ADDONS ---------------------------------------------------*/
/*"join oacs" box on membership advantages page in top right corner*/
dl.curved {background:#39689E url(/images/c_tl.gif) top left no-repeat; margin:0 0 5px 15px; padding:0; width:33%; float:right; clear:none;}
dl.curved dt {background:transparent url(/images/c_tr.gif) top right no-repeat; padding:10px; text-align:center; color:#fff; font-weight:bold;}
dl.curved dd {background:#eee url(/images/c_bl.gif) bottom left no-repeat; padding:0; margin:0;}
dl.curved dd p {margin:0; padding:10px; line-height:1.3em;}
dl.curved dd p.last {background:transparent url(/images/c_br.gif) bottom right no-repeat; }

/*------------------------------------------------------*/

/*button used for search form*/
/*cssbutton.net css*/
div.cssbutton {border:0; float:left; text-align:center; padding:0; margin:0; cursor:pointer;}
div.cssbutton input {border:0; font:bold 12px/23px Verdana; color:#666; display:block; cursor:pointer; float:left; white-space:nowrap; height:23px; margin-left:1px; padding:0 10px 0 9px; width:auto; overflow:visible;} /* padding-left = (padding-right - margin-left) NOTE: Firefox renders this different */
/*BO - i added width and overflow to get rid of extra padding on ie buttons*/
/*sample.css file*/
button.cssbutton.sample span,a.cssbutton.sample span,div.cssbutton.sample input {
color:#000;
}
/* 	Name: 	sample a 
	Desc:	Blue Button	*/
button.cssbutton.sample.a span,a.cssbutton.sample.a span,div.cssbutton.sample.a input {
background:url("/images/sample_aRight.gif") no-repeat right 0;
}
button.cssbutton.sample.a,a.cssbutton.sample.a,div.cssbutton.sample.a {
background:url("/images/sample_aLeft.gif") no-repeat 0 center;
}
button.cssbutton.sample.a:hover span,a.cssbutton.sample.a:hover span,div.cssbutton.sample.a:hover input {
color:#000;
background:url("/images/sample_aRight.gif") no-repeat right 100%;
}
button.cssbutton.sample.a:hover,a.cssbutton.sample.a:hover,div.cssbutton.sample.a:hover {
background:url("/images/sample_aLeft.gif") no-repeat -255px center;
}

/*------------------------------------------------------*/

/*rounded corner boxes used on contact oacs page*/
/*height of left box is 186, height of both right boxes is 88 and there is 10 px between them*/
.curvy1, .curvy2, .curvy3 {position:relative; width:100%; background:#DFE8F4; color:#000;}
.curvy1 { margin:1em auto; height:186px; float:left; width:56%;}
.curvy2 { margin:1em auto 5px auto; height:88px; float:right; width:42%;}
.curvy3 { margin:5px auto 1em auto; height:88px; float:right; clear:right; width:42%;}
#ctl, #cbl, #ctr, #cbr {position:absolute; width:20px; height:20px; color:#DFE8F4; background:#FFF; overflow:hidden; font-style:normal; z-index:1;}
#ctl {top:0; left:0;}
#cbl {bottom:0; left:0;}
#ctr {top:0; right:0;}
#cbr {bottom:0; right:0;}
.curvy1 em b, .curvy2 em b, .curvy3 em b {position:absolute; font-size:150px; font-family:arial; color:#DFE8F4; line-height:40px; font-weight:normal;}
#ctl b {left:-8px;}
#ctr b {left:-25px;}
#cbl b {left:-8px; top:-17px;}
#cbr b {left:-25px; top:-17px;}
.curvy1 p, .curvy2 p, .curvy3 p {position:relative; z-index:100; font-size:.8em; font-weight:bold;}
.curvy1 p {padding:25px 15px;}
.curvy2 p {padding:25px 15px 10px 15px;}
.curvy3 p {padding:25px 15px 10px 15px;}
.curvy1 img, .curvy2 img, .curvy3 img {float:left; border:4px #FFF solid; padding:0;}
.curvy1 img {margin:26px 7px 27px 20px;}
.curvy2 img {margin:15px 7px 15px 20px;}
.curvy3 img {margin:15px 7px 15px 20px;}

/*------------------------------------------------------*/

/*buttons - "become a member" & "join email list"*/
a.iconButton{
	display:block;	
	/* float:left */ /* Uncomment to allow buttons on the same line */
	background-position: 6px;
	background-repeat:no-repeat;
	font-weight:bold;
	font-family:"Lucida Grande", Lucida, Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;	
	text-decoration:none;
	text-indent:30px;
	color:#565656;
	background-color:#F5F5F5;
	border:#39689E solid 1px;
	height:30px;
	width:90%;
	line-height:30px;
	margin:10px auto;
	overflow:hidden;}
a.iconButton:hover{background-color:#39689E; color:#FFF;}
/*had to use some crazy logic with ids here to get this to work in IE6. the first button on each page was showing up with an underline for some reason. it was picking up the main default link style of link, visited, hover, and active above. the id fixed it.*/
a#becomeMemberButton {background-image:url(/images/user_add.png); text-decoration:none; color:#565656;}
a#becomeMemberButton:hover {color:#FFF;}
a#emailListButton {background-image:url(/images/email.gif); text-decoration:none; color:#565656;}
a#emailListButton:hover {color:#FFF;}
a#onlineButton, a#downloadButton {background-image:url(/images/arrow_right.gif); text-decoration:none; color:#565656;}
a#onlineButton:hover, a#downloadButton:hover {color:#FFF;}
a#payDuesButton {background-image:url(/images/user.png); text-decoration:none; color:#565656;}
a#payDuesButton:hover {color:#FFF;}


/*END - MISCELLANEOUS ADDONS -----------------------------------------------------*/