@media only screen and (min-width : 1200px) {
    body {
        width:100vw;
        transform: scale(0.6);
        transform-origin: top center;

    }
}

body {
  background-color: black;
}

h1 {
  font-size: 1vw;
  background: -webkit-linear-gradient(#ffffff, #d8ff00, #00c6ff); /* Light yellow - Light red - blue */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

h2 {
  font-size: 2vw;
  background: -webkit-linear-gradient(#c94208, #a2cf00); /* Orange - Yellowgreen */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
  /*
     h3 {
       font-size: 9px;
       background: -webkit-linear-gradient(#de05f2, #f2a305); /* Purple - Darkyellow */
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
}
  */
h4 {
  font-size: 25px;
  background: -webkit-linear-gradient(#de05f2, #f2a305); /* Purple - Darkyellow */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

h5 {
  font-size: 1vw;
  background: -webkit-linear-gradient(#28fc03, #fc2003, #109de8); /* Green - Blue */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

h6 {
  font-size: 1vw;
  background: -webkit-linear-gradient(#105ee6, #5bc5e3); /* Darker blue - Lighter blue */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

p {
  font-size: 3vw;
  font-family: "Lucida Console", "Courier New", monospace;
  background: -webkit-linear-gradient(#bac1cc, #c7cdd6); /* Light grey - Light grey */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

a {
  font-size: 4vw;
  font-family: "Lucida Console", "Courier New", monospace;
  background: -webkit-linear-gradient(#ffffff, #9acdfc); /* lightred - red */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

pre {
    font-family: ;
   /* white-space: pre-wrap !important; */
}

@font-face {
  font-family: ;
}


                     /* WRAPPERS and ASPECT RATIO */
.aspectwrapper {
  display: inline-block;
  width: 10%;
  position: relative;    /* so .content can use position: absolute */
}
.aspectwrapper::after {
  padding-top: 56.25%; /* percentage of containing block _width_ */
  display: block;
  content: '';
}
.content {
  position: absolute;
  top: 0; bottom: 0; right: 0; left: 0;  /* follow the parent's edges */
  outline: thin dashed green;            /* box visibility */
}



                   /* STYLES */

