Responsive styling

This commit is contained in:
2022-11-12 17:21:53 +02:00
parent 88df9ee947
commit 3a9d767f14
3 changed files with 36 additions and 16 deletions

View File

@@ -16,6 +16,7 @@
display: flex;
align-items: center;
flex-direction: column;
max-width: 80%;
}
.sectionContainer {
@@ -29,8 +30,17 @@
margin-top: 1rem;
}
@media screen and (max-width: 600px) {
.address {
max-width: 120%;
margin-bottom: 1rem;
}
}
.mainLogo {
margin-top: -1rem;
max-width: 120%;
height: 100%;
}
.title {
@@ -42,6 +52,12 @@
letter-spacing: normal;
}
@media screen and (max-width: 600px) {
.underLogo {
font-size: 1.1rem;
}
}
.keepersImage {
max-width: 150px;
margin-top: 1.5rem;
@@ -56,12 +72,13 @@
display: flex;
justify-content: space-around;
margin-top: 1rem;
width: 50%;
}
.socialMediaIcon {
max-width: 30px;
margin: 15px;
margin-bottom: 0;
height: 100%;
}
.postServiceDesc {
@@ -92,6 +109,8 @@
.menuImage {
margin-bottom: 1rem;
max-width: 100%;
height: 100%;
}
.menuLink {
@@ -121,9 +140,20 @@
margin-bottom: 0;
}
.collaborationImage {
max-width: 100%;
height: 100%;
}
.googleMaps {
border: 0;
width: 100%;
height: 30rem;
margin: 5% 20% 0% 20%;
}
@media screen and (max-width: 600px) {
.googleMaps {
height: 15rem;
}
}