You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
52 lines
1.0 KiB
52 lines
1.0 KiB
/* General styles for the body and container */ |
|
body, html { |
|
height: 100%; |
|
margin: 0; |
|
align-items: center; |
|
justify-content: center; |
|
background-color: #f0f0f0; /* Optional: background color */ |
|
} |
|
|
|
.grid-container { |
|
display: grid; |
|
height: 100vh; |
|
width: 100vw; |
|
grid-template-columns: 1fr auto 1fr; |
|
grid-template-rows: 1fr auto 1fr; |
|
"heading . signature" |
|
"buttons logo ." |
|
"nav nav nav" |
|
} |
|
|
|
.grid-item { |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
} |
|
|
|
.grid-item img { |
|
max-width: 25vw; /* Image width occupies 25% of the viewport width */ |
|
max-height: 25vh; /* Image height occupies 25% of the viewport height */ |
|
object-fit: contain; |
|
} |
|
|
|
.card { |
|
grid-area: buttons; |
|
background-color: aqua; |
|
} |
|
|
|
.nav { |
|
grid-area: nav; |
|
} |
|
|
|
.heading { |
|
grid-area: heading; |
|
font-size: 18px; |
|
background-color: firebrick; |
|
} |
|
|
|
.signature { |
|
grid-area: signature; |
|
font-size: 18px; |
|
background-color: mediumpurple; |
|
} |