/**
* @version $Id: graphs.css 20 2007-01-25 14:27:08Z clexus $
* Clexus Private Messaging Component
* @package ClexusPM
* @Copyright (C) 2003 - 2006 Danial Taherzadeh All rights reserved
* @license Released as a commercial component
* @link http://www.clexus.com
**/

 div.graph {height: 15px;

 margin-left:20px;

 }

div.graph .graph_thin_green_bar,
div.graph .graph_thin_yellow_bar,
div.graph .graph_thin_red_bar,
div.graph .graph_thin_no-bar_bar {
width: 90%; }





.graph_thick_green,
.graph_thick_yellow,
.graph_thick_red,
.graph_thick_no-bar {
	height: 60px; }
.graph_thin_green,
.graph_thin_yellow,
.graph_thin_red,
.graph_thin_no-bar {
	height: 23px; }

/* =Green Thick Bar Graph
--------------------*/
.graph_thick_green_open {
	height: 49px;
	width: 24px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_green_open.gif") no-repeat 0 0; }
.graph_thick_green_close {
	height: 49px;
	width: 26px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_green_close.gif") no-repeat 0 0; }
.graph_thick_green_bar {
	height: 49px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thick_middle.gif") repeat-x 0 0;
	line-height: 49px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816; }
	.graph_thick_green_bar strong {
		height: 25px;
		display: block;
		margin-top: 12px;
		float: left;
		text-indent: -5000px;
		line-height: 100%;
		background: transparent url("../images/graphs/graph_thick_green.gif") repeat-x 0 0;
		border-right: 1px solid #249816; }
	.graph_thick_green_bar b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: normal;
		line-height: 49px;
		color: #249816;
		padding-left: 3px; }

/* =Green Thin Bar Graph
--------------------*/
.graph_thin_green_open {
	height: 23px;
	width: 12px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_green_open.gif") no-repeat 0 0; }
.graph_thin_green_close {
	height: 23px;
	width: 11px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_green_close.gif") no-repeat 0 0; }
.graph_thin_green_bar {
	height: 23px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thin_middle.gif") repeat-x 0 0;
	line-height: 23px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816; }
	.graph_thin_green_bar strong {
		height: 15px;
		display: block;
		margin-top: 4px;
		float: left;
		text-indent: -5000px;
		line-height: 100%;
		background: transparent url("../images/graphs/graph_thin_green.gif") repeat-x 0 0;
		border-right: 1px solid #249816; }
	.graph_thin_green_bar b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 11px;
		font-weight: normal;
		line-height: 23px;
		color: #249816;
		padding-left: 3px; }

/* =Yellow Thick Bar Graph
--------------------*/
.graph_thick_yellow_open {
	height: 49px;
	width: 24px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_yellow_open.gif") no-repeat 0 0; }
.graph_thick_yellow_close {
	height: 49px;
	width: 26px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_yellow_close.gif") no-repeat 0 0; }
.graph_thick_yellow_bar {
	height: 49px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thick_middle.gif") repeat-x 0 0;
	line-height: 49px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816; }
	.graph_thick_yellow_bar strong {
		height: 25px;
		display: block;
		margin-top: 12px;
		float: left;
		line-height: 100%;
		background: transparent url("../images/graphs/graph_thick_yellow.gif") repeat-x 0 0;
		border-right: 1px solid #BD7100; }
	.graph_thick_yellow_bar strong b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: normal;
		color: #FFFFFF;
		float: right;
		line-height: 100%;
		position: relative;
		right: 5px;
		top: 6px; }

/* =Yellow Thin Bar Graph
--------------------*/
.graph_thin_yellow_open {
	height: 23px;
	width: 12px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_yellow_open.gif") no-repeat 0 0; }
.graph_thin_yellow_close {
	height: 23px;
	width: 11px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_yellow_close.gif") no-repeat 0 0; }
.graph_thin_yellow_bar {
	height: 23px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thin_middle.gif") repeat-x 0 0;
	line-height: 23px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816; }
	.graph_thin_yellow_bar strong {
		height: 15px;
		display: block;
		margin-top: 4px;
		float: left;
		line-height: 100%;
		background: transparent url("../images/graphs/graph_thin_yellow.gif") repeat-x 0 0;
		border-right: 1px solid #BD7100; }
	.graph_thin_yellow_bar strong b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 11px;
		float: right;
		font-weight: normal;
		color: #FFFFFF;
		position: relative;
		right: 5px;
		top: 1px; }

/* =Red Thick Bar Graph
--------------------*/
.graph_thick_red_open {
	height: 49px;
	width: 24px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_red_open.gif") no-repeat 0 0; }
.graph_thick_red_close {
	height: 49px;
	width: 26px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_red_close.gif") no-repeat 0 0; }
.graph_thick_red_bar {
	height: 49px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thick_middle.gif") repeat-x 0 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816; }
	.graph_thick_red_bar strong {
		height: 25px;
		display: block;
		margin-top: 12px;
		text-indent: -5000px;
		line-height: 100%;
		background: transparent url("/images/graphs/graph_thick_red.gif") repeat-x 0 0; }
	.graph_thick_red_bar b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: normal;
		color: #FFFFFF;
		position: relative;
		bottom: 20px;
		left: 45%; }

/* =Red Thin Bar Graph
--------------------*/
.graph_thin_red_open {
	height: 23px;
	width: 12px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_red_open.gif") no-repeat 0 0; }
.graph_thin_red_close {
	height: 23px;
	width: 13px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_red_close.gif") no-repeat 0 0; }
.graph_thin_red_bar {
	height: 23px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thin_middle.gif") repeat-x 0 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816; }
	.graph_thin_red_bar strong {
		height: 15px;
		display: block;
		margin-top: 4px;
		text-indent: -5000px;
		line-height: 100%;
		background: transparent url("../images/graphs/graph_thin_red.gif") repeat-x 0 0; }
	.graph_thin_red_bar b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 11px;
		font-weight: normal;
		color: #FFFFFF;
		position: relative;
		bottom: 16px;
		left: 45%; }

/* =No-bar Thick Bar Graph
--------------------*/
.graph_thick_no-bar_open {
	height: 49px;
	width: 24px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_open.gif") no-repeat 0 0; }
.graph_thick_no-bar_close {
	height: 49px;
	width: 26px;
	float: left;
	background: transparent url("../images/graphs/graph_thick_close.gif") no-repeat 0 0; }
.graph_thick_no-bar_bar {
	height: 49px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thick_middle.gif") repeat-x 0 0;
	line-height: 49px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816;
	text-align: center; }
	.graph_thick_no-bar_bar b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: normal;
		color: #249816; }

/* =No-bar Thin Bar Graph
--------------------*/
.graph_thin_no-bar_open {
	height: 23px;
	width: 12px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_open.gif") no-repeat 0 0; }
.graph_thin_no-bar_close {
	height: 23px;
	width: 11px;
	float: left;
	background: transparent url("../images/graphs/graph_thin_close.gif") no-repeat 0 0; }
.graph_thin_no-bar_bar {
	height: 23px;
	display: block;
	float: left;
	background: transparent url("../images/graphs/graph_thin_middle.gif") repeat-x 0 0;
	line-height: 23px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #249816;
	text-align: center; }
	.graph_thin_no-bar_bar b {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 11px;
		font-weight: normal;
		color: #249816; }
		
		
		
		
		
/* - minigraph-- */
#quotausagebar{
	position:relative;
	display:block;
	border-style:solid;
	border-width:1px;
	margin:2px 4px;
	height:1em;
	color:#000000;
    width:50px;
	
	}
#quotausagebar span.first
    {
    position:absolute;
    height:100%;
    }
#quotausagebar span.last
    {
    width:100%;
    text-align:center;
    font:normal 10px verdana;
    position:absolute;
    }
html > body#quotausagebar span.last
    {
    display:block;
    width:auto;
    }
div#quotameter div
    {
    border-color:#fbf5d8;
    background-color:#fff;
    }
#quotausagebar
    {
    border-color:#ccc;
    }
div.lowquota span#quotausagebar span.first
    {
    background:#dbebc1 url(../images/graphs/qt_lo_1.gif) repeat-x center left;
    }
div.mediumquota span#quotausagebar span.first
    {
    background:#f9e9b5 url(../images/graphs/qt_m_1.gif) repeat-x center left;
    }
div.highquota span#quotausagebar span.first
    {
    background:#ffc1c1 url(../images/graphs/qt_hi_1.gif) repeat-x center left;
    }
img.graphspacer {
width:120px;
height:1px;
}