html, body {margin:0; padding:0; height:100%;}
html>body #wrap {height:100%;}
#menu {width:100%; height:10px;}
html>body #menu {position:fixed; z-index:1;}
html>body #content-wrap {padding-top:50px; height:100%;} 
html>body #content {padding-top:50px;} 
html>body #video {height:100%;}
#fondcours{background-color:#ffd;}

#menu{color:#a00; text-align:center;}
#content-wrap, #content {padding-top:50px; background:#ffd; text-align:center;}
#index{width:65%; margin:0 auto; text-align:left; color:#400; padding:5px; background-color:#fc4;}

html, body {color:#ffd; background:#ffd;}/*ne videbla*/
body {font:15px sans-serif;}

h1{font-size:50px; width:100%; text-align:center; color:#400; padding-top:10px; margin-top:0; margin-bottom:20px;}
#titre{font-family:monospace; font-style:normal; font-size:80px;}
#soustitre{font-family:monospace; font-style:normal; font-size:18px;}
h2{font-size:30px; width:100%; text-align:center; color:#400; margin-top:0; margin-bottom:0;}
h3{font-size:23px; width:100%; text-align:center; color:#400; margin-top:0; margin-bottom:0;}
h4{text-indent:15px; font-size:20px; width:100%; text-align:left; color:#400; margin-top:0; margin-bottom:0;}

/*Index*/
h2.index{font-family:monospace; text-indent:43px; text-align:left; margin-top:10px;}
h3.index{font-family:monospace; text-indent:43px; text-align:left; }
p.index{text-indent:43px; margin-left:0; padding-left:0;}
p.pindex{text-indent:7%; font-size:15px; margin-left:15px;}

p{text-indent:4%; font-size:20px; margin-left:0.5em; margin-right:0.5em; padding-left:0.25em; padding-right:0.25em; 
margin-top:0; margin-bottom:0; text-align:left; color:#400;}
.attention{font-style:normal; color:#a00;}
.vert{font-style:normal; color:#ffd;}
.enrouge{font-style:normal; font-weight:bold; color:#a00;}
.kong{font-style:normal; font-weight:bold; color:#474;}
.shang{font-style:normal; font-weight:bold; color:#2af;}
.kio{font-style:normal; font-weight:bold; color:#22f;}
.tche{font-style:normal; font-weight:bold; color:#a00;}
.yu{font-style:normal; font-weight:bold; color:#fb2;}
.enorange{font-style:normal; font-weight:bold; color:#c40;}
.enjaune{font-style:normal; font-weight:bold; color:#ee0;}
.u{font-style:normal; text-decoration:underline;}
.centre{text-indent:0; text-align:center;}
.petit{font-style:normal; font-size:15px;}
.petitcentre{text-indent:0; font-size:15px; text-align:center;}
.sup{font-style:normal; vertical-align:super; font-size:10px;}
.survert{font-style:normal; background-color:#4d7;}
.surjaune{font-style:normal; background-color:yellow;}
.mono{font-style:normal; text-indent:4%; font-family:monospace; margin-left:0.5em; margin-right:0.5em;}
.centren{text-indent:0; font-size:15px; margin-bottom:5px; text-align:center; font-weight:bold;}
.noir{font-style:normal; font-size:15px; color:#400;}
.cache{visibility:hidden; clear:both;}
#suno{float:right; margin-right:7em;}

img{border:0 none; text-indent:0px; margin-left:10px; padding-left:0; padding-right:0; margin-top:10px; margin-bottom:0; clear:both;}
/*img class=" ">*/
.droite{float:right; margin-right:10px;}
.droit{float:right; margin-right:200px;}
.droiteEG{float:right; margin-right:100px;}

/*<em class=" ">*/
.surjaune{font-style:normal; background-color:yellow;}
.surrouge{font-style:normal; background-color:red;}
.survert{font-style:normal; background-color:#4d7;}
.survertfluo{font-style:normal; color:#400; background-color:#6f9;}
.surorange{font-style:normal; background-color:#f60;}
.enbleu{font-style:normal; font-weight:bold; color:#3cf;}
.enjaune{font-style:normal; font-weight:bold; color:#f90;}
.enjaunep{font-style:normal; font-weight:bold; color:#f90; font-size:15px;}
.enrouge{font-style:normal; font-weight:bold; color:#f00;}
.enrougef{font-style:normal; font-weight:bold; color:#900;}
.envert{font-style:normal; font-weight:bold; color:#090;}
.ennoir{font-style:normal; color:#ffd;}
.noir{font-style:normal; font-size:15px; color:#400;}
.strike{font-style:normal; text-decoration:line-through;}
.u{font-style:normal; text-decoration:underline; color:#400;}
.unoir{font-style:normal; text-decoration:underline; color:#400;}
.blink{font-style:normal; text-decoration:blink;}
.petit{font-style:normal; font-size:15px; color:#ffd; color:#400;}
.b{font-style:normal; font-weight:bold;}
.sup{font-style:normal; vertical-align:super; font-size:10px;}
.blague{font-family:serif; font-style:normal; font-weight:bold; text-decoration:blink; color:#f00;}

/*Échelles, Modes, Gammes*/
.echel{margin-left:35%; margin-right:35%; padding:0.5em; background-color:#ffd;}
#degnot{text-indent:4%; font-size:20px; margin-left:3%; margin-right:3%; padding:0.5em; margin-top:0; margin-bottom:0; 
color:#ffd; background-color:#f00;}
#degin{text-indent:4%; font-size:20px; margin-left:3%; margin-right:3%; padding:0.5em; margin-top:0; margin-bottom:0; 
color:#ffd; background-color:#f60;}
.do{font-style:normal; font-weight:bold; color:#f00;}
.re{font-style:normal; font-weight:bold; color:#f80;}
.mi{font-style:normal; font-weight:bold; color:#fd0;}
.fa{font-style:normal; font-weight:bold; color:#3f3;}
.sol{font-style:normal; font-weight:bold; color:#0ff;}
.la{font-style:normal; font-weight:bold; color:#05f;}
.si{font-style:normal; font-weight:bold; color:#c0c;}
.surdo{width:70px; font-style:normal; font-weight:bold; background-color:#f00;}
.surre{width:70px; font-style:normal; font-weight:bold; background-color:#f80;}
.surmi{width:70px; font-style:normal; font-weight:bold; background-color:#fd0;}
.surfa{width:70px; font-style:normal; font-weight:bold; background-color:#3f3;}
.sursol{width:70px; font-style:normal; font-weight:bold; background-color:#0ff;}
.surla{width:70px; font-style:normal; font-weight:bold; background-color:#05f;}
.sursi{width:70px; font-style:normal; font-weight:bold; background-color:#c0c;}
.vide{width:70px; font-style:normal; font-size:15px; font-weight:bold; background-color:#333;}
.ton{font-style:normal; font-size:17px; text-decoration:underline; color:#ffd;}
.tab{table-layout:fixed; width:90%; margin-left:auto; margin-right:auto; font-style:normal; background-color:#ffd;}
.blanc{font-style:normal; font-weight:normal; color:#ffd;}
.surgris{font-style:normal; font-weight:normal; background-color:#ccc;}
.gam{width:70px; background-color:#555;}
.alt{text-indent:0; font-size:20px; margin-left:10%; padding-left:0; margin-top:0; margin-bottom:0; text-align:left; color:#400;}

.tuning{table-layout:fixed; width:70%; margin-left:auto; margin-right:auto; font-style:normal; background-color:#400;}
.harpe{table-layout:fixed; width:95%; margin-left:auto; margin-right:auto; font-style:normal; background-color:#400;}
.celt{width:115px; font-weight:normal; background-color:#ffd; color:#400; text-align:center;}
.lev{width:115px; background-color:#fd0; color:#400; text-align:center;}
.X{width:115px; background-color:#ccc; color:#400; text-align:center;}
.surlev{font-style:normal; font-weight:bold; background-color:#fd0;}

/*<div class=" ">*/
.vert{width:75%; border:1px solid black; margin:5px auto; text-align:left; font-size:16px; padding:10px; background-color:#3f3; 
border-radius:8px; box-shadow:2px 2px 1px #200;}
.gris{text-indent:4%; font-size:20px; margin-left:0.5em; margin-right:0.5em; 
padding:0.5em; margin-top:0; margin-bottom:0; text-align:left; color:#ffd; background-color:#ffd;}
.listec{text-indent:10em; font-size:20px; margin-left:0; margin-right:0.5em; padding-left:0.25em; padding-right:0.25em; margin-top:0; margin-bottom:0; text-align:left; color:#400;}
.boxa{width:30%; border:10px solid red; margin:0 auto; text-align:left; font-size:17px; color:#400; padding-top:10px;background-color:#ffd700;}
.box{width:75%; border:1px solid black; margin:5px auto; text-align:left; font-size:16px; padding:10px; background-color:#ffb; 
border-radius:8px; box-shadow:2px 2px 1px #400;}
.boxgtr{width:80%; margin:0 auto; text-align:left; color:#400; padding-top:10px; 
padding-bottom:10px; background-color:#ffa500;}
.rouge{text-indent:4%; font-size:20px; margin-left:0.5em; margin-right:0.5em; padding-left:0.25em; padding-right:0.25em; 
margin-top:0; margin-bottom:0; text-align:left; color:#ffd; background-color:#b00;}
.boxliste{margin-right:10%; margin-left:10%; text-align:left;}
#demo{width:65%; margin:0 auto; text-align:left; font-size:13px; color:#400; padding:5px; background-color:#c33;}

.do{font-style:normal; font-weight:bold; color:#f00;}
.re{font-style:normal; font-weight:bold; color:#f80;}
.mi{font-style:normal; font-weight:bold; color:#fd0;}
.fa{font-style:normal; font-weight:bold; color:#3f3;}
.sol{font-style:normal; font-weight:bold; color:#0ff;}
.la{font-style:normal; font-weight:bold; color:#05f;}
.si{font-style:normal; font-weight:bold; color:#c0c;}


table{width:100%; background-color:#a00; color:#400;}
td{width:20%; background-color:#e70; font-weight:bold; color:#400; text-align:center;}
.ici{width:20%; background-color:#fd3; font-weight:bold;}

/*menu*/
.m:link{text-decoration:none; color:#00e; font-weight:bold;}
.m:visited{text-decoration:none; color:#00e; font-weight:normal;}
.m:hover{text-decoration:none; color:#00e; font-weight:normal; font-size:15px;}
.m:active{text-decoration:none; color:#00e; font-weight:bold;}

.img{line-height:0; text-decoration:underline; color:#400; font-weight:bold;}

a:link{text-decoration:underline; color:#00e; font-weight:bold;}
a:visited{text-decoration:underline; color:#b18; font-weight:bold;}
a:hover{text-decoration:none; color:#f00; font-weight:bold;}
a:active{text-decoration:none; color:#f80; font-weight:bold;}

/*<hr class=" ">*/
.gros{color:#400;}
.petit{width:77%;}