:root {
    --fore: rgb(212, 255, 0);
    --back: #060606;
    --font: 'Source Code Pro', monospace;
}

header {
    font-size: medium;
    
}

#showCards {
    position: absolute;
    top: 10px;
    width: 60px;
    right: 70px;
}

#showCards:hover {
    content:url("deckimg2.svg");

}

h1 {
    text-shadow: 0 0 10px rgba(247, 255, 4, 0.247), 0 0 10px rgba(255, 255, 255, 0), 0 0 22px rgba(195, 255, 0, 0.297), 0 0 42px rgba(195, 255, 0, 0.218),0 0 32px rgba(191, 255, 0, 0.251);
}

body {
    background-color: var(--back);
    color: var(--fore);
    font-family: var(--font);
}

#wrapper {
    display: grid;
    place-items: center;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 20rem auto;
}


/* GRID ITEMS */
#globe {
    max-width: 100%;
    grid-column: 4 / span 3;
    grid-row: 1 / 3;
}
#wrapper > svg {
    /* max-width: 100%; */
    grid-column: 2 / span 8;
    grid-row: 1 / 3;
}
#card1 {
    grid-column: 9 / 12;
    grid-row: 2 / 10;
    z-index: -1;
}
#card1 img {
    max-width: 100%;
}

#type {
    grid-column: 1 / 5;
    grid-row: 1 / 2;
    font-size: x-small;
    font-weight: 400;
    align-self: end;
    overflow-y: hidden;
    
    
}

.hidden {
    display: none !important;
}

#cards {
    display: flex; 
    justify-content: flex-end;
    gap: 10px;
    position: absolute;
    justify-content: flex-end;
    flex-wrap: wrap;
    top: 70px;
    right: 70px;
    width: 700px;
    
}

#cards img {
    width: 200px;
}

#showCards {
    float: right;
    
}

.cursor::after {
    content:'';
    display:inline-block;
    margin-left:3px;
    background-color:rgb(205, 250, 3);
    animation-name:blink;
    animation-duration:0.5s;
    animation-iteration-count: infinite;
  }
  h1.cursor::after {
    height:24px;
    width:13px;
  }
  p.cursor::after {
    height:13px;
    width:6px;
  }
  
  @keyframes blink {
    0% {
      opacity:1;
    }
    49% {
      opacity:1;
    }
    50% {
      opacity:0;
    }
    100% {
      opacity:0;
    }
  }

  .output {
    text-align:center;
    font-family: 'Source Code Pro', monospace;
    color:white;
  }

/* #glitchy_text {
    grid-column: 1 / span 5;
    grid-row: 1 / 2;
    z-index: 1;
} */

/* :not(:defined) { display: none; }
type-writer:defined::after {
	content: attr(carret);
	display: inline;
	opacity: .6;
} */
/* body {
  display: flex;
  flex-flow: column;
  place-items: center;
  text-align: center;
  font-family: sans-serif;
  font-size: 1.6em;
}
body>:not(:first-child) { margin-top: 1em } */

/* td, th { padding: .4em .6em; } */