@charset "UTF-8";

/*monitor*/
/*body { background-color: #000000; }*/
/*body { color: #fff; }*/
.kbMonitor { max-width: 1440px; margin: 0 auto; margin-bottom: 100px; }
.scMonitor { max-width: 700px; margin: 0 auto; }

/*keyboard layout*/
.keyboard { color: #ffffff; background-color: #333; border: 1px solid #000; padding: 15px; display: flex; justify-content: space-between; margin-bottom: 30px; }
.functionkeys { margin-bottom: 10px; }
.functionbreak { margin-top: 62px; }
.blankline { margin-top: 52px; }

/*keys*/
.key { border: 2px solid #000; border-radius: 5px; margin: 2px; }
.keyLine { display: flex; justify-content: space-between; }
.keyLineSpecial { display: flex; justify-content: space-around; }
/*.keyLineSpecial input { border: 2px solid #000; border-radius: 5px; margin: 2px; }*/
.keyNum { display: flex; justify-content: space-between; }
.width100 { padding: 8px 18px; }
.width125 { padding: 8px 23px; }
.width150 { padding: 8px 25px; }
.width175 { padding: 8px 29px; }
.width200 { padding: 8px 33px; }
.width225 { padding: 8px 37px; }
.width300 { padding: 8px 48px; }
.width450 { padding: 8px 98px; }

/*key color*/
.oui { background-color: #777; }
.non { background-color: #444; }
.selected { background-color: #aaa; border: 2px solid #e00; }

/*description*/
.dscLine { display: flex; justify-content: space-between; margin-bottom: 20px; }
.dscKind { width: 33%; }
.dscContent { border: 3px double #000; padding: 20px 5px; height: 75px; }

/*comments*/
.comments div { border: 3px double #000; padding: 10px; margin-bottom: 30px; }

/*table*/
td { font: 8pt "Lucida Grande", Lucida, Verdana, sans-serif; width: 300px; vertical-align: top; border-bottom: 1px solid #e9ebeb; }
.index li { font: 8pt "Lucida Grande"; }
.scList { padding-left: 20px; }