@font-face {
  font-family: Diogenes;
  src: url(../DIOGENES.woff);
}
* {
  font-family: Diogenes;
}
a:link, a:visited {
  text-decoration: none;
  color: #000000;
}
a:hover {
  text-decoration: underline;
  cursor: pointer;
  color: #ef4d30;
}
a.text-link {
  color: #ef4d30;
}
.back-it-up {
  position: absolute;
  z-index: 99;
  background-image: url('../img/back_arrow.svg');
  background-repeat: no-repeat;
  background-origin: border-box;
  padding: 1.2em 2em 2.5em 2em;
  text-align: center;
  top: 6em;
}
h1 {
  text-align: center;
  font-size: 30pt;
  margin-bottom: -0.3em;
}

.max-wide {
  max-width: 32em;
}
.eighteen-em {
  width: 18em;
}
.sixteen-em {
  width: 16em;
}
.fourteen-em {
  width: 14em;
}
.twelve-em {
  width: 12em;
}
.ten-em {
  width: 10em;
}
.eight-em {
  width: 8em;
}
.six-em {
  width: 6em;
}
.fifth {
  width: 20%;
}
div {
  font-size: large;
}
h2.speech-bubble {
  font-weight: normal;
}
.speech-bubble {
  border-image-source: url(../img/speechbubble-01.png);
  border-image-slice: fill 120;
  border-image-width: 20px;
  border-image-outset: 20px;
  padding: 0px;
  margin-bottom: 0;
  border-image-repeat: stretch;
  text-align: center;
}
.mirrored-speech-bubble {
  border-image-source: url(../img/speechbubble_mirror-01.png);
}
.skinny-speech-bubble {
  border-image-width: 15px;
  border-image-outset: 15px;
  padding: 0px;
  border-image-slice: fill 100;
}
.easel {
  position: relative;
  z-index: 99;
  background-image: url(../img/99Cents.jpg);
  background-repeat: no-repeat;
  background-size: 120px 120px;
  width: 120px;
  height: 240px;
  margin: -120px;
  right: -23em;
  top: -10px;
}
.pointy-painter {
  position: relative;
  z-index: 99;
  background-image: url(../img/point.jpg);
  background-repeat: no-repeat;
  background-size: 101px 80px;
  width: 101px;
  height: 80px;
  margin: -40px;
  right: -2em;
  top: 50px;
}
.painter {
  position: relative;
  z-index: 99;
  background-image: url(../img/painter.svg);
  background-repeat: no-repeat;
  width: 160;
  height: 160px;
  margin: -80px;
  right: -19em;
  top: -50px;
}
.sculpted {
  position: relative;
  z-index: 99;
  background-image: url(../img/sculpt.svg);
  background-repeat: no-repeat;
  width: 120;
  height: 120px;
  margin: -60px;
  right: -15em;
  top: 10px;
}
.pointy {
  position: relative;
  right: -4em;
  text-align: center;
  background-image: url(../img/point2.jpg);
  background-repeat: no-repeat;
  background-size: 100px 100px;
  background-position: center bottom;
  z-index: 99;
  top: 160px;
  padding: 0 20px;
  width: 100px;
  height: 160px;
  margin: -60px -80px;
}
.buy-my-stikkers {
  position: relative;
  z-index: -1;
  text-align: center;
  background-image: url(../img/buy.jpg);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 150px 150px;
  right: -15em;
  top: -70px;
  width: 150px;
  height: 150px;
  margin: -75px;
}
.history {
  position: relative;
  z-index: -1;
  text-align: center;
  background-image: url(../img/history.png);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 240px 240px;
  right: -13em;
  top: 50px;
  width: 250px;
  height: 250px;
  margin: -125px;
}
.stone-border {
  border-image-source: url(../img/frame-01.png);
  border-image-slice: fill 25;
  border-image-width: 10px;
  border-image-outset: 0;
  padding: 30;
  border-image-repeat: stretch;
}
.plain-list ol {
  padding:0;
  margin-bottom:0;
}
.stone-border ul {
  list-style:none;
  padding:0;
  margin-bottom:0;
}
.stone-border li::before {
  content: "• ";
}
.centered-text {
  text-align: center;
}
.right-div {
  margin-left: auto;
  margin-right: 0;
}
.centered-div {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
}
.inline-block {
  display: inline-block;
}
.extra-space-above {
  margin-top: 3em;
}
.hilited-text, a.hilited-text {
  color: #ef4d30;
}
.div-img {
  text-align: center;
  background-repeat: no-repeat;
  background-position: center center;
  margin: auto;
}
.family-footer {
  background-image: url(../img/family_footer.gif);
  background-size: 18em;
  height: 8em;
}
.imessage-footer {
  background-image: url(../img/imessage_footer.gif);
  background-size: 19em;
  height: 6em;
}
.gear-footer {
  background-image: url(../img/gear_footer.gif);
  background-size: 19em;
  height: 6em;
}
.four-up {
  text-align: center;
  background-image: url(../img/imessage_montage.gif);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 12em 12em;
  height: 12em;
  margin: auto;
}
.appicon {
  text-align: center;
  background-image: url(../img/AppIcon.png);
  border-radius: 25px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 12em 12em;
  height: 12em;
  margin: auto;
}
.redbubble {
  text-align: center;
  background-image: url(../img/redbubble.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 12em 12em;
  height: 12em;
  margin: auto;
}
.arrghh {
  text-align: center;
  background-image: url(../img/slideshow.gif);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 9em 9em;
  height: 12em;
  margin: auto;
}
a:link.big-link, a:visited.big-link, a:hover.big-link {
  width: 100%;
  font-size: 44pt;
  text-decoration: none;
}
.fudge-pad {
  padding: -4em;
}
h2 {
  font-size: 16pt;
}

.scrolly-polly {
  width: auto;
  height:20em;
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  text-align: center;
  padding: 17px 5em 17px 5em;
}
.scrolly-polly img {
  max-height: 20em;
}
::-webkit-scrollbar {
    width: 0px;  /* remove scrollbar space */
    background: transparent;  /* optional: just make scrollbar invisible */
}

p {
  margin-left: auto;
  margin-right: auto;
  font-size: large;
  max-width: 50em;
  padding-left: 1em;
  padding-right: 1em;
}

* {
  zoom: 0.94;
}
@media all and (min-width: 375px) {
  .speech-bubble {
    margin: 10;
  }
  * {
    zoom: 1;
  }
}
@media all and (min-width: 520px) {
  * {
    zoom: 1;
  }
  p {
    font-size: x-large;
    padding-left: 2em;
    padding-right: 2em;
  }
  h1 {
    font-size: 60pt;
  }
  .sculpted {
    width: 160;
    height: 200px;
    margin: -100px;
    right: -23em;
    top: -50px;
  }
  .pointy {
    background-size: 130px 130px;
    right: -1em;
    top: 160px;
    padding: 0 20px;
    width: 120px;
    height: 200px;
    margin: -100px -80px;
  }
  .buy-my-stikkers {
    background-size: 240px 240px;
    right: -17em;
    top: -120px;
    width: 250px;
    height: 250px;
    margin: -125px;
  }
  .history {
    background-size: 240px 240px;
    right: -21em;
    top: -90px;
    width: 250px;
    height: 250px;
    margin: -125px;
  }
  .family-footer {
    background-size: 24em;
  }
  .easel {
    background-size: 240px 240px;
    width: 240px;
    height: 240px;
    margin: -120px;
    right: -23em;
    top: -90px;
  }
  .pointy-painter {
    background-size: 203px 160px;
    width: 203px;
    height: 160px;
    margin: -80px;
    right: -8em;
    top: 50px;
  }
  .stone-border {
    border-image-slice: fill 66;
    border-image-width: 33px;
    padding: 40;
    border-image-repeat: round;
  }
}