diff --git a/index.html b/index.html
index 25bbe24..3a599ef 100644
--- a/index.html
+++ b/index.html
@@ -14,7 +14,7 @@
diff --git a/styles.css b/styles.css
index 31c33aa..8dc812a 100644
--- a/styles.css
+++ b/styles.css
@@ -48,6 +48,7 @@ header {
font-weight: 400;
font-size: 32px;
width: 220px;
+ max-width: 100%;
height: 39px;
}
@@ -56,6 +57,7 @@ header {
font-weight: 500;
font-size: 48px;
width: 403px;
+ max-width: 100%;
height: 58px;
margin-bottom: 28px;
}
@@ -65,12 +67,14 @@ header {
font-size: 16px;
line-height: 24px;
width: 766px;
+ max-width: 100%;
height: 56px;
margin-bottom: 73px;
}
.computadores {
width: 315.5;
+ max-width: 100%;
height: 315;
margin-bottom: 178.5px;
}
@@ -126,6 +130,7 @@ header {
.laptop-img {
width: 566px;
+ max-width: 100%;
height: 530px;
margin-bottom: 129px;
}
@@ -142,6 +147,7 @@ header {
display: flex;
flex-direction: column;
width: 432px;
+ max-width: 100%;
height: 332px;
gap: 21px;
background: #FFFFFF;
@@ -149,9 +155,16 @@ header {
margin-bottom: 108px;
}
-.card-logo-2-1, .card-logo-2-2, .card-logo-2-3, .card-logo-2-4{
+.card-logo-2-1, .card-logo-2-2, .card-logo-2-3{
display: block;
width: 104px;
+ max-width: 100%;
+ height: 104px;
+}
+.card-logo-2-4{
+ display: block;
+ width: 85px;
+ max-width: 100%;
height: 104px;
}
@@ -159,6 +172,7 @@ header {
font-size: 16px;
font-weight: 400;
width: 367px;
+ max-width: 100%;
height: 95px;
line-height: 24px;
text-align: center;
@@ -180,6 +194,7 @@ header {
font-weight: 400;
font-size: 16px;
width: 550px;
+ max-width: 100%;
text-align: center;
margin-bottom: 50px;
}
@@ -197,6 +212,7 @@ header {
.end-image {
margin-top: 50px;
width: 70.83%;
+ max-width: 100%;
height: 276px;
margin-bottom: 116px;
}
@@ -246,7 +262,7 @@ footer {
.computadores {width: 239px; height: 239.38px; margin-bottom: 90.62px;}
.cards-1 {flex-direction: column; gap: 24px;}
- .card-1-1, .card-1-2, .card-1-3 {width: 350px; height: 287px;}
+ .card-1-1, .card-1-2, .card-1-3 {width: 350px; height: 287px; max-width: 100%;}
.card-1-text {line-height: 24px;}
.laptops-img-div {flex-wrap: wrap; margin-left: 0; margin-right: 0; gap: 14px;}
@@ -262,14 +278,42 @@ footer {
.info-2 {flex-direction: column-reverse;}
.end-image {margin-top: 98px; width: 100%; height: auto; margin-bottom: 50px;}
- .titulo-2 {margin-bottom: 9px; width: 315px; height: 29px; font-size: 24px; line-height: 29.05px;}
- .titulo-2-texto {margin-bottom: 87px; width: 350px; height: 192px; font-size: 16px; line-height: 24px;}
+ .titulo-2 {margin-bottom: 9px; width: 315px; max-width: 100%; height: 29px; font-size: 24px; line-height: 29.05px;}
+ .titulo-2-texto {margin-bottom: 87px; width: 350px; max-width: 100%; height: 192px; font-size: 16px; line-height: 24px;}
.footer-div {display: flex; flex-direction: column; height: 64px;}
.footer-imgs {margin-bottom: 16px;}
- .footer-text {width: 261px; height: 23px; font-size: 10px; line-height: 12.1px; text-align: center;}
+ .footer-text {width: 261px; max-width: 100%; height: 23px; font-size: 10px; line-height: 12.1px; text-align: center;}
}
+@media screen and (max-width: 425px) {
+.titulo-2 {margin-bottom: 9px; width: 265px; max-width: 100%; height: 29px; font-size: 20px; line-height: 25.05px;}
+.titulo-2-texto {margin-bottom: 47px; width: 260px; max-width: 100%; height: 232px; font-size: 12px; line-height: 16px;}
+
+.footer-div {display: flex; flex-direction: column; height: 64px;}
+.footer-imgs {margin-bottom: 16px;}
+.footer-text {width: 261px; max-width: 100%; height: 23px; font-size: 10px; line-height: 12.1px; text-align: center;}
+}
+
+@media screen and (min-width: 992px) {
+ .titulo-2 {margin-bottom: 9px; width: fit-content; max-width: 100%; height: 29px; line-height: 25.05px; font-size: 40px;}
+ .titulo-2-texto {margin-bottom: 47px; width: 660px; max-width: 100%; height: 232px; line-height: 16px;}
+ }
+ .laptops-img-div {flex-wrap: wrap; margin-left: 0; margin-right: 0; gap: 14px;}
+ .laptops-background {height: 574px; margin-bottom: -541px;}
+ .laptop-img {width: 177px; height: 178px; margin-bottom: 0px;}
+ .flex-break {flex-basis: 100%; height: 0;}
+ .laptop-img3 {width: 368px; height: 372px; margin-top: -5px; margin-bottom: 80px;}
+
+ .cards-1 {flex-wrap: wrap;}
+ .card-1-1, .card-1-2, .card-1-3 {width: 350px; height: 287px; max-width: 100%;}
+ .cards-2 {flex-wrap: wrap;}
+
+ .footer-div {display: flex; flex-direction: column; height: 64px;}
+ .footer-imgs {margin-bottom: 16px;}
+ .footer-text {width: 261px; max-width: 100%; height: 23px; font-size: 10px; line-height: 12.1px; text-align: center;}
+
+
@media screen and (min-width: 3840px) {
header {
padding-top: 56px;