la-parenthese-bleue/css/home.css

216 lines
3.4 KiB
CSS
Raw Permalink Normal View History

2025-11-30 01:37:28 +01:00
.home-bg {
background-image: url('../images/illustrations/home/autism-background.webp');
height: 100vh;
min-height: 750px;
background-position: right;
background-repeat: no-repeat;
background-size: cover;
position: relative;
z-index: 1;
color: white;
}
.home-bg::after {
content: "";
display: block;
position: absolute;
z-index: -1;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: #004064E0;
}
.home-header {
text-align: center;
margin-left: 10px;
margin-right: 10px;
}
.home-title {
font-family: DancingScript;
text-align: center;
font-size: 100px;
line-height: 1.1;
font-weight: normal;
padding-top: 50px;
margin: 5px;
}
.home-headline {
font-size: 24px;
}
.home-footer {
padding-left: 48px;
padding-top: 100px;
}
.home-contact {
font-size: 16px;
text-transform: uppercase;
}
.home-contact-content {
margin-top: 20px;
}
.home-contact-logo {
min-width: 40px;
min-height: 40px;
border-radius: 50%;
border: 1px solid white;
text-decoration: none;
justify-content: center;
margin-bottom: 5px;
}
.home-contact-text {
display: inline-flex;
align-items: center;
color: white;
margin-right: 15px;
}
.home-contact-link {
color: white;
}
.home-photo {
height: 400px;
}
.home-prestations {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-column-gap: 40px;
align-items: stretch;
text-align: left;
margin-top: 50px;
}
.home-prestations-title {
display: flex;
justify-content: center;
align-items: center;
height: 70px;
}
.home-prestations-title h3 {
margin-left: 20px;
width: 100%;
}
.home-logo {
height: 50px;
width: 50px;
border-radius: 0;
}
.home-map-display {
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
}
.home-resources {
text-align: center;
}
.home-resources a {
text-decoration: none;
}
.home-resources img {
margin: 1%;
}
@media (max-width: 1000px) {
.home-prestations {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-column-gap: 40px;
align-items: stretch;
text-align: left;
}
.home-resources span {
display: block;
}
.home-resources img {
width: 25%;
}
}
@media (max-width: 795px) {
.home-prestations {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
grid-column-gap: 40px;
align-items: stretch;
text-align: left;
}
}
@media (max-width: 735px) {
.illustrated-left {
float: none;
}
.home-photo {
margin: auto;
display: block;
}
}
@media (max-width: 485px) {
.home-photo {
height: 100%;
width: 100%;
}
}
@media (max-width: 390px) {
.home-contact-content {
font-size: 14px;
}
.home-contact-logo {
display: none;
}
.home-footer div div {
margin-top: 12px;
}
}
@media (max-width: 50em) {
.home-title {
font-size: 60px;
}
.home-headline {
font-size: 17px;
}
}