/*!***************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./app/components/Button/css.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************/
.Button01 {
  background-color: red;
  color: white;
  padding: 10px 20px;
  font-size: 16px;
  font-family: "Arial", sans-serif;
  text-align: center;
  cursor: pointer;
  outline: none;
  clip-path: polygon(10% 0, 90% 0, 100% 50%, 90% 100%, 10% 100%, 0 50%);
  transition: all 0.3s ease;
}

.Button01:hover {
  background-color: darkred; /* Darker shade on hover */
}