LearnByDesign/about-us.html at main · AlexWallaceAptly/LearnByDesign · GitHub

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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>About Us | Learn by Design - Professional ABA Therapy Services</title>
    <meta name="description" content="Learn about Learn by Design's mission, team, and commitment to providing exceptional ABA therapy services for children with autism since 2025.">

    <!-- Favicon -->
    <link rel="icon" type="image/png" sizes="32x32" href="Logos/IconOnly_Transparent_NoBuffer.png">
    <link rel="icon" type="image/png" sizes="16x16" href="Logos/IconOnly_Transparent_NoBuffer.png">
    <link rel="apple-touch-icon" href="Logos/IconOnly_Transparent_NoBuffer.png">
    <link rel="shortcut icon" href="Logos/IconOnly_Transparent_NoBuffer.png">

    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="accessibility.css">
</head>
<body class="font-sans">
    <!-- Header/Navigation -->
    <header class="bg-white shadow-sm sticky top-0 z-50">
        <div class="container mx-auto px-4 py-3 flex justify-between items-center">
            <div class="flex items-center space-x-3">
                <img src="Logos/IconOnly_Transparent_NoBuffer.png" alt="Learn by Design Logo" class="h-12 w-auto">
                <h1 class="text-2xl font-bold text-blueberry">Learn by Design</h1>
            </div>

            <nav class="hidden md:flex space-x-8">
                <a href="index.html" class="text-blueberry font-medium hover:text-magenta transition">Home</a>
                <a href="services.html" class="text-blueberry font-medium hover:text-magenta transition">Services</a>
                <a href="about-us.html" class="text-magenta font-medium">About Us</a>
                <a href="testimonials.html" class="text-blueberry font-medium hover:text-magenta transition">Resources</a>
                <a href="contact.html" class="text-blueberry font-medium hover:text-magenta transition">Contact</a>
            </nav>

            <button class="md:hidden text-blueberry text-2xl" id="mobile-menu-button">
                <i class="fas fa-bars"></i>
            </button>
        </div>

        <!-- Mobile Menu -->
        <div class="md:hidden hidden bg-white w-full py-4 px-4 shadow-md" id="mobile-menu">
            <div class="flex flex-col space-y-4">
                <a href="index.html" class="text-blueberry font-medium hover:text-magenta transition">Home</a>
                <a href="services.html" class="text-blueberry font-medium hover:text-magenta transition">Services</a>
                <a href="about-us.html" class="text-magenta font-medium">About Us</a>
                <a href="testimonials.html" class="text-blueberry font-medium hover:text-magenta transition">Resources</a>
                <a href="contact.html" class="text-blueberry font-medium hover:text-magenta transition">Contact</a>
            </div>
        </div>
    </header>

    <!-- Page Header -->
    <section class="hero-section py-16">
        <div class="container mx-auto px-4 text-center">
            <h1 class="text-4xl md:text-5xl font-bold text-blueberry mb-6">About Learn by Design</h1>
            <p class="text-xl text-sage max-w-3xl mx-auto">Dedicated to empowering children with autism through evidence-based ABA therapy and compassionate family support.</p>
        </div>
    </section>

    <!-- About Us Section -->
    <section class="py-20">
        <div class="container mx-auto px-4">
            <!-- Meet Our Founders -->
            <div class="text-center mb-12">
                <h2 class="text-3xl font-bold text-blueberry mb-6">Meet Our Founders</h2>
                <div class="flex flex-col md:flex-row justify-center items-center gap-12 md:gap-16 mb-12">
                    <!-- Bailey -->
                    <div class="text-center">
                        <img src="assets/Bailey_headshot.jpeg" alt="Bailey Bakken, M.S., BCBA - Co-Founder" class="w-64 h-64 object-cover object-top rounded-full shadow-xl mx-auto mb-4">
                        <h3 class="text-xl font-bold text-blueberry">Bailey Bakken</h3>
                        <p class="text-black font-medium">M.S., BCBA</p>
                        <p class="text-black">Co-Founder</p>
                    </div>
                    <!-- Kayla -->
                    <div class="text-center">
                        <img src="assets/Kayla_headshot.jpeg" alt="Kayla Wallace, M.S., BCBA - Co-Founder" class="w-64 h-64 object-cover rounded-full shadow-xl mx-auto mb-4">
                        <h3 class="text-xl font-bold text-blueberry">Kayla Wallace</h3>
                        <p class="text-black font-medium">M.S., BCBA</p>
                        <p class="text-black">Co-Founder</p>
                    </div>
                </div>
            </div>

            <!-- Our Story -->
            <div class="max-w-4xl mx-auto mb-16">
                <h2 class="text-3xl font-bold text-blueberry mb-6 text-center">Our Story</h2>
                <p class="text-sage mb-6">Bailey Bakken, M.S., BCBA and Kayla Wallace, M.S., BCBA co-founded Learn by Design with the mission to provide quality services utilizing progressive ABA ideologies to increase access to compassionate, individualized care and to make meaningful improvements in the lives of families. Together, they take the lead in inspiring others to embrace these principles.</p>
                <p class="text-sage mb-6">Our team of Board Certified Behavior Analysts (BCBAs) and Registered Behavior Technicians (RBTs) are dedicated to creating meaningful, lasting change through individualized treatment plans.</p>
                <p class="text-sage mb-6">We believe that every child has the potential to learn and thrive. We're committed to helping each individual reach their full potential through evidence-based practices and compassionate quality care.</p>
            </div>

            <!-- Mission Section -->
            <div class="bg-gray-50 p-8 rounded-xl mb-16">
                <div class="text-center mb-8">
                    <h2 class="text-3xl font-bold text-blueberry mb-4">Our Mission</h2>
                    <p class="text-lg text-sage max-w-4xl mx-auto">To empower individuals with developmental differences to reach their full potential through evidence based ABA practices, while supporting families with compassion and expertise.</p>
                </div>

                <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
                    <div class="text-center">
                        <div class="bg-blueberry text-white w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
                            <i class="fas fa-heart text-2xl"></i>
                        </div>
                        <h3 class="text-xl font-bold text-blueberry mb-2">Compassionate Care</h3>
                        <p class="text-sage">We approach every child and family with empathy, understanding, and respect.</p>
                    </div>
                    <div class="text-center">
                        <div class="bg-magenta text-white w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
                            <i class="fas fa-chart-line text-2xl"></i>
                        </div>
                        <h3 class="text-xl font-bold text-magenta mb-2">Data-Driven Results</h3>
                        <p class="text-sage">Our methods are grounded in scientific research and proven outcomes.</p>
                    </div>
                    <div class="text-center">
                        <div class="bg-sage text-white w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
                            <i class="fas fa-users text-2xl"></i>
                        </div>
                        <h3 class="text-xl font-bold text-sage mb-2">Family-Centered</h3>
                        <p class="text-sage">We involve families in every step of the therapy process.</p>
                    </div>
                </div>
            </div>

            <!-- Team Section -->
            <div class="text-center mb-16">
                <h2 class="text-3xl font-bold text-blueberry mb-4">Our Qualifications</h2>
                <p class="text-lg text-sage max-w-2xl mx-auto mb-8">Our team consists of highly qualified professionals committed to excellence in ABA therapy.</p>

                <div class="flex flex-wrap justify-center gap-4">
                    <div class="flex items-center bg-blueberry px-6 py-3 rounded-full">
                        <i class="fas fa-certificate text-white mr-3"></i>
                        <span class="text-white font-medium">BCBA Certified</span>
                    </div>
                    <div class="flex items-center bg-magenta px-6 py-3 rounded-full">
                        <i class="fas fa-user-check text-white mr-3"></i>
                        <span class="text-white font-medium">RBT/BCAT Certified</span>
                    </div>
                    <div class="flex items-center bg-sage px-6 py-3 rounded-full">
                        <i class="fas fa-clock text-white mr-3"></i>
                        <span class="text-white font-medium">Over 10 Years of Experience</span>
                    </div>
                    <div class="flex items-center bg-blueberry px-6 py-3 rounded-full">
                        <i class="fas fa-book text-white mr-3"></i>
                        <span class="text-white font-medium">Continuing Education</span>
                    </div>
                </div>
            </div>


        </div>
    </section>

    <!-- Footer -->
    <footer class="bg-blueberry text-white py-12">
        <div class="container mx-auto px-4">
            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
                <div>
                    <div class="flex items-center space-x-3 mb-4">
                        <img src="Logos/IconOnly_Transparent_NoBuffer.png" alt="Learn by Design Logo" class="h-10 w-auto">
                        <h3 class="text-xl font-bold">Learn by Design</h3>
                    </div>
                    <p class="text-blue-100">Providing exceptional ABA therapy services with compassion and expertise since 2025.</p>
                </div>

                <div>
                    <h4 class="text-lg font-bold mb-4">Quick Links</h4>
                    <ul class="space-y-2">
                        <li><a href="index.html" class="text-blue-100 hover:text-white transition">Home</a></li>
                        <li><a href="services.html" class="text-blue-100 hover:text-white transition">Services</a></li>
                        <li><a href="about-us.html" class="text-blue-100 hover:text-white transition">About Us</a></li>
                        <li><a href="testimonials.html" class="text-blue-100 hover:text-white transition">Resources</a></li>
                        <li><a href="contact.html" class="text-blue-100 hover:text-white transition">Contact</a></li>
                    </ul>
                </div>

                <div>
                    <h4 class="text-lg font-bold mb-4">Services</h4>
                    <ul class="space-y-2">
                        <li><a href="services.html" class="text-blue-100 hover:text-white transition">Early Development Support</a></li>
                        <li><a href="services.html" class="text-blue-100 hover:text-white transition">In-Home Therapy</a></li>
                        <li><a href="services.html" class="text-blue-100 hover:text-white transition">Caregiver Training</a></li>
                    </ul>
                </div>


            </div>

            <div class="border-t border-blue-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
                <p class="text-blue-100 mb-4 md:mb-0">© 2025 Learn by Design. All rights reserved.</p>
                <div class="flex space-x-6">
                    <a href="#" class="text-blue-100 hover:text-white transition">Privacy Policy</a>
                    <a href="#" class="text-blue-100 hover:text-white transition">Terms of Service</a>
                </div>
            </div>
        </div>
    </footer>

    <!-- Back to Top Button -->
    <button id="back-to-top" class="fixed bottom-8 right-8 bg-magenta text-white w-12 h-12 rounded-full shadow-lg flex items-center justify-center opacity-0 invisible transition-all duration-300">
        <i class="fas fa-arrow-up"></i>
    </button>

    <script src="script.js"></script>
</body>
</html>