<style>
   /*Used with
   <div class="dropdown">
    <button class="dropbtn0">ARDUINO</button>
    <div class="dropdown-content">
       <div>
       <div>*/

 .dropbtn {
         background-color: #B00508;
        color: #FFADA8;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}


.dropbtn0 {
         background-color: #B00508;
        color: #FFADA8;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}

.dropbtn1 {
        background-color: #07B018;
        color: #DBFFC7;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}
.dropbtn2 {
        background-color: #140EB0;
        color: #BDF4FF;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}

.dropbtn3 {
        background-color: #B06509;
        color: #F1F155;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}

.dropbtn4 {
         background-color: #7D0879;
        color: #46F263;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}

 .dropbtn5 {
         background-color: #439AA8;
        color: #F2EE9E;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}
 .dropbtn6 {
         background-color: #27CFCA;
        color: #F2EE9E;
        padding: 6px;
        font-size: 16px;
        font-weight: bolder;
        border: none;
}


.dropdown {
        position: relative;
        display: inline-block;
}

.dropdown-content {

        display: none;
        position: absolute;
        background-color: #E8FDF7;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 1;
}

.dropdown-content a {
        color: black;
        padding: 3px 3px;
        text-decoration: none;
        display: block;
}

.dropdown-content a:hover {background-color: #ddd;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn0 {background-color: #B5DEB6;}
.dropdown:hover .dropbtn1 {background-color: #ACC4FA;}
.dropdown:hover .dropbtn2 {background-color: #AADCEB;}
.dropdown:hover .dropbtn3 {background-color: #CCCA89}
.dropdown:hover .dropbtn4 {background-color: #C585CC}
.dropdown:hover .dropbtn5 {background-color: #B0E3E2}
.dropdown:hover .dropbtn6 {background-color: #67CFE3}

  .buttong {
      /*green */
  font: bold 16px Arial;
  text-decoration: double;
  text-decoration: none;
    background-color: #7FEDB6;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top:5px solid #CCCCCC;
  border-right: 5px solid #333333;
  border-bottom:5px solid #333333;
  border-left: 5px solid #CCCCCC;
}
  .buttonr {
         /*red */
  font: bold 16px Arial;
  text-decoration: double;
  text-decoration: none;
    background-color: #ED4015;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top:5px solid #CCCCCC;
  border-right: 5px solid #333333;
  border-bottom:5px solid #333333;
  border-left: 5px solid #CCCCCC;
}
   .buttonb {
            /*blue */
  font: bold 16px Arial;
  text-decoration: double;
  text-decoration: none;
    background-color: #2F8BED;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top:5px solid #CCCCCC;
  border-right: 5px solid #333333;
  border-bottom:5px solid #333333;
  border-left: 5px solid #CCCCCC;
}

   .buttonbr {
          /*brown */
  font: bold 16px Arial;
  text-decoration: double;
  text-decoration: none;
    background-color: #F9CB58;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top:5px solid #CCCCCC;
  border-right: 5px solid #333333;
  border-bottom:5px solid #333333;
  border-left: 5px solid #CCCCCC;
}
   .buttonv {
          /*violet */
  font: bold 16px Arial;
  text-decoration: double;
  text-decoration: none;
    background-color: #D668FA;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top:5px solid #CCCCCC;
  border-right: 5px solid #333333;
  border-bottom:5px solid #333333;
  border-left: 5px solid #CCCCCC;
}

    .buttonlg {
          /*lgreen */
  font: bold 16px Arial;
  text-decoration: double;
  text-decoration: none;
    background-color: #D0FA88;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top:5px solid #CCCCCC;
  border-right: 5px solid #333333;
  border-bottom:5px solid #333333;
  border-left: 5px solid #CCCCCC;
}
</style>