body {
	margin: 0;
	margin:0 auto;
	
	
	
}
#bg {
		
		width: 100vh;
		height: 100vh;
		
	}

		

		
		/* converter */


.titleLabel {
    font: 18px "Helvetica Neue";
	font-weight: bold;
    color: white;
    position: fixed;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
	z-index: 2;
}

.noteLabel {
    font: 14px "Helvetica Neue";
	font-weight: bold;
    color: white;
    position: fixed;
   top: 54%;
   left: 50%;
   transform: translate(-50%, -50%);
	z-index: 2;
	
}

#note {

    position: fixed;
   top: 56%;
   left: 50%;
   transform: translate(-50%, -50%);
    
	text-align:center;
    border-color: transparent;
    -apple-dashboard-region: dashboard-region(control rectangle);
	z-index: 2;
	border:1px white solid;
}

.midiLabel {
    font: 14px "Helvetica Neue";
	font-weight: bold;
    color: white;
    position: fixed;
   top: 59%;
   left: 50%;
   transform: translate(-50%, -50%);
	z-index: 2;
}

#midi {

    position: fixed;
   top: 61%;
   left: 50%;
   transform: translate(-50%, -50%);
	text-align:center;
    -apple-dashboard-region: dashboard-region(control rectangle);
	z-index: 2;
	border:1px white solid;
}

.freqLabel {
    font: 14px "Helvetica Neue";
	font-weight: bold;
    color: white;
    position: fixed;
   top: 64%;
   left: 50%;
   transform: translate(-50%, -50%);
	z-index: 2;
}

#freq {

    position: fixed;
   top: 66%;
   left: 50%;
   transform: translate(-50%, -50%);
	border:1px white solid;
	text-align:center;
    -apple-dashboard-region: dashboard-region(control rectangle);
	z-index: 2;
}

/* converter slut */



#kvintcirklen{ position: fixed;
   top: 55%;
   left: 50%;
   transform: translate(-50%, -50%);
	z-index: 1;}

}