diff --git a/Ability Sports Pictures/BAME.jpg b/Ability Sports Pictures/BAME.jpg
deleted file mode 100644
index 335efa9323b2d5a53c612fac79b225e923dc0f79..0000000000000000000000000000000000000000
Binary files a/Ability Sports Pictures/BAME.jpg and /dev/null differ
diff --git a/AbilitySportsPictures/BAME.jpg b/AbilitySportsPictures/BAME.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..fe46b96f1b1a7fd563a62d022da8ea41604e7ec5
Binary files /dev/null and b/AbilitySportsPictures/BAME.jpg differ
diff --git a/Ability Sports Pictures/ability blue.tif b/AbilitySportsPictures/abilityblue.tif
similarity index 100%
rename from Ability Sports Pictures/ability blue.tif
rename to AbilitySportsPictures/abilityblue.tif
diff --git a/Ability Sports Pictures/about.jpg b/AbilitySportsPictures/about.jpg
similarity index 100%
rename from Ability Sports Pictures/about.jpg
rename to AbilitySportsPictures/about.jpg
diff --git a/Ability Sports Pictures/football.jpg b/AbilitySportsPictures/football.jpg
similarity index 100%
rename from Ability Sports Pictures/football.jpg
rename to AbilitySportsPictures/football.jpg
diff --git a/Ability Sports Pictures/header.jpg b/AbilitySportsPictures/header.jpg
similarity index 100%
rename from Ability Sports Pictures/header.jpg
rename to AbilitySportsPictures/header.jpg
diff --git a/Ability Sports Pictures/home.jpg b/AbilitySportsPictures/home.jpg
similarity index 100%
rename from Ability Sports Pictures/home.jpg
rename to AbilitySportsPictures/home.jpg
diff --git a/Ability Sports Pictures/home2.jpg b/AbilitySportsPictures/home2.jpg
similarity index 100%
rename from Ability Sports Pictures/home2.jpg
rename to AbilitySportsPictures/home2.jpg
diff --git a/Ability Sports Pictures/home3.jpg b/AbilitySportsPictures/home3.jpg
similarity index 100%
rename from Ability Sports Pictures/home3.jpg
rename to AbilitySportsPictures/home3.jpg
diff --git a/Ability Sports Pictures/multi-sports.jpg b/AbilitySportsPictures/multi-sports.jpg
similarity index 100%
rename from Ability Sports Pictures/multi-sports.jpg
rename to AbilitySportsPictures/multi-sports.jpg
diff --git a/About.html b/About.html
index 571b0ab3a7e1f4997fcfae9871080ea51bf13c1a..53f7ce1ded7dc53a483ef7e5c9a2f95a2be1b822 100644
--- a/About.html
+++ b/About.html
@@ -12,24 +12,39 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
- <button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
- <button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
- <button class="btn about" onclick="document.location='About.html'"><a class="active" href="#about">About</a></button>
- <button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='Home.html'" href="#home">Home</a>
+ <a onclick="document.location='Activites.html'" href="#activties">Activites</a>
+ <a onclick="document.location='Booking.html'" href="#booking">Booking</a>
+ <a class="active" onclick="document.location='About.html'" href="#about">About</a>
+ <a onclick="document.location='Contact.html'" href="#contact">Contact</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
</div>
+ <script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
+
+
<h2 class="heading">About Ability Sports Bristol</h2>
- <p1 class = "info">
+ <p class = "info">
Every Saturaday 12:00-14:30 we provide sporting activites for young
people with additional needs at Ability Sports Bristol.
- </p1>
+ </p>
- <img class="abtpic" src="Ability Sports Pictures/about.jpg" alt="information page picture"/>
+ <img class="abtpic" src="AbilitySportsPictures/about.jpg" alt="informationPagePicture"/>
</body>
</html>
\ No newline at end of file
diff --git a/AboutArab.html b/AboutArab.html
index 7279aab4278135f280c1ba46ef1ac6063b752054..a0647a074b95e4c9ba0d80d34a4dbe9cf749165f 100644
--- a/AboutArab.html
+++ b/AboutArab.html
@@ -11,23 +11,38 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='HomeArab.html'"><a class="active" href="#home">الصفحة الرئيسية</a></button>
- <button class="btn activites" onclick="document.location='ActivitesArab.html'"><a href="#activties">أنشطة</a></button>
- <button class="btn booking" onclick="document.location='BookingArab.html'"><a href="#booking">الحجز</a></button>
- <button class="btn about" onclick="document.location='AboutArab.html'"><a href="#about">حول</a></button>
- <button class="btn contact" onclick="document.location='ContactArab.html'"><a href="#contact">اتصل</a></button>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='HomeArab.html'" href="#home">الصفحة الرئيسية</a>
+ <a onclick="document.location='ActivitesArab.html'" href="#activties">أنشطة</a>
+ <a onclick="document.location='BookingArab.html'" href="#booking">الحجز</a>
+ <a class="active" onclick="document.location='AboutArab.html'" href="#about">حول</a>
+ <a onclick="document.location='ContactArab.html'" href="#contact">اتصل</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
</div>
+
+ <script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
+
<h2 class="heading">حول القدرة الرياضية بريستول</h2>
- <p1 class = "info">
+ <p class = "info">
كل يوم سبت من الساعة 12:00 إلى 14:30 نوفر أنشطة رياضية للشباب ذوي الاحتياجات الإضافية في Ability Sports Bristol.
- </p1>
+ </p>
- <img class="abtpic" src="Ability Sports Pictures/about.jpg" alt="information page picture"/>
+ <img class="abtpic" src="AbilitySportsPictures/about.jpg" alt="informationPagePicture"/>
</body>
</html>
\ No newline at end of file
diff --git a/Activites.html b/Activites.html
index d4ae7821aad08a83e8826262dec5cb65f9a32d7d..ccfcb06ddbd8619bf158f35ff90ded80c10f18af 100644
--- a/Activites.html
+++ b/Activites.html
@@ -12,33 +12,49 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
- <button class="btn activites" onclick="document.location='Activites.html'"><a class="active" href="#activties">Activites</a></button>
- <button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
- <button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
- <button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='Home.html'" href="#home">Home</a>
+ <a class="active" onclick="document.location='Activites.html'" href="#activties">Activites</a>
+ <a onclick="document.location='Booking.html'" href="#booking">Booking</a>
+ <a onclick="document.location='About.html'" href="#about">About</a>
+ <a onclick="document.location='Contact.html'" href="#contact">Contact</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
</div>
-
+ <script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
- <p1 class="para1">
- <h2 class="subhead">Authistic Football Group</h2>
- The duration for each football session varies.
- Each session costs 5 pounds.
- </p1>
+ <section class="para1">
+ <h2>Authistic Football Group</h2>
+ <p>
+ The duration for each football session varies.
+ Each session costs 5 pounds.
+ </p>
+ </section>
+ <img class="football" src="AbilitySportsPictures/football.jpg" alt="football"/>
- <img class="football" src="Ability Sports Pictures/football.jpg" alt="football"/>
-
- <p2 class="para2">
- <h2 class="subhead">Downs Multi-Sports Group</h2>
- The duration for each downs multi-sports group session varies.
- Each session costs 5 pounds.
- </p2>
- <img class="multi-sports" src="Ability Sports Pictures/multi-sports.jpg" alt="multisports"/>
+ <section class="para2">
+ <h2>Downs Multi-Sports Group</h2>
+ <p>
+ The duration for each downs multi-sports group session varies.
+ Each session costs 5 pounds.
+ </p>
+ </section>
+
+ <img class="multi-sports" src="AbilitySportsPictures/multi-sports.jpg" alt="multisports"/>
</body>
diff --git a/ActivitesArab.html b/ActivitesArab.html
index c82d522d7b271919eb7b41c61dab49260978937f..645a9d53def1ca04fe2c4bbf224fafa13f5b3052 100644
--- a/ActivitesArab.html
+++ b/ActivitesArab.html
@@ -11,28 +11,47 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='HomeArab.html'"><a class="active" href="#home">الصفحة الرئيسية</a></button>
- <button class="btn activites" onclick="document.location='ActivitesArab.html'"><a href="#activties">أنشطة</a></button>
- <button class="btn booking" onclick="document.location='BookingArab.html'"><a href="#booking">الحجز</a></button>
- <button class="btn about" onclick="document.location='AboutArab.html'"><a href="#about">حول</a></button>
- <button class="btn contact" onclick="document.location='ContactArab.html'"><a href="#contact">اتصل</a></button>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='HomeArab.html'" href="#home">الصفحة الرئيسية</a>
+ <a class="active" onclick="document.location='ActivitesArab.html'" href="#activties">أنشطة</a>
+ <a onclick="document.location='BookingArab.html'" href="#booking">الحجز</a>
+ <a onclick="document.location='AboutArab.html'" href="#about">حول</a>
+ <a onclick="document.location='ContactArab.html'" href="#contact">اتصل</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
</div>
+
+ <script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
- <p1 class="para1">
- <h2>مجموعة التوحد لكرة القدم</h2>
- تختلف مدة كل جلسة كرة قدم. كل جلسة تكلف 5 جنيهات.
- </p1>
+ <section class="para1">
+ <h2>مجموعة التوحد لكرة القدم</h2>
+ <p>
+ تختلف مدة كل جلسة كرة قدم. كل جلسة تكلف 5 جنيهات.
+ </p>
+ </section>
- <img class="football" src="Ability Sports Pictures/football.jpg" alt="football"/>
+ <img class="football" src="AbilitySportsPictures/football.jpg" alt="football"/>
- <p2 class="para2">
- <h2>مجموعة داونز للرياضات المتعددة</h2>
- تختلف مدة كل جلسة جماعية متعددة الرياضات. كل جلسة تكلف 5 جنيهات.
- </p2>
- <img class="multi-sports" src="Ability Sports Pictures/multi-sports.jpg" alt="multisports"/>
+ <section>
+ <h2>مجموعة داونز للرياضات المتعددة</h2>
+ <p>
+ تختلف مدة كل جلسة جماعية متعددة الرياضات. كل جلسة تكلف 5 جنيهات.
+ </p>
+ </section>
+
+ <img class="multi-sports" src="AbilitySportsPictures/multi-sports.jpg" alt="multisports"/>
</body>
</html>
\ No newline at end of file
diff --git a/Booking.html b/Booking.html
index b84ebc25a6f13e085670c8d7f4a23d82ddbfe82f..e9d5fdca0ef02f1623cc8af296ce9524ec5cd9a6 100644
--- a/Booking.html
+++ b/Booking.html
@@ -11,37 +11,56 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
- <button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
- <button class="btn booking" onclick="document.location='Booking.html'"><a class="active" href="#booking">Booking</a></button>
- <button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
- <button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='Home.html'" href="#home">Home</a>
+ <a onclick="document.location='Activites.html'" href="#activties">Activites</a>
+ <a class="active" onclick="document.location='Booking.html'" href="#booking">Booking</a>
+ <a onclick="document.location='About.html'" href="#about">About</a>
+ <a onclick="document.location='Contact.html'" href="#contact">Contact</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
</div>
+<script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
+
<form action="/action_page.php">
<fieldset>
- <legend>Personal Details</legend>
+ <legend>Booking Form</legend>
- <div class="formgrid">
- <label for="fname">First Name:</label><br>
- <input type="text" id="fname" name="fname" required><br>
+ <h2 class="subhead">Personal Details</h2>
+
+ <div class="formgrid">
+ <label for="fname">First Name:</label><br>
+ <input type="text" id="fname" name="fname" required><br>
+
+ <label for="lname">Surname:</label><br>
+ <input type="text" id="lname" name="lname" required><br><br>
- <label for="lname">Surname:</label><br>
- <input type="text" id="lname" name="lname" required><br><br>
+ <label for="DOB">Date of Birth</label><br>
+ <input type="text" id="DOB" name="DOB" placeholder="(DD/MM/YYYY)" required><br>
- <label for="DOB">Date of Birth (DD/MM/YYYY)</label><br>
- <input type="text" id="DOB" name="DOB" required><br>
+ <label for="disability">Disability:</label><br>
+ <input type="text" id="disability" name="disability" required><br><br>
+ </div>
- <label for="disability">Disability:</label><br>
- <input type="disability" id="disability" name="disability" required><br><br>
+ <h2 class="subhead">Gaurdian Details</h2>
- <legend>Gaurdian Details</legend>
+ <div class="formgrid">
<label for="fname1">First Name:</label><br>
<input type="text" id="fname1" name="fname1" required><br><br>
@@ -49,17 +68,21 @@
<input type="text" id="lname1" name="lname1" required><br><br>
<label for="contact">Contact Number:</label><br>
- <input type="number" id="contact" name="contact" required maxlength="11"><br><br>
+ <input type="tel" id="contact" name="contact" required maxlength="11"><br><br>
+ </div>
+
+ <h2 class="subhead">Payment Details</h2>
- <legend>Payment Details</legend>
+ <div class="formgrid">
<label for="c/r">Country/Region:</label><br>
<select id="c/r" required>
+ <option value="">Select Option</option>
<option value=“opt1”>Russia</option>
- <option value=“opt2” selected>United States</option>
- <option value=“opt3” selected>Cayman Islands</option>
- <option value=“opt4” selected>Canada</option>
- <option value=“opt5” selected>United Kingdom</option>
- <option value="" selected>Select Option</option>
+ <option value=“opt2”>United States</option>
+ <option value=“opt3”>Cayman Islands</option>
+ <option value=“opt4”>Canada</option>
+ <option value=“opt5”>United Kingdom</option>
+
</select><br><br>
<label for="cname1">Cardholder First Name:</label><br>
@@ -70,12 +93,12 @@
<label for="card">Card Type:</label><br>
<select id="card" required>
+ <option value="">Select Option</option>
<option value=“opt1”>Visa Debit/Visa/Visa Electron</option>
- <option value=“opt2” selected>Mastercard</option>
- <option value=“opt3” selected>Discover</option>
- <option value=“opt4” selected>Maestro</option>
- <option value=“opt5” selected>American Express</option>
- <option value="" selected>Select Option</option>
+ <option value=“opt2”>Mastercard</option>
+ <option value=“opt3”>Discover</option>
+ <option value=“opt4”>Maestro</option>
+ <option value=“opt5”>American Express</option>
</select><br><br>
<label for="cardnum">Card Number:</label><br>
@@ -86,8 +109,11 @@
<label for="code">Security Code:</label><br>
<input type="number" id="code" name="code" required><br><br>
+ </div>
+
+ <h2 class="subhead">Billing Address</h2>
- <legend>Billing Address</legend>
+ <div class="formgrid">
<label for="address1">Address Line 1:</label><br>
<input type="text" id="address1" name="address1" required><br><br>
@@ -99,8 +125,10 @@
<label for="post">Postcode:</label><br>
<input type="text" id="post" name="post" required><br><br>
-
-
+
+ <p>By submitting this form you <a href="PrivacyDocument.pdf" target="_blank"> agree with Privacy Terms</a></p>
+
+
<input class="submit" type="submit" value="Submit">
</div>
diff --git a/BookingArab.html b/BookingArab.html
index 218ce68d61804812963448c2618116205cb2b9ad..ee3acd5cfc1984763fb218f1a0a8c6d0ff5c8155 100644
--- a/BookingArab.html
+++ b/BookingArab.html
@@ -11,22 +11,38 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='HomeArab.html'"><a class="active" href="#home">الصفحة الرئيسية</a></button>
- <button class="btn activites" onclick="document.location='ActivitesArab.html'"><a href="#activties">أنشطة</a></button>
- <button class="btn booking" onclick="document.location='BookingArab.html'"><a href="#booking">الحجز</a></button>
- <button class="btn about" onclick="document.location='AboutArab.html'"><a href="#about">حول</a></button>
- <button class="btn contact" onclick="document.location='ContactArab.html'"><a href="#contact">اتصل</a></button>
- </div>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='HomeArab.html'" href="#home">الصفحة الرئيسية</a>
+ <a onclick="document.location='ActivitesArab.html'" href="#activties">أنشطة</a>
+ <a class="active" onclick="document.location='BookingArab.html'" href="#booking">الحجز</a>
+ <a onclick="document.location='AboutArab.html'" href="#about">حول</a>
+ <a onclick="document.location='ContactArab.html'" href="#contact">اتصل</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
+ </div>
+
+ <script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
<form action="/action_page.php">
<fieldset>
+
+ <legend>استمارة الحجز</legend>
- <legend>تفاصيل شخصية</legend>
+ <h2 class="subhead">تفاصيل شخصية</h2>
<div class="formgrid">
<label for="fname">الاسم الاول:</label><br>
@@ -35,14 +51,16 @@
<label for="lname">لقب:</label><br>
<input type="text" id="lname" name="lname" required><br><br>
- <label for="DOB">تاريخ الميلاد (يوم / شهر / سنة)</label><br>
- <input type="text" id="DOB" name="DOB" required><br>
+ <label for="DOB">تاريخ الولادة</label><br>
+ <input type="text" id="DOB" name="DOB" placeholder="(يوم / شهر / سنة)" required><br>
<label for="disability">عجز:</label><br>
- <input type="disability" id="disability" name="disability" required><br><br>
+ <input type="text" id="disability" name="disability" required><br><br>
+ </div>
- <legend>تفاصيل الوصي</legend>
+ <h2 class="subhead">تفاصيل الوصي</h2>
+ <div class="formgrid">
<label for="fname1">الاسم الاول:</label><br>
<input type="text" id="fname1" name="fname1" required><br><br>
@@ -50,18 +68,20 @@
<input type="text" id="lname1" name="lname1" required><br><br>
<label for="contact">رقم الاتصال:</label><br>
- <input type="number" id="contact" name="contact" required><br><br>
+ <input type="tel" id="contact" name="contact" required><br><br>
+ </div>
- <legend>بيانات الدفع</legend>
+ <h2 class="subhead">بيانات الدفع</h2>
+ <div class="formgrid">
<label for="c/r">البلد / المنطقة:</label><br>
- <select id="card" required>
+ <select id="c/r" required>
+ <option value="">حدد الخيار</option>
<option value=“opt1”>روسيا</option>
- <option value=“opt2” selected>الولايات المتحدة الأمريكية</option>
- <option value=“opt3” selected>جزر كايمان</option>
- <option value=“opt4” selected>كندا</option>
- <option value=“opt5” selected>المملكة المتحدة</option>
- <option value="" selected>حدد الخيار</option>
+ <option value=“opt2”>الولايات المتحدة الأمريكية</option>
+ <option value=“opt3”>جزر كايمان</option>
+ <option value=“opt4”>كندا</option>
+ <option value=“opt5”>المملكة المتحدة</option>
</select><br><br>
<label for="cname1">الاسم الاول لحامل البطاقة:</label><br>
@@ -72,12 +92,12 @@
<label for="card">نوع البطاقة:</label><br>
<select id="card" required>
+ <option value="">حدد الخيار</option>
<option value=“opt1”>فيزا مدين / فيزا / فيزا إلكترون</option>
- <option value=“opt2” selected>بطاقة ماستر بطاقة ائتمان</option>
- <option value=“opt3” selected>اكتشف</option>
- <option value=“opt4” selected>فنان قائد فرقة موسيقية</option>
- <option value=“opt5” selected>أمريكان اكسبريس</option>
- <option value="" selected>حدد الخيار</option>
+ <option value=“opt2”>بطاقة ماستر بطاقة ائتمان</option>
+ <option value=“opt3”>اكتشف</option>
+ <option value=“opt4”>فنان قائد فرقة موسيقية</option>
+ <option value=“opt5”>أمريكان اكسبريس</option>
</select><br><br>
<label for="cardnum">رقم البطاقة:</label><br>
@@ -88,9 +108,11 @@
<label for="code">رمز الحماية:</label><br>
<input type="number" id="code" name="code" required><br><br>
+ </div>
- <legend>عنوان وصول الفواتير</legend>
+ <h2 class="subhead">عنوان وصول الفواتير</h2>
+ <div class="formgrid">
<label for="address1">العنوان السطر 1:</label><br>
<input type="text" id="address1" name="address1" required><br><br>
@@ -103,6 +125,7 @@
<label for="post">الرمز البريدي:</label><br>
<input type="text" id="post" name="post" required><br><br>
+ <p>عن طريق تقديم هذا النموذج لك<a href="PrivacyDocument.pdf" target="_blank"> توافق على شروط الخصوصية</a></p>
<input class="submit" type="submit" value="إرسال">
diff --git a/Contact.html b/Contact.html
index fbaddba5cf7f23d4e76fb8f852a01ddfb50394d2..2f43d581066ce0aa6ac2f58abcf0327deae51373 100644
--- a/Contact.html
+++ b/Contact.html
@@ -11,21 +11,35 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
- <button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
- <button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
- <button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
- <button class="btn contact" onclick="document.location='Contact.html'"><a class="active" href="#contact">Contact</a></button>
- </div>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='Home.html'" href="#home">Home</a>
+ <a onclick="document.location='Activites.html'" href="#activties">Activites</a>
+ <a onclick="document.location='Booking.html'" href="#booking">Booking</a>
+ <a onclick="document.location='About.html'" href="#about">About</a>
+ <a class="active" onclick="document.location='Contact.html'" href="#contact">Contact</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
+</div>
+
+<script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
<h2 class="contact">Contact details</h2>
<h3 class="tele">Telephone Number</h3>
- <p1 class="c1">+44 (0) 734 034 4762</p1>
+ <p class="c1">+44 (0) 734 034 4762</p>
<form action="/action_page.php">
@@ -42,7 +56,7 @@
<input type="email" id="email" name="email" required><br>
<label for="contact">Contact Number:</label><br>
- <input type="number" id="contact" name="contact" maxlength="11"><br><br>
+ <input type="tel" id="contact" name="contact" maxlength="11"><br><br>
<label for="subject">Subject:</label><br>
<input type="text" id="subject" name="subject" required><br><br>
@@ -50,9 +64,7 @@
<label for="details">Details:</label><br>
<input class="details" type="text" id="details" name="details" required><br><br>
- <label>
- <input class="regcheck" type="checkbox" name="privacy" required><a href="Privacy Document.pdf" target="_blank">Agree with Privacy Terms</a>
- </label>
+ <p>By submitting this form you <a href="PrivacyDocument.pdf" target="_blank"> agree with Privacy Terms</a></p>
<input class="submit" type="submit" value="Submit">
diff --git a/ContactArab.html b/ContactArab.html
index d768eec08a7f1d8bb81c906826c201cbd17e7c74..9c32ca237808c60de0508ad15628e440825c90c5 100644
--- a/ContactArab.html
+++ b/ContactArab.html
@@ -11,21 +11,35 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo"/>
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='HomeArab.html'"><a class="active" href="#home">الصفحة الرئيسية</a></button>
- <button class="btn activites" onclick="document.location='ActivitesArab.html'"><a href="#activties">أنشطة</a></button>
- <button class="btn booking" onclick="document.location='BookingArab.html'"><a href="#booking">الحجز</a></button>
- <button class="btn about" onclick="document.location='AboutArab.html'"><a href="#about">حول</a></button>
- <button class="btn contact" onclick="document.location='ContactArab.html'"><a href="#contact">اتصل</a></button>
- </div>
+ <div class="topnav" id="mytopnav">
+ <a onclick="document.location='HomeArab.html'" href="#home">الصفحة الرئيسية</a>
+ <a onclick="document.location='ActivitesArab.html'" href="#activties">أنشطة</a>
+ <a onclick="document.location='BookingArab.html'" href="#booking">الحجز</a>
+ <a onclick="document.location='AboutArab.html'" href="#about">حول</a>
+ <a class="active" onclick="document.location='ContactArab.html'" href="#contact">اتصل</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
+ </div>
+
+ <script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
<h2 class="contact">بيانات المتصل</h2>
<h3 class="tele">رقم هاتف</h3>
- <p1 class="c1">+44 (0) 734 034 4762</p1>
+ <p class="c1">+44 (0) 734 034 4762</p>
<form action="/action_page.php">
@@ -42,17 +56,17 @@
<input type="email" id="email" name="email" required><br>
<label for="contact">رقم الاتصال:</label><br>
- <input type="number" id="contact" name="contact" required maxlength="11"><br><br>
+ <input type="tel" id="contact" name="contact" required maxlength="11"><br><br>
<label for="subject">موضوع:</label><br>
<input type="text" id="subject" name="subject" required><br><br>
<label for="details">تفاصيل:</label><br>
- <input class="details" type="code" id="details" name="details" required><br><br>
+ <input class="details" type="text" id="details" name="details" required><br><br>
- <label>
- <input class="regcheck" type="checkbox" name="privacy" required><a href="Privacy Document.pdf" target="_blank">توافق على شروط الخصوصية</a>
- </label>
+
+ <p>عن طريق تقديم هذا النموذج لك<a href="PrivacyDocument.pdf" target="_blank"> توافق على شروط الخصوصية</a></p>
+
<input class="submit" type="submit" value="Submit">
diff --git a/Home.html b/Home.html
index eaed6f419d273b29249586f1dbbced9723255cbc..06dfb3ee788b5dfd2bb6e8ce0ba5ab5a530d27eb 100644
--- a/Home.html
+++ b/Home.html
@@ -11,15 +11,15 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class="logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo">
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='Home.html'"><a class="active" href="#home">Home</a></button>
- <button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
- <button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
- <button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
- <button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
+ <div class="topnav" id="mytopnav">
+ <a class="active" onclick="document.location='Home.html'" href="#home">Home</a>
+ <a onclick="document.location='Activites.html'" href="#activties">Activites</a>
+ <a onclick="document.location='Booking.html'" href="#booking">Booking</a>
+ <a onclick="document.location='About.html'" href="#about">About</a>
+ <a onclick="document.location='Contact.html'" href="#contact">Contact</a>
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>
@@ -27,7 +27,7 @@
<script>
function myFunction() {
- var x = document.getElementById("myTopnav");
+ var x = document.getElementById("mytopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
@@ -36,10 +36,10 @@
}
</script>
-<section>
+<section class="homepage">
<div class="headimg">
- <img class= "headimg" src="Ability Sports Pictures/header.jpg" alt="header img"/>
+ <img class= "headimg" src="AbilitySportsPictures/header.jpg" alt="headerImg">
</div>
<button onmouseover="mOver(this)" onmouseout="mOut(this)" class="arab" onclick="document.location='HomeArab.html'"> الترجمة العربية </button><br><br>
@@ -58,42 +58,42 @@
Sporting Activties for Young People
</h3>
- <p1>
+ <p>
Ability Sports session are inclusive of all young people with disabilites.
We do have a core group of kids in both sessions.
- </p1><br><br>
+ </p><br><br>
<button class="bttn" onclick="document.location='Activites.html'">Find out more</button><br><br>
<div class="homeimgs">
- <img class= "homeimg" src="Ability Sports Pictures/home.jpg" alt="home img"/>
- <img class= "homeimg" src="Ability Sports Pictures/home2.jpg" alt="home img"/>
- <img class= "homeimg" src="Ability Sports Pictures/home3.jpg" alt="home img"/>
+ <img class= "homeimg" src="AbilitySportsPictures/home.jpg" alt="homeImg">
+ <img class= "homeimg" src="AbilitySportsPictures/home2.jpg" alt="homeImg">
+ <img class= "homeimg" src="AbilitySportsPictures/home3.jpg" alt="homeImg">
</div>
<div class="info">
- <p2>This organisation is led by representives from the BAME community in
+ <p>This organisation is led by representives from the BAME community in
St.Pauls, Bristol.
- </p2><br><br>
+ </p><br><br>
</div>
<button class="bttn" onclick="document.location='About.html'">Find out more</button><br><br>
<div class="homeimgs">
- <img class= "rep" src="Ability Sports Pictures/BAME.jpg" alt="home img"/>
+ <img class= "rep" src="AbilitySportsPictures/BAME.jpg" alt="homeImg">
</div>
<div class="info">
- <p3>
+ <p>
All young people with a range of disabilities are welcome.
- </p3><br><br>
+ </p><br><br>
</div>
<button class="bttn" onclick="document.location='Booking.html'">JOIN NOW</button><br><br>
- <p4>
+ <p>
Join us in giving back to the community and follow us on our social media pages.
- </p4><br><br>
+ </p><br><br>
<form>
<a href="#" class="fa fa-facebook" onclick="window.location.href='https://www.facebook.com/abilitysportsbristol1/'"></a>
diff --git a/HomeArab.html b/HomeArab.html
index d7348dca3a480ec0b96a798d0fcf54c2a28a99c2..e64a7a319ae9880d99919ba093230cbf811e88ac 100644
--- a/HomeArab.html
+++ b/HomeArab.html
@@ -11,22 +11,35 @@
<body>
<header>
- <img class= "logo" src="Ability Sports Pictures/ability blue.tif" alt="company logo"/>
+ <img class= "logo" src="AbilitySportsPictures/abilityblue.tif" alt="companyLogo">
</header>
- <div class="topnav">
- <button class="btn home" onclick="document.location='HomeArab.html'"><a class="active" href="#home">الصفحة الرئيسية</a></button>
- <button class="btn activites" onclick="document.location='ActivitesArab.html'"><a href="#activties">أنشطة</a></button>
- <button class="btn booking" onclick="document.location='BookingArab.html'"><a href="#booking">الحجز</a></button>
- <button class="btn about" onclick="document.location='AboutArab.html'"><a href="#about">حول</a></button>
- <button class="btn contact" onclick="document.location='ContactArab.html'"><a href="#contact">اتصل</a></button>
+ <div class="topnav" id="mytopnav">
+ <a class="active" onclick="document.location='HomeArab.html'" href="#home">الصفحة الرئيسية</a>
+ <a onclick="document.location='ActivitesArab.html'" href="#activties">أنشطة</a>
+ <a onclick="document.location='BookingArab.html'" href="#booking">الحجز</a>
+ <a onclick="document.location='AboutArab.html'" href="#about">حول</a>
+ <a onclick="document.location='ContactArab.html'" href="#contact">اتصل</a>
+ <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+ <i class="fa fa-bars"></i>
+ </a>
</div>
-
+ <script>
+ function myFunction() {
+ var x = document.getElementById("mytopnav");
+ if (x.className === "topnav") {
+ x.className += " responsive";
+ } else {
+ x.className = "topnav";
+ }
+ }
+ </script>
+
<section>
<div class="headimg">
- <img class= "headimg" src="Ability Sports Pictures/header.jpg" alt="header img"/>
+ <img class= "headimg" src="AbilitySportsPictures/header.jpg" alt="headerImg">
</div>
<button onmouseover="mOver(this)" onmouseout="mOut(this)" class="arab" onclick="document.location='Home.html'">English Translation</button><br><br>
@@ -45,42 +58,42 @@
الأنشطة الرياضية للشباب
</h3>
- <p1>
+ <p>
تشمل جلسة القدرة الرياضية جميع الشباب ذوي الإعاقة.
لدينا مجموعة أساسية من الأطفال في كلتا الجلستين.
- </p1><br><br>
+ </p><br><br>
<button class="bttn" onclick="document.location='Activites.html'">اكتشف المزيد</button><br><br>
<div class="homeimgs">
- <img class= "homeimg" src="Ability Sports Pictures/home.jpg" alt="home img"/>
- <img class= "homeimg" src="Ability Sports Pictures/home2.jpg" alt="home img"/>
- <img class= "homeimg" src="Ability Sports Pictures/home3.jpg" alt="home img"/>
+ <img class= "homeimg" src="AbilitySportsPictures/home.jpg" alt="homeImg">
+ <img class= "homeimg" src="AbilitySportsPictures/home2.jpg" alt="homeImg">
+ <img class= "homeimg" src="AbilitySportsPictures/home3.jpg" alt="homeImg">
</div>
<div class="info">
- <p2>
+ <p>
ويقود هذه المنظمة ممثلون عن مجتمع BAME في St.Pauls ، بريستول.
- </p2><br><br>
+ </p><br><br>
</div>
<button class="bttn" onclick="document.location='About.html'">اكتشف المزيد</button><br><br>
<div class="homeimgs">
- <img class= "rep" src="Ability Sports Pictures/BAME.jpg" alt="home img"/>
+ <img class= "rep" src="AbilitySportsPictures/BAME.jpg" alt="homeImg">
</div>
<div class="info">
- <p3>
+ <p>
نرحب بجميع الشباب ذوي الإعاقات.
- </p3><br><br>
+ </p><br><br>
</div>
<button class="bttn" onclick="document.location='Booking.html'">نضم الان</button><br><br>
- <p4>
+ <p>
انضم إلينا في رد الجميل للمجتمع ومتابعتنا على صفحات وسائل التواصل الاجتماعي الخاصة بنا.
- </p4><br><br>
+ </p><br><br>
<form>
<a href="#" class="fa fa-facebook" onclick="window.location.href='https://www.facebook.com/abilitysportsbristol1/'"></a>
diff --git a/Privacy Document.pdf b/PrivacyDocument.pdf
similarity index 100%
rename from Privacy Document.pdf
rename to PrivacyDocument.pdf
diff --git a/Styles/Main.css b/Styles/Main.css
index 9641ebdb7485cb2123e291d6237d12b66a08885e..bd136293ae25553c3f19202fdb455fb46d230776 100644
--- a/Styles/Main.css
+++ b/Styles/Main.css
@@ -11,44 +11,35 @@ header { /*The code respresents where the logo is positioned in the grid*/
.topnav { /*This set of code sets up the design of the top bar navigation*/
overflow: hidden;
background-color: #3090C7;
- top: 0;
- width: 100%;
+ /*top: 0;
+ width: 100%;*/
grid-column: 1/6;
grid-row: 2;
}
-.topnav a {
+.topnav a { /*The style for the links inside of the navigation bar*/
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
- font-size: 17px;
+ font-size: 20px;
width: 17%;
}
-.btn:hover {
+.topnav a:hover { /*The set color for the hover over the links*/
background: rgb(155, 196, 250);
color: black;
}
.topnav .icon {
display: none;
}
-.btn {
- border: none;
- background-color: #3090C7;
- padding: 14px 70px;
- font-size: 16px;
- cursor: pointer;
- display: inline-block;
- width: 19%;
+.topnav a.active {
+ background-color: black;
+ color: white;
}
.logo {
width: 250px;
height: 120px;
-}
-@media screen and (max-width:999px)
-{
-
}
@media screen and (max-width:600px)
{
@@ -74,7 +65,7 @@ header { /*The code respresents where the logo is positioned in the grid*/
}
/*Home Page*/
-Section{
+.homepage{
grid-column: 1/6;
grid-row: 3;
text-align: center;
@@ -131,7 +122,7 @@ Section{
}
.rep{
width: 100%;
- height: 350px;
+ height: 20%;
}
.info {
padding-top: 100px;
@@ -159,6 +150,7 @@ Section{
.para2{
grid-column: 3/5;
grid-row: 4;
+ font-size: 20px;
font-family: Arial, Helvetica, sans-serif;
}
.football {
@@ -186,7 +178,6 @@ input, option {
box-sizing: content-box;
font-size: 20px;
}
-
select {
width: 100%;
padding: 16px 20px;
@@ -204,11 +195,12 @@ label {
}
fieldset {
- max-width: 40px;
+ width: 100%;
padding: 20px;
margin: 2px auto;
border: 0 none;
font-family: Arial, Helvetica, sans-serif;
+ font-size: 20px;
}
legend {