body{
font-family:"Arial", Arial, sans-serif;
}

h1 {
    text-align: center;
    padding-left:3em;
}
h2 {
    text-align: center;
    padding-left:3em;
}
h3 {
	left:0;
	text-align: left;
    padding-left:3em;
}
h4 {
    padding-left:3em;
}
h5 {
    padding-left:3em;
}
h6 {
    padding-left:3em;
}

p {
    padding-left:3em;
}
dl {
    padding-left:3em;
}

.col_left {
float:left;
width:25em;
}

.col_left_50 {
float:left;
width:50%;
}

.list {
    position:relative;
    padding-left:3em;
    line-height:1.7em;
}

.note {
    position:relative;
    padding-left:3em;
    float:left;
}

.flute_all {
    position:relative;
    padding-left:3em;
    font-size:.7em;
	border: 0;
	display: block;
	overflow: hidden;
}

.flute {
    position:relative;
	border: 0;
	display: block;
	height: 6em;
	overflow: hidden;
}

.flute1-1 {
    position: relative;
	border: 1px solid black;
	top:1.25em;
	height: 2.5em;
	width: 8em;
	display: block;
	float: left;
	z-index: 10;

}
.flute1-2 {
    position: absolute;
	background-color: #eee;
	border-width: 0 0 0 1px;
	border-style: solid;
	border-color: black;
	top: 0;
	height: 100%;
	width: 100%;
	display: block;
	z-index: 7;
}

.flute1-3 {
    position: absolute;
	background-color: #eee;
	border-width: 1px 0px 0px 1px;
	border-style: solid;
	border-color: black;
	top:-0.7em;
	left:-2px;
	height: 2em;
	width: 5em;
	display: block;
	float: left;
	border-radius: 3em/1em;
}

.flute1-4 {
    position:absolute;
	background-color: #fff;
	border-width: 1px 0px 0px 1px;
	border-style: solid;
	border-color: black;
	top:.4em;
	left:-5em;
	height:15em;
	width: 8em;
	display: block;
	border-radius: 5em/3.5em;
	z-index: 20;
}
.flute1-5 {
    position:relative;
	background-color: #eee;
	border: 1px solid black;
	top:.5em;
	height: 4em;
	width: 3em;
	display: block;
	float: left;
    border-radius: 2em/1em;
}

.flute1-6 {
    position:absolute;
	background-color: #fff;
	border: 0px;
	top: 2.6em;
	height: 5em;
	width: 8em;
	display: block;
	z-index: 50;
	}

.flute2 {
    position:relative;
	background-color: #eee;
	border-width: 1px 0px 1px 1px;
	border-style: solid;
	border-color: black;
	top:1.25em;
	height: 2.5em;
	width: 23em;
	display: block;
	float: left;
}

.flute3 {
    position:relative;
	background-color: #eee;
	border-width: 1px 1px 1px 0px;
	border-style: solid;
	border-color: black;
	height: 5em;
	width: 2em;
	left:-0.3em;
	display: block;
	float: left;
	border-radius: 1.8em 0em 0em 1.8em;
}

.flute-g {
    position:absolute;
	background-color: #fff;
	border: 1px solid black;
	height: 1em;
	width: 1em;
	top: -.5em;
	left: 1em;
	border-radius: 1em/1em;
}

.flute-g-half {
    position:absolute;
	background-color: black;
	border: 1px solid black;
	height: .5em;
	width: .5em;
	top: .2em;
	left: .2em;
	border-radius: .35em/.35em;
}

.flute-g-1 {
    position:absolute;
	background-color: #fff;
	border: 1px solid black;
	height: .3em;
	width: .3em;
	top: .1em;
	left: .1em;
	border-radius: .3em/.3em;
}

.flute-g-2 {
    position:absolute;
	background-color: #fff;
	border: 1px solid black;
	height: .45em;
	width: .45em;
	top: .35em;
	left: .35em;
	border-radius: .4em/.4em;
}

.g0 {
    top:1.5em;
	left:.5em;}
.g1 {left:2em;}
.g2 {left:4.5em;}
.g3 {left:7em;}
.g4 {left:9.5em;}
.g5 {left:12em;}
.g6 {left:14.5em;}
.g7 {top:0;
     left:17em;}

.gap_akt {background-color: #000;}

.trimline {padding-top:4em;clear:left;}

.rhyme{
padding-top:1em;
padding-bottom:9em;
padding-left:1em;
clear:left;
background-color:#f0f0f0;
}


.syllable_4{
position:relative;
border-top:4px solid black;
margin-right:1.2em;
width:7.5em;
display:block;
float:left;
}

.syllable_3{
position:relative;
border-top:4px solid black;
margin-right:1.2em;
width:5.5em;
display:block;
float:left;
}
.syllable_2{
position:relative;
border-top:4px solid black;
margin-right:1.2em;
width:4.5em;
display:block;
float:left;
}

.syllable_1{
position:relative;
border-top:4px solid black;
margin-right:1.2em;
width:3em;
display:block;
float:left;
}

.syllable_05{
position:relative;
border-top:4px solid black;
margin-right:1.2em;
width:1.9em;
display:block;
float:left;
}

.pause_1{
position:relative;
border:1px solid black;
margin-top:2em;
margin-right:.2em;
height:.5em;
width:1.1em;
display:block;
float:left;
}

.pause_2{
position:relative;
border:1px solid black;
margin-top:2em;
margin-right:.2em;
height:.5em;
width:2.2em;
display:block;
float:left;
}

.s_d2{
margin-top:0em;
padding-top:6.4em;
}

.s_c2{
margin-top:.8em;
padding-top:5.6em;
}

.s_h1{
margin-top:1.6em;
padding-top:4.8em;
}

.s_his1{
margin-top:2em;
padding-top:4.4em;
}

.s_a1{
margin-top:2.4em;
padding-top:4em;
}

.s_g1{
margin-top:3.2em;
padding-top:3.2em;
}

.s_f1{
margin-top:4em;
padding-top:2.4em;
}

.s_fis1{
margin-top:4.4em;
padding-top:2em;
}

.s_e1{
margin-top:4.8em;
padding-top:1.6em;
}

.s_d1{
margin-top:5.8em;
padding-top:.6em;
}

.s_c1{
margin-top:6.4em;
padding-top:0em;
}

.note_name{
position:relative;
left:.6em;
font-size:1em;
font-weight:bold;
color:red;
}

.s_d2 > .note_name{
top:-7.7em;
margin-left:.1em;
}

.s_c2 > .note_name{
top:-6.9em;
margin-left:.1em;
}

.s_h1 > .note_name{
top:-6.1em;
margin-left:.1em;
}

.s_his1 > .note_name{
top:-5.7em;
margin-left:.1em;
}

.s_a1 > .note_name{
top:-5.3em;
margin-left:.1em;
}

.s_g1 > .note_name{
top:-4.5em;
margin-left:.1em;
}

.s_f1 > .note_name{
top:-3.8em;
margin-left:.1em;
}

.s_fis1 > .note_name{
top:-3.4em;
margin-left:.1em;
}
.s_e1 > .note_name{
top:-2.9em;
margin-left:.1em;
}

.s_d1 > .note_name{
top:-2em;
margin-left:.1em;
}

.s_c1 > .note_name{
top:-1.4em;
margin-left:.1em;
}

.breath{
height:3.5em;
border:2px solid blue;
width:.1em;
display:block;
float:left;
margin-right:2px;
margin-top:1.5em;
}

.repeat_s{
height:7em;
border-left:2px solid #b00;
border-right:1px solid #b00;
width:1px;
display:block;
float:left;
margin-right:1px;
margin-top:.5em;
}
.repeat_e{
height:7em;
border-right:2px solid #b00;
border-left:1px solid #b00;
width:1px;
display:block;
float:left;
margin-left:1px;
margin-top:.5em;
}

.nodisp{
visibility:hidden;
height:0;
padding:0;
}

.note_grip{
width:48%;
margin-bottom:1em;
float:left;
}
.grip_table{
margin-bottom:1em;
float:left;
}




@media print{
@page {
size: A4 landscape;}
.break{
page-break-before: always; }
body{
font-size:.6em;
margin-left:2.5em;}

.flute_all {
font-size:.5em;}
.flute {
height:5.2em;}
.note > img 
{width:70px;
  height:50px;
  padding:0;
  margin:0;
  left:0;}

.grip_table{
position:relative;
top:-2.6em;
margin:0em;
}

.cond_0{
margin-left:2.3em;}
.cond_1{
font-size:.4em;}
.noprint{
visibility:hidden;}
.breath{
border:1px solid blue;
}
.syllable_4{
border-top:2px solid black;}
.syllable_3{
border-top:2px solid black;}
.syllable_2{
border-top:2px solid black;}
.syllable_1{
border-top:2px solid black;}
.syllable_05{
border-top:2px solid black;}

.note_name{
color:#b00;}
.rhyme{
background-color:#f2f2f2;}

.cond_0 .syllable_4{
margin-right:.8em;
width:6.5em;}
.cond_0 .syllable_3{
margin-right:.8em;
width:5.5em;}
.cond_0 .syllable_2{
margin-right:.8em;
width:4.3em;}
.cond_0 .syllable_1{
margin-right:.8em;
width:2.8em;}
.cond_0 .syllable_05{
margin-right:1em;
width:1.7em;}
.cond_0 .pause_1{
margin-right:.2em;
width:.7em;
}
.cond_0 .pause_2{
margin-right:.2em;
width:1.8em;}



a:link {
color:black;
background-color:white;
text-decoration:none;}
a:hover {
color:black;
background-color:white;
text-decoration:none;}
a:active {
color:black;
background-color:white;
text-decoration:none;}
a:visited {
color:black;
background-color:white;
text-decoration:none;}
}