.quote {
  top:0px;
  font-size: 800%;
  font-family:'Courier New', Courier, monospace;
  word-spacing: 40px;
  color:rgb(11, 29, 14);
 }

 .numbers {
  padding:10px;
  font-size:200%;
  font-family:'Courier New', Courier, monospace;
  text-align-last: center;
  color:rgb(11, 29, 14);
 }


 .agc {
  position: fixed;
  color:rgb(255, 255, 255);
  font-size:1000%;
  width:50%;
  height:750px;
  left:40%;
  top:350px;
} 

.name {
  position: fixed;
  top: 10px;
  left: 20px;
  color:rgb(255, 255, 255);
  font-size:15px;
  font-family:'Courier New', Courier, monospace;
}

.name2 {
  position: fixed;
  top: 28px;
  left: 38px;
  color:rgb(255, 255, 255);
  font-size:15px;
  font-family:'Courier New', Courier, monospace;
}

.contact {
  position: fixed;
  top: 10px;
  right: 20px;
  color:rgb(255, 255, 255);
  font-size:15px;
  font-family:'Courier New', Courier, monospace;
}

.work {
  position: fixed;
  top: 10px;
  left: 100px;
  color:rgb(255, 255, 255);
  font-size:15px;
  font-family:'Courier New', Courier, monospace;
}

.about {
  position: fixed;
  top: 10px;
  right: 100px;
  color:rgb(255, 255, 255);
  font-size:15px;
  font-family:'Courier New', Courier, monospace;
}

p {
    font-size: 100%;
    color: rgb(244, 228, 195);
    padding: 6px;
    text-align-last: center;
    padding:100px;
}

.special {
    font-size: 80%;
    font-family:'Courier New', Courier, monospace;
    margin: 10px;
    color:white;
    text-align-last:center;
}

.blizzard {
    position: relative;
}

.boogie {
    right: 2px;
    position: fixed;
}

.draggable {
  cursor:grab;
}

h1 {
    color:rgb(11, 29, 14);
    font-family:'Courier New', Courier, monospace;
    text-align-last:center;
    font-size: 20px;
  }

ol {
    font-size: 90%;
    font-family:'Courier New', Courier, monospace;
    text-align-last:center;
    color:rgb(11, 29, 14);

  }

body {
	background: linear-gradient(-45deg, #ffffff, #c9a3e6, #a140be, #cf3a87);
	background-size: 400% 400%;
	animation: gradient 50s ease infinite;
	height: 100vh;
  transition: right .5s;
  position:relative;
}

.box {
  background-color: slategray;
  color:rgb(245, 187, 245);
  font-size: 20px;
  height:100vh;
  position:fixed;
  top:0;
  right:-300px;
  width:300px;
  border-left:1px solid;    
  transition: right .5s;
}

button {
  border: 1px solid;
  cursor:pointer;
  background-color:thistle;
  border-radius: 5px;
  transition: background-color .2s;
}

button:hover {
  background-color:pink;
}

button:active {
  background-color:white;
}

 /* Dropdown Button */
 .dropbtn {
    background-color: transparent;
    color: rgb(255, 255, 255);
    padding: -4px;
    font-family: 'Courier New', Courier, monospace;
    font-size: 15px;
    border: none;
  }
  
  
  /* Dropdown Content (Hidden by Default) */
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  /* Links inside the dropdown */
  .dropdown-content a {
    color: rgb(146, 83, 148);;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-family: 'Courier New', Courier, monospace;
    font-size: 15px;
  }
  
  /* Change color of dropdown links on hover */
  .dropdown-content a:hover {background-color: rgb(255, 255, 255);}
  
  /* Show the dropdown menu on hover */
  .dropdown:hover .dropdown-content {display: block;}
  
  /* Change the background color of the dropdown button when the dropdown content is shown */
  .dropdown:hover .dropbtn {background-color:rgb(146, 83, 148);} 

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}