/* BEGIN CSS 2 column layout */
html,body {
	color:#000 /*#000080*/; 
	background-color:white;/*#194B80; */
	margin:0px; 
	padding:0px;
	font: 10px verdana, arial, helvetica, sans-serif;
    /*font-size:.95em;*/
	font-size:95%;
	}

em {
   font-weight: bold;
   font-style:normal;
   }

td,tr {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size:.9em;
   line-height: 1.2em;
}

p {
   padding:3px;
   margin-top: 0.2em; 
   margin-bottom: 0.6em; 
   }

form {margin: 0px; padding: 0px;}

input, select, textarea {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 0.9em;
}

h1 {
	margin:0px 0px 15px 0px; /*top right bottom left*/
	padding:0px;
	font-size:1.8em; 
	font-weight:900;
    text-align:center;
	}
h2 {
    /*font:bold 12px/14px verdana, arial, helvetica, sans-serif;*/
    font:bold 1.6em verdana, arial, helvetica, sans-serif;
    margin:0px 0px 5px 0px;
    padding:0px;
    text-align:center;	
	}
	
h3 {
   font:bold 1.4em verdana, arial, helvetica, sans-serif;
   margin:0px 0px 5px 0px;
   padding:0px;
   text-align:center;
        }
h4 {
   font:bold 1.2em verdana, arial, helvetica, sans-serif;
   margin:0px 0px 5px 0px;
   padding:0px;
   text-align:center;
        }
h5 {
   font:bold 1.0em verdana, arial, helvetica, sans-serif;
   margin:0px 0px 5px 0px;
   padding:0px;
   text-align:center;
        }
		
/* head1 - head5 are used to simulate the h1 - h5 html tags */
div.head1 {
	margin:0px 0px 15px 0px;
	padding:0px;
	font-size:1.8em; 
	font-weight:900;
    text-align:center;
	}
div.head2 {
    /*font:bold 12px/14px verdana, arial, helvetica, sans-serif;*/
    font:bold 1.6em verdana, arial, helvetica, sans-serif;
    margin:0px 0px 5px 0px;
    padding:0px;
    text-align:center;	
	}
	
div.head3 {
   font:bold 1.4em verdana, arial, helvetica, sans-serif;
   margin:0px 0px 2px 0px;
   padding-bottom:5px;
   text-align:center;
        }
div.head3 li {
   list-style-type:none;
   list-style-position:outside;
   font-size:.95em;
   line-height:1.4em;
   }

div.head4 {
   font:bold 1.2em verdana, arial, helvetica, sans-serif;
   margin:0px 0px 5px 0px;
   padding:0px;
   text-align:center;
        }
div.head5 {
   font:bold 1.0em verdana, arial, helvetica, sans-serif;
   margin:0px 0px 5px 0px;
   padding:0px;
   text-align:center;
        }
		
a {
	color:#000080; 
	font-size:1.0em;
	font-family:verdana, arial, helvetica, sans-serif;
/*	font-weight:600;*/
	text-decoration:underline;
	}

a:link {
        color:#000080;
        text-decoration:underline;
        }
/*
a:visited {color: #8B008B; 
   background-color: transparent;
   text-decoration: underline;
}
*/
a:hover {
        color:#000080;
        text-decoration:underline;
        }

/* This is for handicapped accessibility. It displays the items
   off the screen area when the class is referenced. */
.HideKeys { /*Used for handicapped support*/
    position: absolute; 
	left: -1000em; /*position it off the screen*/
	width: 20em;
}

#pageContainer {
   background: url(/images/bg_ri_blue.jpg) left repeat-y;
   }
   
ul.noNumList li  {
   list-style-type:none;
   list-style-position:outside;
   font-size:1.0em;
   line-height:1.4em;
   }
.clear {
   clear:both;
   }
      
/* All the content boxes belong to the content class which is the 
   main body of text is displayed. */
.content {
	/*position:relative; /* Position is declared "relative" to gain control of stacking order (z-index). */
	/*float:right;*/
    font-size: 1.0em;
    color:#000 /*#000080*/;
    line-height: 1.2em;
	width:auto;
	min-height:320px;
	margin:0px 5px 50px 150px; /*top right bottom left*/
	/*border:1px solid black;*/
	background-color:transparent;
	padding:5px;
	/*z-index:2; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
	}

.content p {
   text-align:left;
   font-size:.9em;
}
.content p a {
   font-weight:normal;
   font-size:1.0em;
}
.content a {
   color:#000080; /*#09c; */
   font-family:verdana, arial, helvetica, sans-serif;
   font-weight:normal;
   list-style-type: none;
   text-decoration:underline;
   }

.content em {
   font-weight: bold;
   font-style:normal;
   }

  
.content ol, .content ol li {
   color: #000; /*#09c;*/
   font-size: 1em;
   list-style-type:decimal;
   text-decoration:none;
   background-color: transparent;
   }

.content a:link, .content ol li a:link {
   color:#000080; /*#09c;*/
   text-decoration: underline;
}
.content a:visited {
   color: #8B008B;
   background-color: transparent;
   text-decoration: underline;
   }
.content ol li a:visited {
   color: #000080;
   background-color: transparent;
   text-decoration: underline;
   }
.content a:hover, .content ol li a:hover {
   color: #09c;
   text-decoration:underline;
}

#leftcolumn {
   position:absolute;
   /*float:left;*/
   left:0px;
   color: #fff;
   font: bold verdana,arial, sans-serif;
   font-size:12px; /*hard coded font to keep the left menu from changing size*/
   width:140px;
   /*z-index:2;*/
/* Here is the ugly brilliant hack that protects IE5/Win from its own stupidity. 
Thanks to Tantek Celik for the hack and to Eric Costello for publicizing it. 
IE5/Win incorrectly parses the "\"}"" value, prematurely closing the style 
declaration. The incorrect IE5/Win value is above, while the correct value is 
below. See http://glish.com/css/hacks.asp for details. */
   voice-family: "\"}\"";
   voice-family:inherit;
}

#navLeft {
   /*position:absolute;*/
   /*float:left;*/
/*   width:140px;*/
   /*background-color:transparent;*/
   font: bold verdana,arial, sans-serif;
   font-size:12px; /*hard coded font to keep the left menu from changing size*/
   background: url(/images/bg_ri_blue.jpg) left repeat-y 100%;
   padding:10px 0px 0px 0px;
   /*z-index:2;*/

/* Here is the ugly brilliant hack that protects IE5/Win from its own stupidity. 
Thanks to Tantek Celik for the hack and to Eric Costello for publicizing it. 
IE5/Win incorrectly parses the "\"}"" value, prematurely closing the style 
declaration. The incorrect IE5/Win value is above, while the correct value is 
below. See http://glish.com/css/hacks.asp for details. */
/*   voice-family: "\"}\"";
   voice-family:inherit;*/
}

#menuLeft a, #menuLeft ul li a {
   color: #fff;
   display: block;
   font: bold verdana,arial, sans-serif;
   text-align: left;
   padding: 5px 0px 8px 15px;  /*top right bottom left*/
   margin: 0px 0px 0.3em 5px;  /*top right bottom left*/
   text-decoration: none;
   line-height:15px;
}

#menuLeft {  /*hard coded font to keep the left menu from changing size*/
   font-size:12px;
}
#menuLeft a:hover {
   color: #99D9E8;
   /*background: url(/images/arrow2.gif)  left no-repeat;*/
   text-decoration: none;
}

#menuLeft a.navSelected,#menuLeft a.navSelected:hover {
   color: #194B80;
   background: url(/images/arrow_active.gif) top left no-repeat;
}

#menuLeft li,#menuLeft ul {
   list-style-type: none;
   font: bold verdana,arial, sans-serif;
   margin: 0px;
   padding: 0px;
}
/* This is used in the footer to box off and highlight the 
   report abuse text. */
#rptabuse {
/*    float:right;
	width:200px;
	left:560px;  */
	background-color:white; /*#F5F5F5; /*whitesmoke*/
    font-size:10px;
	padding:0px;
	/*z-index:2;*/
	}

/* I've heard this called the "be nice to Opera 5" rule. Basically, it feeds correct 
length values to user agents that exhibit the parsing error exploited above yet get 
the CSS box model right and understand the CSS2 parent-child selector. ALWAYS include
a "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
/*body>#navLeft {width:128px;}*/
		
#navRight {
   float:right;
   width:150px;
   left:578px;
   font-size:12px;
   font-family: bold verdana,arial, sans-serif;
   height:auto; /*410px*/
   background-color:#194B80; /*Opera browser fix. It doesn't like background picture images.*/
   background: url(/images/bg_ri_blue.jpg) right repeat-y 100%;
   padding:10px;
   /*z-index:1;*/
/* Again, the ugly brilliant hack. */
   voice-family: "\"}\"";
   voice-family:inherit;
}

#navRight li,#navRight ul {
   list-style-type: none;
   font: bold verdana,arial, sans-serif;
   margin 0px;
   padding: 0px;
   text-decoration:underline;
}
#navRight ul.neutered, #navRight ul.neutered li {
  list-style-type: none;
  font: bold verdana,arial, sans-serif;
  padding: 0px;
  margin: 0.2em 10px .75em 10px;
  line-height: 1.0em;
  text-decoration:underline;  
}
#navRight h1 {
   margin: 0px;
   padding: 3px;
   font-size: 1.2em;
   font-weight: bold;
   text-decoration: none;
}
#navRight a:link {
   color: #FFF;
   display: block;
   font-family: bold verdana,arial, sans-serif;
   background-color: transparent;
   text-decoration:underline;
}

#navRight a:hover {
   color: #99D9E8;
   background-color: transparent;
   text-decoration: underline;
}

/* This is the DCYF page header */
#top1 {
   margin: 0px 0px 0px 0px;
   padding: 0px;
   background: #007 url(/images/logo_800.jpg) center no-repeat 100%;
   height: 75px;
   /*z-index:0;*/
}
/* This is the DCYF page header */
#top {
   margin: 0px 0px 0px 0px; /*top right bottom left*/
   padding: 0px;
   background-color: #010066; /*Opera Browser fix. It doesn't like background picture images*/
   background: #010066 url(/images/dcyf_logo_right.jpg) right no-repeat 100%;
   min-height:85;
   height: 85px;
}

/*This is a light blue bar between the header and content.*/
#breadcrumb {
   margin: 0px;
   padding: 0px;
   color:#ffffff;
   font-size:1.0; /*.95em;*/
   text-align: right;
   background:#0099cc; /*light blue */
   height:20px;
}

#breadcrumb .bcLeft {
   float:left;
   text-align:left;
   font-size:1.0; /*.9em;*/
}
#breadcrumb .bcRight {
   float:right;
   text-align:right;
}

#breadcrumb a {
   margin: 0px;
   padding: 3px;
   font-size:1.0em;
   color: #fff;
}
#breadcrumb a:hover, #breadcrumb .bcleft a:hover {
   color: #99D9E8; 
   text-decoration: underline;
}

.smallred, p.smallred {
   font-size:.9em;
   color: #FF0000;
}

.italic {
   font-style: italic;
}

.bold {
   font-weight: bold;
}
.underline {
   text-decoration: underline;
}
.largeText, p.largeText {
   font-size: 1.3em;
}
.xlargeText, p.xlargeText {
   font-size: 1.4em;
}
.smallText, p.smallText {
   font-size:.8em;
}
.xsmallText, p.xsmallText {
   font-size:.65em;
}
/* This class is for a thin blue horzontal rule to divide sections*/
.thinhr hr {
   margin: 0px;
   padding: 0px;
   width:100%;
   color:#194B80;
   text-align: left;
   background-color:#194B80; 
   height:3px;  
}
/* bottom and foot classes are used in the page footer */
#bottom {
   clear:both;
   background-color:white;
   font-size:11px;
   color: #000;
   padding: 0px;
   margin:0px;
}

#bottom a {
   color:#09c;
   font-size: 11px;
   text-decoration:underline;
}
#bottom a:hover { 
   text-decoration:underline;
}

#bottom p {
   margin:0px; 
   padding:4px;
   text-align:center;
}

#footSpace {
   margin: 0px;
   padding: 0px;
   text-align:center;
   font-size:11px;
   color:#ffffff;   
   background-color: #0099cc; 
   height:20px;
   line-height: 1.5em;
}

#footSpace a {
   color:#fff;
   font-size: 11px;
   text-decoration:underline;
}
/*used for the middle text display in footer.*/
#footLeft {
   float:left;
   width:155px;
   margin:0px; /*top right bottom left*/
}

/*used for the middle text display in footer.*/
#footMiddle {
   margin:0px 145px 0px 155px; /*top right bottom left*/
   text-align:center;
   width:auto; /*500px;*/
   font-size:11px;
   line-height: 1.4em;
}

/* used for the display of the bobby and w3c image buttons.*/
.footerButtons {
	float: right;
	margin: 0px;
	padding: 0px;
    width:135px;
}
#bottom .footerButtons #bobby {
/*   margin:488px 0px 0px 25px; /*top right bottom left*/
   background: url(/images/approved.gif) right no-repeat;
   height:30px;
   width:88px;
   padding-left:47px;
}
#bottom .footerButtons #w3c {
   background: url(/images/w3c.png) right no-repeat;
   height:35px;
   width:88px;
   padding-left:47px;
}

#imgri { /*RI shield image settings*/
   float:left;
   margin:0px 10px 15px 10px;
}

#imgorg { /*org chart image settings*/
   float:left;
   margin: .02em;
}

.leftimg { /*standard left image with text wrapping around*/
float:left;
border:0px;
margin-right:15px;
margin-bottom:6px;
}

.rightimg { /*standard right image with text wrapping around*/
float:right;
border:0px;
margin-right:15px;
margin-bottom:6px;
}

/*  Thanks to Alex Robertson! http://www.fu2k.org/alex/css/layouts/3Col_NN4_RWS_C.mhtml */
#wrapper1, #wrapper2 {
   margin                               : 0px;
   padding                              : 0px;
}

input.login {
   width:200px;
   margin-left:-20px;
}

input.btn {
   margin-left:00px;
   font-size:1em;
}

label.radio {
   margin-left:10px;
   font-weight:normal;
   line-height: .9em;
}

form p {
   clear:top;
   margin-left:20px;
   padding:0;
   padding-top:5px;
}
form p label {
   float:left;
   width:35%;
   font-weight:bold;
   font-size:1em;
   padding-top:0px;
}

/*creates a rounded corner box but only in Mozilla.
  The 'border-radius' porperty is part of CSS3 recommendation.*/
.curvebox {
   width:auto;
   padding:1em;
   border: 2px solid #33527B;
   -moz-border-radius:25px;
}

/* The next 2 classes will create boxes that can be used for side
   by side display. The width will need to be adjusted for 2 column
   or 3 column style sheets */
.contentMidleft {
   margin-left:1px;
   margin-bottom:10px;
   padding: 4px;
   width:47%;
   font-size:.98em;
   /*border:1px solid black;*/
   background-color:transparent;
   -moz-border-radius:25px; /*Creates rounded borders in Mozilla*/
   }
.contentMidright {
   float:right;
   margin-right:0px;
   margin-bottom:10px;
   padding:4px;
   width:48%;
   font-size:.98em;
   /*border:1px solid black;*/
   background-color:transparent;
   -moz-border-radius:25px;/*Creates rounded borders in Mozilla*/
   }

.contentMidleft a, .contentMidright a {
   font-size: 1.0em;
   font-weight:normal;
   }
      
/*This class will draw a box around the content area*/   
.border {
   border:1px solid black;
   }
   
HR {
    height:10px;
    width:30%;
    background:#446791;
    margin: 0px 150px 0px 150px;  
   }
   
.panel { 
	font-size: .98em; 
	text-align: left; 
	padding: 0px 2px 0px 2px; /*top right bottom left*/
	margin: 0px 0px 11px 0px; 
}

/* These are headers for the text inside the highlight bars on 
   top of the 3 border panel boxes.*/
.panel h3, .panelRight h3, .panelLeft h3 { 
   font-size: 1.1em;  
   text-align: left; 
   color: #fff; 
   border-width: 1px 1px 1px 1px; 
   border-style: solid; 
   border-color: #FF8C00;
   background-color: #194B80; 
   margin: 0px; 
   padding: 2px 0px 2px 4px;
   }

.panel li {
   color: #008; /*#09c;*/
   font-size: 1.0em;
   list-style-type:none;
   text-decoration:none;
   /*line-height: 1.3em;*/
	}
.panelRight li a, .panelLeft li a, .panelRight a, .panelLeft a ,
 .panel li a {
   color: #008; 
   font-size: .98em;
   list-style-type:none;
   text-decoration:none;
   line-height: 1.0em;
   font-weight:normal;
	}

/* This is a three border box in left menu blue color,
   usually used with a highlight bar on the top.*/	
.panel2 { 
	font-size: 1.0em; 
	line-height: 1.3em; 
	margin: 0px 0px 11px 0px; /*top right bottom left*/
	border-width: 0px 1px 1px 1px; 
	border-style: solid; 
	border-color: #194B80; /*light blue 3690C0;*/
	background-color:transparent;
	padding: 3px;
}
/* This is a three border box in the light powder blue color,
   usually used with a highlight bar on the top.*/	
.boxPanel { 
	font-size: 1.0em; 
	line-height: 1.4em; 
	margin: 0px 0px 11px 0px; /*top right bottom left*/
	border-width: 0px 1px 1px 1px; 
	border-style: solid; 
	border-color: #3690C0;
	background-color:transparent;
	padding: 3px;
}
   
.panel2 p {
	margin: 0px 0px 8px 0px;
}

.panel2 p a {
   color: #008; 
   font-size: 1.0em;
}

/*This is similar to contentMidleft class but this
  one allows for a highlight bar to be applied */ 
.panelLeft {
   margin: 0px 0px 11px 1px; /*top right bottom left*/
   padding: 3px; /*top right bottom left*/
   width:47%;
   font-size:.98em;
   background-color:transparent;
   color: #000;
   text-align: left; 
   }
/*This is similar to contentMidright class but this
  one allows for a highlight bar to be applied */ 
.panelRight {
   float:right;
   margin: 0px 0px 11px 1px; /*top right bottom left*/
   padding:3px; /*top right bottom left*/
   width:47%;
   font-size:.98em;
   background-color:transparent;
   color: #000;
   }

/* This is a blue background bar with a red border */
.blueRedBar {
   margin: 0px;
   padding: 0px;
   color:#ffffff;
   text-align: left;
   background:#194B80; /*light blue */
   border-width: 1px 1px 1px 1px; 
   border-style: solid; 
   border-color: #CC0000;
   height:20px;
}
/* This is a blue background bar with an orange border */
.blueOrangeBar {
   margin: 0px;
   padding: 0px;
   color:#ffffff;
   text-align: left;
   background:#194B80; /*light blue */
   border-width: 1px 1px 1px 1px; 
   border-style: solid; 
   border-color: #FF8C00;
   height:20px;
}
/* This is a blue background bar with no border */
.blueBar {
   margin: 0px;
   padding: 0px;
   color:#ffffff;
   text-align: left;
   background:#194B80; /*light blue */
   /*border-width: 1px 1px 1px 1px; 
   border-style: solid; 
   border-color: #FF8C00;*/
   height:20px;
}
/* This is a yellow background bar with a blue border on the
   top and bottom.*/
.hiborder { 
   color: #000000; 
   font-weight: bold; 
   text-align: Center; 
   background-color: #FFFF00; 
   border-top-style: solid; 
   border-top-color: #0000FF; 
   border-bottom-style: solid; 
   border-bottom-color: #0000FF; 
   margin-left: 20px; 
   margin-right: 20px; 
   margin-top: 10px; 
   padding-left: 5px; 
   padding-right: 5px; 
   padding-top: 3px; 
   padding-bottom: 3px 
   }

#billRights {
   background-color:#0099cc;
   color:#001166;
}

#billRights h4  {
   margin: 0px;
   padding: 2px;
   font-size: 1.1em;
   font-weight: bold;
   text-decoration: none;
   border:1px solid white;
   background-color:#FFCC33;/*gold*/
   color:#194B80;
}


/*Theses are generic color classes */
.black {color: #000000;}
.white {color: #ffffff;}
.darkblue {color: #001166;}
.mediumblue {color: #003399;}
.lightblue {color: #99CCFF;}
.blue {color: #DDEEFF;}
.red {color: #CC0000;}
.orange {color: #FF3300;}
.green {color: #006600;}
.teal {color: #0099CC;}
.gold {color: #FFCC33;}
.gray {color: #999999;}
.darkgray {color: #666666;}
.paleblue {color:#E4F2FB;}
.lightgray {color:#E8E8E8;}
.bg_gold1 {background-color: #FFCC33;}
.bg_yellow {background-color: #FFFF99;}
.bg_lightblue {background-color:#0099cc;}
.bg_paleblue {background-color:#E4F2FB;}
.bg_darkblue {background-color: #001166;}
.bg_lightyellow {background-color: #FFFFCC;}
.bg_lightgray {background-color:#E8E8E8;}
.bg_whitesmoke {background-color:#F5F5F5;} /*whitesmoke*/
.bg_gainsboro {background-color:#DCDCDC;} /*gainsboro (grayish)*/
.bg_blue {background-color:#194B80;} /*left menu blue*/
.head_blue {color:#010066;} /*dcyf blue header color*/
   
 END CSS