.spellbound-tooltip {
  box-shadow: none !important;
}
.spellbound-tooltip .fa {
  font-size: 2rem;
}
.spell-error > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

/**
 * Feelin' Fab
 */
.spell--fab {
  text-shadow: -1px -1px 5px rgba(0, 0, 0, 0.5), 1px -1px 5px rgba(0, 0, 0, 0.5),
    -1px 1px 5px rgba(0, 0, 0, 0.5), 1px 1px 5px rgba(0, 0, 0, 0.5);
  animation: fabRainbow 15s linear infinite;
  border-width: 2px 2px 0 !important;
  margin-left: -2px;
  margin-right: -2px;
  border-color: rgba(255, 255, 255, 0.5);
}
.spell--fab .to_magnify {
  animation: fabRainbow 15s linear infinite;
}
.spell--fab .text-muted,
.spell--fab blockquote cite span {
  color: rgba(255, 255, 255, 0.75);
}
.spell--fab .btn-default:not(:hover):not(:focus):not(.disabled) {
  background: rgba(0, 0, 0, 0.15);
  border-color: rgba(255, 255, 255, 0.5);
}
.spell--fab blockquote {
  border-color: rgba(255, 255, 255, 0.5);
  background-color: rgba(0, 0, 0, 0.15);
}
.spell--fab .media-body {
  background-color: transparent !important;
}
.spell--fab .media-left {
  background-color: rgba(0, 0, 0, 0.15) !important;
}

@keyframes fabRainbow {
  0% {
    background-color: #c80000;
  }
  18% {
    background-color: #c8c800;
  }
  34% {
    background-color: #00c800;
  }
  50% {
    background-color: #00c8c8;
  }
  66% {
    background-color: #0000c8;
  }
  82% {
    background-color: #c800c8;
  }
  100% {
    background-color: #c80000;
  }
}

/**
 * Autocorrect
 */
.spell--autocorrect__target {
  display: inline-block;
  text-align: center;
}
.spell--autocorrect__target:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: url(../../../images/spells/assets/glue.svg) no-repeat top left;
  background-size: 100%;
  background-position: center center;
  opacity: 0.1;
  pointer-events: none;
}
.spell--autocorrect__target:nth-of-type(even):after {
  transform: rotate(180deg);
}
.spell--autocorrect__strip {
  position: absolute;
  display: inline-block;
  text-align: center;
  background: white;
  background: linear-gradient(
    to right,
    #f0f9ff 6%,
    #d1edf9 25%,
    #d1edf9 25%,
    #f0f9ff 44%,
    #d1edf9 67%,
    #f0f9ff 88%
  );
  color: black;
  padding: 0 2px;
  box-shadow: 1px 1px 0 #799eb1, 1px 1px 1px rgba(0, 0, 0, 0.35);
  text-shadow: none;
  font-family: "Comic Sans MS", cursive;
  font-weight: 700;
  white-space: nowrap;
  z-index: 1;
  cursor: pointer;
}
.spell--autocorrect__strip--1 {
  transform: rotate(1deg);
}
.spell--autocorrect__strip--2 {
  transform: rotate(-2deg);
}
.spell--autocorrect__strip--3 {
  transform: rotate(0.5deg);
}
.spell--autocorrect__strip--peeling {
  animation: paperPeel 500ms ease-in-out;
}
.spell--autocorrect__strip--floating {
  animation: paperFall 4s ease-out, paperWave 1.75s ease-out infinite;
}

@keyframes paperPeel {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1) rotate(10deg) skewX(-30deg) translate(-30px, 0);
    margin-top: 30px;
  }
}

@keyframes paperFall {
  0% {
    margin-top: 30px;
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    margin-top: 500px;
    opacity: 0;
  }
}

@keyframes paperWave {
  0% {
    transform: rotate(10deg) skewX(-30deg) translate(-30px, 0);
  }
  50% {
    transform: rotate(-10deg) skewX(30deg) translate(30px, 0);
  }
  100% {
    transform: rotate(10deg) skewX(-30deg) translate(-50px, 0);
  }
}

/**
 * Size Matters
 */
.spell--sizematters {
  background: #2c2c2f;
  background: radial-gradient(circle at 50%, #46464a 60%, #2c2c2f);
}
.spell--sizematters > .to_magnify {
  transform: scale(0.5);
  box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.5);
}
.magnify_glass-wrap {
  z-index: 99;
  position: absolute;
}
.magnify_glass-wrap > div {
  position: absolute;
  width: 150px;
  height: 150px;
  background-image: url(../../../images/spells/assets/magnifying-glass.png);
  background-repeat: no-repeat;
  background-size: 100%;
  margin-top: 27px;
  margin-left: -27px;
}
.magnify_glass {
  position: absolute;
  background: #2c2c2f;
  border-radius: 50%;
  width: 84px;
  height: 84px;
  top: 6px;
  left: 60px;
  overflow: hidden;
  z-index: -1;
}
.magnify_glass > * {
  pointer-events: none;
}

/*
 * Whoops!
 */
.spell--whoops__splat {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /*background: url(../../../images/spells/assets/splat.svg) no-repeat center center;*/
  /*background-size: 120% 120%;*/
  z-index: 2;
}
.spell--whoops__success {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 75%;
  z-index: 3;
  animation: 500ms fadeIn, 1s rubberBand;
}
@media screen and (min-width: 768px) {
  .spell--whoops__success {
    width: 33%;
  }
}

/**
 * Vertigo
 */
body {
  transition: transform 2s;
}
body.flipping {
  overflow: hidden;
}
body.flipped {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  transform: rotate(180deg);
}
.spell--vertigo {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  transform: rotate(180deg);
}

/**
 * Great Sh*t
 */
.spell--greatshit [data-reactid*="Sh*t"] {
  animation: fabRainbow 5s linear infinite;
  border-color: rgba(255, 255, 255, 0.25);
}

/**
 * The Best Sh*t
 */
.spell--bestshit > .media {
  border-style: solid;
  border-width: 59px 60px 65px !important;
  -moz-border-image: url(../../../images/spells/assets/frame-small.png) 59 60 65
    round repeat;
  -webkit-border-image: url(../../../images/spells/assets/frame-small.png) 59 60
    65 round repeat;
  -o-border-image: url(../../../images/spells/assets/frame-small.png) 59 60 65
    round repeat;
  border-image: url(../../../images/spells/assets/frame-small.png) 59 60 65 fill
    round repeat;
}
@media screen and (min-width: 1000px) {
  .spell--bestshit > .media {
    border-width: 90px 90px 90px !important;
    -moz-border-image: url(../../../images/spells/assets/frame.png) 90 90 90
      round repeat;
    -webkit-border-image: url(../../../images/spells/assets/frame.png) 90 90 89
      round repeat;
    -o-border-image: url(../../../images/spells/assets/frame.png) 90 90 90ound
      repeat;
    border-image: url(../../../images/spells/assets/frame.png) 90 90 90 fill
      round repeat;
  }
}

/**
 * Lights Out
 */
.spell--nightvision > .media {
  -webkit-filter: brightness(0.15);
  -moz-filter: brightness(0.15);
  filter: brightness(0.15);
}
body.nightvision {
  -webkit-filter: brightness(4) sepia(100%) hue-rotate(70deg) saturate(300%);
  -moz-filter: brightness(4) sepia(100%) hue-rotate(70deg) saturate(300%);
  filter: brightness(4) sepia(100%) hue-rotate(70deg) saturate(300%);
}
body.nightvision:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: white;
  pointer-events: none;
  z-index: 99998;
  animation: fadeOut 1s linear;
  animation-fill-mode: forwards;
}
body.nightvision:before {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  pointer-events: none;
  background: radial-gradient(
    ellipse at center,
    rgba(95, 255, 50, 0) 60%,
    rgba(0, 0, 0, 1) 100%
  );
}

.spell--bestshit__plaque {
  position: absolute;
  top: 100%;
  left: 50%;
  width: 200px;
  height: 70px;
  margin-top: -73px;
  margin-left: -100px;
  border-radius: 20px/10px;
  text-align: center;
  color: #858484;
  padding: 1rem;
  z-index: 1;
  text-shadow: none;
  box-shadow: inset 0 4px 0 white, inset 0 -4px 0 rgba(0, 0, 0, 0.2),
    0 2px 8px rgba(0, 0, 0, 0.5);
  font-family: "Georgia", serif;
  background-image: url(../../../images/spells/assets/plaque.jpg);
}
.spell--bestshit__plaque > div {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translate(0, -50%);
}

/**
   * Stick Around
   */
@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}
.stick-around-arrow {
  position: absolute;
  background: url(../../../images/spells/assets/stick-around-arrow.svg)
    no-repeat;
  height: 64px;
  width: 144px;
  animation: bounceInLeft 1s;
  z-index: 10000;
}
.stick-around-arrow--2 {
  background-image: url(../../../images/spells/assets/stick-around-arrow-2.svg);
}
.stick-around-arrow--3 {
  background-image: url(../../../images/spells/assets/stick-around-arrow-3.svg);
}

/**
 * SALT-CAM
 */
@keyframes shakyCam {
  0% {
    transform: translate(0);
  }
  15% {
    transform: translate(-5px, 5px);
  }
  50% {
    transform: translate(6px, -5px);
  }
  70% {
    transform: translate(-7px, 2px);
  }
}
@keyframes static {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 100%;
  }
}
@keyframes blink {
  50% {
    opacity: 0;
  }
}
.post-inner {
  display: flex;
  height: 100%;
  padding: 1rem;
  animation: shakyCam 4s ease-in-out infinite;
}
.spell--saltcam {
  overflow: hidden;
  padding-bottom: 5rem !important;
}
.spell--saltcam:after {
  content: "";
  pointer-events: none;
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: 4.5rem;
  background: url(../../../images/spells/assets/saltcam-frame.svg);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  z-index: 2;
}
.saltcam-logo {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  background: url(../../../images/spells/assets/saltcam-logo.svg) no-repeat;
  background-color: #34333a;
  background-position: center center;
  height: 4.5rem;
  z-index: 50;
  border-bottom: 12px solid #34333a;
}
.saltcam-rekt {
  position: absolute;
  right: 7%;
  top: 12%;
  background: url(../../../images/spells/assets/saltcam-rekt.svg) no-repeat top
    left;
  height: 33px;
  width: 104px;
  animation: blink 2s step-start 0s infinite;
  z-index: 50;
}
.post-static {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  animation: static 0.2s steps(3) infinite;
  opacity: 0.15;
  z-index: 1;
}
/**
 * BIG REVEAL
 */
.spell--bigreveal--closed {
  overflow: hidden;
  cursor: pointer;
}
.spell--bigreveal__curtain {
  position: absolute;
}
.spell--bigreveal__curtain--top {
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  height: 109px;
  background: url(../../../images/spells/assets/curtain-draped.svg) repeat-x;
  background-position: 50% 0;
  z-index: 99998;
}
.spell--bigreveal--open .spell--bigreveal__curtain--top {
  animation: openTopCurtain 500ms ease-in-out;
  animation-fill-mode: forwards;
}
.spell--bigreveal__curtain--left,
.spell--bigreveal__curtain--right {
  top: 0;
  bottom: 0;
  width: 50%;
  background: url(../../../images/spells/assets/curtain.svg) repeat;
  z-index: 99997;
}
.spell--bigreveal__curtain--left {
  left: 0;
  background-position: right center;
}
.spell--bigreveal--open .spell--bigreveal__curtain--left {
  animation: openLeftCurtain 500ms ease-in-out;
  animation-fill-mode: forwards;
}
.spell--bigreveal__curtain--right {
  right: 0;
  background-color: left center;
}
.spell--bigreveal--open .spell--bigreveal__curtain--right {
  animation: openRightCurtain 500ms ease-in-out;
  animation-fill-mode: forwards;
}
.spell--bigreveal__lights {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 4em;
  width: 25vw;
  height: 25vw;
  margin: 0 auto;
  margin-left: -12.5vw;
  margin-top: -12.5vw;
  animation: eight 1s -1s infinite linear alternate;
  z-index: 99999;
  visibility: hidden;
  pointer-events: none;
}
.spell--bigreveal--open .spell--bigreveal__lights {
  display: none !important;
}
.spell--bigreveal--closed:hover .spell--bigreveal__lights {
  visibility: visible;
}
.spell--bigreveal__lights:before,
.spell--bigreveal__lights:after {
  content: "";
  display: block;
  height: 25vw;
  width: 25vw;
  position: absolute;
  top: 0;
  background: radial-gradient(
      ellipse at center,
      rgba(255, 240, 140, 0.4) 0%,
      rgba(255, 240, 140, 0.5) 50%,
      rgba(255, 240, 140, 0) 60%
    )
    transparent;
  animation: sideToSide 2s infinite linear;
}
.spell--bigreveal__lights:after {
  animation-delay: -1s;
}
@keyframes eight {
  0%,
  25% {
    transform: rotate(40deg);
  }
  100%,
  75% {
    transform: rotate(-40deg);
  }
}
@keyframes sideToSide {
  25% {
    transform: translate3d(-25vw, 0, 0);
  }
  75% {
    transform: translate3d(25vw, 0, 0);
  }
}
@keyframes openLeftCurtain {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-110%, 0) scale(1.2);
  }
}
@keyframes openRightCurtain {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(110%, 0) scale(1.2);
  }
}
@keyframes openTopCurtain {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(0, -110%) scale(1.2);
  }
}
/**
 * JIMMY WAILS
 */
.spell--jimmywails-banner {
  white-space: pre-line;
  height: 200px;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .spell--jimmywails-banner {
    height: 300px;
  }
}
.spell--jimmywails-banner__text {
  position: absolute;
  top: 1rem;
  max-width: 65%;
  font-size: 1.4rem;
}
@media screen and (min-width: 768px) {
  .spell--jimmywails-banner__text {
    top: 3rem;
    font-size: 1.8rem;
  }
}
.spell--jimmywails-banner__img {
  position: absolute;
  top: 0;
  height: 100%;
}
.spell--jimmywails-banner--1 {
  background: linear-gradient(#8b8c7d, #bdbbb4);
}
.spell--jimmywails-banner--1 > .spell--jimmywails-banner__img {
  background: url(../../../images/spells/assets/jimmy/1.png) no-repeat;
  width: 450px;
  left: 0;
  background-size: contain;
  background-position: top right;
}
.spell--jimmywails-banner--1 > .spell--jimmywails-banner__text {
  right: 3rem;
}
.spell--jimmywails-banner--2 {
  background: linear-gradient(
    135deg,
    rgba(168, 176, 150, 1) 0%,
    rgba(213, 215, 195, 1) 10%,
    rgba(239, 240, 224, 1) 20%,
    rgba(239, 240, 224, 1) 23%,
    rgba(213, 215, 195, 1) 33%,
    rgba(141, 155, 129, 1) 50%,
    rgba(141, 155, 129, 1) 59%,
    rgba(200, 211, 202, 1) 77%,
    rgba(225, 232, 226, 1) 100%
  );
}
.spell--jimmywails-banner--2 > .spell--jimmywails-banner__img {
  background: url(../../../images/spells/assets/jimmy/2.png) no-repeat;
  width: 799px;
  right: 0;
  background-size: auto 100%;
  background-position: top right;
}
.spell--jimmywails-banner--2 > .spell--jimmywails-banner__text {
  left: 3rem;
  color: rgba(0, 0, 0, 0.75);
}
.spell--jimmywails-banner--3 {
  background: linear-gradient(
    135deg,
    rgba(18, 18, 18, 1) 0%,
    rgba(18, 18, 18, 1) 49%,
    rgba(61, 51, 57, 1) 74%,
    rgba(61, 51, 57, 1) 100%
  );
}
.spell--jimmywails-banner--3 > .spell--jimmywails-banner__img {
  background: url(../../../images/spells/assets/jimmy/3.png) no-repeat;
  width: 769px;
  right: -50px;
  background-size: contain;
  background-position: top right;
}
.spell--jimmywails-banner--3 > .spell--jimmywails-banner__text {
  left: 3rem;
}

/**
 * HEADS WILL ROLL
 */
@keyframes roll {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.floating-reaction {
  cursor: pointer;
  position: absolute;
  min-width: 32px;
  min-height: 32px;
  list-style: none;
  border-radius: 50%;
  z-index: 500;
  background: transparent;
  transition: width 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55),
    height 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.floating-reaction.reaction-selected {
  background: transparent !important;
}
.floating-reaction > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  animation: roll 1s linear 0s infinite reverse;
  animation-play-state: paused;
}
.floating-reaction > div > img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  height: 100%;
  animation: roll 2s linear 0s infinite normal;
}
.reverse div {
  animation-play-state: running !important;
}
.spell--headswillroll .reactions-area > div:not(:first-child) > .reaction {
  opacity: 0;
  pointer-events: none;
}

/**
 * ADFLOCK MINUS
 */
@keyframes popup {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes popout {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.85);
  }
}

.spell--adflock__ad {
  position: absolute;
  max-width: 50%;
  top: 0;
  left: 0;
  z-index: 1000;
  border-radius: 4px;
  box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.25),
    10px 10px 50px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  animation: popup 250ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  animation-fill-mode: forwards;
}
.spell--adflock__ad--closing {
  animation: popout 250ms ease-out;
  animation-fill-mode: forwards;
}
.spell--adflock__ad__btn {
  display: block;
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  line-height: 3rem;
  width: 3rem;
  text-align: center;
  color: white;
  background-color: transparent;
  border: 0;
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.75), 1px -1px 0 rgba(0, 0, 0, 0.75),
    -1px 1px 0 rgba(0, 0, 0, 0.75), 1px 1px 0 rgba(0, 0, 0, 0.75);
}
.spell--adflock__ad img {
  width: 100%;
  display: block;
}

/**
   * ATTACKS
   */
.spell--tomato .tomato {
  position: absolute;
  z-index: 10;
  background: url(../../../images/spells/assets/tomato.svg);
  background-size: cover;
  width: 70px;
  height: 70px;
  margin-top: -35px;
  margin-left: -35px;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .spell--tomato .tomato {
    width: 140px;
    height: 140px;
    margin-top: -70px;
    margin-left: -70px;
  }
}
.spell--tomato .tomato:nth-child(2n) {
  transform: rotate(40deg) scale(1.1);
}
.spell--tomato .tomato:nth-child(3n) {
  transform: rotate(10deg) scale(0.95);
}
.spell--tomato .tomato:nth-child(4n) {
  transform: rotate(60deg) scale(1.15);
}
.spell--tomato .tomato:nth-child(5n) {
  transform: rotate(20deg) scale(1.05);
}
/* Permacorrect */
.spell--permacorrect__target {
  display: inline-block;
  text-align: center;
  font-size: 1.2em;
}
.spell--permacorrect__strip {
  position: absolute;
  display: inline-block;
  text-align: center;
  background: white;
  background: #db3651;
  color: white;
  padding: 0 2px;
  box-shadow: 1px 1px 0 #981e32, 1px 1px 1px rgba(0, 0, 0, 0.35);
  text-shadow: none;
  font-weight: 400;
  font-size: 1.2em;
  white-space: nowrap;
  z-index: 1;
  cursor: not-allowed;
}

/**
 * SPELL IMAGES
 */
.spellimg {
  background-image: url(../../../images/spells/1x/spellimg.jpg);
  background-repeat: no-repeat;
  display: block;
  width: 100px;
  height: 100px;
}
.spellimg-sm {
  width: 40px;
  height: 40px;
  background-size: 36px;
}

.spellimg-autocorrect {
  background-position: 0 0;
}

.spellimg-autoplay {
  background-position: 0 -100px;
}
.spellimg-sm.spellimg-autoplay {
  background-position: 0 -36px;
}

.spellimg-bestshit {
  background-position: 0 -200px;
}
.spellimg-sm.spellimg-bestshit {
  background-position: 0 -72px;
}

.spellimg-bigreveal {
  background-position: 0 -300px;
}
.spellimg-sm.spellimg-bigreveal {
  background-position: 0 -108px;
}

.spellimg-braille {
  background-position: 0 -400px;
}
.spellimg-sm.spellimg-braille {
  background-position: 0 -144px;
}

.spellimg-feelinfab {
  background-position: 0 -500px;
}
.spellimg-sm.spellimg-feelinfab {
  background-position: 0 -180px;
}

.spellimg-greatshit {
  background-position: 0 -600px;
}
.spellimg-sm.spellimg-greatshit {
  background-position: 0 -216px;
}

.spellimg-hotbox {
  background-position: 0 -700px;
}
.spellimg-sm.spellimg-hotbox {
  background-position: 0 -252px;
}

.spellimg-linguisticfire {
  background-position: 0 -800px;
}
.spellimg-sm.spellimg-linguisticfire {
  background-position: 0 -288px;
}

.spellimg-nightvision {
  background-position: 0 -900px;
}
.spellimg-sm.spellimg-nightvision {
  background-position: 0 -324px;
}

.spellimg-overreaction {
  background-position: 0 -1000px;
}
.spellimg-sm.spellimg-overreaction {
  background-position: 0 -360px;
}

.spellimg-permacorrect {
  background-position: 0 -1100px;
}
.spellimg-sm.spellimg-permacorrect {
  background-position: 0 -396px;
}

.spellimg-saltcam {
  background-position: 0 -1200px;
}
.spellimg-sm.spellimg-saltcam {
  background-position: 0 -432px;
}

.spellimg-sizematters {
  background-position: 0 -1300px;
}
.spellimg-sm.spellimg-sizematters {
  background-position: 0 -468px;
}

.spellimg-stickaround {
  background-position: 0 -1400px;
}
.spellimg-sm.spellimg-stickaround {
  background-position: 0 -504px;
}

.spellimg-tomato {
  background-position: 0 -1500px;
}
.spellimg-sm.spellimg-tomato {
  background-position: 0 -540px;
}

.spellimg-vertigo {
  background-position: 0 -1600px;
}
.spellimg-sm.spellimg-vertigo {
  background-position: 0 -576px;
}

.spellimg-whodunnit {
  background-position: 0 -1700px;
}
.spellimg-sm.spellimg-whodunnit {
  background-position: 0 -612px;
}

.spellimg-whoops {
  background-position: 0 -1800px;
}
.spellimg-sm.spellimg-whoops {
  background-position: 0 -648px;
}

.spellimg-wide {
  background-position: 0 -1900px;
}
.spellimg-sm.spellimg-wide {
  background-position: 0 -684px;
}

.spellimg-headswillroll {
  background-position: 0 -2000px;
}
.spellimg-sm.spellimg-headswillroll {
  background-position: 0 -720px;
}

.spellimg-jimmywails {
  background-position: 0 -2100px;
}
.spellimg-sm.spellimg-jimmywails {
  background-position: 0 -756px;
}

.spell__loading {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #732d80;
  z-index: 100;
  display: flex;
  text-align: center;
  align-items: center;
}
.spell__loading > div {
  margin: 0 auto;
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.75), 1px -1px 0 rgba(0, 0, 0, 0.75),
    -1px 1px 0 rgba(0, 0, 0, 0.75), 1px 1px 0 rgba(0, 0, 0, 0.75);
}
.spell__loading span {
  display: block;
  margin: 1rem 0 auto;
  font-family: "upheaval", "Lato", helvetica, verdana, sans-serif;
  font-size: 2.5rem;
}
.spell__loading .fa {
  font-size: 5rem;
  margin: 0 auto;
}

@media only screen and (min-device-pixel-ratio: 2) {
  .spellimg {
    background-image: url(../../../images/spells/2x/spellimg.jpg);
    background-size: 200px 200px;
  }
}