@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700,800');

:root {
  --primary-color  : #CC3333;
  --secondary-color: #008000;
  --bg-color       : #FFFFFF;
}

html, body {
  font-family: 'Open Sans', Arial, Helvetica;
  background-color: var(--bg-color);
}

body {
  background: linear-gradient(
    302deg,
    var(--primary-color) 30%,
    var(--secondary-color) 74%
  );
}

.site-name {
  margin        : 0;
  padding       : 0;
  color         : var(--primary-color);
  display       : inline-block;
  text-transform: uppercase;
}

.switch {
  margin  : 0.3em 0;
  position: relative;
  display : inline-block;
  width   : 46px;
  height  : 25px;
}
.switch input {
  opacity: 0;
  width  : 0;
  height : 0;
}
.slider {
  position          : absolute;
  cursor            : pointer;
  top               : 0;
  left              : 0;
  right             : 0;
  bottom            : 0;
  background-color  : #ccc;
  -webkit-transition: .4s;
  transition        : .4s;
}
.slider:before {
  position          : absolute;
  content           : "";
  height            : 18px;
  width             : 18px;
  left              : 4px;
  bottom            : 4px;
  background-color  : #FFFFFF;
  -webkit-transition: .4s;
  transition        : .4s;
}
input:checked + .slider {
  background-color: #28D672;
}
input:focus + .slider {
  box-shadow: 0 0 1px #28D672;
}
input:checked + .slider:before {
  -webkit-transform: translateX(20px);
  -ms-transform    : translateX(20px);
  transform        : translateX(20px);
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
.slider.round {
  border-radius: 34px;
}
.slider.round:before {
  border-radius: 50%;
}

.billing.hide,
.delivery.hide,
.merchant.hide {
  visibility: hidden;
  height    : 0;
}
.billing.expand,
.delivery.expand
.merchant.expand {
  height    : auto;
  visibility: visible;
}

#submitbtn.enabledbtn {
  color           : #848884;
  background-image: linear-gradient(
    #A9A9A9,
    #D3D3D3,
    #A9A9A9
  );
}
#submitbtn.enabledbtn:hover {
  color           : #FFFFFF;
  background-image: linear-gradient(
    #A9A9A9,
    #D3D3D3,
    #A9A9A9
  );
}
#submitbtn.disabledbtn {
  background-color: lightgray;
  color           : darkgray;
}
#submitbtn.disabledbtn:hover {
  background-color: lightgray;
  color           : darkgray;
}

.footer-text {
  color: white;
}