.colorchange{color:green; margin-right:15px; opacity:0.7} 
.colorchange:hover{color:green; margin-right:15px;opacity:1}

.play{color:#32AE01; margin-right:3px; opacity:1} 
.playoff{color:#608B83; margin-right:3px;opacity:0.7}
.playoff:hover{color:#32AE01; margin-right:3px;opacity:1}

.pause{color:#f6b26b; margin-right:3px; opacity:1} 
.pauseoff{color:#608B83; margin-right:3px;opacity:0.7}
.pauseoff:hover{color:#f6b26b; margin-right:3px;opacity:1}

.stop{color:#e06666; margin-right:3px; opacity:1} 
.stopoff{color:#608B83; margin-right:3px;opacity:0.7}
.stopoff:hover{color:#e06666; margin-right:3px;opacity:1}

.colorchange2>a{color:#f9be4e; margin-right:15px;}
.colorchange2>a:hover{color:#f9be4e; margin-right:15px;}

.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptexttop {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
  
  
}
.tooltip .tooltiptextdown {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
  
}

.tooltip .tooltiptexttop::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

.tooltip .tooltiptextdown::after {
  content: " ";
  position: absolute;
  bottom: 100%;  /* At the top of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent black transparent;
}

.tooltip:hover .tooltiptexttop {
  visibility: visible;
}

.tooltip:hover .tooltiptextdown {
  visibility: visible;
}

.activeplay{ margin-right:3px; color:#32ae01; opacity:1}
	
.activewhite{ margin-right:3px; color:#fda538; opacity:1}

.activestop{ margin-right:3px; color:#fb2323; opacity:1}

.deactivpic {display:none}


.curs {
cursor: pointer;
}

.storm {
 width:1px; 
 height:1px;
 overflow:hidden;
}

.tooltip2 {
  position: relative;
  display: inline-block;
}

.tooltip2 .tooltiptexttop2 {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
  
  
}
.tooltip2:hover .tooltiptexttop2 {
  visibility: visible;
}