/* defaults */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td {
	margin:0;
	padding:0;
}

body {
	font:normal 100%/150% Helvetica,Verdana,'Liberation Sans','Bitstream Vera Sans',Arial,sans-serif;
	background:#bebebe;
	color:#333333;
	text-align:center;
	min-width:950px;
}

/* boxes, box specific typography */

#pg {
	position:relative;
	margin:0 auto 0 auto;
	text-align:left;
	width:950px;
}

#pghead {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:175px;
	background:white url("img/one98.png") no-repeat left top;
}

#pglogo {
	padding:4px 0 4px 0;
	position:absolute;
	height:33px;
	left:0;
	width:100%;
	bottom:0;
	background:#7EBD3B url("img/one98navbg.png") repeat-y left top;
}

#pgnav {
	display:table;
	list-style:none;
	white-space:nowrap;
	margin:0 0 0 5px;
}
#pgnav li {
	display:table-cell;
	margin:5px;
}
#pgnav li a, #pgnav li b {
	font-size:80%;
	line-height:260%;
	padding:10px;
	text-decoration:none;
	color:#FFFFFF;
}
#pgnav li a:hover {
	background:#3D70C3;
}

#pgbody {
	width:100%;
	position:absolute;
	top:150px;
	margin:25px 0 0 0;
	background:white url("img/one98bg.png") repeat-y 50% top;
	font-size:85%;
	padding:20px 0 0 0;
}

#pgleft {
	position:absolute;
	top:0;
	left:0;
	/* i changed the last below this from 40 to 20 */
	margin:20px 0 40px 20px;
	/*And this from 158 to 210*/
	width:210px;
	font-size:90%;
	line-height:1.4;
}

#pgmain {
	margin:0 30px 0 240px;
	padding:0 0 3em 0;
}
	
#pgtail {
	clear:both;
	border-top:3px solid #4578CB;
	padding:.5em 0 0 0;
	color:#999;
	position:absolute;
	font-size:85%;
	line-height:1.1;
}
#pgtail p {
	margin:0;
}
#pgtail a {
	color:#999;
}


.txtflt {
	width:190px;
	float:right;
	font-size:80%;
	line-height:1.2;
	color:white;
	margin:0 0 0 5px;
	padding:0 0 0 10px;
}
.txtflt p {
	margin:0 0 1em 0;
}
.txtflt :last-child {
	margin-bottom:0;
}

.expieredred
{
	color:#F00;
	font-weight:550;
	font-size:18px;
	line-height:200%;
}

.yelowhighlighter
{
	color:#000;
	background-color:#FFC;
}


/* typography */
h1, h2, h3, h4, h5, h6 {
	margin:0 0 .5em 0;
	color:#555555;
	border-bottom:1px solid #dddddd;
}
h1 {	font-size:150%;}
h2 {	font-size:135%;}
h3 {	font-size:125%;}
h4 {	font-size:115%;}
h5 {	font-size:105%;}
h6 {	font-size:100%;}

p, ul, ol, dl {
	margin:0 0 1.5em 0;
}
ul {
	padding:0 0 0 25px;
}
a {
	text-decoration:underline;
}
a:link {
	color:#888888;
}
a:visited {
	color:#333333;
}
a:hover, a:active {
	color:red;
}
img {
	border:none;
}
hr {
	height:1px;
	clear:both;
}

/*This is added for the tooltips thing ! images are relative to this CSS i think but make absolute not relative anyways !*/

/*---------- bubble tooltip -----------*/
a.tt{
    position:relative;
    z-index:24;
    /*color:#3CA3FF;*/
	color:#fd0a21;
	font-weight:bold;
    text-decoration:none;
}
a.tt span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:25; color: #fd0a21; background:;}
a.tt:hover span.tooltip{
    display:block;
    position:absolute;
    top:0px; left:0;
	padding: 15px 0 0 0;
	width:200px;
	color: #993300;
    text-align: center;
	filter: alpha(opacity:90);
	KHTMLOpacity: 0.90;
	MozOpacity: 0.90;
	opacity: 0.90;
}
a.tt:hover span.top{
	display: block;
	padding: 30px 8px 0;
    background: url(tooltip/bubble.gif) no-repeat top;
}
a.tt:hover span.middle{ /* different middle bg for stretch */
	display: block;
	padding: 0 8px; 
	background: url(tooltip/bubble_filler.gif) repeat bottom; 
}
a.tt:hover span.bottom{
	display: block;
	padding:3px 8px 10px;
	color: #548912;
    background: url(tooltip/bubble.gif) no-repeat bottom;
}

/*The following are attention boxes*/

body{
    font-family:Arial, Helvetica, sans-serif; 
    font-size:13px;
}
.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('img/info.png');
}

.info a {
    color: #0000EE;
}

.success {
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image:url('img/success.png');
}
.warning {
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('img/warning.png');
}
.error {
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('img/error.png');
}

.validation {
    color: #D63301;
    background-color: #FFCCBA;
    background-image: url('img/validation.png');
}

/*TT class but with a strikethrough !*/


/*---------- bubble tooltip -----------*/
a.tst{
    position:relative;
    z-index:24;
    /*color:#3CA3FF;*/
	color:#fd0a21;
	font-weight:bold;
    text-decoration:line-through;
}
a.tst span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tst:hover{ z-index:25; color: #fd0a21; background:;}
a.tst:hover span.tooltip{
    display:block;
    position:absolute;
    top:0px; left:0;
	padding: 15px 0 0 0;
	width:200px;
	color: #993300;
    text-align: center;
	filter: alpha(opacity:90);
	KHTMLOpacity: 0.90;
	MozOpacity: 0.90;
	opacity: 0.90;
}
a.tst:hover span.top{
	display: block;
	padding: 30px 8px 0;
    background: url(tooltip/bubble.gif) no-repeat top;
}
a.tst:hover span.middle{ /* different middle bg for stretch */
	display: block;
	padding: 0 8px; 
	background: url(tooltip/bubble_filler.gif) repeat bottom; 
}
a.tst:hover span.bottom{
	display: block;
	padding:3px 8px 10px;
	color: #548912;
    background: url(tooltip/bubble.gif) no-repeat bottom;
}

.vcimageright
{
	padding-top:60px;
	padding-right:0;
	float:right;
}
