/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  typography
- - - - - - - - - - - - - - - - - - - - - - - - - - */

@font-face {
  font-family: 'FuturaNext-Light';
  src: url('https://1979.ws/inc/woff/FuturaNext-Light.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FuturaNext-Book';
  src: url('https://1979.ws/inc/woff/FuturaNext-Book.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FuturaRound-Light';
  src: url('https://1979.ws/inc/woff/FuturaRound-Light.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FuturaRound-LightOblique';
  src: url('https://1979.ws/inc/woff/FuturaRound-LightOblique.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FuturaRound-Book';
  src: url('https://1979.ws/inc/woff/FuturaRound-Book.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FuturaRound-BookOblique';
  src: url('https://1979.ws/inc/woff/FuturaRound-BookOblique.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FuturaRound-Medium';
  src: url('https://1979.ws/inc/woff/FuturaRound-Medium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FuturaRound-MediumOblique';
  src: url('https://1979.ws/inc/woff/FuturaRound-MediumOblique.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FuturaRound-Demi';
  src: url('https://1979.ws/inc/woff/FuturaRound-Demi.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FuturaRound-DemiOblique';
  src: url('https://1979.ws/inc/woff/FuturaRound-DemiOblique.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FuturaRound-Bold';
  src: url('https://1979.ws/inc/woff/FuturaRound-Bold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FuturaRound-BoldOblique';
  src: url('https://1979.ws/inc/woff/FuturaRound-BoldOblique.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  generica
- - - - - - - - - - - - - - - - - - - - - - - - - - */

* {
	margin: 0px;
	padding: 0px;
}

html,
body {
  height: 100%;
	color: black;
	background-size: cover;
	background: #005DA6 url('https://1979.ws/inc/img/1979_bg.jpg') no-repeat center center fixed;
  @supports (background-image: url('https://1979.ws/inc/img/1979_bg.webp')) {
  	background: #005DA6 url('https://1979.ws/inc/img/1979_bg.webp') no-repeat center center fixed;
  }
  box-sizing: border-box;
  font-family: 'Futura Next', sans-serif;
	font-size: 1em;
  font-variant-ligatures: none;
}

.hidden {
  display: none;
}
.invisible {
  visibility: hidden;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  layout: overall
- - - - - - - - - - - - - - - - - - - - - - - - - - */


#envelope {
  text-align: center;
  padding-bottom: 100px;
  display: block;
}

.nav,
#content { 
  margin: 0 auto;
  width: 1024px;
  max-width: 1024px;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  layout: nav
- - - - - - - - - - - - - - - - - - - - - - - - - - */

.nav.header {
  margin: 50px auto;
}
.nav ul {
  margin-left: 50px;
  padding: 0 50px;
  display: flex;
  align-items: stretch;
  width: 100%;
  margin: 0;
  padding: 0;
}
.nav li {
  line-height: 0;
  justify-content: flex-end;
}
.nav li:not(.logo) {
  margin-left: 50px;
}
.nav li.logo {
  margin-right: auto;
}

.nav li {
  align-self: center;
  display: block;
  flex: 0 1 auto;
  list-style-type: none;
}
.nav li:last-of-type {
  padding-right: 50px;
}
.nav li a {
  letter-spacing: 0.1em;
  text-decoration: none;
  font-size: 1.25em;
  font-family: 'FuturaRound-Medium', sans-serif;
  text-transform: uppercase;
}
.nav .logo {
  text-align: left;
  margin-left: 50px;
}
.nav .logo img {
  width: 90%;
}
.nav .current a {
/*   font-family: 'FuturaRound-Bold', sans-serif; */
}
.nav span.cart-count {
  display: inline-block;
  border-radius: 5px;
  text-align: left;
  padding: 20px 15px;
  margin-left: 10px;
  letter-spacing: 0em;
  font-family: 'FuturaRound-Bold', sans-serif;
  min-width: 16px;
}
.nav li:last-child {
  color: red !important;
  margin-top: -3px;
}

.nav.header li a {
  opacity: 0.4;
  color: white;
}
.nav.header a:hover {
  opacity: 0.8;
  transition: 200ms;
  transition-timing-function: ease-in;
}
.nav.header .logo a {
  opacity: 1;
}
.nav.header svg * { 
  fill: white;
}
.nav.header .logo a:hover {
  opacity: 1;
}
.nav.header .current a {
  opacity: 1;
}
.nav.header span.cart-count {
  background-color: #1EB85F;
  color: white;
  background-color: #F8E034;
  color: black;
  background: white;
  color: #005DA6;
}

.nav.footer {
  padding: 50px 0;
  box-sizing: border-box;
  background: #f0f0f0;
  border-top: solid 1px #ddd;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.nav.footer a {
  opacity: 0.2;
  color: black !important;
}
.nav.footer a:hover {
  /* color: #005DA6; */
  opacity: 1;
  transition: 200ms;
  transition-timing-function: ease-in;
}
.nav.footer .logo a {
  fill: #666;
}
.nav.footer .logo a:hover svg {
  opacity: 1;
  transition: 200ms;
  transition-timing-function: ease-in;
  fill: #005DA6;
}
.nav.footer .current a {
  opacity: 1;
}
.nav.footer .current a:hover {
  color: #005DA6;
}
.nav.footer span.cart-count {
  background-color: #005DA6;
  color: white;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  layout: content
- - - - - - - - - - - - - - - - - - - - - - - - - - */

#content {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background: white;
}
#content .inset {
  padding: 50px;
}

#content a:not(.button),
#content a:not(.button):visited {
  color: #005DA6;
  text-decoration: none;
  font-family: 'FuturaRound-Book', sans-serif;
}
#content p a:not(.button):hover,
#content ul a:not(.button):hover {
  color: black;
  border-bottom: solid 1px black;
}
#content p a:not(.button),
#content ul a:not(.button) {
  border-bottom: solid 1px #ddd;
}

#content .item p a:not(.button),
#content ul a:not(.button),
#content .item p a:not(.button):hover,
#content ul a:not(.button):hover {
  border-bottom: 0;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  layout: module index
- - - - - - - - - - - - - - - - - - - - - - - - - - */

.module {
  margin-bottom: 0px;
}

.row {
  display: flex;
}
.column {
  text-align: left;
  align-self: center;
  flex-direction: column;
}
.column.left {
  flex: 70%;
  text-align: left;
}
.column.right {
  flex: 30%;
  text-align: right;
  min-height: 58px;
}
.column.pad {
  padding: 50px;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  layout: display elements
- - - - - - - - - - - - - - - - - - - - - - - - - - */

h1 {
  font-family: 'FuturaRound-Demi', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.0666em;
  font-size: 1.75em;
  color: #2b1707;
  color: black;
}
#content h1.title a {
  font-family: 'FuturaRound-Demi', sans-serif;
  font-size: 21pt;
  color: black !important;
  line-height: 1pt;
}
h1 span {
  font-family: 'FuturaRound-Light', sans-serif;
  color: #888;
}
h1.pad {
  padding: 60px 0 50px;
}
h2 {
  font-family: 'FuturaNext-Light', sans-serif;
  font-size: 22pt;
  line-height: 36pt;
  letter-spacing: 0.1em;
  padding: 50px 0 30px;
}
h2.pad {
  padding: 50px 0 40px;
}
h2.media {
  margin-bottom: 30px;
}

h3 {
  letter-spacing: 0.0333em;
  font-size: 20pt;
  font-weight: normal;
  padding: 0 0 30px;
  font-family: 'FuturaRound-Book', sans-serif;
}

p, ul {
  font-family: 'FuturaRound-Light', sans-serif;
  font-size: 1.25em;
  line-height: 1.5em;
  /* responsive */
  padding: 0 150px 40px;
  letter-spacing: 0.025em;
}
ul {
  list-style-type: none;
  margin-bottom: 20px;
}

p i {
  font-family: 'FuturaRound-LightOblique', sans-serif;
}
p b,
li b {
  font-family: 'FuturaRound-Book', sans-serif;
}
p b i {
  font-family: 'FuturaRound-BookOblique', sans-serif;
}

.highlight {
  background: #fffe9f;
}
p.highlight {
  background: #FCFEE2;
  padding-top: 37.5px;
  margin: 0 50px 12.5px;
}
p.download {  
  background: #f8f8f8;
  margin: 0 150px 75px;
  padding: 50px 50px;
  border-radius: 10px;
}

.code {
  font-family: monospace;
}
h1.title + p {
  /* used for extras page, etc */
  padding: 25px 0 0;
}
.module + p {
  /* used for extras page, etc */
  padding: 50px 0;
}
p.large {
  font-size: 1.4em;
  line-height: 1.666em;
  /* responsive */
  padding: 0 150px 60px;
  letter-spacing: 0.025em;
}
p.large + p.large {
  margin-top: -25px;
}
.preorder_banner p {
  margin-bottom: -30px;
}
.preorder_banner + p.large,
.preorder_banner + h3 {
  padding-top: 30px
}
.preorder_banner h3 {
  margin-bottom: 0;
  padding-bottom: 0;
}
h2 + .preorder_banner {
  margin-top: 30px;
  padding-top: 50px;
  margin-bottom: 30px;
}
p.large + .preorder_banner {
  padding-top: 30px;
  margin-bottom: 50px;
}
p.large + .preorder_banner p {
  padding-top: 0;
  padding-bottom: 20px;
}
.preorder_banner .price_button + p {
  margin-top: 40px;
  margin-bottom: -30px;
}
p.image {
  padding: 0 75px 50px;
}

p.subtotal {
  font-size: 1.666em;
}
p.message {
  color: #ccc;
}
.description {
/* large type on module pages */
  padding: 20px 0;
}
.description h2 {
  padding-left: 100px;
  padding-right: 100px;
}
.notice {
  /* top of all pages */
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding: 25px 50px;
  background: #fcfee1;
  border-bottom: solid 1px #eee;
  text-align: left;
}
.notice h1 {
  float: left;
  font-family: 'FuturaRound-Light', sans-serif;
  opacity: 0.333;
}
.notice p {
  float: right;
  display: block;
  padding-top: 10px;
  padding: 5px 0 0;
}

.notice:after {
  content: "";
  display: table;
  clear: both;
  text-transform: none;
}


.preorder_banner {
/* large type on module pages */
  padding: 50px 0 50px;
  background: #ffffee;
  background: #fcfee1;
  border-top: solid 1px #eee;
  border-bottom: solid 1px #eee;
}
.preorder_banner p {
  line-height: 1.66em;
  font-size: 1.33em;
  font-family: 'FuturaRound-Light', sans-serif;
}
.preorder_banner .eta {
  font-size: 133%;
}

.preorder_banner.split {
  padding: 0;
}
.preorder_banner.split .column.left {
  text-align: right;
  font-size: 133%;
  padding-left: 50px; 
}
.preorder_banner.split .column.left span {
  font-family: 'FuturaRound-Demi', sans-serif;
  font-size: 110%;
  display: inline-block;
  margin-right: 5px;
}
.preorder_banner.split .column.right {
  text-align: center;
}



h2.hr {
  border-top: solid 1px #ccc;  
  padding: 75px 20% 40px;  
  margin-top: 25px;
}
ul.features {
  font-size: 1.33em;
  font-family: 'FuturaRound-Light', sans-serif;
  padding-bottom: 62.5px;
}
ul.features li {
  padding: 12.5px 0;
  list-style: none;  
}

ul.features.dots {
  border: solid 1px #ddd;
  margin: 0 100px 37.5px;
  padding: 0 0;
  border-radius: 5px;
}
ul.features.dots li {
  font-size: 90%;
  padding: 12.5px 0;
  border-bottom: solid 1px #ddd;
}
ul.features.dots li:last-child {
  border-bottom: 0;
}

/* --------------------------- */

div.table_container {
  overflow-x: auto;
}

th, td { 
  text-align: center;
  font-size: 120%;
  padding: 8px 0 10px;
}
tbody tr {
  border-bottom: solid 1px #eee;
  border-left: solid 1px #ccc;
  border-right: solid 1px #ccc;
}
thead tr,
tbody tr:nth-of-type(4n) {
  border-bottom: solid 1px #ccc;
}

table.specs {
  border-collapse: collapse; 
  margin: 0 10% 50px 10%;
  width: 80%; 
}
table.specs thead {
  font-family: 'FuturaRound-Book', sans-serif;
  border-top: solid 1px #ccc;
  background: #eee;
}

table.specs th:first-child {
  border-top: solid 1px #ccc;
  border-left: solid 1px #ccc;
}
table.specs th:last-child {
  border-top: solid 1px #ccc;
  border-right: solid 1px #ccc;
}
table.specs td {
  font-family: 'FuturaRound-Light', sans-serif;
}
table.specs.two-col th,
table.specs.two-col td {
  /* left justified label/description pairs */
  text-align: left;
  padding: 8px 0 10px 15px;
}
table.specs.five-col th,
table.specs.five-col td {
  width: 20%;
}

/* --------------------------- */

p.footnote {
  font-style: italic;
  margin: 30px 0;
}
ul.features + p.footnote {
  margin-top: -30px;
  margin-bottom: 50px;
}

.grid_container {
  width: 90%;
  margin: 40px 5%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 30px;
  /* style */
  font-family: 'FuturaRound-Light', sans-serif;
  overflow-x: auto;
  font-size: 120%;
  letter-spacing: 0.02em;
}
h2.hr + .grid_container {
  margin-top: 40px;
}

.grid_container div {
  text-align: left;
}
.grid_container b {
  font-family: 'FuturaRound-Medium', sans-serif;
}

.grid_graphic { grid-area: 1 / 1 / 3 / 2; }
.grid_description { grid-area: 1 / 2 / 2 / 5; line-height: 150%; }
.grid_timbre { grid-area: 2 / 2 / 3 / 3; }
.grid_harmonic { grid-area: 2 / 3 / 3 / 4; }
.grid_morph { grid-area: 2 / 4 / 3 / 5; }

.grid_graphic img {
  width: 60% !important;
  padding-top: 3px;
}
.grid_graphic.trig_exp img {
  padding-top: 7px;
}

h1.image {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  height: 100px;
  margin-bottom: 0px;
  padding: 60px 0 0;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0) 33%,
    rgba(255,255,255,100) 100%
  ),url('http://1979.ws/img/temp.jpg') fixed 50px no-repeat;
}

button#add-to-cart,
#content a.button,
#content button {
  padding: 0.35em 1em;
  letter-spacing: 0.0666em;
  border-radius: 2em;
  font-family: 'FuturaRound-Demi', sans-serif;
  color: rgba(255,255,255,0.8);
  text-decoration: none;
  display: inline-block;
  background-color: #0C5AB5;
  text-transform: uppercase;
}
button#add-to-cart.pending,
button#add-to-cart.sold_out,
#content a.button.light,
#content button.light,
#content .light {
  font-family: 'FuturaRound-Light', sans-serif;
}
button#add-to-cart,
#content a.button.large,
#content button.large {
  font-size: 1.75em;
}
#content a.button.medium,
#content button.medium {
  font-size: 1.5em;
  padding: 0.5em 1em;
}
#content a.button.small,
#content button.small {
  font-size: 1.25em;
}
#price-container.available button#add-to-cart,
#content a.button.green,
#content button.green,
.price_button.green .button {
  background-color: #1EB85F !important;
}
.color-green {
  color: #1EB85F;
  font-family: "FuturaRound-Medium", sans-serif;
}
.color-orange {
  color: #f28019;
  font-family: "FuturaRound-Medium", sans-serif;
}
.color-red {
  color: #d00;
  font-family: "FuturaRound-Medium", sans-serif;
}
#price-container.preorder button#add-to-cart,
#content a.button.orange,
#content button.orange,
.price_button.orange .button {
  background-color: #f28019 !important;
}
#price-container.pending button#add-to-cart,
#price-container.sold_out button#add-to-cart,
#content a.button.gray,
#content button.gray,
.price_button.gray .button {
  background-color: #f2f2f2 !important;
  color: #aaa !important;
  font-family: 'FuturaRound-Light', sans-serif;
}
#price-container.available button#add-to-cart:hover,
#price-container.preorder button#add-to-cart:hover,
#content a.button:hover,
#content button:hover,
#content a.button.green:hover,
#content button.green:hover,
#content .green button:hover,
#content a.button.orange:hover,
#content button.orange:hover,
#content .orange button:hover {
  color: rgba(255,255,255,1);
}
#content a.button.gray:hover,
#content button.gray:hover,
#content .gray button:hover {
  color: rgba(0,0,0,1);
}
#content a.button.null:hover,
#content button.null:hover {
  cursor: default; 
}
button#add-to-cart:hover,
#content a.button:hover,
#content button:hover {
  transition: 200ms;
  transition-timing-function: ease-in;
  cursor: pointer;
}
#price-container.pending button#add-to-cart:hover,
#price-container.sold_out button#add-to-cart:hover {
  cursor: default;
}

button {
  border: 0;
}
button[type=submit] {
  margin: 10px 0 30px;
}

#content img {
  width: 100%;
  margin-bottom: 0;
}

hr {
  border: 0;
  border-top: solid 1px #ddd;
  display: block;
  margin-bottom: 0;
}
p + hr {
  margin-top: 30px;
}
hr + p {
  margin-top: 60px;
}
hr.padded {
  margin: 0 5%;
}


div.return {
  padding: 68px 0 30px;
}
p.return {
  padding-bottom: 60px;
}
p + .return {
  padding-top: 0;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  mailchimp signup form
- - - - - - - - - - - - - - - - - - - - - - - - - - */

.mc-field-group p {
  padding-bottom: 0;
}

div[for=mce-EMAIL],
#mce-responses,
#mce-success-response,
#mce-error-response {
  margin: 30px 0;
  color: #ccc;
  letter-spacing: 0.05em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  responsive media embedding
- - - - - - - - - - - - - - - - - - - - - - - - - - */

iframe {
  border: 0;
  margin-bottom: 0;
}
.video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}
.video iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 1024px;
  width: 100%;
  height: 100%;
}

.audio iframe {
  width: 100%;
  height: 166px;
  width: 100%;
  height: 200px;
}
.video + .video,
.video + .audio,
.audio + .video,
.audio + .audio,
.audio + h2,
.video +h2 {
  margin-top: 50px;
}



/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  responsive slideshow - responsiveslides.com
- - - - - - - - - - - - - - - - - - - - - - - - - - */

.rslides_container {
  position: relative;
  overflow-y: hidden;
}

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  z-index: 1;
  border-top: solid 1px #eee;
  border-bottom: solid 1px #eee;
}

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
}

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
}

.rslides_nav {
  display: block;
  z-index: 2;
  border: 0;
  opacity: 0.5;
  width: 42px;
  height: 42px;
  background: url('https://1979.ws/inc/img/rslides_arrow.svg') no-repeat;
}
.rslides_nav:hover {
  opacity: 1;
  transition: 200ms;
  transition-timing-function: ease-in;
}
.rslides_nav.prev {
  width: 42px;
  height: 42px;
  position: absolute;
  top: 50%;
  left: 5%;
  transform: translateY(-50%);
}
.rslides_nav.next {
  width: 42px;
  height: 42px;
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translateY(-50%) scaleX(-1);
}

.rslides .title {
  background-color: #0c5ab5;
  position: relative;
}
.rslides .title img {
  position: relative;
  z-index: 1;
  opacity: 0.5;
}
.rslides .title .acronym {
  z-index: 2;
  position: absolute;
  top: 51%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-family: 'FuturaRound-BoldOblique', sans-serif;
  font-size: 6.66em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  order/cart page
- - - - - - - - - - - - - - - - - - - - - - - - - - */

h1#cart-heading {
  padding: 60px 0 0;
}

.cart-item {
  height: 450px;
  padding: 50px 0 90px;
  border-bottom: solid 2px #eee;
}

.cart-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}
.cart-column {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}

.cart-item-image img {
  max-width: 300px;
}

.cart-column-detail {
  text-align: left;
}
.cart-column-detail h2 {
  padding: 0 0 40px;
  font-size: 19pt;
  letter-spacing: 0.02em;
  line-height: 20pt;
}
.cart-item-detail {
  font-weight: 200;
  margin-bottom: 25px;
  font-size: 14pt;
}
.cart-item-detail b {
  font-weight: 300;
}

/* adjust quantity */
.cart-actions {
  margin: 40px 0 0;
  padding: 0;
}
.cart-actions a {
  display: inline-block;
  opacity: 0.33;
  margin: 0 15px 0 0;
}
.cart-actions a:hover {
  opacity: 1;
  transition: 200ms;
  transition-timing-function: ease-in;
}
.cart-actions img {
  height: 40px;
  width: 40px;
}

.cart-order-total {
  font-size: 20pt;
  margin: 20px 0 -10px;
}
.cart-order-shipping {

}
#cart-checkout-button {
  margin: -20px 0 0;
  padding-bottom: 70px;
}
#cart-contents {
  /* emptyCartMessage etc */
 padding: 20px 0;
}

.cart-empty {
  padding-top: 20px;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  form stuff (mailing list, etc)
- - - - - - - - - - - - - - - - - - - - - - - - - - */

input[type=text],
input[type=number] {
  border-radius: 10px;
  border: solid 1px #f9f9f9;
  padding: 8px 5px 10px;
  margin: 20px 12px 20px 0;
  text-align: center;
  width: 2em;
  font-size: 1em;
  font-family: 'FuturaRound-Book', sans-serif;
  background: #eee;
}
input[type=email] {
  border-radius: 5px;
  border: solid 1px #ccc;
  padding: 8px 5px 10px;
  margin: 0;
  text-align: center;
  font-size: 1em;
  font-family: 'FuturaRound-Book', sans-serif;
  background: #f8f8f8;
}
button:focus,
input:focus {
  color: #333;
  outline: none;
  background: #ffffe0;
}
input::placeholder {
  color: #ccc;
}
input:focus::placeholder {
  color: transparent;
}
input[type='number'] {
  -moz-appearance:textfield;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input.pending {
  animation: flash 1.5s; 
}
@keyframes flash {
  0%   { background: #ffdf00; }
  100%  { background: #eee; }
}
input.pending {
  animation: flash 1.5s; 
}
@keyframes flash {
  0%   { background: #ffdf00; }
  100%  { background: #eee; }
}

input.removing {
  animation: goodbye 1.5s; 
}
@keyframes goodbye {
  0%   { background: #ffdf00; }
  100%  { background: #fff; }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - 
  print
- - - - - - - - - - - - - - - - - - - - - - - - - - */

@media print {
  * {
    font-family: sans-serif;
  }
  img {
    max-width: 100%;
  }
}