generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 2
/
cards.html
80 lines (74 loc) · 4.26 KB
/
cards.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Meta tags for search engines -->
<meta name="description"
content="Tarot Tales. Get a Tarcot Card reading. Learn about the different tarot card meanings. Join Class to unlock your potential to res Taor Cards. Explore the connections between Tarot Cards and psychology. Online or at our studio in Cork City.">
<meta name="keywords"
content="tarot card, tarot meaning, understanding tarot, reading taror cards, psychology, tarot and psychology overlap, learning, online, class room, Cork City, Cork, Ireland">
<title>Tarot Tales - The Cards</title>
<!--Favicon-->
<!--<a target="_blank" href="https://icons8.com/icon/FEFpkitFCxia/tarot-cards">Tarot Cards</a> icon by <a target="_blank" href="https://icons8.com">Icons8</a>-->
<link rel="apple-touch-icon" sizes="180x180" href="assets/favicon/icons8-tarot-cards-100.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/favicon/icons8-tarot-cards-100.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/favicon/icons8-tarot-cards-100.png">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<!--Header Area-->
<header>
<a href="index.html">
<h1 id="logo">Tarot Tales</h1>
</a>
<input type="checkbox" id="menu-show" name="menu-show">
<label for="menu-show" class="menu-show-label">
<i class="fa-solid fa-bars"></i>
</label>
<nav>
<ul id="menu">
<li><a href="index.html">Home</a></li>
<li><a href="cards.html" class="active">Cards</a></li>
<li><a href="booking.html">Booking</a></li>
</ul>
</nav>
</header>
<!--Main Content Area-->
<main>
<!-- https://www.purplegarden.co/blog/list-of-tarot-cards-with-pictures -->
<!--https://www.bennionkearny.com/wp-content/uploads/2019/11/Tarot-Card-Deck.pdf -->
<div id="card-images">
<img src="assets/images/card0.jpg" alt="The Fool standing oblivious with a spindle">
<img src="assets/images/card1.jpg" alt="The Magician standing before a table with his arm in the air">
<img src="assets/images/card2.jpg" alt="The High Pristess sitting serenely on her throne">
<img src="assets/images/card3.jpg" alt="The Empress holding her septre above her head">
<img src="assets/images/card4.jpg" alt="The Emperor on his throne">
<img src="assets/images/card5.jpg" alt="The Hierophant with his arms raised">
<img src="assets/images/card6.jpg" alt="The Lovers standing naked before a watchful spirit">
<img src="assets/images/card7.jpg" alt="Warrior in The Chariot pulled by two mythic beasts">
<img src="assets/images/card8.jpg" alt=" A maiden demonstrating her Strength by taming a lion">
<img src="assets/images/card9.jpg"
alt="The Hermit standing with a staff in one hand and a lantern in the other">
</div>
</main>
<!--Footer Area-->
<footer>
<ul id="socials">
<li><a href="https://www.youtube.com/" target="_blank" rel="noopener"
aria-label="Visit our YouTube page. This will open in a tab"><i
class="fa-brands fa-youtube"></i></a></li>
<li><a href="https://www.twitter.com/" target="_blank" rel="noopener"
aria-label="Visit our Twitter page. This will open in a tab"><i
class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="https://www.facebook.com/" target="_blank" rel="noopener"
aria-label="Visit our Facebook page. This will open in a tab"><i
class="fa-brands fa-facebook"></i></a></li>
<li><a href="https://www.tiktok.com/" target="_blank" rel="noopener"
aria-label="Visit our TikTok page. This will open in a tab"><i class="fa-brands fa-tiktok"></i></a>
</li>
</ul>
</footer>
<script src="https://kit.fontawesome.com/9d9c64c030.js" crossorigin="anonymous"></script>
</body>
</html>