body {
    background-image: url('back-main.png');
    background-repeat: repeat;
}

.title {
  font-family: 'Comic Sans MS', cursive;
  text-align: center;
  color: rgb(245, 168, 1);
  -webkit-text-stroke: 1px black;
}

.card-sprite {
  width: 260px;
  height: 360px;
  background-image: url('sprite.png'); 
  background-repeat: no-repeat;
  display: inline-block;
}

/* Individual cards */
.card-0  { background-position:    0px    0px; }
.card-1  { background-position: -260px    0px; }
.card-2  { background-position: -520px    0px; }
.card-3  { background-position: -780px    0px; }
.card-4  { background-position: -1040px   0px; }
.card-5  { background-position: -1300px   0px; }
.card-6  { background-position: -1560px   0px; }
.card-7  { background-position: -1820px   0px; }
.card-8  { background-position: -2080px   0px; }
.card-9  { background-position: -2340px   0px; }

.card-10 { background-position:    0px  -360px; }
.card-11 { background-position: -260px  -360px; }
.card-12 { background-position: -520px  -360px; }
.card-13 { background-position: -780px  -360px; }
.card-14 { background-position: -1040px -360px; }
.card-15 { background-position: -1300px -360px; }
.card-16 { background-position: -1560px -360px; }
.card-17 { background-position: -1820px -360px; }
.card-18 { background-position: -2080px -360px; }
.card-19 { background-position: -2340px -360px; }

.card-20 { background-position:    0px  -720px; }
.card-21 { background-position: -260px  -720px; }
.card-22 { background-position: -520px  -720px; }
.card-23 { background-position: -780px  -720px; }
.card-24 { background-position: -1040px -720px; }
.card-25 { background-position: -1300px -720px; }
.card-26 { background-position: -1560px -720px; }
.card-27 { background-position: -1820px -720px; }
.card-28 { background-position: -2080px -720px; }
.card-29 { background-position: -2340px -720px; }

.card-30 { background-position:    0px  -1080px; }
.card-31 { background-position: -260px  -1080px; }
.card-32 { background-position: -520px  -1080px; }
.card-33 { background-position: -780px  -1080px; }
.card-34 { background-position: -1040px -1080px; }
.card-35 { background-position: -1300px -1080px; }
.card-36 { background-position: -1560px -1080px; }
.card-37 { background-position: -1820px -1080px; }
.card-38 { background-position: -2080px -1080px; }
.card-39 { background-position: -2340px -1080px; }

.card-40 { background-position:    0px  -1440px; }
.card-41 { background-position: -260px  -1440px; }
.card-42 { background-position: -520px  -1440px; }
.card-43 { background-position: -780px  -1440px; }
.card-44 { background-position: -1040px -1440px; }
.card-45 { background-position: -1300px -1440px; }
.card-46 { background-position: -1560px -1440px; }
.card-47 { background-position: -1820px -1440px; }
.card-48 { background-position: -2080px -1440px; }
.card-49 { background-position: -2340px -1440px; }

.icon {
  display: inline-block;
  width: 48px; /* width of one icon */
  height: 48px;
  background-image: url('icons.png');
  background-size: auto; /* or width depending on your sprite layout */
  vertical-align: middle;
  margin-right: 4px;
}

.icon-heal    { background-position: 0   0; }
.icon-energy  { background-position: -48px 0; }
.icon-dice    { background-position: -96px 0; }
.icon-fame    { background-position: -144px 0; }
.icon-destruction { background-position: -192px 0; }
.icon-damage   { background-position: -240px 0; }
.icon-death    { background-position: -288px 0; }
.icon-smash   { background-position: -336px 0; }
.icon-special  { background-position: -384px 0; }
.icon-keep    { background-position: -432px 0; }
/* And so on, depending on the sprite layout */

.sticker {
  width: 154px;
  height: 154px;
  background-image: url('stickers.png');
  background-size: auto; /* or width depending on your sprite layout */
  display: inline-block;
  vertical-align: middle;
}
.sticker-cool-dino { background-position: 0 0; }
.sticker-panda { background-position: -154px 0; }
.sticker-alien { background-position: -308px 0; }
.sticker-chibi-monster { background-position: -462px 0; }
.sticker-pharao { background-position: -616px 0; }
.sticker-kong { background-position: -770px 0; }
.sticker-jack-o-lantern { background-position: -924px 0; }
.sticker-snake { background-position: -1078px 0; }
.sticker-penguin { background-position: -1232px 0; }
.sticker-robotcat { background-position: -1386px 0; }
.sticker-glowcat { background-position: -1540px 0; }
.sticker-bulbcat { background-position: -1694px 0; }

html {
    overflow-y: scroll;
}