-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
147 lines (147 loc) · 7.58 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="keywords" content="Kill the Justice League, KTJL, Suicide Squad, videogame" />
<meta
name="description"
content="The villains of the DC Comics® Universe are forced to create a super team and defeat the mightiest heroes in the DC Universe. Get into action right now!"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,400;0,600;0,700;0,900;1,900&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="css/styles.css" />
<link rel="icon" type="image/x-icon" href="/media/favicon.ico" />
<title>Suicide Squad: Kill The Justice League | Home</title>
<style>
.header {
background-image: none;
}
.header .navBar__preorder {
color: black;
}
.header .navBar__btn {
color: black;
}
.header__logo {
filter: contrast(10%) brightness(5) invert(100%);
}
@media (max-width: 640px) {
.header {
background-image: none;
background: rgb(255, 255, 255);
background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.691) 25%, rgba(0, 0, 0, 1) 90%);
}
.header__logo {
filter: grayscale(100%) brightness(0%) invert(100%);
}
.header .navBar__preorder {
color: white;
}
.header .navBar__btn {
color: white;
}
}
</style>
</head>
<body>
<header class="header">
<a href="./index.html"><img class="header__logo" src="media/images/logo.png" alt="Kill the Justice League logo" /></a>
<nav class="navBar">
<a href="./pre_order.html" class="navBar__preorder">PRE ORDER NOW!</a>
<div class="navBar__btnContainer">
<a href="./faq.html" class="navBar__btn">FAQ</a>
<a href="./gallery.html" class="navBar__btn">GALLERY</a>
<a href="./community.html" class="navBar__btn">COMMUNITY</a>
</div>
</nav>
</header>
<section class="hero">
<img class="hero__cover" src="media/images/main.jpeg" alt="Kill the Justice League game cover" />
<div class="hero__info"><p>AVAILABLE JUNE 8TH 2023</p></div>
</section>
<main>
<section id="trailer" class="trailerSection">
<h2 class="trailerSection__title">TRAILER</h2>
<iframe
class="trailerSection__video"
src="https://www.youtube.com/embed/J9vFB65-U_c"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen
></iframe>
<h3 class="trailerSection__footer">
FROM THE CREATORS OF <br class="space" />
BATMAN: ARKHAM SERIES
</h3>
<p class="trailerSection__info">
Heroes will fall. The Justice League is no longer the symbol of hope and justice. They have become a threat to humanity, and it's up to you to stop
them. In this intense, action-packed game, you'll have to use all your skills and cunning to take down the likes of Superman, Batman, and the rest of
the Justice League. Are you ready for the challenge?
</p>
</section>
<section class="boardsSection">
<div class="board">
<img class="board__image" src="media/images/board1.jpg" alt="Kill the Justice League game screenshot" />
<h2 class="board__title">PLAY SOLO, CO-OP OR ONLINE</h2>
<p class="board__info">
Join forces with other players and tackle the Justice League head-on. "Kill the Justice League" features epic cooperative missions where you can
team up with your friends and take down the biggest threats in the DC universe. Join the fight and take down the Justice League together!
</p>
</div>
<div class="board">
<img class="board__image" src="media/images/board2.jpg" alt="Kill the Justice League game screenshot" />
<h2 class="board__title">OUTSTANDING GRAPHICS AND IMMERSIVE WORLD</h2>
<p class="board__info">
Step into a world of breathtaking graphics and intense gameplay in "Kill the Justice League." The game's stunning visuals and realistic physics
engine will make you feel like you're right in the middle of the action. Get ready to experience a new level of realism in superhero gaming.
</p>
</div>
<div class="board">
<img class="board__image" src="media/images/board3.jpg" alt="Kill the Justice League game screenshot" />
<h2 class="board__title">NEXT-GEN COMBAT SYSTEM AND PROGRESSION</h2>
<p class="board__info">
Get ready for an unforgettable gaming experience as you unleash your powers and take down the Justice League. The combat in "Kill the Justice
League" is immersive and intense, allowing you to truly feel like a superhero. Put your skills to the test and take down the biggest threats in the
DC universe.
</p>
</div>
</section>
</main>
<footer class="footer">
<div class="footer__socials">
<a target="_blank" href="https://www.instagram.com/suicidesquadrs/"
><img class="footer__socials__icon" src="media/images/instagram.png" alt="ig icon"
/></a>
<a target="_blank" href="https://twitter.com/suicidesquadRS"><img class="footer__socials__icon" src="media/images/twitter.png" alt="tw icon" /></a>
<a target="_blank" href="https://www.facebook.com/SuicideSquadRocksteady"
><img class="footer__socials__icon" src="media/images/facebook.png" alt="fb icon"
/></a>
<a target="_blank" href="https://www.youtube.com/suicidesquadrs"><img class="footer__socials__icon" src="media/images/youtube.png" alt="yt icon" /></a>
<a target="_blank" href="https://discord.com/invite/SuicideSquadRS"
><img class="footer__socials__icon" src="media/images/discord.png" alt="dc icon"
/></a>
</div>
<div class="footer__studios">
<a target="_blank" href="https://warnerbrosgames.com/"><img class="footer__studios__icon" src="media/images/wbgames.png" alt="wbgames logo" /></a>
<a target="_blank" href="https://www.dc.com/"><img class="footer__studios__icon" src="media/images/dccomics.png" alt="dc comics logo" /></a>
<a target="_blank" href="https://rocksteadyltd.com/"><img class="footer__studios__icon" src="media/images/rocksteady.png" alt="rocksteady logo" /></a>
</div>
<div class="footer__platforms">
<img class="footer__platforms__icon" src="media/images/ps5dwn.png" alt="PS5 logo" />
<img class="footer__platforms__icon" src="media/images/xboxdwn.png" alt="Xbox logo" />
<img class="footer__platforms__icon" src="media/images/pcdwn.png" alt="PC Download logo" />
</div>
<p>WB WARNER BROS. GAMES LOGO, WB SHIELD: ™ & © Warner Bros. Entertainment Inc. (s22)</p>
<div class="footer__boilerplate">
<a class="footer__boilerplate__link" href="">PRIVACY POLICY</a>
<a class="footer__boilerplate__link" href="">TERMS OF USE</a>
<a class="footer__boilerplate__link" href="">AD CHOICE</a>
</div>
<img class="footer__ESRB" src="media/images/ESRB.jpg" alt="Pending ESRB" />
</footer>
</body>
</html>