body{
    display: flex;
    margin: 0%;
    padding: 0%;
    height: 100%;
    justify-content: center;
    text-align: center;
    box-sizing: border-box;
    background:linear-gradient(to right,
    rgb(2, 8, 83) 50%,
    rgb(248, 245, 246) 50%)
    fixed
}
.container{
    padding: 15px;
    background-color:white;
    width: 300px;
    height: 250px;
    border: 6px solid silver;
    border-radius: 2%;
    box-shadow: 10px 10px 10px 10px black;
    margin: 25vh;
}
img{
    width: 200px;
    height: 200px;
}
button{
    margin:2vh;
}
#btn{
    font-size: 18px;
    font-family:"Rubik",sans-serif;;
    font-weight: 900;
    background-color:rgb(88, 85, 86);
    color:silver;
    text-shadow: 2px 2px black;
    border: 2px solid rgb(138, 119, 248);
    padding: 8px;
    border-radius: 8px;
    cursor: pointer;

}
#result{
    margin-top:70px;
    font-size: 95px;
    color:red;
    font-family:"Rubik",sans-serif;
    font-weight:900;
    text-shadow: 2px 2px silver;
}
footer{
        font-family: "Rubik",sans-serif;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        text-align: center;
        color: black;
        background-color: gray;
        font-size: 22px;
        font-weight: 900;
        padding:4px;
    }
@media screen and (max-width:800px) {
    .container{
        position: fixed;
        margin: 17vh;
        width:300px;
        height: 250px;
    }
    
}