html{
    scroll-behavior:smooth
}

h1{
    font-variant:small-caps;
}

a:hover{
  text-decoration: underline;
  font-family: monospace;
  animation: colorRotate 6s linear 0s infinite;
}

a{
    text-align: center;
  text-decoration: underline;
  font-family: monospace;
  color:navy;
}

.victory{
    animation: colorRotate 3s linear 0s infinite;
}

@keyframes colorRotate {
  from {
    color: #6666ff;
  }
  10% {
    color: #0099ff;
  }
  50% {
    color: #00ff00;
  }
  75% {
    color: #ff3399;
  }
  100% {
    color: #6666ff;
  }
}


hr{
    color:white;
    height:100%;
}


.border3{
     width: 200px;
      height: 100px;
      background: red;
      border-radius:100px;
      margin:auto;
}

.bordersquare{
    border-radius:100px;
}

.bordercircle{
    border-radius:100px;
    height:160px;
    white-space: nowrap;
    min-width:25%;
    max-width:56%;
    margin:auto;
}


.card{
    margin:auto;
}



.card2{
    background-image: url("https://codehs.com/uploads/17f0deddd842f38c1a34876f449404aa");
    margin:auto;
    min-width:97%;
    max-width:200%;
    min-height:750px;
    max-height:987px;
}


.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}


.tiny{
    width:50px;
    height:5%;
}

.ui{
    float:left;
     background-image: url("https://gifdb.com/images/high/retro-pixel-landscape-background-0g0dpo6tlg0pbmfp.gif");
}

.ui2{
    float:right;
    background-image: url("https://gifdb.com/images/high/retro-pixel-landscape-background-0g0dpo6tlg0pbmfp.gif");
}

img2{
    width:50px;
    height:50%;
}

.navbar:hover{
    color:green;
}

.target{
    margin:auto;
}



.navbar{
    background-color:saddlebrown;
}

.btn{
    border-radius:100px;
}


.the{
    margin:auto;
    border:3px solid;
    border-color: green;
    
}

.game{
    width:500px;
    height:500px;
}


.crosshair {cursor: crosshair;}

.embed-responsive-item{
    width:200px;
    height:100px;
}

.d-block{
    margin:auto;
    width:75%;
}

audio{
    width:100%;
    display:;
    
}

.signed{
  border-radius:100px;
  border-color:black;
  color: white;
  padding: 16px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  cursor: pointer;
    
}


table{/* This is for the table in the chatroom */
    border: 1px solid white;
    width:80%;
    margin:auto;
}

th:first-child {  /* This is for the first header in the table */
    width:10%;
    background-color: seagreen;
}
  
th:nth-child(2) { /* This is for the second header in the table */
    width:90%;
    background-color: seagreen;
    text-align: left;
    padding-left: 3%;
}

td:first-child {  /* This is for the first column in the table */
    width:10%;
    text-align: left;
    padding-left:20px;
}
  
td:nth-child(2) {  /* This is for the second column in the table */
    width:90%;
    text-align: left;
    padding-left: 3%;
}

.chatroomText{  /* This is for the Welcome and the textbox to enter a msg*/
    width:80%;
    margin:auto;
    text-align: left;
}