body{
    font-family: "Arial",sans-serif;
    font-size:1.3em;
}
h1{
    text-align: center;
    margin-top: 0px;
    margin-bottom: 10px;
    font-family: sans-serif;
    font-size: 6rem;
    background: linear-gradient(to right, #ef5350, #f48fb1, #7e57c2, #2196f3, #26c6da, #43a047, #eeff41, #f9a825, #ff5722);
    -webkit-background-clip:text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
input{
    padding:2px;
    font-size:1.5em;
    width: 150px;

}
label{
color: #656565;
text-align: right;
margin-right:5px;
}
.grid{
display:grid;
grid-template-columns: 150px 150px;
row-gap: 20px;
align-items: center;
}
main{
width:400px;
margin:auto;
margin-top:100px;
}
button{
position:relative;
left:400px

}
.flex-container {
  display: flex;
  justify-content: center; /* Center horizontally */
  align-items: center; /* Center vertically */
  height: 100vh; /* Full viewport height */
}

video {
  width: 80%; /* Set width */
  height: auto; /* Maintain aspect ratio */
}
.p-10 {
  padding-top: 10px;
  padding-left:100px;
}
.size{
  height:auto;
  width:1000px;
}
.m-vid{
  margin-bottom: 400px;
}


@keyframes rainbow-border {
  0% {
      border-color: red;
  }
  14% {
      border-color: orange;
  }
  28% {
      border-color: yellow;
  }
  42% {
      border-color: green;
  }
  57% {
      border-color: blue;
  }
  71% {
      border-color: indigo;
  }
  85% {
      border-color: violet;
  }
  100% {
      border-color: red;
  }
}

.border {
  
 
  border-width: 10px; /* Adjust the border width */
  border-style: solid;
  border-color: red; /* Initial color */
  animation: rainbow-border 10s linear infinite; /* Animation name, duration, timing function, iteration count */
}
h2 {
  font-size: 2em;
  
}