.contenedornivelColor{
width: 100%;
}
.nivelColorRojo{
  
  
 
  
  justify-content: space-around;
  align-items: center;
  
  background-color: rgba(192, 57, 43,0.8);
  color: #fff;
}
.nivelColorNaranja{
   
  
  justify-content: space-around;
  align-items: center;
  
  background-color: rgba(202, 111, 30,0.8);
  color: #fff;
}
.nivelColorAmarillo{
   
  
  justify-content: space-around;
  align-items: center;
  
  background-color: rgba( 241, 196, 15, 0.8  );
  color: #000;
}
.nivelColorVerde{
   
  
  justify-content: space-around;
  align-items: center;
  
  background-color: rgba(  39, 174, 96 , 0.8  );
  color: #000;
}
.nivelColorVerdeClaro{
   
  
  justify-content: space-around;
  align-items: center;
  
  background-color: rgba(   171, 235, 198  , 0.8  );
  color: #000;
}
.nivelColorAzul{
   
  
  justify-content: space-around;
  align-items: center;
  
  background-color: rgba(133, 193, 233, 0.8  );
  color: #000;
}
.nivelColorAzulOscuro{
   
  
  justify-content: space-around;
  align-items: center;
  
  background-color: rgba(26, 82, 118, 0.8  );
  color: #fff;
}
@media (max-width: 1068px) {

}



#colorca1{
  padding: 6px;
  min-height: 20px;
  min-width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  background: rgba(174, 214, 241 , 0.8);
   }
  
   #colorca2{
  padding: 6px;
  min-height: 20px;
  min-width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  background: rgba(14, 102, 85, 0.8);
   }
   #colorca3{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  color: black;
  background: rgba(218, 247, 166 , 0.8);
   }
    #colorca4{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  background: rgba(255, 0, 255, 0.8);
   }
     #colorca5{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  background: rgba(0, 0, 128, 0.8);
   }
      #colorca6{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  background: rgba(0, 0, 255, 0.8);
   }
       #colorca7{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  background: rgba(0, 128, 128, 0.8);
   }
        #colorca66{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  background: rgba(0, 255, 255, 0.8);
   }
   #colorca9{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(144, 12, 63 , 0.8);
   }
    #colorca10{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(0, 128, 0, 0.8);
   }
     #colorca11{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(0, 255, 0, 0.8);
   }
   #colorca12{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(255, 195, 0 , 0.8);
   }
    #colorca13{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(128, 128, 0, 0.8);
   }
   #colorca14{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(255, 87, 51, 0.8);
   }
    #colorca15{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(255, 255, 0, 0.8);
   }
     #colorca16{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(128, 0, 0, 0.8);
   }
     #colorca17{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(192, 192, 192, 0.8);
   }
      #colorca18{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.8);
   }
   #colorca99{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  background: rgba(118, 68, 138, 0.8);
   }
  
  
  
  
  #colorca1act{
  padding: 6px;
  min-height: 20px;
  min-width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(174, 214, 241 , 0.8);
   }
   #colorca2act{
  padding: 6px;
  min-height: 20px;
  min-width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(14, 102, 85, 0.8);
   }
   #colorca3act{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  color: black;
  border: 2px solid #FFFFFF;
  background: rgba(218, 247, 166 , 0.8);
   }
    #colorca4act{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(255, 0, 255, 0.8);
   }
     #colorca5act{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(0, 0, 128, 0.8);
   }
      #colorca6act{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(0, 0, 255, 0.8);
   }
       #colorca7act{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(0, 128, 128, 0.8);
   }
        #colorca66act{
  padding: 6px;
  height: 20px;
  width: 20px;
  float: left;
  font-size: 12px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(0, 255, 255, 0.8);
   }
   #colorca9act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(144, 12, 63 , 0.8);
   }
    #colorca10act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(0, 128, 0, 0.8);
   }
     #colorca11act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(0, 255, 0, 0.8);
   }
   #colorca12act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(255, 195, 0 , 0.8);
   }
    #colorca13act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(128, 128, 0, 0.8);
   }
   #colorca14act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(255, 87, 51, 0.8);
   }
    #colorca15act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(255, 255, 0, 0.8);
   }
     #colorca16act{
  float: left;
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(128, 0, 0, 0.8);
   }
     #colorca17act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(192, 192, 192, 0.8);
   }
      #colorca18act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(0, 0, 0, 0.8);
   }
   #colorca99act{
  padding: 6px;
  height: 20px;
  font-size: 12px;
  width: 20px;
  float: left;
  border-radius: 50%;
  border: 2px solid #FFFFFF;
  background: rgba(118, 68, 138, 0.8);
   }