.mainbox {
    display : flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-direction: column;

}
.container{
    display: grid;
    grid-template-rows: 2fr 1fr;
    border: aquamarine 1px solid;
    min-width: 30vw;
    max-width: 50vw;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: mediumslateblue;
    border-radius: 10px;
    height: fit-content;
    overflow-wrap: break-word;
    padding-bottom: 10px;
}
.button{
    background-color:grey ;
    border: black 5px solid;
    border-radius: 10px;
    width: fit-content;
    height: fit-content;
    align-items: center;
    align-content: center;
    justify-self: left;
    color: black;
    grid-row: 2/-2;
}
.button:hover{
    animation: aqua .15s ease-in-out forwards;

}
@keyframes aqua {
    from { rotate: 8deg; }
    to { rotate: 0deg; background-color: aquamarine }
}
.button:link{
    text-decoration: none;
}
.button:visited{
    color: black;
}
p{
    text-align: center;
}
hr{
    color:black
}