
.my-button {
  background-color: red; /* Initial background color */
 /* color: black; Initial text color */
   font: 16px Arial, Helvetica, Tahoma;
   font-weight: bold;
  color: black; 
  padding: 10px;
  border-radius: 5px; 
  border: none;
  cursor: pointer;
  /* transition: background-color 0.3s ease; Smooth transition for background color */
}

.my-button-on {
  background-color: red; /* Initial background color */
   font: 16px Arial, Helvetica, Tahoma;
   font-weight: bold;
  color: white; 
  padding: 10px;
  border-radius: 5px; 
  border: none;
  cursor: pointer;
  /* transition: background-color 0.3s ease; Smooth transition for background color */
}


.my-button:hover {
  background-color: red; /* New background color on hover */
  color: white;
}
.container {
    display: flex;
    justify-content: space-between; /* Or space-around, or space-evenly */
    /* border: 1px solid red; For visualization */
    padding: 10px;
}

.container div {
    background-color: red;
    padding: 5px;
    margin: 5px;
}

/*

a {
   font: 14px Arial, Helvetica, Tahoma;
   font-weight: bold;
   color: black;
   border-radius: 5px;
   padding: 5px;
  }
	   
a:hover {
  background-color: red; /* New background color on hover */
  color: white;
}
*/
