challenge-landing-page-samu.../styles/style.css

123 lines
2.0 KiB
CSS

@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', sans-serif;
color: #000000;
}
.page-header {
background-color: #000000;
display: flex;
justify-content: center;
}
.header-logo {
padding: 29px 0px;
display: block;
}
.main-banner {
width: 100%;
}
.first-content {
padding-top: 73px;
display: flex;
align-items: center;
justify-content: center;
}
.first-content-text {
max-width: 766px;
}
.first-content-h2 {
text-transform: uppercase;
font-weight: 400;
font-size: 32px;
line-height: 39px;
text-align: center;
}
.first-content-h1 {
font-weight: 500;
font-size: 40px;
line-height: 58px;
text-transform: uppercase;
text-align: center;
}
.first-content-p {
font-weight: 400;
font-size: 16px;
padding-top: 28px;
}
.block {
width: 50%;
max-width: 315px;
display: block;
margin: auto;
padding: 73px 0px 179px 0px;
}
.first-card {
width: auto;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 21px;
padding-bottom: 79px;
}
.first-card-p {
width: 299px;
padding: 27px;
padding-top: 27px;
text-align: center;
}
.first-card-image {
display: block;
margin: auto;
width: 103px;
padding: 35px 12px 0px 12px;
}
.first-card-cards {
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23);
}
@media screen and (max-width: 1024px) {
.first-content-text {
max-width: 367px;
padding: 0px 29px;
}
.first-content-h2 {
font-size: 20px;
line-height: 24px;
}
.first-content-h1 {
font-size: 28px;
line-height: 34px;
}
.first-content-p {
text-align: center;
}
.block {
padding-bottom: 90px;
}
.first-card {
display: flex;
flex-direction: column;
}
}