body{
    padding-top: 20px;
    padding-bottom: 50px;
    font-size: calc(17px + 0.390625vw);
    color: white;
    background-color: grey;
}
.box{
    text-align: center;
}
div#screen{
    margin: auto;
    width:390px;
    border: 2px solid red;
    padding: 5px;
}
@media screen and (max-width:430px) {
    body{
        padding: 0;
    }
    div#screen{
        margin: 0;
    }
}
input, button{
    font-size: calc(16px + 0.390625vw);
    width: 100px;
}

.grid{
    display: grid;
    grid-template-columns: max-content max-content;
    grid-template-rows: max-content max-content;
    column-gap: 10px;
    row-gap: 10px;
}
.title{
    background-color: rgb(11, 87, 90);
    padding: 7px;

    border-radius: 15px;
}
#picture{
    width: 90%;
    margin: auto;
    height: 200px;
    background-repeat: no-repeat;
    background-image: url("data:image/jpeg;base64,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");
}
h2{
    width: max-content;
    padding: 0;
}
.border{
    border-bottom: 2px solid white;
    margin-bottom: 10px;
    max-width: fit-content;
}
#clock{
    font-size: calc(25px + 0.390625vw);
    height: 40px;
    text-align: left;
}

#box{
    position: fixed;
    left: 50%;        /* Move the element horizontally to the center of the screen */
    bottom: 5px;     /* Position it at the bottom with a 20px margin */
    transform: translateX(-50%); /* Offset by 50% of the element's width to truly center it */
    margin: 0 auto;   /* Optional: ensure the auto margin doesn't interfere */
    display: flex;
    flex-wrap: nowrap;
    
}
#address{
    padding: 5px;
    margin-top: 0;
    margin-bottom: 5px;
    text-align: left;
    font-size: calc(8px + 0.390625vw);
}
#padd{
    padding-left: 10px;
}
#weather{
    width: 200px;
    margin-top: 10px;
}
#date{
    margin-bottom: 20px;
}
#temperature,#weather{
    font-size: calc(30px + 0.390625vw);
    font-weight: 900;
}
#border{
    width: 99%;
    margin: 10px auto 10px auto;
    background-color: #ffffff;
    height: 5px;
}
button{
    width: 250px;
}