body {
 font:normal 76% helvetica,verdana,tahoma,arial,"sans serif";
 background:#FCEAD8;
}

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

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

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

.dialog .hd {
 background:transparent url(img/lo.png) no-repeat 0px 0px;
 margin-right:25px; /* space for right corner */
}

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

.dialog .bd {
 background:transparent url(img/l.png) repeat-y 0px 0px;
 margin-right:23px;
}

.dialog .bd .c {
 background:transparent url(img/r.png) repeat-y right 0px;
 margin-right:0px;
}

.dialog .bd .c .s {
 margin:0px 23px 0px 23px;
 padding:1em;
 background:#E5E5E5;
}

.dialog .ft {
 background:transparent url(img/lu.png) no-repeat 0px 0px;
 margin-right:25px;
}

.dialog .ft .c {
 background:transparent url(img/ru.png) no-repeat right 0px;
 margin-right:-2px;
}

/* content-specific */

.dialog h1 {
 /* header */
 margin:0px;
 font-size:24px;
 margin-left:-20px;
 padding:0px;
}

.dialog h2 {
 /* header */
 text-align: right;
 font-size:16px;
 margin:0px;
 padding:0px;
}

.dialog .buttons{
 margin-right:-2px;
 text-align: right;
}

.dialog .formerror{
  color:red;
  font:16px arial,tahoma,"sans serif";
  font-weight:normal;
  font-style:italic;
  font-weight:bold;  
}
.showerror{
  border: medium double red;
  background: red;
  border-width:8px;
}

.dialog .example{
  font:15px arial,tahoma,"sans serif";
  font-weight:normal;
  font-style:italic;
}

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

.dialog p {
 margin:0.75em 0px 0px 0px;
 padding:5px;
 font:16px arial,tahoma,"sans serif";
 font-weight:bold;
 line-height:30px;
}

html>body .dialog pre {
 font-size:1.1em;
}