@import url('https://fonts.googleapis.com/css2?family=Arvo&family=Bree+Serif&family=Clicker+Script&family=Courgette&family=Libre+Baskerville:wght@700&family=Lobster+Two:wght@700&family=Orelega+One&family=PT+Serif:ital,wght@1,700&family=Pacifico&family=Patua+One&family=Roboto+Slab:wght@600&family=Signika+Negative:wght@300&family=Yantramanav&display=swap');


body {
    transition: 1s;
    background-color: rgb(6, 1, 50);
    display: flex;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    height: 97vh;
    font-family: 'Roboto Slab', serif;
}

.container {
    background: linear-gradient(90deg, rgb(133, 21, 160), rgb(205, 37, 37), rgb(70, 203, 25));
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 1rem;
    justify-content: center;
    border-radius: .3rem;
    padding: 1rem;
}

.container button {
    width: 100%;
    outline: none;
    border: none;
    border-radius: .3rem;
    min-height: 2.5rem;
    background-color: rgb(2, 2, 52);
    color: white;
    font-weight: bolder;
    cursor: pointer;
}

.container h2 {
    color: black;
}

h2 {
    color: white;
}

#btn1 {
    margin-top: .7rem;
    transition: 1s;
}

#btn,
#btn1 {
    background: linear-gradient(200deg, rgb(215, 53, 255), rgb(22, 41, 147), rgb(125, 255, 81));
}

#btn:hover {
    background: linear-gradient(90deg, rgb(117, 6, 144), rgb(8, 6, 93), rgb(29, 7, 91));
}

#btn1:hover {
    background: linear-gradient(90deg, rgb(117, 6, 144), rgb(8, 6, 93), rgb(29, 7, 91));
}

#Copied {
    background: linear-gradient(400deg, rgb(215, 53, 255), rgb(22, 41, 147), rgb(125, 255, 81));
    color: white;
    width: 50%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: .2rem;
    transition: all 3s;
}