.nav-links {
list-style: none;
height: 200px;
display: flex;
justify-content: center;
align-items: center;
margin: 5px;
padding: 0;
font-size: larger; /* Default font size */
background-image: url("Sky.webp");
justify-content: space-evenly;
/* For tablets and large mobile devices (up to 1023px) */
/* For small mobile devices (up to 479px) */
}
@media screen and (max-width: 479px) {
header{
width: 100%;
height: 200px;
}
.nav-links{
flex-direction: column; /* Stack links vertically */
gap: 5px; /* Tighten gap further */
font-size: larger;
align-items: flex-start; /* Align links to the left */
padding-left: 20px; /* Add left padding */
display: flex;
justify-content: center;
}
li:hover{
background-color: #333;
}
}
@media screen and (max-width: 1023px) {
header{
width: 100%;
height: 200px;
}
.nav-links{
flex-direction: row; /* Stack links vertically */
gap: 5px; /* Tighten gap further */
font-size: larger;
align-items: center; /* Align links to the left */
justify-content: center;
padding-left: 20px; /* Add left padding */
display: flex;
justify-content: space-evenly;
}
li:hover{
background-color: #333;
text-decoration: none;
}
}