body{
    margin: 0;
    height: 100vh;
display: flex;
justify-content: center;
align-items: center;
 background-color: azure;
}

image-container{
    display: flex;
    justify-content: center;
    align-items: center;
}

.resposive-image{
width: 100%;
height: auto;
object-fit: cover;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}


@media (max-width: 700px){
.responsive-image{
        width: 90vw;
        height:auto;
}
picture{
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
   
   
}

body{
    justify-content: flex-start;
    align-items: flex-start;
    background-color: #dbd8d3;
}
}