body{font-family:Sans, Verdana;font-size:80%;color:#fff;text-align:center;background:#222;}
.clear{clear:both;height:1px;overflow:hidden;}
canvas{margin:0px auto;border:1px solid black;}

.script{background:#000;}
pre{font-size:10pt;border:1px solid #4b4b4b;background:#333;padding:10px;float:left;margin:0 25px 10px 0;}
a{color:#0088aa;}
a:hover{color:#00aaff;}
a:focus{background:#00aaff;color:#000;}
a:vistied{color:#cc0000;}
b{color:#eee;}
.strike{text-decoration: line-through;}


a img{border:none;}

#container{width:900px;margin:0 auto 50px auto;}
h1{font-size:2em;margin-bottom:0;}
h2{font-size:.9em;margin-top:0;font-weight:normal;}
#head{text-align:right;padding-top:25px;}
.noBorder{border:none;}
#headAnim{margin:0 -50px -400px 0;}
canvas#mouseTrack{position:absolute;z-index:0;}


#page{text-align:left;margin:10px auto;background:#3a3a3a;padding:40px 30px 30px 30px;border:1px solid #4b4b4b;color:#ccc;}

/*

#page{text-align:left;margin:10px auto;background:#3a3a3a;padding:40px 30px 30px 30px;border:1px solid #4b4b4b;color:#ccc;}
*/
.page{padding:40px 30px 20px 30px;background:#3a3a3a;padding:40px 30px 30px 30px;border:1px solid #4b4b4b;color:#ccc;}
h3{color:#eee;font-size:1.6em;margin:0;}
h3 a{color:inherit;text-decoration:none;font-size:.9em;}
h3 a:hover, h3 a:focus{text-decoration:underline;}
h4{color:#eee;font-size:1em;margin:0 0 20px 0;font-weight:normal;}
p.signature{font-size:.9em;font-style:italic;padding-left:20px;}
.subjecthead{text-align:center;margin:0 0 30px 0;}
p.footnote{margin:0 0 10px 0;color:#fff;font-size:.85em;}
p.IEMode{margin:0 0 5px 0;color:#fff;font-size:.85em;color:#cc8888;}
h5{color:#eee;font-size:1.2em;margin:20px 0 10px 0;}
p{margin-top:0;}


ol pre{float:none;margin:0 0 20px 0;}

div.mini-example{/*width:370px*/;margin-bottom:20px;}
div.mini-example > * {margin-left:120px;}
div.mini-canv{float:left;margin:0 20px 10px 0;width:100px;text-align:left;}
div.mini-example canvas{margin-bottom:3px;}
div.mini-canv a{font-size:.85em;color:#eee;text-decoration:none;}
div.mini-canv a:hover{color:#aaff00;text-decoration:underline;}
div.mini-canv a:focus{background:aaff00;color:#000;text-decoration:underline;}

div.mini-example h5{margin-bottom:5px;}
div.mini-example.even{margin-right:0;} 


.index {margin-top:10px;}
.index img{float:left;margin-right:10px;border:1px solid black;width:40px;height:30px;}
.index .item{margin-bottom:5px;}
.index .item p {margin:0 0 0 50px;}

div.code{float:left!important;margin-right:20px;margin-bottom:10px;}
div.code *{margin:0!important;}
strong{font-weight:normal;color:#fff;}
strong.code{font-weight:normal;color:#000;background:#fff;padding:2px;font-size:.8em;margin-right:5px;border:1px solid black}

ul.footlinks{list-style-type:none;border-top:1px solid #555;padding:10px 0 0 0;margin-top:20px;}
ul.footlinks li{float:left;color:#777;margin-right:5px;}
ul.footlinks li a{color:#777;}
ul.footlinks li a:hover{color:#aaff00;}
ul.footlinks li a:focus{background:#aaff00;color:#000;}
ul.footlinks li a:vistied{color:#cc0000;}

.source-window{position:absolute;border:1px solid #fff;background:#88aa00;display:none;padding:10px;}
.source-window .close{border:2px solid #fff;padding:3px 6px;font-weight:bold;color:#fff;background:#000;float:left;margin-right:5px;}
.source-window .close:hover{background:#aaff00;color:#000;}
.source-window .close:focus{background:#aaff00;color:#000;}
.source-window h5{color:#fff;}
.source-window div{margin:0!important;}



div.console{padding:none;color:#fff;font-size:10px;background:#000;border:1px solid #662000;}
strong.console{background:#662000;color:#fff;font-weight:normal;padding:3px;display:block!important;}

th{background:#555;font-weight:normal;padding:5px;color:#fff;}
td{padding:2px 5px;vertical-align:top;}
tr.odd{background:#3e3e3e;}
tr.even{background:#424242;}
tr.odd.hover, tr.even.hover{background:#4c5b3c;color:#fff;}
td.highlight{background:#4c5b3c;color:#fff;}
th.hover, td.hover{background:#8c9b37;color:#fff;}
td.broken{color:#f00;}
td.additional{color:#08f;}

td.hover a{color:#000;}
td.hover a:hover, td.hover a:focus{background:#fff;color:#000;}



form.canvasControls{display:block;width:320px;margin:5px auto 0 auto;text-align:right;}
form.canvasControls.double{width:650px;text-align:center;}
form.canvasControls input.smallNumber{width:30px;}
form.canvasControls input.mediumNumber{width:50px;}
form.canvasControls input.submit{}
strong.super{vertical-align:super;font-size:.6em}
form span{margin-right:10px;}




div.flipContainer{width:640px;height:480px;margin:0px auto;}
div#canvasBack{width:0px;height:480px;border:1px solid #f00;height:480px;margin:0px auto;position:absolute;display:none;margin-left:320px;}
div#canvasBack table{width:90%;margin:0 auto;}
form.recordScore{margin-top:10px;padding:10px;display:none;}
b.Yellow.Player{color:#ff0;}
b.Cyan.Player{color:#0ff;}


div#canvasBack th{background:#833;}
div#canvasBack tr.odd{background:#5a3e3e;}
div#canvasBack tr.even{background:#7a4242;}
div#canvasBack tr.odd.hover, div#canvasBack tr.even.hover{background:#b00;}
div#canvasBack td.highlight{background:#b00;}
div#canvasBack th.hover, div#canvasBack td.hover{background:#f00;}



div.floatleft{float:left;margin-right:20px;}
div.floatright{float:right;margin-left:20px;}

.border{border:1px solid black;}


form.liveCode {text-align:right;}
form.liveCode textarea{width:350px;border:1px solid black;height:150px;display:block;margin:5px 0;}


strong{font-weight:normal;color:#fff;}


.redBorder{border:1px solid #000;}
.redBorder:hover{border:1px solid #f00;}


.vertImgSeq{margin-bottom:10px;}
.vertImgSeq img{border:1px solid #888;margin-bottom:5px;}

.miniCanvasStrip{float:left;margin-right:5px;}


div.valid div.dp-highlighter{background:#E7FFDC url(../img/validProcessing.gif) no-repeat 7px 4px!important}
div.valid div.dp-highlighter div.bar,
div.valid div.dp-highlighter div.tools{height:38px;}

div.invalid div.dp-highlighter{background:#FFE5DC url(../img/invalidProcessing.gif) no-repeat 7px 4px!important}
div.invalid div.dp-highlighter div.bar,
div.invalid div.dp-highlighter div.tools{height:38px;}