-
-
-
-
+
diff --git a/resources/images/bookmark.png b/resources/images/bookmark.png
deleted file mode 100644
index 8e92047..0000000
Binary files a/resources/images/bookmark.png and /dev/null differ
diff --git a/resources/images/community.png b/resources/images/community.png
index b68dc2a..72a9288 100644
Binary files a/resources/images/community.png and b/resources/images/community.png differ
diff --git a/resources/images/creation.png b/resources/images/creation.png
new file mode 100644
index 0000000..300d23a
Binary files /dev/null and b/resources/images/creation.png differ
diff --git a/resources/images/discord.png b/resources/images/discord.png
index 438655a..1fae4d3 100644
Binary files a/resources/images/discord.png and b/resources/images/discord.png differ
diff --git a/resources/images/hero.png b/resources/images/hero.png
deleted file mode 100644
index 11eeec1..0000000
Binary files a/resources/images/hero.png and /dev/null differ
diff --git a/resources/images/instagram.png b/resources/images/instagram.png
index dcb9622..bf32063 100644
Binary files a/resources/images/instagram.png and b/resources/images/instagram.png differ
diff --git a/resources/images/left_button.png b/resources/images/left_button.png
new file mode 100644
index 0000000..60a973a
Binary files /dev/null and b/resources/images/left_button.png differ
diff --git a/resources/images/minecraft.png b/resources/images/minecraft.png
new file mode 100644
index 0000000..b2425c7
Binary files /dev/null and b/resources/images/minecraft.png differ
diff --git a/resources/images/right_button.png b/resources/images/right_button.png
new file mode 100644
index 0000000..5128692
Binary files /dev/null and b/resources/images/right_button.png differ
diff --git a/resources/images/series.png b/resources/images/series.png
index fd158f9..7d40ffc 100644
Binary files a/resources/images/series.png and b/resources/images/series.png differ
diff --git a/resources/images/wa.png b/resources/images/wa.png
deleted file mode 100644
index 37721bd..0000000
Binary files a/resources/images/wa.png and /dev/null differ
diff --git a/resources/images/whatsapp.png b/resources/images/whatsapp.png
new file mode 100644
index 0000000..6a524d3
Binary files /dev/null and b/resources/images/whatsapp.png differ
diff --git a/resources/images/youtube.png b/resources/images/youtube.png
index a40df0d..cbad582 100644
Binary files a/resources/images/youtube.png and b/resources/images/youtube.png differ
diff --git a/resources/style.css b/resources/style.css
index 25ee198..98e765c 100644
--- a/resources/style.css
+++ b/resources/style.css
@@ -13,6 +13,7 @@ body {
margin-bottom: 140px;
}
+/* PAGE ---> About */
.bg-hero {
height: 470px;
background-image: url("../resources/images/bg_hero.png");
@@ -21,37 +22,59 @@ body {
background-size: cover;
}
-.hero {
- display: flex;
- justify-content: center;
- position: relative;
- top: 80%;
- filter: drop-shadow(1px 1px 1px #000000);
+.hero-img {
+ top: 70%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ position: absolute;
+ max-width: 90%;
+ height: auto;
}
-.box-season {
- width: 320px;
- height: 440px;
+/* PAGE ---> Series */
+.series .box-season {
+ width: 20rem;
margin: 0 auto;
background-color: #f3f3f3;
outline-style: solid;
- outline-color: red;
- outline-width: 4px;
- border-radius: 4px;
+ outline-color: #AF1514;
+ outline-width: 5px;
+}
+.series .box-season:hover {
+ outline-color: #E62B28;
}
.box-text {
- margin-top: 20px;
+ margin-top: 40px;
text-align: center;
}
-.screen {
- width: 640px;
- height: 400px;
- background-color: #d9d9d9;
+/* PAGE ---> Creation */
+.creation .box-display {
+ width: 30rem;
+ margin: 0 auto;
+ background-color: #f3f3f3;
outline-style: solid;
- outline-color: #ffffff;
- outline-width: 4px;
+ outline-color: #AF1514;
+ outline-width: 5px;
+}
+
+.creation .box-display:hover {
+ outline-color: #E62B28;
+}
+
+/* PAGE ---> Community */
+
+.community .box-display {
+ width: 30rem;
+ margin: 0 auto;
+ background-color: #f3f3f3;
+ outline-style: solid;
+ outline-color: #F6BF51;
+ outline-width: 5px;
+}
+.community .box-display:hover {
+ outline-color: #FAEA61;
}
@media (min-width: 960px) {
@@ -65,28 +88,10 @@ body {
}
@media (max-width: 960px) {
- .hero {
- top: 80%;
- }
- .hero img {
- width: 80%;
- height: 100%;
- }
}
@media (max-width: 720px) {
- .hero {
- top: 90%;
- }
- .hero img {
- width: 70%;
- height: 100%;
- }
}
@media (max-width: 540px) {
- .hero img {
- width: 100%;
- height: 100%;
- }
}
+
+
+
-
+
+
+
+
+
+
+
-
+
+