*{
    /* margin: 0%; */
    /* padding: 0%; */
    box-sizing: border-box;
    text-decoration: none;
}
body {
   background: linear-gradient(to right,rgb(10, 184, 227), #000000, #090909);
    /* background: linear-gradient(to right, #081b08, #ffffff); */
    font-family: Arial, sans-serif;
}

h1, h2 {
    text-align: center;
    color: #0a318c; /* a softer red */
}

h3 {
    text-align: center;
    color: #06f3ffe1;
}

.main {
    display: flex;
    flex-wrap: wrap;
    gap: 3rem;
    justify-content: center;
    margin-top: 100px;
}

.paper {
    width: 150px;
    height: 200px;
    /* background-color: rgba(216, 220, 96, 0.964); */
    background: linear-gradient(to top,black,rgb(208, 208, 205));
    border-radius: 10px;
    border: 2px solid  rgb(26, 157, 223);
    text-align: center;
    /* box-shadow: 2px 2px 6px rgba(0,0,0,0.2); */
    box-shadow: inset 0px 0px 30px 5px rgb(0, 0, 0);
    transition: transform 0.2s ease, background-color 0.2s ease;
}

.paper:hover {
    transform: scale(1.05);
    background: linear-gradient(to top,black,rgb(2, 171, 228));

}
.btnD:hover{
    background: linear-gradient(to right ,black,black);
}
.btnD{
    
    color: rgb(255, 0, 0) ;
    background:linear-gradient(to left ,rgba(25, 25, 25, 0),rgba(9, 9, 9, 0.704));
    padding:  4%;
    border-radius: 10px;
     display: inline-block;
    margin-top: 30px;
}
 h1{
    animation: colorChange 3s infinite;
}

@keyframes colorChange {
    0%{
        color: red;
    }
    25%{
        color: yellow;
    }
    50%{
        color: blue;
    }
    75%{
        color: green;
    }
    100%{
        color: red;
    }
}