html{
  min-height: 100%; /* this code fixes the gradient overlapping at the bottom */
  position: relative; /* this code fixes the gradient overlapping at the bottom */
}
body {
    background: linear-gradient(45deg, #333333, #07294D, #006699,#E1E1E0,#FFC600, #FFC600,#FFC600);
    background-size: 500% 500%; /* this code fixes the gradient overlapping at the bottom */
    width: 100%; /* this code fixes the gradient overlapping at the bottom */
    height: 100%; /* this code fixes the gradient overlapping at the bottom */
    animation: color 26s ease-in-out infinite; /* Added 's' for seconds */
}
@keyframes color {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }

}

.Top {
    align-items: center; /* Align items vertically */
}
h1 {
    text-align: center;
}
h3 {
    text-align: center;
}
.logo {
  margin-right: 10px; /* Adjust the margin as needed */
  width: 180px;
}

.link {
	float: right;
}

/* Start of custom sidebar*/
*::-webkit-scrollbar {
    height: 10px;
    width: 10px;
  }
  *::-webkit-scrollbar-track {
    border-radius: 5px;
    background-color: #DFE9EB;
  }
  
  *::-webkit-scrollbar-track:hover {
    background-color: #B8C0C2;
  }
  
  *::-webkit-scrollbar-track:active {
    background-color: #B8C0C2;
  }
  
  *::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: #686868;
  }
  
  *::-webkit-scrollbar-thumb:hover {
    background-color: #686868;
  }
  
  *::-webkit-scrollbar-thumb:active {
    background-color: #686868;
  }
/*start of the href button*/
.link {
  background-color: #ddd;
  border: none;
  color: black;
  padding: 16px 32px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  transition: 0.3s;
  border-radius: 25px;
}

.link:hover {
  background-color: #3e8e41;
  color: white;
}

.Dragon {

  text-align: center;
  width: 1450px;
  height: 300px;

}