/* Global Links */
a{ text-decoration:none;}
a img {border: none; }
a:HOVER {background : #00254C; color : White;}
a:LINK{color : #FFC000;}
a:VISITED{color : #FFC000;}
a:ACTIVE{color : #FFC000;}

/* user levels */
a.ul0{color: #00BFFF;}
a.ul0:VISITED{color: #00BFFF;}
font.ul0 {color: #00BFFF;}
a.ul1 {color: #00BFFF;}
a.ul1:VISITED {color: #00BFFF;}
font.ul1 {color: #00BFFF;}
a.ul2 {color: #00FF00;}
a.ul2:VISITED {color: #00FF00;}
font.ul2 {color: #00FF00;}
a.ul3 {color: #FFFF00;}
a.ul3 :VISITED{color: #FFFF00;}
font.ul3 {color: #FFFF00;}
a.ul4 {color: #FF66FF;}
a.ul4 :VISITED{color: #FF66FF;}
font.ul4 {color: #FF66FF;}
a.ul5 {color: #FF0000;}
a.ul5 :VISITED{color: #FF0000;}
font.ul5 {color: #FF0000;}
a.winr {color: #FCFCFC;}
a.winr :VISITED{color: #FCFCFC;}
font.winr {color: #FCFCFC;}

/* body definitions */
body{text-align: center;}
.bodysub { background: url(images/purple-gradient.jpg) top left repeat-x #9F3EA5; }
.bodyfree { background: url(images/grey2-gradient.jpg) top left repeat-x #1502DB; }
.bodygrey { background: url(images/grey-gradient.jpg) top left repeat-x #2F302E; }
.bodydarkgrey { background: url(images/darkgrey-gradient.jpg) top left repeat-x #6C6967; }
.bodyblue { background: url(images/blue-gradient.jpg) top left repeat-x #040562; }
.bodygreen { background: url(images/green-gradient.jpg) top left repeat-x #148509; }
.bodyred { background: url(images/red-gradient.jpg) top left repeat-x #710E03; }
.bodypink { background: url(images/pink-gradient.jpg) top left repeat-x #980693; }
.bodyblack { background: #000000; }

.text{font-family: Verdana, Arial, sans-serif; FONT-SIZE: 11px; line-height : 12px;}

/* Scrolling Boxes */
#pscroller1
{
width: 115px;
height: 80px;
border: 1px solid black;
padding: 3px;
background-color: #474747;
}
#pscroller2
{
width: 350px;
height: 20px;
border: 1px solid black;
padding: 3px;
}
#pscroller1 a
{text-decoration: none;}
#pscroller2 a
{text-decoration: none;}
.scrollers
{
font-size: 12px;
text-align: left;
}
/* this is an example page. Real-use cases should never have inline CSS like this. ;) */


.dialog {
 width:100%;
 margin:0px auto;
 min-width:20em;
 max-width:800px; /* I only cut the left background images out to 800px. You could do much larger, etc. */
 color:#fff;
}

.dialog .hd .c,
.dialog .ft .c {
 font-size:1px; /* ensure minimum height */
 height:11px;
}

.dialog .ft .c {
 height:14px;
}

.dialog .hd {
 background:transparent url(images/boxes/tl.png) no-repeat 0px 0px;
 margin-right:14px; /* space for right corner */
}

.dialog .hd .c {
 background:transparent url(images/boxes/tr.png) no-repeat right 0px;
 margin-right:-14px; /* pull right corner back over "empty" space (from above margin) */
}

.dialog .bd {
 background:transparent url(images/boxes/ml.png) repeat-y 0px 0px;
 margin-right:6px;
}

.dialog .bd .c {
 background:transparent url(images/boxes/mr.png) repeat-y right 0px;
 margin-right:-6px;
}

.dialog .bd .c .s {
 margin:0px 8px 0px 4px;
 background:#000 url(images/boxes/ms.jpg) repeat-x 0px 0px;
 padding:1em;
}

.dialog .ft {
 background:transparent url(images/boxes/bl.png) no-repeat 0px 0px;
 margin-right:14px;
}

.dialog .ft .c {
 background:transparent url(images/boxes/br.png) no-repeat right 0px;
 margin-right:-14px;
}

/* content-specific */

.dialog h1 {
 /* header */
 font-size:2em;
 margin:0px;
 padding:0px;
 margin-top:-0.6em;
}

p {
 font-family:verdana,tahoma,arial,"sans serif";
}

.dialog p {
 margin:0.5em 0px 0px 0px;
 padding:0px;
 font:0.95em/1.5em arial,tahoma,"sans serif";
}