/* fretboard stylesheet */
#statusDiv { position: relative; clear: both; text-align: left; }
#debugDiv { position: relative; display: none; text-align: left; border: 1px solid #666666; padding: 1em; margin: 10px 0; background-color: white } 
#appBox { position: relative; border-top: 2px solid #222222; margin: 20px 0; padding: 10px; 
	text-align: center; margin: auto; vertical-align: top; background-color: #EFECE1 }

#ui { width: 720px; text-align: left; padding: 0px; margin: 10px auto }
#guitarForm {}
.buttonGroup { clear: both }
/* width: 25% breaks ie6 */
.buttonColumn { width: 24.9%; float: left }
.buttonColumn p { margin: 0 0 1em 0 }

.scaleButton { width: 120px; padding: 1px 3px; margin: 2px; font-size: 10px }
.button { width: 120px; padding: 1px 3px; margin: 2px; font-size: 10px }
.modeSelect { width: 120px; padding: 1px 3px; margin: 2px; margin-bottom: 1em; font-size: 10px }
#modalFieldset { width: 130px; padding: 5px } 
#tuningSelectFieldset { width: 120px; float: right; padding: 5px; margin-right: 10px }
fieldset#dspStyleSel { width: 120px; text-align: right; float: right }
fieldset#dspStyleSel .radio { margin-right: 10px; }


#neck { clear: both; position: relative; width: 726px; height: 252px; 
 margin: 10px auto 0px auto; cursor: crosshair }
img.cell { width: 40px; height: 40px; position: absolute }
img.nut { width: 6px; height: 40px; position: absolute }
img.binding { width: 686px; height: 6px; position: absolute; }
#dTop { top: 0; left: 40px; position: absolute }
#dBottom { top: 246px; left: 40px; position: absolute }
/* move down to not cover binding */
div#string6 { top: 6px; left: 0px; position: absolute }
div#string5 { top: 46px; left: 0px; position: absolute }
div#string4 { top: 86px; left: 0px; position: absolute }
div#string3 { top: 126px; left: 0px; position: absolute }
div#string2 { top: 166px; left: 0px; position: absolute }
div#string1 { top: 206px; left: 0px; position: absolute }
img#n6 { top: 0; left: 40px }
img#n5 { top: 0; left: 40px }
img#n4 { top: 0; left: 40px }
img#n3 { top: 0; left: 40px }
img#n2 { top: 0; left: 40px }
img#n1 { top: 0; left: 40px }
img#c600 { top: 0; left: 0px }
img#c601 { top: 0; left: 46px }
img#c602 { top: 0; left: 86px }
img#c603 { top: 0; left: 126px }
img#c604 { top: 0; left: 166px }
img#c605 { top: 0; left: 206px }
img#c606 { top: 0; left: 246px }
img#c607 { top: 0; left: 286px }
img#c608 { top: 0; left: 326px }
img#c609 { top: 0; left: 366px }
img#c610 { top: 0; left: 406px }
img#c611 { top: 0; left: 446px }
img#c612 { top: 0; left: 486px }
img#c613 { top: 0; left: 526px }
img#c614 { top: 0; left: 566px }
img#c615 { top: 0; left: 606px }
img#c616 { top: 0; left: 646px }
img#c617 { top: 0; left: 686px }

img#c500 { top: 0; left: 0px }
img#c501 { top: 0; left: 46px }
img#c502 { top: 0; left: 86px }
img#c503 { top: 0; left: 126px }
img#c504 { top: 0; left: 166px }
img#c505 { top: 0; left: 206px }
img#c506 { top: 0; left: 246px }
img#c507 { top: 0; left: 286px }
img#c508 { top: 0; left: 326px }
img#c509 { top: 0; left: 366px }
img#c510 { top: 0; left: 406px }
img#c511 { top: 0; left: 446px }
img#c512 { top: 0; left: 486px }
img#c513 { top: 0; left: 526px }
img#c514 { top: 0; left: 566px }
img#c515 { top: 0; left: 606px }
img#c516 { top: 0; left: 646px }
img#c517 { top: 0; left: 686px }

img#c400 { top: 0; left: 0px }
img#c401 { top: 0; left: 46px }
img#c402 { top: 0; left: 86px }
img#c403 { top: 0; left: 126px }
img#c404 { top: 0; left: 166px }
img#c405 { top: 0; left: 206px }
img#c406 { top: 0; left: 246px }
img#c407 { top: 0; left: 286px }
img#c408 { top: 0; left: 326px }
img#c409 { top: 0; left: 366px }
img#c410 { top: 0; left: 406px }
img#c411 { top: 0; left: 446px }
img#c412 { top: 0; left: 486px }
img#c413 { top: 0; left: 526px }
img#c414 { top: 0; left: 566px }
img#c415 { top: 0; left: 606px }
img#c416 { top: 0; left: 646px }
img#c417 { top: 0; left: 686px }

img#c300 { top: 0; left: 0px }
img#c301 { top: 0; left: 46px }
img#c302 { top: 0; left: 86px }
img#c303 { top: 0; left: 126px }
img#c304 { top: 0; left: 166px }
img#c305 { top: 0; left: 206px }
img#c306 { top: 0; left: 246px }
img#c307 { top: 0; left: 286px }
img#c308 { top: 0; left: 326px }
img#c309 { top: 0; left: 366px }
img#c310 { top: 0; left: 406px }
img#c311 { top: 0; left: 446px }
img#c312 { top: 0; left: 486px }
img#c313 { top: 0; left: 526px }
img#c314 { top: 0; left: 566px }
img#c315 { top: 0; left: 606px }
img#c316 { top: 0; left: 646px }
img#c317 { top: 0; left: 686px }

img#c200 { top: 0; left: 0px }
img#c201 { top: 0; left: 46px }
img#c202 { top: 0; left: 86px }
img#c203 { top: 0; left: 126px }
img#c204 { top: 0; left: 166px }
img#c205 { top: 0; left: 206px }
img#c206 { top: 0; left: 246px }
img#c207 { top: 0; left: 286px }
img#c208 { top: 0; left: 326px }
img#c209 { top: 0; left: 366px }
img#c210 { top: 0; left: 406px }
img#c211 { top: 0; left: 446px }
img#c212 { top: 0; left: 486px }
img#c213 { top: 0; left: 526px }
img#c214 { top: 0; left: 566px }
img#c215 { top: 0; left: 606px }
img#c216 { top: 0; left: 646px }
img#c217 { top: 0; left: 686px }

img#c100 { top: 0; left: 0px }
img#c101 { top: 0; left: 46px }
img#c102 { top: 0; left: 86px }
img#c103 { top: 0; left: 126px }
img#c104 { top: 0; left: 166px }
img#c105 { top: 0; left: 206px }
img#c106 { top: 0; left: 246px }
img#c107 { top: 0; left: 286px }
img#c108 { top: 0; left: 326px }
img#c109 { top: 0; left: 366px }
img#c110 { top: 0; left: 406px }
img#c111 { top: 0; left: 446px }
img#c112 { top: 0; left: 486px }
img#c113 { top: 0; left: 526px }
img#c114 { top: 0; left: 566px }
img#c115 { top: 0; left: 606px }
img#c116 { top: 0; left: 646px }
img#c117 { top: 0; left: 686px }


