path: root/src/html/index.html



<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta property="og:type" content="website">
		<meta property="og:site_name" content="Carpenter Tutoring">
		<meta property="og:title" content="Carpenter Tutoring">
		<meta property="og:description" content="">
		<meta property="og:url" content="">
		<meta property="og:image" content="">
		<title>Carpenter Tutoring</title>
		<link rel="stylesheet" href="css/index.css">
	</head>

	<body class="has-navbar-fixed-top">
		<!-- navigation -->
		<nav class="navbar is-fixed-top">
			<div class="navbar-brand">
				<a class="navbar-item" href="#">
					<img src="/logo-simple.png">
				</a>
				<a role="button" class="navbar-burger" data-target="navMenu" aria-label="menu" aria-expanded="false">
					<span aria-hidden="true"></span>
					<span aria-hidden="true"></span>
					<span aria-hidden="true"></span>
				</a>
			</div>
			<div class="navbar-menu" id="navMenu">
				<div class="navbar-start">
				</div>
				<div class="navbar-end">
					<a class="navbar-item" href="#offerings">
						Offerings
					</a>
					<a class="navbar-item" href="#about">
						About
					</a>
					<!--<a class="navbar-item" href="#testimonials">
	     Testimonials
	     </a>-->
	     <a class="navbar-item" href="#contact">
		     Contact Me
	     </a>
				</div>
			</div>
		</nav>

		<!-- title, slogan, phone -->
		<section class="section has-text-right has-banner">
			<div class="banner">
				<div class="container">
					<h1 class="title is-2 has-text-shadow">
						CARPENTER TUTORING
					</h1>
					<h2 class="subtitle is-3 has-text-shadow">
						<b>Discovering <em>your</em> path to success</b>
					</h2>
					<div class="buttons is-right">
						<a class="button is-large is-rounded is-link" href="tel:1-757-335-7555">
							Call (757) 335-7555
						</a>
						<a class="button is-large is-rounded is-primary" href="#contact">
							Contact me by email
						</a>
					</div>
				</div>
			</div>
		</section>

		<!-- intro blurb, logo -->
		<section class="section quiet">
			<div class="container">
				<div class="columns">
					<div class="column">
						<p>
							Lorem ipsum dolor sit amet, consectetur adipiscing elit.
							Mauris eget lobortis erat. Vivamus venenatis nec quam vitae
							vulputate. Class aptent taciti sociosqu ad litora torquent
							per conubia nostra, per inceptos himenaeos. Vestibulum ante
							ipsum primis in faucibus orci luctus et ultrices posuere
							cubilia Curae; Cras nec aliquam purus, nec ornare urna.
							Phasellus accumsan vitae elit sed fringilla. Nulla
							porttitor magna eget ipsum ultricies malesuada quis a
							ipsum.
						</p>
					</div>
					<div class="column is-one-third">
						<div class="box">
							<figure class="image">
								<img src="/amy.jpg">
							</figure>
						</div>
					</div>
				</div>
			</div>
		</section>

		<!-- offerings tiles -->
		<section class="section" id="offerings">
			<div class="container">
				<div class="tile is-ancestor">

					<div class="tile is-parent is-vertical">
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box darkteal">
									<p>
									<b>Subject Tutoring</b>
									</p>
									<p>
									Tutoring for specific courses or disciplines. Click
									here for a full list of courses covered.
									</p>
								</div>
							</div>
						</div>
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box green">
									<p>
									<b>Time Management</b>
									</p>
									<p>
									Personalized plans for managing academics,
									extracurriculars, and other commitments.
									</p>
								</div>
							</div>
						</div>
					</div>


					<div class="tile is-parent is-vertical">
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box darkgreen">
									<p>
									<b>Study Skills</p>
									</b>
									<p>
									Learn how to make the most of your study time.
									</p>
								</div>
							</div>
						</div>
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box darkerteal">
									<p>
									<b>Academic Coaching</b>
									</p>
									<p>
									Time management and study skills blended with
									continuing accountability.
									</p>
								</div>
							</div>
						</div>
					</div>


					<div class="tile is-parent is-vertical">
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box darkteal">
									<p>
									<b>College Prep</b>
									</p>
									<p>
									ACT &amp; SAT preparation and assistance with
									college application essays.
									</p>
								</div>
							</div>
						</div>
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box green">
									<p>
									<b>College-Level Writing</b>
									</p>
									<p>
									Get a head start on meeting professors'
									expectations.
									</p>
								</div>
							</div>
						</div>
					</div>


					<div class="tile is-parent is-vertical">
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box darkgreen">
									<p>
									<b>Group Webinars</b>
									</p>
									<p>
									Participate in general workshops and pre-planned
									courses from the comfort of home.
									</p>
								</div>
							</div>
						</div>
						<div class="tile is-child">
							<div class="box darkgray">
								<div class="box darkerteal">
									<p>
									<b>Parent Consultations</b>
									</p>
									<p>
									For parents seeking advice for facilitating their child's learning.
									</p>
								</div>
							</div>
						</div>
					</div>

				</div>
			</div>
		</section>

		<!-- about pic and text -->
		<section class="section quiet" id="about">
			<div class="container">
				<div class="columns">
					<div class="column is-one-third">
						<figure class="image">
							<img src="/logo.png">
						</figure>
					</div>
					<div class="column">
						<div class="content">
							<p>
							School is tricky, and there is no universal pathway
							to success. I started Carpenter Tutoring for those
							seeking a little help finding their way. 
							</p>
							<p>
							I received my B.A. from The College of William and
							Mary in 2018 and will receive my M.Ed from W&amp;M
							in 2020. As an undergraduate, I worked and was
							trained as a tutor at W&amp;M's peer tutoring
							center, the Tribe TutorZone. During this period, I
							conducted over 150 one-on-one appointments with
							W&amp;M students in 26 different content areas. I
							earned lifetime Advanced Tutor Certification, the
							highest level W&amp;M can grant, through the
							College Reading and Learning Association, and I was
							trained as a time management consultant. I took on
							leadership roles within the TutorZone until I was
							working alongside its director. As a graduate
							student, I became one of the Graduate Assistants
							helping oversee the TutorZone as well as an
							academic coach to students with high need for
							academic support. 
							</p>
							<p>
							I loved getting to work with the Tribe TutorZone
							tutors, but I realized that I missed being the
							tutor. There's just nothing like watching the light
							bulb of understanding go off or seeing students who
							had struggled with material master it! With that
							realization, I decided to dedicate my life to my
							passion: helping students of all ages learn,
							succeed, and believe in themselves. 
							</p>
							<p>
							Thank you for considering Carpenter Tutoring.
							</p>
							<p>
							-- Amy Carpenter
							</p>
						</div>
					</div>
				</div>
		</section>

		<!-- testimonial bubbles -->
		<!--<section class="section" id="testimonials">
	  <div class="container">
	  <div class="blurb">
	  <p>
	  Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	  Mauris eget lobortis erat. Vivamus venenatis nec quam vitae
	  vulputate. Class aptent taciti sociosqu ad litora torquent
	  per conubia nostra, per inceptos himenaeos. 
	  </p>
	  </div>
	  </div>
	  </section>-->

	  <!-- contact box, additional contact and tutoring info -->
	  <section class="section" id="contact">
		  <div class="container">
			  <div class="columns">
				  <div class="column is-one-third">
					  <div class="box">
						  <form name="inquiry">
							  <div class="field">
								  <div class="control has-icons-left">
									  <span class="icon">
										  <i class="iconify" data-icon="mdi-account"></i>
									  </span>
									  <input name="name" class="input is-rounded" type="text" placeholder="name"></input>
								  </div>
							  </div>
							  <div class="field">
								  <div class="control has-icons-left">
									  <span class="icon">
										  <i class="iconify" data-icon="mdi-email"></i>
									  </span>
									  <input name="from" class="input is-rounded" type="text" placeholder="email address"></input>
								  </div>
							  </div>
							  <div class="field">
								  <div class="control">
									  <textarea name="body" class="textarea" placeholder="question/comment" spellcheck="true"></textarea>
								  </div>
							  </div>
							  <div class="field is-grouped is-grouped-right">
								  <div class="control">
									  <button class="button is-rounded is-primary" type="submit">
										  <span class="icon">
											  <i class="iconify" data-icon="mdi-check"></i>
										  </span>
										  <span>
											  Submit
										  </span>
									  </button>
								  </div>
							  </div>

							  <div id="errorBox" class="notification is-danger" style="display: none">
							  </div>
							  <div id="successBox" class="notification is-success" style="display: none">
								  Message sent!
							  </div>

						  </form>
					  </div>
				  </div>

				  <div class="column">
					  <div class="box">
							<p>
						  Info about cancellation, contact info, travel,
						  payment methods, maybe different section IDK yet.
							</p>
					  </div>
				  </div>
			  </div>
		  </div>
	  </section>

	  <!-- footer, copyright, problems -->
	  <footer class="footer">
		  <div class="content has-text-centered">
			  <p>
			  &copy; 2020 Carpenter Tutoring. All rights reserved.
			  </p>
			  <p>
			  Something wrong? 
			  <a href="mailto:webmaster@carpentertutoring.com">
				  Tell the webmaster.
			  </a>
			  </p>
		  </div>
	  </footer>

	  <script src="/js/index.js" type="text/javascript"></script>
	  <script src="/js/iconify.min.js" type="text/javascript"></script>
	  <script src="/js/smtp.js" type="text/javascript"></script>
	</body>
</html>