.footer-label path {
  transition: fill 0.3s ease;
}
.footer-label.footer-flash path {
  fill: #9FB065;
}

.header-icon {
  border-color: rgba(205, 211, 186, 0);
  transition: width 0.3s ease, border-color 0.3s ease, background 0.1s ease;
  overflow: hidden;
}
.header-icon-label {
  opacity: 0;
  transition: opacity 0.3s ease;
  white-space: nowrap;
}
.header-icon:hover {
  width: 190px;
  border-color: #cdd3ba;
  background-color: #FBFBF1;
}
.header-icon.short:hover {
  width: 140px;
  border-color: #cdd3ba;
  background-color: #FBFBF1;
}
.header-icon:hover .header-icon-label {
  display: block;
  opacity: 1;
  transition: opacity 0.5s ease 0.5s;
}
.header-icon:active svg :not(.static-fill) {
  fill: #9FB065;
}
.header-icon:active .header-icon-label {
  color: #9FB065;
}
.header-icon:active {
  background-color: #FBFBF1;
}

.eye-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.eye-svg {
  display: block;
  margin: 0 auto;
}
.pupil {
  transition: cx 0.3s ease;
}
.category-link:hover .eye .eye-container .pupil {
  cx: 13;
}

	.btn-area:hover path {
    stroke: #9FB065;
  }
 	.btn-area:hover .text16 {
  	color: #9FB065;
  }
  .btn-area path {
    transition: stroke 0.2s ease;
  }
 	.btn-area .text16 {
  	transition: color 0.2s ease;
  }