body {
  font-family: 'Roboto', sans-serif;
  line-height:2em;
  background:#f3f3f3;
}
body * {
  position:relative;
}
.message {
  line-height: 1.4em;
  font-size: 80%;
}
button {
  display:block;
  width:75px;
  margin:1em auto;
}
.primary-500 {
  background:#005722;
  color:#fff;
}
.gone {
  display:none !important;
}
header {
  Display: flex;
    background-color: #2072b7;
    padding: 0 4%;
    padding-top: 0px;
    padding-right: 4%;
    padding-bottom: 0px;
    padding-left: 5%;
    justify-content: space-between;
  /*padding:.5em 0;*/
}
header>h2, header .quartered h2 {
  font-size: 14px;
  padding:0 .5em;
}
header .lefted {
  display:inline-block;
  width:50%;
}
header .lefted + .righted {
  display:inline-block;
  width:50%;
}
header .quartered:last-child {
  text-align: right;
}
header .quartered button {
  margin-right:18px;
}

div.md-input-box.quartered, .quartered {
  width:25%;
  display: inline-block;
}
.halfed {
  width:50%;
  display: inline-block;
}
div.md-input-box.halfed {
  width:49%;
  margin-right:1%;
  display: inline-block;
}
#selected-reward, #transaction-result {
  height:0px;
  background:rgba(255, 255, 0, 0);
  border:0px rgba(255, 255, 0, .5) solid;
  border-radius: 3px;
  font-size: 13px;
  transition: all .2s ease 0s;
  -webkit-transition: all .2s ease 0s;
  -moz-transition: all .2s ease 0s;
  -o-transition: all .2s ease 0s;
  cursor: pointer;
}
#selected-reward {
  height: auto;
}
#selected-reward>header, #transaction-result>header {
  padding: 0;
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  background: rgba(255, 255, 0, .35);
  border-bottom: 1px rgba(255, 128, 0, .35) solid;
  line-height: 1.6em;
}
 .promo-code .md-input-box.halfed {
  display: none;
}
.promo-code #expired_promo_code_text {
  display: inline-block;
}
#selected-reward .promo-code .md-input-box.halfed {
  display: inline-block;
}
#selected-reward .promo-code #expired_promo_code_text {
  display: none;
}
#transaction-result.bad>header {
  background: rgba(255, 167, 38, .35);
  border-bottom: 1px rgba(255, 167, 38, .35) solid;
}
#transaction-result.ok>header {
  background: rgba(128, 128, 255, 0.2);
  border-bottom: 1px rgba(128, 128, 255, 0.2) solid;
}
#selected-reward>.padded, #transaction-result>.padded {
  padding:4px;
}
#transaction-result {
  /** top:-8px; **/
}
.columns-2>div.md-input-box {
  width: 100%;
}
#transaction-result + .columns-2 {
  width: 45%;
}
#transaction-result + .columns-2 + .columns-2 {
  width: 55%;
  top: -12px;
}
#transaction-result + .columns-2>.md-input-box {
  height: 5em;
}
#page-title {
  font-size: 16px;
  color: #ffffff;
  text-shadow: -1px -1px 1px rgba(255,255,255,0.2), 1px 1px 1px rgba(0,0,0,0.6);
  width: 768px;
  max-width: 100%;
  white-space: nowrap;
}
#logo-text
{
  padding: 8px;
    position: absolute;
}
#store-id {
  position: absolute;
  top:8px;
  width:100%;
  text-align: center;
}
#tools-container, #search-container, #account-container {
  position:absolute;
  width:50%;
  top:56px;
  left:25%;
  min-width:256px;
  max-width:1024px;
  margin: 0 auto;
}
#account-container {
  z-index: 10;
  transition: all .2s ease 0s;
  -webkit-transition: all .2s ease 0s;
  -moz-transition: all .2s ease 0s;
  -o-transition: all .2s ease 0s;
}
#account-container>section>div>.padded {
  overflow-y: scroll;
}
#search-result-add-new {
  position: absolute;
  z-index:2;
  left: 33.3333%;
  top: 0;
}
#login-container {
  margin:0 auto;
  width:384px;
  z-index:4;
  opacity:1;
  transition: all .2s ease 0s;
  -webkit-transition: all .2s ease 0s;
  -moz-transition: all .2s ease 0s;
  -o-transition: all .2s ease 0s;
}
#search-container {
  z-index:3;
  opacity:0;
  transition: all .2s ease 0s;
  -webkit-transition: all .2s ease 0s;
  -moz-transition: all .2s ease 0s;
  -o-transition: all .2s ease 0s;
}
#tools-container {
  z-index:2;
  opacity:0;
  width:55%;
  transition: all .25s ease 0s;
  -webkit-transition: all .25s ease 0s;
  -moz-transition: all .25s ease 0s;
  -o-transition: all .25s ease 0s;
}
#back-to-search {
  opacity:0;
  transition: all .25s ease 0s;
  -webkit-transition: all .25s ease 0s;
  -moz-transition: all .25s ease 0s;
  -o-transition: all .25s ease 0s;
}
#search-field-container + div.inline>button:not(.z-depth-1) {
  background:#f3f3f3;
}
#action-card-search {
  margin-bottom:16px;
  width:50%;
  min-width:256px;
}
#tools-column-1, #tools-column-2, .columns-2 {
  display:inline-block;
  vertical-align:top;
  width:50%;
}
.columns-2 {
  vertical-align:bottom;
}
.action-card {
  width:95%;
  top:8px;
  min-width:256px;
  margin: 0 auto;
}
.action-card {
  margin-top:8px;
}
.action-card:first-child {
  margin-top:0;
}
.action-card>div:first-child {
  width:100%;
}
.inline {
  display:inline-block;
}
.centered {
  text-align:center;
}
.righted {
  text-align:right;
}
body .md-button.active-button, body .md-button.active-button:hover, body .md-button.active-button:active {
  cursor:default;
  background:#d3e1c4;
}
#option-buttons {
  text-align:center;
}
.anim-height {
  height:0px;
  overflow:hidden;
  transition: height .5s ease 0s;
  -webkit-transition: height .5s ease 0s;
  -moz-transition: height .5s ease 0s;
  -o-transition: height .5s ease 0s;
}
::-webkit-input-placeholder {
 color:#666;font-size:16px;
}
:-moz-placeholder { /* Firefox 18- */
 color:#666;font-size:16px;
}
::-moz-placeholder {  /* Firefox 19+ */
 color:#666;font-size:16px;
}
:-ms-input-placeholder {
 color:#666;font-size:16px;
}
div.md-input-box {
  height:64px;
  width:95%;
  vertical-align: top;
}
input:not([type=radio]) + label {
  color:#666;
  left:0em;
  top:-2.2em;
  font-size:16px;
  line-height:20px;
  font-weight:normal;
  width:100%;
  cursor:text;
  transition: all .5s ease 0s;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  display:inline-block;
  margin:0;
}
#option-buttons {
  opacity:0;
  transition: opacity .5s ease 0s;
  -webkit-transition: opacity .5s ease 0s;
  -moz-transition: opacity .5s ease 0s;
  -o-transition: opacity .5s ease 0s;
}
div.md-input-box>input.wide {
  width:100%;
}
div.md-input-box>input {
  position:absolute;
  top:1.3em;
  z-index:2;
}
div.md-input-box>input + label {
  position:absolute;
  top:1.3em;
  z-index:1;
}
input {
  color:#666;
}
input:not([type=radio]):focus + label, input.non-empty:not([type=radio]) + label {
  top:-3em;
  left: 0em;
  color:#000;
  font-size:18px;
  font-weight:700;
}
div.md-input-box>input:focus:not([type=radio]) + label, div.md-input-box>input.non-empty:not([type=radio]) + label {
  top:0em;
}
div.md-input-box>input:not([type=radio]), #transaction-amount-decimal {
  border-top:none;
  border-right:none;
  border-left:none;
  border-bottom-color:#666;
  background: transparent;
  outline:none;
  width:100%;
  font-size:18px;
  display:block;
  margin:0;
  height:32px;
  line-height:32px;
}
input, textarea, button {
  -webkit-appearance: none; /*Safari/Chrome*/
  -moz-appearance: none; /*Firefox*/
  -ms-appearance: none; /*IE*/
  -o-appearance: none; /*Opera*/
  appearance: none;
  border-radius:0;
}
.md-paper {
  margin:0;
  padding:0;
}
.md-paper>header {
  padding:10px 0 5px 0;
  left:0;
  top:0;
}
.md-paper>header>h2 {
  margin:0;
  color:#fff;
  text-shadow:-1px -1px 1px rgba(255,255,255,0.2), 1px 1px 1px rgba(0,0,0,0.6);
}
.notice {
  margin: 8px;
  border-width: 0px;
  border-color: rgba(0,0,0,.1);
  border-style: solid;
  border-radius: 4px;
  text-align:center;
  font-size: 14px;
  line-height:32px;
  height:0px;
  transition: all .5s ease 0s;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  overflow:hidden;
}
.notice.success {
  background: rgba(255, 255, 0, .25);
}
.notice.error {
  background: rgba(255, 0, 0, .25);
}
h4.name {
  margin:0;
  line-height:1.4em;
}
h5.email {
  margin:0;
  line-height:1.4em;
}
h5.phone {
  margin:0;
}
.points, .cash {
  display:inline-block;
  text-align: center;
  width:50%;
  vertical-align:top;
}
.points h5, .cash h5 {
  margin: 0;
  font-size: 3em;
  line-height:1em;
}
.padded {
  padding:16px;
}
.l-padded {
  padding:0 0 0 16px;
}
#rewards {
  height:325px;
  overflow-y:scroll;
  width:100%;
}
.reward {
  cursor:pointer;
  height:auto;
}
.reward:nth-child(odd) {
  background:rgba(0,0,0,.05);
}
.reward:nth-child(even) {
  border-bottom:1px rgba(0,0,0,.15) solid;
}
.history-row {
  line-height:1.2em;
  font-size:90%;
}
.history-row>div {
  display:inline-block;
  width:20%;
  text-align:right;
}
#history-header {
  font-weight:bold;
}
.history-row:nth-child(even) {
  background:rgba(0,0,0,.05);
}
.history-row {
  padding:8px;
}
.history-voided div {
  color:rgba(255, 0, 0, .75) !important;
}
.history-row>div.history-time {
  display:block;
  width: auto;
  text-align:left;
}
.history-row>div.history-type {
  width:40%;
  text-align:left;
}
.offer {
  line-height: 1.4em;
  font-weight:bold;
}
.expiration, .promo-code {
  display:inline-block;
  width:50%;
  font-style:italic;
  vertical-align:top;
}
.promo-code {
  text-align:right;
}
.md-paper>footer {
  padding:0 0 8px 0;
  left:0;
}
button.md-button {
  line-height:16px;
  height:32px;
  border:none;
  background:#f07e28;
  width:auto;
  font-size:11px;
  color: white;
}
#configuration-dialog .padded {
  height: 80%;
  overflow-y: scroll;
}
#configuration-dialog h4 {
  margin:.5em 0;
}
#configuration-dialog h4 {
  margin:1em 0 0 0;
}
#configuration-dialog p {
  font-style: italic;
  margin: 0 4em 1em 4em;
  border-radius: 2px;
  background: rgba(255, 255, 0, .5);
  border: 1px rgba(255, 128, 0, .5) solid;
  padding: .5em;
  line-height: 1.4em;
  text-align: center;
  font-weight: bold;
  color: #333;
}
.configuration-row>label.inline {
  width: calc(100% - 26px);
  vertical-align: top;
}
section>div {
  background:#f8f8f8;
}
/* Checkbox */
.md-container {
  display:inline-block;
  width: 20px;
  height: 20px;
  line-height: 32px;
  vertical-align: middle;
}
.md-checkbox {
  background: transparent;
  display: inline-block;
  width: 20px;
  height: 20px;
  cursor: pointer;
  text-align: center;
}
[data-md-element].md-checkbox div:last-child {
  position: absolute;
  box-sizing: border-box;
  top: 0px;
  left: 0px;
  width: 20px;
  height: 20px;
  overflow:hidden;
}
[data-md-element].md-checkbox div.box:last-child {
  border: 2px #5a5a5a solid;
}
[data-md-element].md-checkbox input {
  visibility:hidden;
}
#configuration-dialog {
  position:fixed;
  background:rgba(255, 255, 255, .9);
  height:0px;
  width:0px;
  overflow: hidden;
  transition: height .5s ease 0s, width .5s ease 0s;
  -webkit-transition: height .5s ease 0s, width .5s ease 0s;
  -moz-transition: height .5s ease 0s, width .5s ease 0s;
  -o-transition: height .5s ease 0s, width .5s ease 0s;
  z-index:25;
  padding-bottom:2%;
}
.left-aligned-half:not(.gone) + .right-aligned-half {
  display:inline-block;
  width:50%;
}
.right-aligned-half {
  text-align:right;
}
.left-aligned-half {
  display:inline-block;
  width:50%;
  text-align:left;
}
#toast {
  color:#fff;
  background:rgba(0, 0, 0, .75);
  padding:0em 2em;
  position: fixed;
  top:-512px;
  left:40%;
  height:0px;
  min-width:256px;
  white-space:nowrap;
  text-align:center;
  border-radius:2px;
  overflow:hidden;
  transition: all .5s ease 0s;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  z-index:50;
}
#dd-selector {
  overflow:hidden;
  background:rgba(255, 255, 255, .90);
  position:absolute;
  top:0;
  left:0;
  height:0px;
  width:200px;
  z-index:26;
  transition: height .5s ease 0s;
  -webkit-transition: height .5s ease 0s;
  -moz-transition: height .5s ease 0s;
  -o-transition: height .5s ease 0s;
}
.dd-wider {
  min-width:400px;
  width:inherit;
}
.dd-selectable {
  cursor:pointer;
  padding-left:8px;
  white-space:nowrap;
}
.dd-selectable:hover {
  background-color:#f3f3f3;
  box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
  -moz-box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
  -webkit-box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
  -o-box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
}
.dd-selectable.currently-selected {
  font-weight:bold;
  font-style:italic;
  font-size:17px;
  background-color:rgba(0,0,255, .05);
}
[data-options], [data-options] + label {
  cursor:pointer;
}
.ic_button {
  width:36px;
  height:36px;
  overflow:hidden;
  text-indent:-1024px;
  border: 0;
  background-color: transparent;
  padding: 0;
  margin: 0;
  display:inline-block;
  outline:none;
}
.ic_settings {
  background-size: 100%;
  background-image:url(/img/ic_settings_applications_white_18dp.png);
  background-repeat:no-repeat;
}
.ic_search {
  background-image:url(/img/ic_search_white_18dp.png);
  background-repeat: no-repeat;
  width: auto;
  text-indent: initial;
  color: #fff;
  font-weight: bold;
  letter-spacing: 1px;
  padding-left: 32px;
  padding-left: 40px;
    margin-top: 10px;
}
/* Animations Start */
[data-md-element].md-checkbox .checked.box {
  border: solid 2px;
  -webkit-animation: box-shrink 140ms ease-out forwards;
  animation: box-shrink 140ms ease-out forwards;
}

@-webkit-keyframes box-shrink {
  0% {
    -webkit-transform: rotate(0deg);
    top: 0px;
    left: 0px;
    width: 18px;
    height: 18px;
  }
  100% {
    -webkit-transform: rotate(45deg);
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
}

@keyframes box-shrink {
  0% {
    transform: rotate(0deg);
    top: 0px;
    left: 0px;
    width: 18px;
    height: 18px;
  }
  100% {
    transform: rotate(45deg);
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
}

[data-md-element].md-checkbox .checked.checkmark {
  border-left: none;
  border-top: none;
  -webkit-animation: checkmark-expand 140ms ease-out forwards;
  animation: checkmark-expand 140ms ease-out forwards;
}
.pom-activity-indicator {
  position: absolute;
  background:rgba(64, 64, 64, .25);
  border-radius:4px;
  border:1px rgba(255, 255, 255, .5) solid;
  width: 129px;
  height: 129px;
  text-align: center;
  z-index:24;
}
.pom-activity-indicator>img:first-child {
  position:absolute;
  width:97px;
  height:97px;
  top:4px;
  left:16px;
  -webkit-animation: logo-rotation 1500ms linear infinite;
  animation: logo-rotation 1500ms linear infinite;
}
.pom-activity-indicator>img:nth-child(2) {
  position:absolute;
  top:35px;
  left:47px;
}
.pom-activity-indicator>div.label {
  text-align:center;
  width: 129px;
  top: 97px;
  font-weight: bold;
}
header img{
  height: 25px !important;
  top: 1px;
  position: relative;
}
@-webkit-keyframes checkmark-expand {
  0% {
    -webkit-transform: rotate(45deg);
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
  100% {
    -webkit-transform: rotate(45deg);
    top: -4px;
    left: 6px;
    width: 10px;
    height: 21px;
    border-right-width: 2px;
    border-bottom-width: 2px;
  }
}

@keyframes checkmark-expand {
  0% {
    transform: rotate(45deg);
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
  100% {
    transform: rotate(45deg);
    top: -4px;
    left: 6px;
    width: 10px;
    height: 21px;
    border-right-width: 2px;
    border-bottom-width: 2px;
  }
}

@-webkit-keyframes logo-rotation {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes logo-rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


[data-md-element].md-checkbox .checked {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -4px;
  left: 6px;
  width: 10px;
  height: 21px;
  border: 2px #0f9d58 solid;
  border-top: none;
  border-left: none;
}

/* checkbox unchecked animations */
[data-md-element].md-checkbox .unchecked.checkmark {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  border-left: none;
  border-top: none;
  -webkit-animation: checkmark-shrink 140ms ease-out forwards;
  animation: checkmark-shrink 140ms ease-out forwards;
}

@-webkit-keyframes checkmark-shrink {
  0% {
    top: -4px;
    left: 6px; 
    width: 10px;
    height: 21px;
    border-right-width: 2px;
    border-bottom-width: 2px;
  }
  100% {
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
}

@keyframes checkmark-shrink {
  0% {
    top: -4px;
    left: 6px; 
    width: 10px;
    height: 21px;
    border-right-width: 2px;
    border-bottom-width: 2px;
  }
  100% {
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
}

[data-md-element].md-checkbox .unchecked.box {
  -webkit-animation: box-expand 140ms ease-out forwards;
  animation: box-expand 140ms ease-out forwards;
}

@-webkit-keyframes box-expand {
  0% {
    -webkit-transform: rotate(45deg);
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
  100% {
    -webkit-transform: rotate(0deg);
    top: 0px;
    left: 0px;
    width: 18px;
    height: 18px;
  }
}

@keyframes box-expand {
  0% {
    transform: rotate(45deg);
    top: 13px;
    left: 5px;
    width: 4px;
    height: 4px;
  }
  100% {
    transform: rotate(0deg);
    top: 0px;
    left: 0px;
    width: 18px;
    height: 18px;
  }
}
#processing-indicator {
  position:fixed;
  width:0px;
  height:0px;
  top:0px;
  left:0px;
  z-index:0;
  overflow: hidden;
}
#processing-indicator.active {
  background:rgba(255, 255, 255, .9);
  z-index:25;
  width: 100%;
  height: 100%;
}
#processing-indicator-message {
  padding:8px;
  background:rgba(255, 255, 0, .5);
  display:block;
  width:384px;
  margin:5em auto 0 auto;
  font-size:150%;
  text-align:center;
  font-weight:bold;
  border-radius:2px;
  border:1px rgba(255, 255, 255, .75) solid;
  box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
  -moz-box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
  -webkit-box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
  -o-box-shadow:0 1px 1.5px rgba(0,0,0,.12), 0 -1px 1.5px rgba(0,0,0,.12);
}
.spinner-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.blue {
  border-color: #4285f4;
}

.red {
  border-color: #db4437;
}

.yellow {
  border-color: #f4b400;
}

.green {
  border-color: #0f9d58;
}

.active .spinner-layer.blue {
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
}

.active .spinner-layer.red {
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
}

.active .spinner-layer.yellow {
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
}

.active .spinner-layer.green {
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
}

@-webkit-keyframes fill-unfill-rotate {
  12.5% { -webkit-transform: rotate(135deg);  } /* 0.5 * ARCSIZE */
  25%   { -webkit-transform: rotate(270deg);  } /* 1   * ARCSIZE */
  37.5% { -webkit-transform: rotate(405deg);  } /* 1.5 * ARCSIZE */
  50%   { -webkit-transform: rotate(540deg);  } /* 2   * ARCSIZE */
  62.5% { -webkit-transform: rotate(675deg);  } /* 2.5 * ARCSIZE */
  75%   { -webkit-transform: rotate(810deg);  } /* 3   * ARCSIZE */
  87.5% { -webkit-transform: rotate(945deg);  } /* 3.5 * ARCSIZE */
  to    { -webkit-transform: rotate(1080deg); } /* 4   * ARCSIZE */
}

@keyframes fill-unfill-rotate {
  12.5% { transform: rotate(135deg);  } /* 0.5 * ARCSIZE */
  25%   { transform: rotate(270deg);  } /* 1   * ARCSIZE */
  37.5% { transform: rotate(405deg);  } /* 1.5 * ARCSIZE */
  50%   { transform: rotate(540deg);  } /* 2   * ARCSIZE */
  62.5% { transform: rotate(675deg);  } /* 2.5 * ARCSIZE */
  75%   { transform: rotate(810deg);  } /* 3   * ARCSIZE */
  87.5% { transform: rotate(945deg);  } /* 3.5 * ARCSIZE */
  to    { transform: rotate(1080deg); } /* 4   * ARCSIZE */
}

@-webkit-keyframes blue-fade-in-out {
  from { opacity: 1; }
  25% { opacity: 1; }
  26% { opacity: 0; }
  89% { opacity: 0; }
  90% { opacity: 1; }
  100% { opacity: 1; }
}

@keyframes blue-fade-in-out {
  from { opacity: 1; }
  25% { opacity: 1; }
  26% { opacity: 0; }
  89% { opacity: 0; }
  90% { opacity: 1; }
  100% { opacity: 1; }
}

@-webkit-keyframes red-fade-in-out {
  from { opacity: 0; }
  15% { opacity: 0; }
  25% { opacity: 1; }
  50% { opacity: 1; }
  51% { opacity: 0; }
}

@keyframes red-fade-in-out {
  from { opacity: 0; }
  15% { opacity: 0; }
  25% { opacity: 1; }
  50% { opacity: 1; }
  51% { opacity: 0; }
}

@-webkit-keyframes yellow-fade-in-out {
  from { opacity: 0; }
  40% { opacity: 0; }
  50% { opacity: 1; }
  75% { opacity: 1; }
  76% { opacity: 0; }
}

@keyframes yellow-fade-in-out {
  from { opacity: 0; }
  40% { opacity: 0; }
  50% { opacity: 1; }
  75% { opacity: 1; }
  76% { opacity: 0; }
}

@-webkit-keyframes green-fade-in-out {
  from { opacity: 0; }
  65% { opacity: 0; }
  75% { opacity: 1; }
  90% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes green-fade-in-out {
  from { opacity: 0; }
  65% { opacity: 0; }
  75% { opacity: 1; }
  90% { opacity: 1; }
  100% { opacity: 0; }
}

#save-spinner .gap-patch {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 45%;
  width: 10%;
  height: 100%;
  overflow: hidden;
  border-color: inherit;
}

#save-spinner .gap-patch .circle {
  width: 1000%;
  left: -450%;
}

#save-spinner .circle-clipper {
  display: inline-block;
  position: relative;
  width: 50%;
  height: 100%;
  overflow: hidden;
  border-color: inherit;
}

#save-spinner .circle-clipper .circle {
  width: 200%;
}

#save-spinner .circle {
  box-sizing: border-box;
  height: 100%;
  border-width: 3px;
  border-style: solid;
  border-color: inherit;
  border-bottom-color: transparent !important;
  border-radius: 50%;
  -webkit-animation: none;
  animation: none;
}

#save-spinner .circle-clipper.left .circle {
  border-right-color: transparent !important;
  -webkit-transform: rotate(129deg);
  transform: rotate(129deg);
}

#save-spinner .circle-clipper.right .circle {
  left: -100%;
  border-left-color: transparent !important;
  -webkit-transform: rotate(-129deg);
  transform: rotate(-129deg);
}

#save-spinner.active .circle-clipper.left .circle {
  -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
  animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
}

#save-spinner.active .circle-clipper.right .circle {
  -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
  animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;
}

@-webkit-keyframes left-spin {
  from { -webkit-transform: rotate(130deg); }
  50% { -webkit-transform: rotate(-5deg); }
  to { -webkit-transform: rotate(130deg); }
}

@keyframes left-spin {
  from { transform: rotate(130deg); }
  50% { transform: rotate(-5deg); }
  to { transform: rotate(130deg); }
}

@-webkit-keyframes right-spin {
  from { -webkit-transform: rotate(-130deg); }
  50% { -webkit-transform: rotate(5deg); }
  to { -webkit-transform: rotate(-130deg); }
}

@keyframes right-spin {
  from { transform: rotate(-130deg); }
  50% { transform: rotate(5deg); }
  to { transform: rotate(-130deg); }
}

#save-spinner.cooldown {
  -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
  animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
}

@-webkit-keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}
.md-card-1-3 {
  display: inline-block;
  width: 33.3333%;
  vertical-align: top;
}
.md-card-1-3>.md-card-1-3-contents {
  margin: 8px;
  padding: 0;
  width: auto;
}
.grid-fluid {
  background:transparent;
  width: auto;
}
.md-card-1-3>.md-card-1-3-contents {
  font-size:15px;
}
.md-card-1-3>.md-card-1-3-contents>h3 {
  width: 100%;
  margin: 0;
  background: #bbe0ff;
  font-size:16px;
  height:32px;
}
.md-card-1-3>.md-card-1-3-contents>h3.accent-400 {
  background: #f07e28;
}
.search-name, .search-phone, .search-email {
  text-overflow: ellipsis;
  white-space:nowrap;
  overflow:hidden;
  padding:0 .5em;
}
.search-phone {
  height:2em;
}
.md-card-1-3>.md-card-1-3-contents>.padded.centered {
  height:6em;
}
.md-button[disabled] {
  opacity:.5;
}
[data-disabled] {
  opacity:.1;
  transition: all .2s ease 0s;
  -webkit-transition: all .2s ease 0s;
  -moz-transition: all .2s ease 0s;
  -o-transition: all .2s ease 0s;
}
#save-spinner {
  position:fixed;
  top:200px;
  left:200px;
  z-index:10;
}

[type=radio] {
  opacity:0;
  width:0px;
  height:0px;
}
[type=radio] + label {
  height:32px;
  padding-left:20px;
  cursor:pointer;
  background:url(/img/radio.png) left top no-repeat;
  display:inline-block;
}
[type=radio]:checked + label {
  background-position:0 -32px;
}
#transaction-amount {
  letter-spacing: .05em;
}
#transaction-amount, #transaction-amount-decimal {
  font-family: monospace;
  text-align:right;
  font-size: 3em;
  line-height: 1em;
  height: 1em;
  top: .4em;
  padding:0;
}
#transaction-amount-decimal {
  position: absolute;
  z-index: 1;
  width: 1.5em;
  right: 0;
  text-align: left;
  top: .5em;
  color: #666;
  font-size: 3em;
}
#currency-indicator {
  display:none;
}
#currency-indicator.currency-indicator {
  display: inline-block;
  position: absolute;
  font-size: 2.8em;
  top: .6em;
  color:#666;
}
#currency-indicator.currency-indicator + .md-input-box {
  width:100%;
  transition: all .2s ease 0s;
  -webkit-transition: all .2s ease 0s;
  -moz-transition: all .2s ease 0s;
  -o-transition: all .2s ease 0s;
}
#currency-indicator.currency-indicator + .md-input-box {
  left: 1.6em;
  width: 80%;
}
div.md-input-box>input#transaction-amount + label[for="transaction-amount"] {
  line-height: .6em;
  font-size: 1.8em;
}
.indented {
  text-indent:1.5em;
  line-height:2.2em;
  display:inline-block;
}
.mdi-content-add:before {
  content: "+";
  position: relative;
  top: -4px;
}
.empty {
  visibility: hidden;
}
#transaction-no-history {
  text-align:center;
  color:rgba(0, 0, 0, .8);
}
#tools-column-2 .action-card-account-transaction-history {
  display:none !important;
}
#measurer {
  position: fixed;
  left: 100vw;
  top: 100vh;
}
#obfuscator {
  display: none;
  margin-bottom: 1em;
}
@media (max-width:1100px) {
  #tools-container, #search-container, #account-container {
    width: 98%;
    left:0;
  }
  .mdi-content-add:before {
    top: 0px;
  }
}
@media (max-height: 690px) {
  header {
   /* padding:.125em 0;*/
    font-size: 14px;
  }
  #page-title {
    font-size: 14px;
  }
  .ic_settings {
    background-size:100%;
    width: 49px;
    height: 50px;
  }
  #tools-container, #search-container, #account-container {
    width:90%;
    left: 5%;
  }
  #search-container>section {
    display: inline-block;
    vertical-align: top;
    width:40%;
  }
  #search-container>section#action-card-search-results {
    width:60%;
    margin:0;
    left: 1%;
  }
  .grid-fluid {
    margin:0;
  }
  .md-card-1-3>.md-card-1-3-contents {
    margin-top:0;
  }
  .action-card>div, #action-card-search>div {
    /*left:8px;*/
  }
  div.md-input-box.halfed {
      width: 95%;
  }
  .md-paper>header>h2 {
    font-size:16px;
  }
  #tools-column-2 {
    left: 8px;
  }
}
@media (max-height: 690px) and (max-width:730px) {
  #search-container>section {
    display:block;
  }
  #search-container>section#action-card-search-results {
    width:100%;
  }
}
@media (max-width: 600px) {
  #tools-column-1, #tools-column-2 {
    display: block;
    width: 100%;
  }
  #tools-column-2 {
    margin-top:8px;
    margin-bottom: 2em;
    left:0px;
  }
  #tools-column-1 .action-card-account-transaction-history {
    display:none !important;
  }
  #tools-column-2 .action-card-account-transaction-history {
    display:block;
  }
  #currency-indicator.currency-indicator + .md-input-box {
    width: 100%;
  }
}
@media (max-width: 675px) {
  .expiration, .promo-code {
    font-size:12px;
  }
}
@media (max-width:924px) {
  body {
    font-size:14px;
  }
  div.md-input-box {
    height:5.5em;
  }
  #page-title {
    text-indent:-1024px;
    overflow:hidden;
  }
  #page-title>img {
    left: 1024px;
  }
  .ic_button {
    /*height:30px;*/
  }
  .quartered {
    vertical-align: top;
  }
  .ic_search {
    background-size: auto 75%;
    background-position: left;
  }
  .points h5, .cash h5 {
    margin: 0;
    font-size: 32px;
    line-height: 44px;
  }
  .padded {
    padding:8px;
  }
  .dd-selectable {
    font-size: 16px;
  }
  .md-button {
    font-size:.7em;
  }
}
@media (max-width:384px) {
  #login-container {
    width:256px;
  }
  #search-container>section {
    width:97%;
  }
  div.md-input-box.halfed {
    width: 100%;
  }
  #search-container>section#action-card-search-results {
    width: 97%;
  }
  .md-card-1-3 {
    width: 48%;
    margin: 1%;
  }
  .md-paper, .grid-fluid {
    display: inline-block;
  }
  .search-name, .search-phone, .search-email {
    padding:0;
    width: 132px;
    text-indent: 8px;
  }
  .padded {
    padding:4px;
  }
  .quartered {
    width: 32%;
  }
  #page-title {
    font-size: 9px;
    width: 100%;
    line-height: 1.4em;
  }
  .halfed {
    width: 36%;
  }
  #store-id {
    font-size: 10px;
    top:0px;
  }
  header .quartered button {
    margin-right:4px;
  }
  #back-to-search {
    font-size: 10px;
    background:transparent;
    padding-left:0;
  }
  .configuration-row {
    vertical-align: top;
    white-space: normal;
    margin-bottom: 8px;
  }
  .configuration-row:nth-child(even) {
    background:#eeeeee;
  }
  .configuration-row>label {
    width: 85%;
    line-height: 1.4em;
    left: 4px;
    top: 1px;
  }
  #action-card-account-balance {
    margin-bottom: 8px;
  }
  .md-container {
    vertical-align: top;
    top: 4px;
    left: 3px;
  }
}
#rewards>.reward .qrcode {
  display: none;
}
#selected-reward .qrcode {
  display: inline-block;
}