diff --git a/assets/images/imgTresComputadores.png b/assets/images/img-tres-computadores.png
similarity index 100%
rename from assets/images/imgTresComputadores.png
rename to assets/images/img-tres-computadores.png
diff --git a/assets/styles/style.css b/assets/styles/style.css
index 326b728..808e89a 100644
--- a/assets/styles/style.css
+++ b/assets/styles/style.css
@@ -4,9 +4,9 @@
padding: 0;
}
html, body{
-
box-sizing: border-box;
font-family: 'Inter', sans-serif;
+ color: black;
}
.header{
background: black;
@@ -19,14 +19,107 @@ html, body{
}
.main-banner{
width: 100%;
+ display: block;
}
-@media screen and (max-width: 414px) {
+/*---------------------------------------------------------------------------------------*/
+.top-infocard{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 80px;
+ margin-bottom: 95px;
+}
+.top-infocard-text{
+ max-width: 766px;
+ margin-right: 124px;
+}
+.top-infocard-subtitle{
+ font-weight: 400;
+ font-size: 32px;
+ text-transform: uppercase;
+}
+.top-infocard-title{
+ font-weight: 500;
+ font-size: 48px;
+ text-transform: uppercase;
+}
+.top-infocard-description{
+ font-weight: 400;
+ font-size: 16px;
+ margin-top: 24px;
+}
+
+
+/*-------------------------------------------------------------------*/
+
+
+@media screen and (max-width: 1024px) {
.main-banner-desktop{
display: none;
}
+ .top-infocard{
+ flex-direction: column;
+ margin-top: 54px;
+ margin-left: 31px;
+ margin-right: 26px;
+ }
+ .top-infocard-text{
+ margin: 0 0 68px;
+
+ }
+ .top-infocard-subtitle{
+ font-weight: 400;
+ font-size: 20px;
+ }
+ .top-infocard-title{
+ font-weight: 500;
+ font-size: 28px;
+ }
+ .top-infocard-description{
+ font-weight: 400;
+ font-size: 16px;
+ margin-top: 19px;
+ }
+ .top-infocard-img{
+ margin: 0 86px 0 86px;
+ max-width: 240px;
+ }
}
-@media screen and (min-width: 415px) {
+
+
+@media screen and (min-width: 1025px) {
.main-banner-mobile{
display: none;
}
+
+}
+
+@media screen and (min-width: 1026px) and (max-width: 1220px){
+ .top-infocard-text{
+ max-width: 550px;
+ margin-right: 70px;
+
+}
+}
+
+@media screen and (min-width: 2500px) {
+ .top-infocard-subtitle{
+ font-weight: 400;
+ font-size: 60px;
+ }
+ .top-infocard-title{
+ font-weight: 500;
+ font-size: 96px;
+ }
+ .top-infocard-description{
+ font-weight: 400;
+ font-size: 32px;
+
+ }
+ .top-infocard-text{
+ max-width: 45%;
+ margin-right: 70px;
+
+}
+
}
\ No newline at end of file
diff --git a/index.html b/index.html
index 02c9774..faed8c3 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,6 @@
+
@@ -7,8 +8,9 @@
Landing Page
+
-
+
@@ -17,14 +19,48 @@
- 
+ 
+
+ 
+
+