* {
  margin: 0px;
  padding: 0px;
}

td {padding: 8px;}

th {text-align:right; }

/* base div styles */
#main { width:100%; height:100%; top:0px; left:0px; bottom:0px; right:0px; position:absolute; }
#header { width:750px; margin-top:25px; margin-bottom:25px; }
#content { text-align:center; }

/* div {outline: 1px solid #ff0000; } /* */

/* content div styles   float:left; width:100%   */
#title {text-align:center; font-weight:bold; font-size:23px; margin-bottom:20px; }
#description { text-align:justify;  font-size:17px; margin-bottom:20px; margin-left:20px; margin-right:20px; }
#code { margin-bottom:20px; }
#list { text-align:left; display:inline; font-weight:bold; line-height:23px; font-weight:bold; font-size:20px;}
#response { font-weight:bold; text-align:center; padding:5px; margin-left:20px; margin-right:20px; display:none;} /* overflow:hidden; */
#buttons { text-align:center; margin-top:20px; }
.errorfloat { position:absolute; border:2px solid #FF0000; width:5px; height:20px; left:100px; top:100px; display:none; z-index:100; }
.red-arrow { position:absolute; display:none; z-index:100; width:63px; left:100px; top:100px; height:50px; }
.red-arrow-top {height:55px; background:url(/media/img/red-arrow-top.png); }
.red-arrow-bar {height:100%; background:url(/media/img/red-arrow-bar.png);}
/* #errorlocation { position:absolute; border:2px solid #FF0000; width:5px; height:20px; left:100px; top:100px; z-index:100; } */

/* CodeMirror styles */
.CodeMirror-line-numbers {position:relative; width:20px; font-family:monospace; font-size:10pt; color:black; top:6px; text-align:right; background-color:#CCCCCC; padding-right:5px; }

iframe {
overflow-x: auto;
overflow-y: hidden;
}


/* Blue Box (borders) */

.bluebox { position:relative; background-color:#FFFFC7; }

.bluebox-l { background: transparent url(/media/img/borders/bluebox-l.png) repeat-y left; height:100%; width:100%; position:absolute; left:0px;}
.bluebox-r { background: transparent url(/media/img/borders/bluebox-r.png) repeat-y right; height:100%; width:100%; position:absolute; left:0px;}
.bluebox-t { background: transparent url(/media/img/borders/bluebox-t.png) repeat-x top; width:100%; height:100%; position:absolute; left:0px;}
.bluebox-b { background: transparent url(/media/img/borders/bluebox-b.png) repeat-x bottom; width:100%; height:100%; position:absolute; left:0px;}

.bluebox-tl { background: transparent url(/media/img/borders/bluebox-tl.png) no-repeat top left; height:100%; width:100%; position:absolute;  left:0px;}
.bluebox-tr { background: transparent url(/media/img/borders/bluebox-tr.png) no-repeat top right; height:100%; width:100%; position:absolute; left:0px;}
.bluebox-bl { background: transparent url(/media/img/borders/bluebox-bl.png) no-repeat bottom left; width:100%; height:100%; position:absolute; left:0px;}
.bluebox-br { background: transparent url(/media/img/borders/bluebox-br.png) no-repeat bottom right; width:100%; height:100%; position:absolute; left:0px;}

.bluebox-content {position:relative; padding:55px; }

/* Red Box (borders) */

.redbox { position:relative; background-color:#FFFFFF; margin-left:5px; }

.redbox-l { background: transparent url(/media/img/borders/redbox-l.png) repeat-y left; height:100%; width:100%; position:absolute; z-index:5; left:0px;}
.redbox-r { background: transparent url(/media/img/borders/redbox-r.png) repeat-y right; height:100%; width:100%; position:absolute; z-index:5; left:0px;}
.redbox-t { background: transparent url(/media/img/borders/redbox-t.png) repeat-x top; width:100%; height:100%; position:absolute; z-index:5; left:0px;}
.redbox-b { background: transparent url(/media/img/borders/redbox-b.png) repeat-x bottom; width:100%; height:100%; position:absolute; z-index:5; left:0px;}

.redbox-tl { background: transparent url(/media/img/borders/redbox-tl.png) no-repeat top left; height:100%; width:100%; position:absolute; z-index:10; left:0px;}
.redbox-tr { background: transparent url(/media/img/borders/redbox-tr.png) no-repeat top right; height:100%; width:100%; position:absolute; z-index:10; left:0px;}
.redbox-bl { background: transparent url(/media/img/borders/redbox-bl.png) no-repeat bottom left; width:100%; height:100%; position:absolute; z-index:10; left:0px;}
.redbox-br { background: transparent url(/media/img/borders/redbox-br.png) no-repeat bottom right; width:100%; height:100%; position:absolute; z-index:10; left:0px;}

.redbox-content {position:relative; padding-top:13px; padding-left:13px; padding-bottom:19px; padding-right:20px;  z-index:15; }