/* Styles for controllers for media player */

div.controls_bar{ 
   background: #5DB7BB;
   color:#E0FFF0;
   height: 20px; width: 360px;
   font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 12px;
   opacity: 0; 
  -webkit-transition: 1s;
  transition: opacity 1s;
}

input.playpausebtn{
	background:#FF0000;
	color: #FFFFFF;
	border: none;
	margin-top: 0px; 
	width:30px;
	height:20px;
	cursor:pointer;
	opacity:0.7;
}
input.playpausebtn:hover{ opacity:1; }
input.seekslider{ width:230px; height: 7px; }
div.muslink{ color: #0000cc; font-size: 13px; font-weight: 900; cursor: pointer; }
div.muslink:hover{ color: #990066; }
div.muslink-inline{ color: #0000cc; font-size: 13px; font-weight: 900; cursor: pointer; display: inline-block; }
div.muslink-inline:hover{ color: #990066; }

/*-------------------------------------------------------------*/

/*.input{ margin: 0px; padding: 0px; height: 40px; } */

/* The slider itself */
.seekslider {
  -webkit-appearance: none;  /* Override default CSS styles */
  appearance: none;
  width: 100px; /* Full-width */
  height: 15px; /* Specified height eller 15px for smal linie */
  margin-top: 0px;
  border-radius: 5 px;  /*for afrundede ender */
  background: #ddddd3; /* Grey background #d3d3d3 */
  outline: none; /* Remove outline */
  opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
}

/* Mouse-over effects */
.seekslider:hover {
  opacity: 1; /* Fully shown on mouse-over */
}

.seekslider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 10spx; /* Set a specific slider handle width */
  height: 20px; /* Slider handle height */
  //border-radius: 30%; /* for rundt håndtag */
  background: #ddddd3; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.seekslider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 10px; /* Set a specific slider handle width */
  height: 20px; /* Slider handle height */
  border-radius: 30%; /* for rundt håndtag */
  background: #ddddd3; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

.seekslider::-moz-range-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 10px; /* Set a specific slider handle width */
  height: 20px; /* Slider handle height */
  border-radius: 30%; /* for rundt håndtag */
  background: #ddddd3; /* Green background */
  cursor: pointer; /* Cursor on hover */
}