:root {
  --normal-monster: #dcbd5e;
  --effect-monster: #b66e4e;
  --ritual-monster: #4d78c0;
  --fusion-monster: #b77fc8;
  --synchro-monster: #c2c1c6;
  --xyz-monster: #262827;
  --link-monster: #1f6ea3;
  
  
  --obelisk: #5067a1;
  --ra: #bac22e;
  --slifer: #a8524d;
    
  
  --pendulum-normal-monster: linear-gradient(to bottom, var(--normal-monster), var(--spell));
  --pendulum-effect-monster: linear-gradient(to bottom, var(--effect-monster), var(--spell));
  --pendulum-ritual-monster: linear-gradient(to bottom, var(--ritual-monster), var(--spell));
  --pendulum-fusion-monster: linear-gradient(to bottom, var(--fusion-monster), var(--spell));
  --pendulum-synchro-monster: linear-gradient(to bottom, var(--synchro-monster), var(--spell));
  --pendulum-xyz-monster: linear-gradient(to bottom, var(--xyz-monster), var(--spell));
  
  
  --spell: #b9dedb;
  --trap: #b57a99;
  
  --token: #b6bcc1;
}


/* Deck Lists */
  .monsters, 
  .spells, 
  .traps, 
  .extra, 
  .supplies {
    border: 3px groove black;
  }
  
  .monsters th {
    background-color: var(--normal-monster);
  }
  
  .spells th {
    background-color: var(--spell);
  }
  
  .traps th {
    background-color: var(--trap);
  }
  
  .extra th {
    background-color: var(--fusion-monster);
  }
  
  .supplies th {
    background-color: var(--token);
  }
  
  .monsters tr, 
  .spells tr, 
  .traps tr, 
  .extra tr, 
  .supplies tr {
    height: 25px;
  }
  
  .monsters tr:last-child, 
  .spells tr:last-child, 
  .traps tr:last-child, 
  .extra tr:last-child, 
  .supplies tr:last-child {
    border-top: 3px solid black;
  }
  
  .monsters tr:last-child td:last-child, 
  .spells tr:last-child td:last-child, 
  .traps tr:last-child td:last-child, 
  .extra tr:last-child td:last-child, 
  .supplies tr:last-child td:last-child {
    text-align: left;
    font-weight: bold;
  }
  
  .monsters tr:last-child td:first-child {
    background-color: #dcbd5e;
  }
  
  .spells tr:last-child td:first-child {
    background-color: #b9dedb;
  }
  
  .traps tr:last-child td:first-child {
    background-color: #b57a99;
  }
  
  .extra tr:last-child td:first-child {
    background-color: #caa0d2;
  }
  
  .supplies tr:last-child td:first-child {
    background-color: #b6bcc1;
  }


/* Card Spotlights */
  .normal-monster-card,
  .effect-monster-card,
  .ritual-monster-card,
  .fusion-monster-card,
  .synchro-monster-card,
  .xyz-monster-card,
  .link-monster-card,
  .pendulum-normal-monster-card,
  .pendulum-effect-monster-card,
  .pendulum-ritual-monster-card,
  .pendulum-fusion-monster-card,
  .pendulum-synchro-monster-card,
  .pendulum-xyz-monster-card,
  .spell-card,
  .trap-card,
  .token-card,
  .obelisk-card,
  .ra-card,
  .slifer-card {
    float: right;
    border: 3px double black;
    width: 25%;
    margin-top: var(--margin);
    margin-bottom: var(--margin);
    margin-left: var(--margin);
    padding: var(--margin);
    /* Debugging */ background-color: purple;
  }
  
  .normal-monster-card p,
  .effect-monster-card p,
  .ritual-monster-card p,
  .fusion-monster-card p,
  .synchro-monster-card p,
  .xyz-monster-card p,
  .link-monster-card p,
  .pendulum-normal-monster-card p,
  .pendulum-effect-monster-card p,
  .pendulum-ritual-monster-card p,
  .pendulum-fusion-monster-card p,
  .pendulum-synchro-monster-card p,
  .pendulum-xyz-monster-card p,
  .spell-card p,
  .trap-card p,
  .token-card p,
  .obelisk-card p,
  .ra-card p,
  .slifer-card p {
    line-height: 1.25;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  
  .normal-monster-card ul li,
  .effect-monster-card ul li,
  .ritual-monster-card ul li,
  .fusion-monster-card ul li,
  .synchro-monster-card ul li,
  .xyz-monster-card ul li,
  .link-monster-card ul li,
  .pendulum-normal-monster-card ul li,
  .pendulum-effect-monster-card ul li,
  .pendulum-ritual-monster-card ul li,
  .pendulum-fusion-monster-card ul li,
  .pendulum-synchro-monster-card ul li,
  .pendulum-xyz-monster-card ul li,
  .spell-card ul li,
  .trap-card ul li,
  .token-card ul li,
  .obelisk-card ul li,
  .ra-card ul li,
  .slifer-card ul li {
    line-height: 1.25;
    margin-top: 0;
    margin-bottom: 0;
  }
  
  .normal-monster-card p:first-child,
  .effect-monster-card p:first-child,
  .ritual-monster-card p:first-child,
  .fusion-monster-card p:first-child,
  .synchro-monster-card p:first-child,
  .xyz-monster-card p:first-child,
  .link-monster-card p:first-child,
  .pendulum-normal-monster-card p:first-child,
  .pendulum-effect-monster-card p:first-child,
  .pendulum-ritual-monster-card p:first-child,
  .pendulum-fusion-monster-card p:first-child,
  .pendulum-synchro-monster-card p:first-child,
  .pendulum-xyz-monster-card p:first-child,
  .spell-card p:first-child,
  .trap-card p:first-child,
  .token-card p:first-child,
  .obelisk-card p:first-child,
  .ra-card p:first-child,
  .slifer-card p:first-child {
    margin-top: 0;
    text-align: center;
  }
  
  .normal-monster-card p:last-child,
  .effect-monster-card p:last-child,
  .ritual-monster-card p:last-child,
  .fusion-monster-card p:last-child,
  .synchro-monster-card p:last-child,
  .xyz-monster-card p:last-child,
  .link-monster-card p:last-child,
  .pendulum-normal-monster-card p:last-child,
  .pendulum-effect-monster-card p:last-child,
  .pendulum-ritual-monster-card p:last-child,
  .pendulum-fusion-monster-card p:last-child,
  .pendulum-synchro-monster-card p:last-child,
  .pendulum-xyz-monster-card p:last-child,
  .spell-card p:last-child,
  .trap-card p:last-child,
  .token-card p:last-child,
  .obelisk-card p:last-child,
  .ra-card p:last-child,
  .slifer-card p:last-child {
    margin-bottom: 0;
  }
  
  .normal-monster-card {
    background-color: var(--normal-monster);
  }
  
  .effect-monster-card {
    background-color: var(--effect-monster);
  }
  
  .ritual-monster-card {
    background-color: var(--ritual-monster);
  }
  
  .fusion-monster-card {
    background-color: var(--fusion-monster);
  }
  
  .synchro-monster-card {
    background-color: var(--synchro-monster);
  }
  
  .xyz-monster-card {
    background-color: var(--xyz-monster);
    color: #ffffff;
  }
  
  .link-monster-card {
    background-color: var(--link-monster);
  }
  
  .spell-card {
    background-color: var(--spell);
  }
  
  .trap-card {
    background-color: var(--trap);
  }
  
  .token-card {
    background-color: var(--token);
  }
  
  .pendulum-normal-monster-card {
    background: transparent;
    background-image: linear-gradient(to bottom, var(--normal-monster), var(--spell));
  }
  
  .pendulum-effect-monster-card {
    background: transparent;
    background-image: linear-gradient(to bottom, var(--effect-monster), var(--spell));;
  }
  
  .pendulum-ritual-monster-card {
    background: transparent;
    background-image: linear-gradient(to bottom, var(--ritual-monster), var(--spell));
  }
  
  .pendulum-fusion-monster-card {
    background: transparent;
    background-image: linear-gradient(to bottom, var(--fusion-monster), var(--spell));
  }
  
  .pendulum-synchro-monster-card {
    background: transparent;
    background-image: linear-gradient(to bottom, var(--synchro-monster), var(--spell));
  }
  
  .pendulum-xyz-monster-card {
    background: transparent;
    background-image: linear-gradient(to bottom, var(--xyz-monster), var(--spell));
  }
  
  .obelisk-card {
    background-color: var(--obelisk);
  }
  
  .ra-card {
    background-color: var(--ra);
  }
  
  .slifer-card {
    background-color: var(--slifer);
  }