html, body {height:100%;}
	body {color:#555;font-size:100%;}
	* {margin:0;padding:0;}
	a {color:#333;}
	a.no_underline {text-decoration:none;}
	button {cursor:pointer;background:transparent;padding:1em 1em 1em 1em;border:0;outline:0;} /*outline:0;*/
	button:focus {outline:2px solid rgba(166,199,255,.5);}
	
	.topbar {position:relative;border-bottom:1px solid #ddd;background-color:white;}
	/*.topbar a {font-size:3em;font-family:"Lato",sans-serif;font-weight:400;position:absolute;color:#aaa;padding:.215em .54em;}
	.topbar a span {position:absolute;left:-9999px;}
	*/
	#content {padding:0 9% 0 6%;}
	
	h1 {text-align:center;padding:1em;font-size:1.5em;font-family:"Lato",sans-serif;font-weight:700;color:#444;}
	ul.li {}
	li:first-child {}
	li a {color:#444;border-bottom:1px solid #ddd;cursor:pointer;font-size:2em;display:block;width:100%;font-family:"Lato",sans-serif;font-weight:900;text-decoration:none;}

	li a span {display:block;padding:1em;}
	li a span.title_uge {display:block;padding:1em;}
	li a span.title_year {display:inline-block;padding:0;margin-left:.5em;font-weight:normal;color:#bbb;}
	
	.forside .topbar {border-bottom:0;}
	.forside .topbar a {display:none;}
	.forside li.li_one a {background-color:#167c80;}
	.forside li.li_one a:hover {background-color:#146f73;}
	.forside li.li_two a {background-color:#0082c8;}
	.forside li a {color:white;cursor:pointer;border:0;}
	
	/* Om os */
	body {display:flex; flex-direction:column;}
	#container {flex: 1 0 auto;}
	#footer {flex-shrink: 0;font-family:sans-serif;color:#666;font-size:100%;line-height:1.45em;line-height:1.55em;}
	
	body.om-os #content {max-width:40em;margin-top:3em;font-family:sans-serif;color:#666;font-size:100%;line-height:1.45em;}
	/*body.om-os {margin:0em;font-family:sans-serif;color:#666;font-size:100%;line-height:1.45em;}
	
	body.om-os h1 {font-size:2em;margin:1em 0em .5em 0;color:#444;}*/
	h2 {font-size:1.2em;margin:.6em 0em .3em 0;color:#555;}
	p {font-size:1.125em;}
	p strong {color:#444;}
	
	/*a {color:#666;}*/
	a.tel {text-decoration:none;}
	
	a.page_back {position:absolute;line-height:1.3em;padding:1em 2em .8em 2em;float:none;} /*display:block;position:absolute;border: 3px solid red;top: 0px;width: 10px;height: 10px;*/
	/* width:1.3em;height:3em; */
	
	/* Player */
	body.uge {background-color:#532dbe;} /* line-height: 1.4;color: #666;font-family: sans-serif;*/

	#play_container {display:none;margin-top:5em;} /*min-height:8em;*/
	#play_container_loading {opacity:.4;margin-top:4em;} /*padding:2em;*/
	#play_container_loading .lds-ring {margin-top:1.25em;}
	#player_and_loader {display:block;height:18em;overflow:hidden;}
	
	#modern {padding-bottom:60px;display:block;position:relative;float:left;text-align:center;width:360px;top:0;bottom:0;width:100%;z-index:99;}
	#modern p {font-family:'Lato',sans-serif;color:white;line-height:1.5em;}
	#modern p.player_intro {margin:0 auto;margin-top:3em;padding:0em 2em;font-size:1.3em;}
	
	#section_and_chapter {background-color:#4928a6;padding-left:1.5em;text-align:left;font-family:'Lato',sans-serif;letter-spacing:.05em;font-size:1.5em;}
	#sektioner_show {padding-left:2em;color:rgba(255,255,255,.9);padding:1.3em 0;font-weight:bold;}
	#sektioner_show span {font-weight:normal;color:rgba(255,255,255,.4);margin-left:.2em;}
	
	 @font-face {font-family:'fontello';src: url('../fonts/fontello.woff2?58996813') format('woff2'),url('../fonts/fontello.woff?58996813') format('woff'),url("../fonts/fontello.ttf?58996813") format("truetype");font-weight:normal;font-style:normal;}
	 .fontello {float:right;font-family:"fontello";font-style:normal;font-weight:normal;speak:none;display:inline-block;text-decoration:inherit;width:1em;
	      /*margin-right:.2em;margin-left:.2em;*/
	      text-align: center;/* For safety - reset parent styles, that can break glyph codes*/
		  font-variant: normal;text-transform: none;
	      /* fix buttons height, for twitter bootstrap */
	      line-height: 1em;
	      /* Animation center compensation - margins should be symmetric */
	      /* remove if not needed */
	      /* Font smoothing. That was taken from TWBS */
	      -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
		  width: auto;height: auto;line-height: 3.3em;
	   }
	
	.fontello {float:none;color:white;}
		
	/* default setup */
	span.aria_only {position:absolute;left:-9999px;}
	
	#play_prev, #play_next, #play_down {opacity:.1;}
	#play_prev.btn_active, #play_next.btn_active, #play_down.btn_active {opacity:1;}
	
	#play_container_middle {display:inline-block;margin-top:3%;margin-left:0em;}
	#play_container_down {display:inline-block;margin-left:0em;margin-top:1.5em;}
	
	.fontello:before {font-size:4em;}
	.fontello.icon-play:before {content:'\70'; padding-left:.05em;}
	.fontello.icon-pause:before {content:'\61';}
	.fontello.icon-prev:before {content:'\78'; color:rgba(255,255,255,.8)}
	.fontello.icon-next:before {content:'\7a'; color:rgba(255,255,255,.8)}
	.fontello.icon-down:before {content:'\63'; color:rgba(255,255,255,.8)}
	
	a.page_back .fontello.icon-prev:before {content:'\78'; font-size:3em;line-height:1em;color:#666;}
	
	/* IE10+ CSS */
	@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	  .fontello:before {font-size:.28em;}
	}
	
	#play_modern:active, #play_prev.btn_active:active, #play_next.btn_active:active, #play_down.btn_active:active {opacity:.7;} /*outline:3px solid rgba(255,255,255,.8);*/
	
	
		#modern .fontello.icon-play, #modern .fontello.icon-pause {width:6.2em;line-height:5.8em;}
		#modern .fontello.icon-prev, #modern .fontello.icon-next {line-height:5.2em;}
		#modern .fontello.icon-down {line-height:4em;}
		
		#modern .icon-prev {margin-right:3.2em;}
		#modern .icon-next {margin-left:3.2em;}
		
		#modern .fontello:before {font-size:8em;}
		#modern .fontello.icon-play:before {padding-left:.075em;}
		#modern .fontello.icon-prev:hover:before,
		#modern .fontello.icon-next:hover:before,
		#modern .fontello.icon-play:hover:before,
		#modern .fontello.icon-pause:hover:before,
		#modern .fontello.icon-down:hover:before {color:white;}
		
		/* IE10+ CSS */
		@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
		  #modern .fontello:before {font-size:1em;}
		}
		
	/* not used */
	body.uge #wrapper {visibility:hidden;position:absolute;top:-9000px;} /*display:block;width:1px;height:1px;margin:0;padding:0;border:0;background-color:white;width:380px;margin:20px auto;position:fixed;float:left;*/
	body.uge #wrapper li a {font-size:.875em;}
	
	/*h1 { color: #444; font-size: 1.2em; padding: 14px 2px 12px; margin: 0px; }
	h1 em { font-style: normal; color: #999; }
	a { color: #888; text-decoration: none; }*/
	#wrapper ol { padding: 0px; margin: 0px; list-style: decimal-leading-zero inside; color: #ccc; width: 360px; border-top: 1px solid #ccc; font-size: 0.9em; }
	#wrapper ol li { position: relative; margin: 0px; padding: 9px 2px 10px; border-bottom: 1px solid #ccc; cursor: pointer; }
	#wrapper ol li a { display: block; text-indent: -3.3ex; padding: 0px 0px 0px 20px; }
	#wrapper ol li ol li a {padding-left:18px;}
	#wrapper ol li ol {margin-top:.8em;}
	#wrapper ol li ol li {padding-left:0;border-bottom:0;padding-bottom:0;}
	#wrapper li.playing { color: #aaa; text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.3); }
	#wrapper li.playing a { color: #000; }
	#wrapper li.playing:before {font-family: "fontello"; content: '?';content: '\e802';content: '\6e'; width: 14px; height: 14px; padding: 3px; line-height: 14px; margin: 0px; position: absolute; left: -24px; top: 9px; color: #000; font-size: 13px; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2); }
	#wrapper li.playing a .fontello.icon-play:before {content:'\e801';content:'\70';background-color:#eee;padding: .5em .7em .5em .9em;border-radius: 2em;}
	#wrapper li.playing li a .fontello.icon-play:before {content: '';background-color:transparent;}
	
	#shortcuts { position: fixed; bottom: 0px; width: 100%; color: #666; font-size: 0.9em; margin: 60px 0px 0px; padding: 20px 20px 15px; background: #f3f3f3; background: rgba(240, 240, 240, 0.7); }
	#shortcuts div { width: 360px; margin: 0px auto; }
	#shortcuts h1 { margin: 0px 0px 6px; }
	#shortcuts p { margin: 0px 0px 18px; }
	#shortcuts em { font-style: normal; background: #d3d3d3; padding: 3px 9px; position: relative; left: -3px;
	  -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px;
	  -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); -o-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); }

	
	/*
	.icon-pause:before { content: '\e800'; }
	.icon-play:before { content: '\e801'; }*/
	/* PURPLE */
	
	/* RESPONSIVE */
	/*
	#play_container_loading {min-height:13em;margin-top:4em;}
	*/
	
	@media screen and (max-device-width: 480px) {
		#wrapper { position: relative; left: -3%; }
		#shortcuts { display: none; }
	}
	
	@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {
	 /* STYLES GO HERE */
	   .no_mobile {display:none;}
	 }
	 
	 /* one col */
	@media all and (max-width:33em) { /* 528  */ 
		body:after {content:'mobile';display:none;}
		.no_mobile {display:none;}
	}

	@media all and (max-width:23.45em) { /* 375 - iPhone 6/7/8 */ 
		#modern p.player_intro {padding-top:1.5em;padding-bottom:0em;font-size:1.0em;text-align:left;}
		#section_and_chapter {text-align:center;padding:0;}
		#sektioner_show {font-size:.875em;}
	}
	
	@media all and (max-width:22em) { /* 330px - iPhone default  */
	  #modern .icon-prev {margin-right:1.6em;}
	  #modern .icon-next {margin-left:1.6em;}
	}

    body.mobile .no_mobile {display:none;}
	
	
	
/* LOADER */

.lds-ring {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 51px;
  height: 51px;
  margin: 6px;
  border: 6px solid #fff;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}