body {
font-family:Arial, Helvetica, sans-serif;
background:#444 url(/images/backtile.jpg) repeat-x;
margin:0;
padding:0 0 24px 0;
}

.hidden {
	display:none;
}

a {
text-decoration:none;
}

a:link,
a:visited {
color:#00C;
}

a:hover {
color:#07F;
text-decoration:underline;
}

a:active {
color:#C00;
text-decoration:underline;
}

a:focus {
border:0;
outline:0;
}


/* ------------------- */

a.scrollToTop {
width:36px;
height:33px;
padding-top:3px;
position:fixed;
bottom:80px;
right:20px;
border-radius:6px;
background-color:#CCC;
color:#666;
font-size:24px;
text-align:center;
text-decoration:none;
display:none;
cursor:pointer;
box-shadow:3px 3px 6px #222;
}

a.scrollToTop:hover {
background-color:#2580FA;
color:#FFF;
}

/* ------------------- */


.container {
background-color:#FFFFFF;
margin:0 auto;
overflow: hidden;
width:960px;
}

.pageheader {
border:0;
height: 140px;
margin:0;
overflow:hidden;
}

h1.printheader {
display:none;
}


/*-- left column --*/


.leftcolumn {
background-color: #FFFFFF;
float:left;
font-size:13px;
margin:20px 0 20px 0;
overflow:hidden;
padding: 4px 0 0 20px;
width:180px;
}

.leftcolumn ul, .leftcolumn ul ul, .leftcolumn ul ul ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.menu > li > a {
	border-top: 1px dotted #316CC6;
	padding: 6px 4px 7px 4px;
  text-decoration:none;
	display: block;
	font-weight: bold;
	color: #316CC6;
}

.menu > li > ul > li {
  padding-left: 16px;
}

.menu > li > ul > li > a {
	/*border-top: 1px dotted #316CC6;*/
  margin-left: 0;
	padding: 6px 0 7px 4px;
  text-decoration:none;
	display: block;
	font-weight: bold;
	color: #316CC6;
}

.menu > li > a:hover,
.menu > li > a.active,
.menu ul li a:hover,
.menu ul li a:active {
	background-color: #D9D9D9;
  color:#2A5EAC;
}

p.liabilitystatement {
  border-bottom: 1px solid #000000;
  border-top: 1px solid #000000;
  margin: 30px 0;
  padding: 10px 0;
}


.leftcolumn .logo {
  margin: 0 0 20px 40px;
  display:block;
}

/* -- logo column -- */

.logocolumn {
float:left;
width:112px;
padding: 0 0 0 34px;
}

.logocolumn a {
display:block;
width:112px;
height:112px;
background:url(/images/logos_sprite.png) no-repeat;
margin:0 0 20px 0;
}

.logocolumn a.SJR {
background-position:0 0;
}

.logocolumn a.SJR:hover {
background-position:0 -113px;
}

.logocolumn a.SUW {
background-position:-113px 0;
}

.logocolumn a.SUW:hover {
background-position:-113px -113px;
}

.logocolumn a.DEP {
background-position:-226px 0;
}

.logocolumn a.DEP:hover {
background-position:-226px -113px;
}



/* -- MAIN CONTENT AREA -- */

.maincontent {
  border-left: 1px solid #B7B7B7;
  float: right;
  margin:20px 30px 20px 0;
  min-height: 1140px;
  padding:0 0 0 20px;
  width: 690px;
}


.maincontent h5.subhead {
color:#484848;
font:italic bold 17px/22px Georgia, "Times New Roman", Times, serif;
margin:14px 0 28px 0;
padding:0;
}

.maincontent h2 {
font:bold 1.6em/1.3em Georgia, "Times New Roman", Times, serif;
color:#1231C7;
margin: 0 0 20px 0;
/*text-shadow:2px 3px 3px #B0B0B0;*/
}

.maincontent h2.homeheader {
  margin: 20px 0 0 0;
}

.maincontent p {
margin-top:0;
margin-bottom:16px;
line-height:1.4em;
font-size:1.0em;
}

.maincontent p:last-of-type {
  margin-bottom: 32px;
}

.maincontent h3 {
font:bold 1.4em/1em Georgia, "Times New Roman", Times, serif;
color:#1231C7;
margin-top:0;
margin-bottom:18px;
}

.maincontent h4 {
font:bold 1.3em/1em Georgia, "Times New Roman", Times, serif;
color:#1231C7;
margin:24px 0 16px 0;
/*text-shadow:2px 3px 3px #B0B0B0;*/
}

.maincontent h4.sectionhead {
  border-bottom:1px solid #1231C7;
  color:#1231C7;
  font:normal 1.0em/1em Arial, Helvetica, sans-serif;
  margin: 4px 0 20px 0;
  padding-bottom: 8px;
}


.maincontent h5 { 
font:bold 1.05em/1em Georgia, "Times New Roman", Times, serif;
color:#555;
margin-top:0;
margin-bottom:10px;
}

.maincontent ol {
margin-top:0;
margin-bottom:16px;
padding-top:0;
padding-bottom:0;
}

.maincontent ul {
  font-size:1.0em;
  font-weight:normal;
  line-height:1.4em;
margin-top:0;
margin-bottom:20px;
padding-top:0;
padding-bottom:0;
list-style-image:url(/images/li-bullet.gif);
}

.maincontent ul ul,
.maincontent ul ul ul {
margin-top:6px;
margin-bottom:8px;
padding-top:0;
padding-bottom:0;
}

.maincontent ul li {
  font-size:1.0em;
  line-height:1.4em;
  margin-top:0;
  margin-bottom:12px;
  padding:0;
}

.maincontent ul.itemlist li {
margin-bottom:10px;
line-height:1.4em;
}

.maincontent ul ul li {
margin-bottom:8px;
font-size:1.0em;
line-height:1.4em;
}

.maincontent ul ul ul li {
margin-bottom:2px;
}



/* -- Home page  -- */



.maincontent h2.title,
.maincontent h3.title,
.maincontent h4.title {
margin-bottom:4px;
}



.maincontent .border {
margin-top:30px;
padding-top:24px;
border-top:1px solid #CCC;
}



.maincontent p.title {
margin-bottom:2px;
}

.maincontent .indentbox {
margin:30px 30px 0 30px;
}

.maincontent .indentbox2 {
margin:0 60px;
}

.maincontent .right {
text-align:right;
}

.maincontent p.gototop {
text-align:right;
}

.maincontent p.gototop a {
display:inline-block;
width:25px;
height:25px;
background:url(/images/gototopback_sprite.png) no-repeat 0 0;
}

.maincontent p.gototop a:hover {
background-position:-26px 0;
}

.maincontent .centered {
text-align:center;
}

.maincontent .graphic {
float:right;
margin:0 0 8px 16px;
}

.maincontent .graphic-2 {
  /*border: 1px solid #000000;*/
  margin:0 0 20px 0;
}


.maincontent .photo {
float:right;
margin-left:10px;
margin-bottom:6px;
border:1px solid #000;
}

.maincontent .photo-2 {
border:1px solid #000000;
}

.maincontent .photo-3 {
border:1px solid #000000;
margin-bottom: 30px;
}

.large {
font-size:1.1em;
}

.larger {
font-size:1.3em;
}

.largest {
font-size:1.5em;
}

.small {
font-size:.87em;
}

.smaller {
font-size:.8em;
}

.smallest {
font-size:.7em;
}

.blue-pale {
color:#CADEF2;
}

.blue-medium {
color:#6287C3;
}

.blue-dark {
color:#027;
}

.graymed {
color:#666;
}

.brightblue {
color:#06C;
}

.dkred {
color:#800000;
}

.dkbluegray {
color:#00385D;
}

.redtext {
color:#C00;
}

.blacktext {
color:#000;
}

.aqualt {
color:#87CBCB;
}

.aquamed {
color:#1F9797;
}

.aquadk {
color:#177070;
}

.salmonlt {
color:#FFB1A8;
}

.salmonmed {
color:#FA8072;
}

.salmondk {
color:#B9564B;
}

.sanseriffont2 {
font-family:Verdana, Arial, Helvetica, sans-serif;
}

.updated {
  background-color:#C00;
  border-radius: 3px;
  color:#FFFFFF;
  font-size: 0.75em;
  font-weight: 700;
  padding: 1px 3px;
}

/*--------- footer ----------*/

.footer {
  background-color:#316CC6;
  overflow:hidden;
  padding: 20px 0;
  width: 960px;
}

.footer p {
margin:0;
font:12px/11px Verdana, Arial, Helvetica, sans-serif;
color:#BBB;
text-align:center;
letter-spacing:.3em;
word-spacing:.3em;
}

.footer .bulletcolor {
color:#6390FF;
}

.footerimages {
display:none;
}

sup {
font:normal 55%/6px Verdana, Arial, Helvetica, sans-serif;
vertical-align:super;
}

.maincontent div.image144 img,
.maincontent div.image180 img,
.maincontent div.image216 img,
.maincontent div.image252 img,
.maincontent div.image288 img,
.maincontent div.image324 img,
.maincontent div.image360 img {
border:1px solid #000;
/*box-shadow:2px 2px 4px #333;
behavior:url(/css/PIE_uncompressed.htc);
position:relative;
zoom:1;*/
}

.maincontent div.image144,
.maincontent div.image180,
.maincontent div.image216,
.maincontent div.image252,
.maincontent div.image288,
.maincontent div.image324,
.maincontent div.image360 {
float:right;
margin:0 0 8px 16px;
}

.maincontent div.image144 {
width:146px;
}

.maincontent div.image180 {
width:182px;
}

.maincontent div.image216 {
width:218px;
}

.maincontent div.image252 {
width:254px;
}

.maincontent div.image288 {
width:290px;
}

.maincontent div.image324 {
width:326px;
}

.maincontent div.image360 {
width:362px;
}

.maincontent p.cutline {
font-size:.77em;
line-height:1.2em;
margin-top:6px;
margin-bottom:8px;
color:#484848;
}

.maincontent div.sidebar {
float:right;
width:220px;
background-color:#F0F0F0;
margin:4px 0 8px 24px;
padding:12px;
border:3px double #777;
/*box-shadow:2px 2px 4px #333;
behavior:url(/css/PIE_uncompressed.htc);
position:relative;
zoom:1;*/
}

.maincontent div.sidebar h5 {
text-align:center;
margin-bottom:10px;
font-size:17px;
line-height:17px;
color:#1231C7;
}

.maincontent div.sidebar p {
margin-bottom:10px;
font-size:13px;
line-height:17px;
}

.maincontent div.sidebar p.last {
margin-bottom:0;
margin-left:28px;
}

.maincontent div.sidebar ul li {
margin-bottom:10px;
margin-left:-16px;
font-size:.8em;
}

.maincontent div.sidebar ul,
.maincontent div.sidebar ul li.last {
margin-bottom:0;
}

.maincontent div.SB324 {
width:324px;
}

.maincontent div.SB256 {
width:256px;
}

.maincontent div.SB180 {
width:180px;
}

.maincontent div#textbox {
width:74%;
font-size:.87em;
background-color:#FFE0D5;
border:3px double #CCC;
padding:16px;
margin:24px auto;
/*box-shadow:2px 2px 4px #333;
behavior:url(/css/PIE_uncompressed.htc);
position:relative;
zoom:1;*/
}

.maincontent div#textbox h5,
.maincontent div#textbox2 h5 {
color:#800000;
text-align:center;
}

.maincontent div#textbox p.last,
.maincontent div#textbox2 p.last {
margin-bottom:0;
}

.maincontent div#textbox2 {
width:224px;
float:right;
font-size:.87em;
background-color:#FFE0D5;
border:3px double #CCC;
padding:16px 24px 20px 24px;
margin:-14px 0 8px 24px;
/*box-shadow:2px 2px 4px #333;
behavior:url(/css/PIE_uncompressed.htc);
position:relative;
zoom:1;*/
}

#notice {
	width: 500px;
	margin: 10px;
}

#notice h2 {
font:bold 1.4em/1em Georgia, "Times New Roman", Times, serif;
color:#1231C7;
margin-top:0;
margin-bottom:16px;
text-shadow:2px 3px 3px #B0B0B0;
}


#notice p {
margin-top:0;
margin-bottom:16px;
line-height:1.3em;
font-size: 1.0em;
}



/* Data table */

table.datatable {
border-spacing:1px;
background-color:#BBB;
margin-bottom:0;
text-align:right;
}

table.datatable tr {
background-color:#FFFFFF;
}

table.datatable tr.tablehead th {
background:transparent url(/images/tableheadback.jpg) no-repeat 50% 50%;
font-weight:bold;
padding:6px;
text-align:center;
vertical-align:middle;
}

table.datatable tr.tablehead th.head-1 {
  width: 320px;
}

table.datatable tr.tablehead th.head-2, table.datatable tr.tablehead th.head-3, table.datatable tr.tablehead th.head-4 {
  width: 68px;
}

table.datatable tr.tablehead th.head-5 {
  width:94px;
}

.maincontent table.datatable tr.tablehead th p {
  font-weight:bold;
  color:#FFFFFF;
}

.maincontent table.datatable td {
padding:4px 10px 4px 10px;
vertical-align:center;
}

.maincontent table.datatable td.category {
text-align:left;
vertical-align:center;
padding: 4px 0 4px 10px;
}

.maincontent table.datatable td.center {
  text-align:center;
}

.maincontent table.datatable p {
  font:.9em/1.3em Verdana, Arial, Helvetica, sans-serif;
  margin:0;
  padding:0;
}

.maincontent h5.tableheader {
  border-top: 1px solid #1231C7;
  color: #1231C7;
  font-size: 1.3em;
  line-height:1.45em;
  margin-top: 36px;
  padding-top: 16px;
}

.maincontent p.updated {
  color:#CD0E11;
  font-size: 0.85em;
  font-weight: bold;
  margin: -8px 0 10px 0;
}

.maincontent p.tablenote {
  font-size:0.8em;
  margin: 4px 0 0 11px;
  padding:0;
}



/* ------ Total Water Use / Projection Summaries ------ */

.wrapper-linklist {
  margin: 30px 0 20px 0;
  overflow:hidden;
}

ul.linklist {
  float:left;
  width: 280px;
}

ul.linklist a {
  font-weight:bold;
}

/* ------ FAQ page ------ */

.maincontent li.toggle {
  color:#00C;
  cursor:pointer;
  font-size:1.1em;
  font-weight: bold;
  /*font:bold 1.2em/1.2em Georgia, "Times New Roman", Times, serif;*/
  /*font-style:italic;*/
  
}

.maincontent ul.content, .maincontent ul.no-toggle-content {
  list-style-image:none;
  list-style-type:none;
  padding-left:0;
}

.maincontent ul.content li, .maincontent ul.no-toggle-content li {
  color: #000000;
  cursor:text;
  font:normal 16px/22px Helvetica, Arial, sans-serif;
  font-style:normal;
}


/* ------ Meeting pages ------ */

/* meeting pages */


ul.meetings {
  margin:30px 0 0 20px;
  padding:0;
}

.maincontent ul.meetings li {
  font-size:1.0em;
  list-style-image:none;
  list-style-type:none;
  margin-bottom:20px;
}

.maincontent ul.meetings li p {
  margin:4px 0 0 20px;
  padding: 0;
}

.maincontent ul.meetings li ul {
  margin-top: 6px;
}

.maincontent ul.meetings li ul li {
  font-weight:normal;
  list-style-image:url(/images/li-bullet.gif);
  margin-bottom: 6px;
}

.maincontent ul.meetings li ul ul {
  padding-left:20px;
}

.maincontent ul.meeting-documents {
  font-weight:bold;
  padding-left:20px;
}

.maincontent ul.meeting-documents li {
  list-style-type:none;
  list-style-image:none;
  margin-bottom:20px;
}

.maincontent ul.meeting-documents li ul li {
  font-weight:normal;
  list-style-image:url(/images/li-bullet.gif);
  margin-bottom: 3px;
}

/* Right meeting list */

ul.rightlist {
  border: 1px solid #000000;
  float:right;
  font-size:0.9em;
  list-style-image:none;
  list-style-type:none;
  margin: 0 0 0 30px;
  padding: 20px;
  width: 180px;
}

ul.rightlist ul {
  list-style-image:none;
  list-style-type:none;
  padding-left: 10px;
}

/* Dropdown menu on meetings pages */

.button-wrapper {
  overflow:hidden;
  padding-bottom: 0;
  margin:0 0 30px 0;
}

.maincontent .actionbutton {
  background:#DCEEF5 url(/images/returnbuttonback_sprite.png) repeat-x 0 -300px;
  border:1px solid #5CA5CB;
  color:#005F9E;
  float:left;
  font:14px/16px Verdana, Arial, Helvetica, sans-serif;
  font-weight:bold;
  margin-right:20px;
  padding:4px 0 6px 0;
  position:relative;
  text-align:center;
  text-shadow:2px 1px 1px #FFF;
  width: 200px;
 }

.dropdown {
  float: left;
}

.maincontent .button {
  background:#DCEEF5 url(/images/returnbuttonback_sprite.png) repeat-x 0 -300px;
  border:1px solid #5CA5CB;
  color:#005F9E;
  display:block;
  font:14px/16px Verdana, Arial, Helvetica, sans-serif;
  font-weight:bold;
  margin:0 !important;
  padding:4px 0 6px 0;
  position:relative;
  text-align:center;
  text-shadow:2px 1px 1px #FFF;
  width: 240px;
}

.maincontent .button:hover, .button:focus,
.maincontent .actionbutton:hover {
  background-color:#039;
  background-position:0 -64px;
  border:1px solid #8FB3E4;
  color:#DCE5FF;
  text-decoration:none;
  text-shadow:2px 1px 2px #222;
}

.dropdown-content {
  background-color: #EEEEEE;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  display:none;
  list-style-type:none;
  margin:0;
  overflow: auto;
  padding:0;
  position: absolute;
  text-align:center;
  width: 242px;
}

.maincontent .dropdown-content li {
  margin:0;
  padding:0;
}

.dropdown-content li a {
  color:#0000F7;
  display: block;
  font-size:13px;
  font-weight:bold;
  margin:0;
  padding: 12px 16px;
  text-decoration: none;

}

.dropdown a:hover {
  background-color: #bde5ff;
  color:#00C;
  }


p.notation {
  font-size:.8em;
  padding-top: 20px;
  border-top: 1px solid #5CA5CB;
}

/* ------ Committee page ------ */

div.textcolumns {
margin:36px 0 36px 20px;
overflow:hidden;
}

div.textcolumns h5 {
margin-top:0px;
margin-bottom:14px;
font:bold 1.05em/1em Arial, Helvetica, sans-serif;
color:#FFF;
background-color:#416ED2;
padding:4px 0 4px 8px;
}

div.textcolumns p {
padding-left:8px;
}

div.columnleft{
  float:left;
  width:300px;
}

div.columnright{
  float:left;
  margin-left: 30px;
  width:300px;
}