FbGadgets

----------------------------------------------------------------------------------------------------

Read More:
http://fbgadgets.blogspot.co.uk/2014/06/label-widget-rainbowmulti-colour-style.html
http://fbgadgets.blogspot.co.uk/2014/05/label-widget-simple.html
http://fbgadgets.blogspot.co.uk/2014/08/multi-color-label-cloud-widget.html
http://www.color-names.com/

FIND B SKIN TAG AND REPLACE :

]]></b:skin>


-----------------------------------------------------------------------------------------------------


.cloud-label-widget-content {
text-align: left;
}
.label-size {
background: #5498C9;
display: block;
float: left;
margin: 3px 3px 0 0;
color: #fff;
font-family: 'Open Sans',"Segoe UI",Arial,Tahoma,sans-serif;
font-size: 11px;
text-transform: uppercase;
}
.label-size:last-child {
margin-bottom: 3px;
}
.label-size:nth-child(1) {
background: #F53477;
}
.label-size:nth-child(2) {
background: #89C237;
}
.label-size:nth-child(3) {
background: #44CCF2;
}
.label-size:nth-child(4) {
background: #01ACE2;
}
.label-size:nth-child(5) {
background: #94368E;
}
.label-size:nth-child(6) {
background: #A51A5D;
}
.label-size:nth-child(7) {
background: #555;
}
.label-size:nth-child(8) {
background: #f2a261;
}
.label-size:nth-child(9) {
background: #00ff80;
}
.label-size:nth-child(10) {
background: #b8870b;
}
.label-size:nth-child(11) {
background: #99cc33;
}
.label-size:nth-child(12) {
background: #ffff00;
}
.label-size:nth-child(13) {
background: #40dece;
}
.label-size:nth-child(14) {
background: #ff6347;
}
.label-size:nth-child(15) {
background: #f0e68d;
}
.label-size:nth-child(16) {
background: #7fffd2;
}
.label-size:nth-child(17) {
background: #7a68ed;
}
.label-size:nth-child(18) {
background: #ff1491;
}
.label-size:nth-child(19) {
background: #698c23;
}
.label-size:nth-child(20) {
background: #00ff00;
}
.label-size a, .label-size span {
display: inline-block;
color: #fff !important;
padding: 4px 10px;
font-weight: bold;
}
.label-size:hover {
background: #222;
}
.label-count {
white-space: nowrap;
padding-right: 3px;
margin-left: -3px;
background: #333;
color: #fff ;
}
.label-size:hover .label-count, .label-size:focus+.label-count {
background-color: #ff6bb5;
}



]]></b:skin>


-----------------------------------------------------------------------------------------------------
OR USE THIS CODE IN THIS CASE LABEL TEXT NOT SHOW UNDERLINE
WITH THIS CODE

outline:none; text-decoration: none; 
------------------------------------------------------------------------------------------------------


.cloud-label-widget-content {
text-align: left;
}
.label-size {
background: #5498C9;
display: block;
float: left;
margin: 3px 3px 0 0;
color: #fff;
font-family: 'Open Sans',"Segoe UI",Arial,Tahoma,sans-serif;
font-size: 11px;
text-transform: uppercase;
outline:none; text-decoration: none; 
}
.label-size:last-child {
margin-bottom: 3px;
}
.label-size:nth-child(1) {
background: #F53477;
}
.label-size:nth-child(2) {
background: #89C237;
}
.label-size:nth-child(3) {
background: #44CCF2;
}
.label-size:nth-child(4) {
background: #01ACE2;
}
.label-size:nth-child(5) {
background: #94368E;
}
.label-size:nth-child(6) {
background: #A51A5D;
}
.label-size:nth-child(7) {
background: #555;
}
.label-size:nth-child(8) {
background: #f2a261;
}
.label-size:nth-child(9) {
background: #00ff80;
}
.label-size:nth-child(10) {
background: #b8870b;
}
.label-size:nth-child(11) {
background: #99cc33;
}
.label-size:nth-child(12) {
background: #ffff00;
}
.label-size:nth-child(13) {
background: #40dece;
}
.label-size:nth-child(14) {
background: #ff6347;
}
.label-size:nth-child(15) {
background: #f0e68d;
}
.label-size:nth-child(16) {
background: #7fffd2;
}
.label-size:nth-child(17) {
background: #7a68ed;
}
.label-size:nth-child(18) {
background: #ff1491;
}
.label-size:nth-child(19) {
background: #698c23;
}
.label-size:nth-child(20) {
background: #00ff00;
}
.label-size a, .label-size span {
display: inline-block;
color: #fff !important;
padding: 4px 10px;
font-weight: bold;
outline:none; text-decoration: none; 
}
.label-size:hover {
background: #222;
}
.label-count {
white-space: nowrap;
padding-right: 3px;
margin-left: -3px;
background: #333;
color: #fff ;
outline:none; text-decoration: none; 
}
.label-size:hover .label-count, .label-size:focus+.label-count {
background-color: #ff6bb5;
outline:none; text-decoration: none; 
}


------------------------------------------------------------------------------------------------------------------
YOU CAN CHANGE THIRD LABEL WITH GRADIENT COLOR
Read More:
http://www.w3schools.com/css/css3_gradients.asp
------------------------------------------------------------------------------------------------------------------



.label-size:nth-child(3) {
background: -webkit-linear-gradient(red, green, blue); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(red, green, blue); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(red, green, blue); /* For Firefox 3.6 to 15 */
background: linear-gradient(red, green, blue); /* Standard syntax */
}

------------------------------------------------------------------------------------------------------------
OR USE THIS ANIMATED STYLE
-------------------------------------------------------------------------------------------------------------


.label-size:nth-child(3) {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh78E2iPDKrJQO008UBHerLhVQykp656gNd2TwCJo2hMsPHKbvJlhAOqSnsbK-LI-RSzEHAKkMSfkWqQYlC5sByhz8SqnlTZXRKVMBAOEA6wfIowFuxUN9sprlxqaWGzHzgEyNiJilQ_pMj/s300-c/Stars.gif);
display:block;
width:260px;
height:30px;
-webkit-border-radius: 28;
-moz-border-radius: 28;
border-radius: 28px;
font-size: 20px;
padding: 10px 20px 10px 20px;
text-decoration: none
}
=======================================================================

=======================================================================
=======================================================================
OR USE THESE BASIC COLORS & IDEAS
https://za.pinterest.com/pin/302867143671950229/
=======================================================================