/* put a border around the canvas element */
			#canvas{
				
			} 
			
			html, body, center {
				height: 100%;
				padding: 0px;
				margin: 0px;
				overflow: auto;
			}
			
			body{
				background-color: #ededed;
				font-family: 'Open Sans', serif;
				font-size: 12px;
				line-height: 1.6;
			}

			.playerblock{
				background: #f2f2e1;  
				width: 292px;
				height: 180px;
				border: 4px; 
				border-style: solid; 
				border-color: #00aba7; 
				position: relative;
				text-align: center
			}
			
			.tekstblok{
				background-color: #ffffe2; 			
				border-top: 0px; 
				border-left: 0px; 
				border-right: 0px; 
				border-bottom:2px; 
				border-style: solid; 
				border-color: #d9d9a6; 
			}
			
			.voortgangsBalk{
				position: absolute;
				top: 85px;
				left: 32px;	
				opacity: .60;
				border-style:solid; 
				border-width:1px; 
				padding: 3px; 
				height: 16px;
				width: 220px;
			}
			
			.voortgangsKleur{
				color: rgb(0,172,0, 0.9);
				background-color: ;
				display: none;
			}
			
			.button-volume-up {
				position: absolute;
				top: 111px;
				width: 32px;
				height: 32px;
				left: 235px;
				background: url(../buttons/volume-up.png);
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
			}
			
			.button-volume-down {
				position: absolute;
				top: 111px;
				width: 32px;
				height: 32px;
				left: 30px;
				background: url(../buttons/volume-down.png);
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
			}

			.button-play {
				position: absolute;
				top: 142px;
				width: 36px;
				height: 36px;
				left: 127px;	
				background: url(../buttons/play.png);
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
			}	
			
			.button-pauze {
				position: absolute;
				top: 142px;
				width: 36px;
				height: 36px;	
				left: 127px;
				background: url(../buttons/pause.png) ;
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
			}
			.button-stop {
				position: absolute;
				top: 144px;	
				width: 32px;
				height: 32px;				
				left: 54px;
				background: url(../buttons/stop.png);
				background-size: 100% 100%;
				border: none;
				cursor: 	pointer;
			}
			.button-rewind {
				position: absolute;
				top: 144px;
				width: 32px;
				height: 32px;
				left: 90px;				
				background: url(../buttons/rewind.png);
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
			}

			.button-forward {
				position: absolute;
				top: 144px;
				width: 32px;
				height: 32px;
				left: 168px;				
				background: url(../buttons/forward.png);
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
			}

			.button-mute {
				position: absolute;
				top: 144px;
				width: 32px;
				height: 32px;
				left: 205px;
				background: url(../buttons/mute-speaker.png) ;
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
			}
			.button-unmute {
				position: absolute;
				top: 144px;		
				width: 32px;
				height: 32px;
				left: 205px;				
				background: url(../buttons/unmute-speaker.png);
				background-size: 100% 100%;
				border: none;
				cursor: pointer;
				}

			.linkerTeller{
				font-size: 13px;
				position: absolute;
				top: 87px;
				left: 36px;
			}
			.rechterTeller{
				font-size: 13px;
				position: absolute;
				top: 87px;
				left: 222px;
			}
			
			.filler {
				min-width: 300px;
				width: 80%;
				min-height: 10px;
				/*height: calc(calc(calc(calc(100% - 152px) - 188px ) - 198px ) + 0px );*/
				/*height: calc(calc(100% - 152px) - 386px)*/
				/* height: calc(100% - 538px); */
				height: calc(100% - 519px);
			}
			
			.laatsteNieuws {
				width: 300px;
				background-color: #FFFFFF;
				padding-bottom: 1em;
				max-height: 180px;
				overflow-y: auto;
			}
			
			.laatsteNieuws a{
				color: #000000 !important;	
			}
			
			.laatsteNieuwsTitel {
				font-weight: bold;
				font-size: 1.3em;
			}
			
			.footer {
				background-color: #2D2D2D;
				color: #ededed;
				bottom: 0px;
				width: 100%;
				left: 0px;
				line-height: 24px;
				vertical-align: top;
			}
			
			.cookiebar {
				background-color: #2D2D2D;
				color: #ededed;
				position: absolute;
				top: 0px;
				width: 100%;
				left: 0px;
				text-align: center;
				padding-bottom: 0.5em;
			}
			
			.cookiebar a{
				color: #ededed;
				cursor: pointer;
				text-decoration: none;
				font-weight: bold;
			}

			.pdatumtijd{
				position:absolute;	
				top: 37px;
				left: 49px;	
				font-size: 11px;
			}
			
			.pos-volume-canvas{
				position: absolute;	
				top: 115px;			
				left: 55px;
				width: 176px;
				heigth: 14px;
				opacity:.40;
				border-style:solid; 
				border-width:1px;  
				padding:1px; 
				background: #efefda;
			}

			.pos-volume-txt{
				position:absolute;	
				top: 118px;			
				left: 100px;
				font-weight:bold;
			}
			.pos-volume-level{
				position:absolute;	
				top: 118px;			
				left: 154px;
				width: 30px;
				background: #efefda;
				border: 0; 
				/* color: #f6931f;  */
				font-weight: bold;
			}