body,html { margin: 0; height: 100%; display: flex; flex-direction: column; overflow: hidden; background-size: cover; background-repeat: no-repeat; background-color: rgba(21, 50, 65, 0.7); } .container-top { height: 10%; width: 100%; display: grid; justify-content: center; align-items: center; color:white; font-size: 50px; } .container-bottom { height: 75%; width: 100%; display: flex; justify-content: center; align-items: center; } .container1 { width: 80%; height: 80%; } .bottom{ height:10%; width:100%; display: flex; justify-content: center; align-items: center; } #humidity { margin:100px; font-size:60px; color:white; } /* Responsive design */ @media (max-width: 600px) { .container-top { font-size: 30px; } .container1 { width: 90%; height: 90%; } #temperature { margin: 20px; font-size: 40px; } }