.btn {
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  border: 0;
  border-radius: 4px;
}

.btn .icon {
  font-size: 1.3em;
  line-height: 1em;
  float: left;
}

.btn:active,
.btn:focus,
.btn:hover {
  outline: 0;
}

.btn:active {
  position: relative;
  top: 1px;
}

.form-wrapper::after {
  display: block;
  content: ' ';
  clear: both;
}

.form-wrapper .btn {
  clear: both;
}

.btn-color-fern {
  background-color: #66bf7e;
  color: #373737;
  border-bottom: 3px solid #54b76f;
  color: #efedea;
}

.btn-color-fern .icon {
  border-right: 1px solid #54b76f;
}

.btn-color-fern:active,
.btn-color-fern:focus,
.btn-color-fern:hover {
  background-color: #5fbc78;
  color: #efedea;
}

.btn-color-bondi {
  background-color: #0888b2;
  color: #373737;
  border-bottom: 3px solid #07759a;
  color: #efedea;
}

.btn-color-bondi .icon {
  border-right: 1px solid #07759a;
}

.btn-color-bondi:active,
.btn-color-bondi:focus,
.btn-color-bondi:hover {
  background-color: #0881a8;
  color: #efedea;
}

.btn-color-bay {
  background-color: #273b88;
  color: #373737;
  border-bottom: 3px solid #213274;
  color: #efedea;
}

.btn-color-bay .icon {
  border-right: 1px solid #213274;
}

.btn-color-bay:active,
.btn-color-bay:focus,
.btn-color-bay:hover {
  background-color: #253880;
  color: #efedea;
}

.btn-color-purple {
  background-color: #771d59;
  color: #373737;
  border-bottom: 3px solid #62184a;
  color: #efedea;
}

.btn-color-purple .icon {
  border-right: 1px solid #62184a;
}

.btn-color-purple:active,
.btn-color-purple:focus,
.btn-color-purple:hover {
  background-color: #6f1b53;
  color: #efedea;
}

.btn-color-grape {
  background-color: #52215e;
  color: #373737;
  border-bottom: 3px solid #421a4b;
  color: #efedea;
}

.btn-color-grape .icon {
  border-right: 1px solid #421a4b;
}

.btn-color-grape:active,
.btn-color-grape:focus,
.btn-color-grape:hover {
  background-color: #4b1e56;
  color: #efedea;
}

.btn-color-cararra {
  background-color: #f4f3f0;
  color: #373737;
  border-bottom: 3px solid #e9e7e1;
}

.btn-color-cararra .icon {
  border-right: 1px solid #e9e7e1;
}

.btn-color-cararra:active,
.btn-color-cararra:focus,
.btn-color-cararra:hover {
  background-color: #f0eeea;
}

.btn-color-cararra2 {
  background-color: #e8e6e2;
  color: #373737;
  border-bottom: 3px solid #dddad4;
}

.btn-color-cararra2 .icon {
  border-right: 1px solid #dddad4;
}

.btn-color-cararra2:active,
.btn-color-cararra2:focus,
.btn-color-cararra2:hover {
  background-color: #e3e1dc;
}

.btn-color-silver {
  background-color: #cccccc;
  color: #373737;
  border-bottom: 3px solid #bfbfbf;
}

.btn-color-silver .icon {
  border-right: 1px solid #bfbfbf;
}

.btn-color-silver:active,
.btn-color-silver:focus,
.btn-color-silver:hover {
  background-color: #c7c7c7;
}

.btn-color-mountain {
  background-color: #11ada0;
  color: #373737;
  border-bottom: 3px solid #0f968b;
  color: #efedea;
}

.btn-color-mountain .icon {
  border-right: 1px solid #0f968b;
}

.btn-color-mountain:active,
.btn-color-mountain:focus,
.btn-color-mountain:hover {
  background-color: #10a497;
  color: #efedea;
}

.btn-color-valencia {
  background-color: #dd4343;
  color: #373737;
  border-bottom: 3px solid #d92d2d;
  color: #efedea;
}

.btn-color-valencia .icon {
  border-right: 1px solid #d92d2d;
}

.btn-color-valencia:active,
.btn-color-valencia:focus,
.btn-color-valencia:hover {
  background-color: #db3a3a;
  color: #efedea;
}

.btn-color-chateau {
  background-color: #44a55a;
  color: #373737;
  border-bottom: 3px solid #3d9350;
  color: #efedea;
}

.btn-color-chateau .icon {
  border-right: 1px solid #3d9350;
}

.btn-color-chateau:active,
.btn-color-chateau:focus,
.btn-color-chateau:hover {
  background-color: #419e56;
  color: #efedea;
}

.btn-color-cotton {
  background-color: #efedea;
  color: #373737;
  border-bottom: 3px solid #e4e1dc;
}

.btn-color-cotton .icon {
  border-right: 1px solid #e4e1dc;
}

.btn-color-cotton:active,
.btn-color-cotton:focus,
.btn-color-cotton:hover {
  background-color: #ebe8e4;
}

.btn-xs {
  padding: 4px 9px 1px 10px;
  font-size: 10px;
  line-height: 1.5;
  min-width: 115px;
}

.btn-xs .icon {
  padding-right: 4px;
  margin: 0 7px 0 -1px;
}

.btn-sm {
  padding: 6px 11px 3px;
  font-size: 12px;
  line-height: 1.6;
  min-width: 140px;
}

.btn-sm .icon {
  padding-right: 5px;
  margin: 0 9px 0 -3px;
}

.btn-md {
  padding: 9px 20px 5px;
  font-size: 13px;
  line-height: 1.6;
  min-width: 175px;
}

.btn-md .icon {
  padding-right: 8px;
  margin: 0 17px 0 -9px;
}

.btn-lg {
  padding: 8px 28px 4px 30px;
  font-size: 16px;
  line-height: 1.9;
}

.btn-lg .icon {
  padding: 3px 8px 0 0;
  margin: 0 23px 0 -17px;
}

.btn-xl {
  padding: 10px 30px 6px 32px;
  font-size: 22px;
  line-height: 1.9;
  min-width: 230px;
}

.btn-xl .icon {
  padding: 3px 8px 0 0;
  margin: 0 23px 0 -12px;
}

.btn-right,
.form-wrapper .btn-right {
  float: right;
  margin: 0 0 15px 15px;
}

@media only screen and (max-width: 767px) {
  .btn-right,
  .form-wrapper .btn-right {
    float: none;
    margin: 0 0 10px;
  }
}

.btn-color-transparent {
  background-color: transparent;
  border-bottom: 3px solid transparent;
  color: #efedea;
  letter-spacing: 0;
  text-transform: none;
  color: #373737;
  text-align: left;
  border-bottom: 0;
}

.btn-color-transparent .icon {
  border-right: 1px solid transparent;
}

.btn-color-transparent:active,
.btn-color-transparent:focus,
.btn-color-transparent:hover {
  background-color: transparent;
  color: #efedea;
}

.btn-color-transparent .icon {
  font-size: 1.5em;
  color: #2a979c;
  padding-top: 0 !important;
  margin-right: 3px !important;
}

.btn-color-transparent:active,
.btn-color-transparent:active .icon,
.btn-color-transparent:focus,
.btn-color-transparent:focus .icon,
.btn-color-transparent:hover,
.btn-color-transparent:hover .icon {
  color: #11ada0;
}

.choose-buttons {
  clear: both;
}

.choose-buttons a,
.choose-buttons button {
  cursor: pointer;
  display: inline-block;
  position: relative;
  border: none;
  float: left;
  padding: 80px 0 0 65px;
  text-align: left;
  color: #65b55f;
  background: #e8e6e2;
  width: 200px;
  height: 200px;
  margin: 0 20px 15px 0;
  text-decoration: none;
  font-size: 80px;
}

@media only screen and (max-width: 767px) {
  .choose-buttons a,
  .choose-buttons button {
    padding: 59px 0 0 30px;
    width: 100px;
    height: 100px;
    font-size: 30px;
    margin-right: 10px;
  }
}

@media only screen and (min-width: 1200px) {
  .choose-buttons a,
  .choose-buttons button {
    padding: 85px 0 0 75px;
    width: 250px;
    height: 260px;
    font-size: 110px;
  }
}

.choose-buttons a span,
.choose-buttons button span {
  letter-spacing: 1px;
  position: absolute;
  display: block;
  text-transform: uppercase;
  font-size: 18px;
  line-height: 24px;
  left: 24px;
  top: 20px;
  color: #65b55f;
}

@media only screen and (max-width: 767px) {
  .choose-buttons a span,
  .choose-buttons button span {
    font-size: 11px;
    line-height: 14px;
    left: 8px;
    top: 6px;
  }
}

.choose-buttons a:last-child,
.choose-buttons button:last-child {
  margin-right: 0;
}

.choose-buttons a.active,
.choose-buttons a:hover,
.choose-buttons button.active,
.choose-buttons button:hover {
  background: #73c36e;
  color: #efedea;
  text-decoration: none;
}

.choose-buttons a.active span,
.choose-buttons a:hover span,
.choose-buttons button.active span,
.choose-buttons button:hover span {
  color: #efedea;
}

button.not-in-cart {
  min-width: 147px;
  background-color: #11ada0;
  color: #373737;
  border-bottom: 3px solid #0f968b;
  color: #efedea;
}

button.not-in-cart .remove-icon,
button.not-in-cart .remove-text {
  display: none;
}

button.not-in-cart .icon {
  border-right: 1px solid #0f968b;
}

button.not-in-cart:active,
button.not-in-cart:focus,
button.not-in-cart:hover {
  background-color: #10a497;
  color: #efedea;
}

button.in-cart {
  min-width: 147px;
  background-color: #e8e6e2;
  color: #373737;
  border-bottom: 3px solid #dddad4;
}

button.in-cart .add-action,
button.in-cart .add-text {
  display: none;
}

button.in-cart .icon {
  border-right: 1px solid #dddad4;
}

button.in-cart:active,
button.in-cart:focus,
button.in-cart:hover {
  background-color: #e3e1dc;
}

.btn-bold {
  font-weight: 800;
}