-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
199 lines (184 loc) · 8.3 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
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width" />
<meta name="description" content="Welcome to Itqan Hub, your premier destination for IT training and professional services. Join us on a transformative adventure to unleash untapped potential." />
<meta property="og:title" content="ItqanHub">
<meta property="og:image" content="https://itqanhub.com/Assets/ItqanHubOpenGraph.png">
<meta property="og:type" content="website">
<title>ItqanHub</title>
<link rel="stylesheet" href="Assets/index.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="icon" href="Assets/favicon.ico">
</head>
<body>
<body id="HomePage">
<section id="MainSection">
<div class="NavBardiv">
<img class="NavLogo"src="Assets/ItqanHubEmblem1.png" alt="Navigation Bar Logo">
<div class="NavBarContainer">
<div class="NavBar">
<a id="HomeNav" href="#MainSection" >Home</a>
<a id="AboutNav" href="AboutUs.html">About Us</a>
<a id="ServicesNav" href="Services.html">Our Services</a>
<a id="PartnersNav" href="Partners.html">Our Partners</a>
<a id="CalendarNav" href="Calendar.html">Schedule</a>
<a id="ContactNav" href="#ContactUs">Contact Us</a>
<a id="JobsNav" href="Jobs.html">Jobs</a>
</div>
</div>
</div>
<div class="MobileNavBarContainer">
<div class="MobileNavBar">
<a href="index.html">
<img class="NavLogo"src="Assets/ItqanHubEmblem1.png" alt="Navigation Bar Logo">
</a>
<i id="MenuIcon" class="fa-solid fa-bars"></i>
<i id="CloseIcon" class="fa-solid fa-x"></i>
</div>
<div id="MobileNavBarActive" class="MobileNavBarActive" >
<a id="MobileHomeNav" href="#MainSection" >Home</a>
<a id="MobileAboutNav" href="AboutUs.html">About Us</a>
<a id="MobileServicesNav" href="Services.html">Our Services</a>
<a id="MobilePartnersNav" href="Partners.html">Our Partners</a>
<a id="MobileCalendarNav" href="Calendar.html">Schedule</a>
<a id="MobileContactNav" href="#ContactUs">Contact Us</a>
<a id="MobileJobsNav" href="Jobs.html">Jobs</a>
</div>
</div>
<div class="LogoContainer">
<img src="Assets/ItqanHubPrimaryLogo1.png" class="MainLogo" alt="Main Logo image">
</div>
<h1 class="Slogan"><span>Empowering Minds</span> <br> Transforming Futures </h1>
</section>
<section class="HomePageDescriptionSection" >
<div class="DesktopsDescriptionContainer">
<h4 class="HomePageDescription">Welcome to <span>ITQAN HUB</span>, your premier destination for IT training, educational upskilling, professional services and consultations. Based in Egypt, we are proud to serve as a beacon of excellence in the heart of the Middle East and Africa region.</h4>
</div>
<div class="MobileDescriptionContainer">
<h4 class="HomePageDescription">Welcome to <span>ITQAN HUB</span>, your premier destination for IT training, educational upskilling, professional services and consultations. Based in Egypt, we are proud to serve as a beacon of excellence in the heart of the Middle East and Africa region.</h4>
</div>
</section>
<a class="LearnMoreButton" href="AboutUs.html">
<Button class="SubmitButton" id="LearnMore" >Learn More</Button>
</a>
<hr >
<h2 class="Title">Our Services</h2>
<section >
<div class="HomeServicesPreview">
<div class="card">
<a class="card1" href="Services.html">
<p>IT Training Services</p>
<hr class="ServicesPreviewLine">
<p class="small">Offering diverse IT training services, covering product training, knowledge transfer, vendor accreditations, and sales trainings for channel empowerment.
</p>
<div class="go-corner" >
<div class="go-arrow">
<i class="fa-solid fa-circle-info"></i>
</div>
</div>
</a>
</div>
<div class="card" >
<a class="card1" href="Services.html">
<p>Professional Services</p>
<hr class="ServicesPreviewLine">
<p class="small">Our professional services encompass proof of concept (POC) and labs, consultancy, solution implementation and enablement, as well as support services</p>
<div class="go-corner">
<div class="go-arrow">
<i class="fa-solid fa-circle-info"></i>
</div>
</div>
</a>
</div>
</div>
<div id="ContactUs"></div>
</section>
<hr >
<section >
<h2 class="Title" >Contact Us</h2>
<h4 class="DropUsaLine">Drop Us A Line!</h4>
<form class="ContactForm" id="ContactUsForm"
method="post"
>
<label for="Name" >Name <span id="NameAsterik">*</span><br>
<input type="Text" name="Name" id="Name" placeholder="Your Name Goes Here..." required>
</label>
<label for="MobileNumber">Mobile Number <span id="MobileNumberAsterik">*</span><br>
<input type="text" name="MobileNumber" id="MobileNumber"placeholder="Your Mobile Number Goes Here..." required>
</label>
<label for="email">Email <span id="EmailAsterik">*</span><br>
<input type="email" name="Email" id="Email"placeholder="Your Email Goes Here..." required>
</label>
<label for="Company">Company <span id="CompanyAsterik">*</span><br>
<input type="text" name="Company" id="Company" placeholder="Your Company Goes Here..." required>
</label>
<label for="ContactMessage">Message <span>*</span><br>
<textarea name="Message" id="ContactMessage" placeholder="Your text Goes Here..." required></textarea>
</label>
<button type="submit" class="SubmitButton" id="SubmitButton">Send</button>
</form>
</section>
<hr>
<section id="LocationSection" class="LocationSection" >
<h2 class="Title">Our Office</h2>
<h5 class="LocationDescription">Makateb Offices,Building 74,Unit 206,Banks Center St,New Cairo1,<br>Cairo Governorate,Egypt
</h5>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d55258.20168720633!2d31.330877333802082!3d30.047252977488892!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x14583d671b3693ad%3A0x46ed9c9c45eb2cb2!2sItqan%20Hub!5e0!3m2!1sen!2seg!4v1708026087864!5m2!1sen!2seg" style="border:0;" allowfullscreen="" referrerpolicy="no-referrer-when-downgrade" alt="map"></iframe>
</section>
<section class="FooterSection">
<div class="SocialLinks">
<a href="https://www.facebook.com/ItqanHub/">
<i class="fab fa-facebook"></i>
</a>
<a href="https://www.linkedin.com/company/itqan-hub/">
<i class="fab fa-linkedin"></i>
</a>
</div>
<img class="FooterLogo" src="Assets/ItqanHubSecondaryLogo3.png" alt="Footer Logo">
<h5 class="CopyRightsText">COPYRIGHT © 2024 ITQANHUB.COM-ALL RIGHTS RESERVED</h5>
</section>
</div>
</div>
</body>
<script src="index.js"></script>
<script>
window.onbeforeunload = () => {
for(const form of document.getElementsByTagName('form')) {
form.reset();
}
}
document.getElementById('ContactUsForm').addEventListener('submit', function(event) {
event.preventDefault();
const formData = new FormData(this);
fetch('ContactUs.php', {
method: 'POST',
body: formData
})
.then(response => response.text())
.then(data => {
fetch('https://formspree.io/xqkrpjbp', {
// fetch('', {
method: 'POST',
body: formData,
headers: {
'Accept': 'application/json'
}
})
.then(response => response.json())
.then(data => {
window.location.href = 'Success.html';
})
.catch(error => {
console.error('Error:', error);
alert('There was an error sending your message. Please try again later.');
});
})
.catch(error => {
console.error('Error:', error);
alert('There was an error sending your message. Please try again later.');
});
});
</script>
</html>