-
Notifications
You must be signed in to change notification settings - Fork 1
/
october-special.html
228 lines (227 loc) · 13.9 KB
/
october-special.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
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
---
layout: new-landings
title: Foot-tech Academy - October Special
image: /img/alt-bg.jpg
---
<div class="wrapper">
<header class="header _large">
<img class="header__logo logo _large" src="/img/common/logo.png" alt="Logo"/>
</header>
<div class="title-bar">
<div class="title-bar__content container">
<h1 class="title-bar__main">Skills based football camp in Leeds</h1>
<div class="title-bar__additional">30th Oct- 1st Nov</div>
</div>
</div>
<section class="intro _october-special">
<div class="intro__container container">
<form class="intro__form form _extended" action="#" method="POST">
<div class="form__head">Sign up today!</div>
<div class="form__container">
<input class="form__input input-text" name="parents-full-name" type="text" placeholder="Parents full name" required/>
<input class="form__input input-text" name="children-name" type="text" placeholder="Child's name" required/>
<div class="form__date-wrapper">
<label class="form__date-label form__label">Childrens date of birth</label>
<div class="form__date-inputs">
<input name="day" type="text" class="form__date-input input-text" placeholder="[DD]" maxlength="2" pattern="^\d{1,2}$" required/>
<input name="month" type="text" class="form__date-input input-text" placeholder="[MM]" maxlength="2" pattern="^\d{1,2}$" required/>
<input name="year" type="text" class="form__date-input input-text" placeholder="[YYYY]" maxlength="4" pattern="^(19|20)\d{2}$" required/>
</div>
</div>
<div class="form__checkbox-group">
<div class="form__checkbox-group-title">Which dates are you interested in?</div>
<div class="form__checkbox-group-items">
<div class="form__checkbox-group-item checkbox-group-item">
<input id="oct30th" name="date" value="oct30th" type="checkbox" class="checkbox" required/>
<label for="oct30th" class="checkbox-group-item__label form__label checkbox-label">Tuesday 30th Oct</label>
</div>
<div class="form__checkbox-group-item checkbox-group-item">
<input id="oct31st" name="date" value="oct31st" type="checkbox" class="checkbox" required/>
<label for="oct31st" class="checkbox-group-item__label form__label checkbox-label">Wednesday 31st Oct</label>
</div>
<div class="form__checkbox-group-item checkbox-group-item">
<input id="nov1st" name="date" value="nov1st" type="checkbox" class="checkbox" required/>
<label for="nov1st" class="checkbox-group-item__label form__label checkbox-label">Thursday 1st Nov</label>
</div>
</div>
</div>
<input class="form__input input-text" name="email" type="email" placeholder="Your email address" required/>
<button class="form__submit submit _dark">Submit</button>
</div>
<img src="/img/october-special/pumpkin.png" class="form__pumpkin _left" aria-hidden="true"/>
<img src="/img/october-special/pumpkin.png" class="form__pumpkin _right" aria-hidden="true"/>
<img src="/img/october-special/leaves2.png" class="form__leaves leaves2" aria-hidden="true"/>
</form>
<img src="/img/october-special/leaves1.png" class="intro__leaves leaves1" aria-hidden="true"/>
</div>
</section>
<section class="section-main _october-special">
<div class="section-main__inner">
<div class="section-main__container container">
<div class="section-main__illustration-wrapper">
<img src="/img/october-special/boy.png" class="section-main__illustration" aria-hidden="true"/>
<img src="/img/october-special/leaves2.png" class="section-main__illustration-leaves leaves2" aria-hidden="true"/>
</div>
<h2 class="section-main__title">Half Term <br>Football Camp</h2>
<div class="section-main__content">
<p class="section-main__text text">Fancy an awesome football-packed 3 days where you'll learn the best new skills, play in tournaments and win loads of prizes?</p>
<p class="section-main__text text">The Foot-Tech football camps are back for October half term after two sell-out weeks in the summer. Come and join in the fun and learn from our amazing professional football coaches.</p>
<p class="section-main__text text">Foot-Tech is an innovative football coaching school for boys and girls aged 4-14 that will give your child a completely new football training experience. Since starting in 2014, Foot-Tech has grown significantly and we are proud to coach over 400 children in the Leeds area on a weekly basis.</p>
</div>
<div class="section-main__features features _october-special">
<div class="features__item features-item">
<img class="features-item__icon _smile" src="/img/common/icons/smile.png" aria-hidden="true"/>
<div class="features-item__caption">Fun non pressured environment</div>
<div class="features-item__text">Learn new football and life skills and make new friends</div>
</div>
<div class="features__item features-item">
<img class="features-item__icon _rock" src="/img/common/icons/rock.png" aria-hidden="true"/>
<div class="features-item__caption">Build confidence</div>
<div class="features-item__text">Gain confidence and become a new person</div>
</div>
<div class="features__item features-item">
<img class="features-item__icon _person" src="/img/common/icons/person.png" aria-hidden="true"/>
<div class="features-item__caption">All abilities- <br>beginner to advance</div>
<div class="features-item__text">No matter what your ability or experience, we will help you gain football skills</div>
</div>
<div class="features__item features-item">
<img class="features-item__icon _ball-boots" src="/img/common/icons/ball-boots.png" aria-hidden="true"/>
<div class="features-item__caption">Learn new skills</div>
<div class="features-item__text">Gain professional football skills to help you on the pitch</div>
</div>
</div>
<img src="/img/october-special/leaves1.png" class="section-main__leaves1 leaves1" aria-hidden="true"/>
<img src="/img/october-special/leaves2.png" class="section-main__leaves2 leaves2" aria-hidden="true"/>
</div>
</div>
<div class="section-main__bg-container _overflow-hidden">
<div class="section-main__bg1"></div>
</div>
<div class="section-main__bg-container">
<div class="section-main__bg2"></div>
</div>
</section>
<section class="section-event section">
<div class="section-event__container container">
<h2 class="section-event__title section__title">When and Where?</h2>
<div class="section-event__table event-table">
<div class="event-table__title">Tues 30th Oct, Wed 31st Oct & Thurs 1st Nov</div>
<div class="event-table__time">
<p class="event-table__text">9am- 3pm each day</p>
</div>
<div class="event-table__location">
<p class="event-table__text">Roundhay School Primary Campus,</p>
<p class="event-table__text">Leeds,</p>
<p class="event-table__text">LS8 2LE</p>
</div>
<img src="/img/october-special/leaves2.png" class="event-table__leaves1 leaves2" aria-hidden="true"/>
</div>
<div class="section-event__table event-table">
<div class="event-table__title">PRICES</div>
<div class="event-table__prices">
<p class="event-table__text-small">One day- £17.50</p>
<p class="event-table__text-small">Two days- £35</p>
<p class="event-table__text-small">Three days- £50</p>
<p class="event-table__text-small">(choose between 1,2 or all 3 days of the camp)</p>
</div>
<div class="event-table__extra">
<p class="event-table__text-tiny">Early drop off option from 8am</p>
<p class="event-table__text-tiny">Late pick up option up to 4pm</p>
<p class="event-table__text-tiny">(£4 extra for each of these options)</p>
</div>
<img src="/img/october-special/leaves2.png" class="event-table__leaves2 leaves2 _size2" aria-hidden="true"/>
</div>
<!--<div class="carousel" data-carousel>-->
<!--<div class="carousel__inner" data-carousel-container>-->
<!--<div class="carousel__items swiper-wrapper">-->
<!--<div class="carousel__item carousel-item swiper-slide" style="background-image: url('img/october-special/carousel/1.jpg');"></div>-->
<!--<div class="carousel__item carousel-item swiper-slide" style="background-image: url('img/october-special/carousel/2.jpg');"></div>-->
<!--</div>-->
<!--</div>-->
<!--<img src="i/mg/common/arrow-right.svg" class="carousel__prev" aria-label="Prev" role="button" data-carousel-prev>-->
<!--<img src="i/mg/common/arrow-right.svg" class="carousel__next" aria-label="Next" role="button" data-carousel-next>-->
<!--</div>-->
</div>
</section>
<section class="section-cta _october-special">
<div class="section-cta__container container">
<div class="section-cta__container-inner">
<img src="/img/october-special/boy.png" class="section-cta__illustration" aria-hidden="true"/>
<form class="section-cta__form-extended form _extended _alt-padding _shadow" action="#" method="POST">
<div class="form__head">Sign up today!</div>
<div class="form__container">
<input class="form__input input-text" name="parents-full-name" type="text" placeholder="Parents full name" required/>
<input class="form__input input-text" name="children-name" type="text" placeholder="Child's name" required/>
<div class="form__date-wrapper">
<label class="form__date-label form__label">Childrens date of birth</label>
<div class="form__date-inputs">
<input name="day" type="text" class="form__date-input input-text" placeholder="[DD]" maxlength="2" pattern="^\d{1,2}$" required/>
<input name="month" type="text" class="form__date-input input-text" placeholder="[MM]" maxlength="2" pattern="^\d{1,2}$" required/>
<input name="year" type="text" class="form__date-input input-text" placeholder="[YYYY]" maxlength="4" pattern="^(19|20)\d{2}$" required/>
</div>
</div>
<div class="form__checkbox-group">
<div class="form__checkbox-group-title">Which dates are you interested in?</div>
<div class="form__checkbox-group-items">
<div class="form__checkbox-group-item checkbox-group-item">
<input id="oct30th2" name="date" value="oct30th" type="checkbox" class="checkbox" required/>
<label for="oct30th2" class="checkbox-group-item__label form__label checkbox-label">Tuesday 30th Oct</label>
</div>
<div class="form__checkbox-group-item checkbox-group-item">
<input id="oct31st2" name="date" value="oct31st" type="checkbox" class="checkbox" required/>
<label for="oct31st2" class="checkbox-group-item__label form__label checkbox-label">Wednesday 31st Oct</label>
</div>
<div class="form__checkbox-group-item checkbox-group-item">
<input id="nov1st2" name="date" value="nov1st" type="checkbox" class="checkbox" required/>
<label for="nov1st2" class="checkbox-group-item__label form__label checkbox-label">Thursday 1st Nov</label>
</div>
</div>
</div>
<input class="form__input input-text" name="email" type="email" placeholder="Your email address" required/>
<button class="form__submit submit _dark">Submit</button>
</div>
<img src="/img/october-special/pumpkin.png" class="form__pumpkin _right" aria-hidden="true"/>
</form>
</div>
<img src="/img/october-special/leaves2.png" class="section-cta__leaves1 leaves2 _size2" aria-hidden="true"/>
<img src="/img/october-special/leaves2.png" class="section-cta__leaves2 leaves2" aria-hidden="true"/>
</div>
<div class="section-cta__bg"></div>
</section>
<footer class="footer">
<div class="footer__container container">
<img src="/img/common/logo-white.png" alt="Logo" class="footer__logo">
<div class="footer__contacts">
<div class="footer-contact">
<div class="footer-contact__title">Email Us</div>
<a href="mailto:[email protected]" class="footer-contact__content">[email protected]</a>
</div>
<div class="footer-contact">
<div class="footer-contact__title">Call Us</div>
<a href="mailto:[email protected]" class="footer-contact__content">07732865677</a>
</div>
</div>
<div class="footer__social social-buttons">
<div class="social-button">
<a href="#" class="social-button__link">
<img src="/img/common/social/facebook.svg" class="social-button__icon _facebook" aria-hidden="true"/>
<div class="social-button__caption">Foot-Tech Academy</div>
</a>
</div>
<div class="social-button">
<a href="#" class="social-button__link">
<img src="/img/common/social/instagram.svg" class="social-button__icon _instagram" aria-hidden="true"/>
<div class="social-button__caption">foottech_academy</div>
</a>
</div>
<div class="social-button">
<a href="#" class="social-button__link">
<img src="/img/common/social/twitter.svg" class="social-button__icon _twitter" aria-hidden="true"/>
<div class="social-button__caption">FootTechAcademy</div>
</a>
</div>
</div>
</div>
</footer>
</div>
<!--<script src="/js/new-landings/october-special.js"></script>-->