feat: k12 content, card formatting, begin style changesHEADmaster

11 files changed, 395 insertions, 63 deletions

diff --git a/src/handlers.rs b/src/handlers.rs
index 800d8f8..43d31fd 100644
--- a/src/handlers.rs
+++ b/src/handlers.rs
@@ -1,15 +1,16 @@
-use askama::Template;
-use crate::views::post::PostView;
-use crate::views::posts::PostsView;
 use crate::posts::abstractions::repo::PostRepo;
-use crate::views::policies::PoliciesTemplate;
-use crate::views::index::IndexTemplate;
-use crate::views::brochure::BrochureTemplate;
-use crate::views::about::AboutView;
 use crate::tutors::abstractions::tutor_repo::TutorRepo;
-use std::sync::Arc;
+use crate::views::about::AboutView;
+use crate::views::brochure::BrochureTemplate;
+use crate::views::index::IndexTemplate;
+use crate::views::k12::K12Template;
+use crate::views::policies::PoliciesTemplate;
+use crate::views::post::PostView;
+use crate::views::posts::PostsView;
+use askama::Template;
+use axum::extract::{Path, State};
 use axum::response::Html;
-use axum::extract::{State, Path};
+use std::sync::Arc;
 
 pub async fn about_handler(State(repo): State<Arc<impl TutorRepo>>) -> Html<String> {
     let view = AboutView::with_tutors(repo.load());
@@ -17,7 +18,7 @@ pub async fn about_handler(State(repo): State<Arc<impl TutorRepo>>) -> Html<Stri
 }
 
 pub async fn brochure_handler() -> Html<String> {
-    Html(BrochureTemplate{}.render().unwrap())
+    Html(BrochureTemplate {}.render().unwrap())
 }
 
 pub async fn index_handler() -> Html<String> {
@@ -25,7 +26,7 @@ pub async fn index_handler() -> Html<String> {
 }
 
 pub async fn policies_handler() -> Html<String> {
-    Html(PoliciesTemplate{}.render().unwrap())
+    Html(PoliciesTemplate {}.render().unwrap())
 }
 
 pub async fn posts_handler(State(repo): State<Arc<impl PostRepo>>) -> Html<String> {
@@ -33,8 +34,14 @@ pub async fn posts_handler(State(repo): State<Arc<impl PostRepo>>) -> Html<Strin
     Html(view.render().unwrap())
 }
 
-pub async fn post_handler(Path(post_id): Path<String>, State(repo): State<Arc<impl PostRepo>>) -> Html<String> {
+pub async fn post_handler(
+    Path(post_id): Path<String>,
+    State(repo): State<Arc<impl PostRepo>>,
+) -> Html<String> {
     let view = PostView::with_post(repo.by_id(&post_id));
     Html(view.render().unwrap())
 }
 
+pub async fn k12_handler() -> Html<String> {
+    Html(K12Template {}.render().unwrap())
+}
diff --git a/src/main.rs b/src/main.rs
index 372915b..57b0256 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -1,20 +1,23 @@
+use axum::{extract::Request, routing::get, Router, ServiceExt};
+use middleware::cache_control::cache_static;
+use posts::fs_post_repo::FsPostRepo;
+use std::{env, sync::Arc};
 use tower::Layer;
-use tracing_subscriber::{layer::SubscriberExt, util::SubscriberInitExt, EnvFilter};
-use tower_http::{trace::{self, TraceLayer}, normalize_path::NormalizePathLayer};
+use tower_http::services::ServeDir;
+use tower_http::{
+    normalize_path::NormalizePathLayer,
+    trace::{self, TraceLayer},
+};
 use tracing::{info, Level};
-use axum::{routing::get, Router, ServiceExt, extract::Request};
+use tracing_subscriber::{layer::SubscriberExt, util::SubscriberInitExt, EnvFilter};
 use tutors::fs_tutor_repo::FsTutorRepo;
-use std::{sync::Arc, env};
-use tower_http::services::ServeDir;
-use posts::fs_post_repo::FsPostRepo;
-use middleware::cache_control::cache_static;
 
+mod handlers;
 mod helpers;
+mod middleware;
 mod posts;
 mod tutors;
 mod views;
-mod handlers;
-mod middleware;
 
 #[tokio::main]
 async fn main() {
@@ -28,9 +31,9 @@ async fn main() {
         .init();
 
     info!("loading state...");
-    let blog_dir = env::var("CT_POSTS").unwrap();
-    let tutor_dir = env::var("CT_TEAM").unwrap();
-    let assets_dir = env::var("CT_ASSETS").unwrap();
+    let blog_dir = env::var("CT_POSTS").unwrap_or(String::from("/var/ct/posts"));
+    let tutor_dir = env::var("CT_TEAM").unwrap_or(String::from("/var/ct/team"));
+    let assets_dir = env::var("CT_ASSETS").unwrap_or(String::from("/var/ct/assets"));
 
     let posts = Arc::new(FsPostRepo::with_dir(blog_dir));
     let tutors = Arc::new(FsTutorRepo::with_dir(tutor_dir.clone()));
@@ -44,6 +47,7 @@ async fn main() {
         .route("/policies", get(handlers::policies_handler))
         .route("/brochure", get(handlers::brochure_handler))
         .route("/about", get(handlers::about_handler))
+        .route("/k12", get(handlers::k12_handler))
         .with_state(tutors)
         .nest_service("/assets", ServeDir::new(assets_dir))
         .nest_service("/team", ServeDir::new(tutor_dir))
@@ -51,14 +55,14 @@ async fn main() {
         .layer(axum::middleware::from_fn(cache_static))
         .layer(
             TraceLayer::new_for_http()
-                .make_span_with(trace::DefaultMakeSpan::new()
-                    .level(Level::INFO))
-                .on_response(trace::DefaultOnResponse::new()
-                    .level(Level::INFO))
+                .make_span_with(trace::DefaultMakeSpan::new().level(Level::INFO))
+                .on_response(trace::DefaultOnResponse::new().level(Level::INFO)),
         );
     let app = NormalizePathLayer::trim_trailing_slash().layer(app);
 
     let addr = env::var("CT_BIND").unwrap_or("0.0.0.0:8000".into());
     let listener = tokio::net::TcpListener::bind(addr).await.unwrap();
-    axum::serve(listener, ServiceExt::<Request>::into_make_service(app)).await.unwrap();
+    axum::serve(listener, ServiceExt::<Request>::into_make_service(app))
+        .await
+        .unwrap();
 }
diff --git a/src/middleware/cache_control.rs b/src/middleware/cache_control.rs
index 30f31ca..0f11924 100644
--- a/src/middleware/cache_control.rs
+++ b/src/middleware/cache_control.rs
@@ -3,7 +3,7 @@ use axum::http::header::{HeaderValue, CACHE_CONTROL};
 use axum::middleware::Next;
 use axum::response::Response;
 
-pub async fn cache_static(mut request: Request, next: Next) -> Response {
+pub async fn cache_static(request: Request, next: Next) -> Response {
     let was_static = request.uri().path().starts_with("/assets");
     let mut response = next.run(request).await;
 
diff --git a/src/posts/fs_post.rs b/src/posts/fs_post.rs
index a1de678..4fc03b2 100644
--- a/src/posts/fs_post.rs
+++ b/src/posts/fs_post.rs
@@ -26,7 +26,7 @@ impl Post for FsPost {
         let article = self.get_article();
         Cow::Owned(
             article
-                .split_once("\n")
+                .split_once('\n')
                 .map(|(first, _)| first)
                 .unwrap_or_default()
                 .trim_start_matches('_')
diff --git a/src/views.rs b/src/views.rs
index cb58813..e9f1951 100644
--- a/src/views.rs
+++ b/src/views.rs
@@ -1,6 +1,7 @@
 pub mod about;
 pub mod brochure;
 pub mod index;
+pub mod k12;
 pub mod policies;
 pub mod post;
 pub mod posts;
diff --git a/src/views/k12.rs b/src/views/k12.rs
new file mode 100644
index 0000000..eb9725f
--- /dev/null
+++ b/src/views/k12.rs
@@ -0,0 +1,6 @@
+use crate::helpers::*;
+use askama::Template;
+
+#[derive(Template)]
+#[template(path = "k12.html")]
+pub struct K12Template;
diff --git a/static/desktop.css b/static/desktop.css
index 7a20b0a..cfe5b73 100644
--- a/static/desktop.css
+++ b/static/desktop.css
@@ -17,11 +17,9 @@
   .banner {
     padding-top: 7em;
     text-align: right;
-    background: linear-gradient(
-      to right,
-      rgba(255, 255, 255, 0) 0%,
-      rgba(255, 255, 255, 1) 50%
-    );
+    background: linear-gradient(to right,
+        rgba(255, 255, 255, 0) 0%,
+        rgba(255, 255, 255, 1) 50%);
   }
 
   form {
@@ -66,14 +64,7 @@
     padding: 2em;
   }
 
-  #reviews .card,
-  #offerings .card {
-    display: block;
-    flex: none;
-    width: 20%;
-  }
-
   .modal .card {
     width: 25%;
   }
-}
+}
\ No newline at end of file
diff --git a/templates/card.html b/templates/card.html
new file mode 100644
index 0000000..1397bc8
--- /dev/null
+++ b/templates/card.html
@@ -0,0 +1,14 @@
+<div class="card">
+    <h2>
+        {% block title %}
+        Card Title
+        {% endblock %}
+    </h2>
+
+    <p>
+        {% block content %}
+        Stuff in the card
+        {% endblock %}
+    </p>
+
+</div>
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 72b0892..a98fa29 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -29,7 +29,8 @@
 			student services without creating financial strain. </p>
 
 		<p>
-			I invite you to explore and learn more about the <a href="/#offerings">services we offer</a>, <a href="/about">Carpenter Tutoring's background</a>,
+			I invite you to explore and learn more about the <a href="/#offerings">services we offer</a>, <a
+				href="/about">Carpenter Tutoring's background</a>,
 			and some of <a href="/policies">our policies</a>. Thank you for visiting, and
 			please do not hesitate to reach out with any questions. We will be thrilled to
 			assist you!
@@ -222,7 +223,8 @@
 		<h2>Subject Tutoring</h2>
 		<p>Tutoring for specific courses or disciplines
 		</p>
-		<a class="button" href="#offering-subject-tutoring"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-subject-tutoring"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
@@ -231,13 +233,15 @@
 			Personalized plans for managing academics, extracurriculars, and
 			other commitments
 		</p>
-		<a class="button" href="#offering-time-management"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-time-management"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
 		<h2>Study Skills</h2>
 		<p>Learn how to make the most of your study time</p>
-		<a class="button" href="#offering-study-skills"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-study-skills"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
@@ -246,7 +250,8 @@
 			Time management and study skills blended with continuing
 			accountability
 		</p>
-		<a class="button" href="#offering-academic-coaching"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-academic-coaching"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
@@ -255,19 +260,22 @@
 			Assistance with generating a college list and crafting application
 			essays
 		</p>
-		<a class="button" href="#offering-college-prep"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-college-prep"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
 		<h2>College-Level Writing</h2>
 		<p>Get a head start on meeting professors' expectations</p>
-		<a class="button" href="#offering-college-writing"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-college-writing"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
 		<h2>Dissertation Coaching</h2>
 		<p>Ensure your research is communicated effectively and eloquently</p>
-		<a class="button" href="#offering-dissertation-coaching"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-dissertation-coaching"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
@@ -275,13 +283,15 @@
 		<p>
 			Tailored assistance in preparing for a variety of standardized tests
 		</p>
-		<a class="button" href="#offering-test-prep"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-test-prep"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" />
+			Learn more</a>
 	</div>
 
 	<div class="card">
 		<h2>Music Lessons</h2>
 		<p>Piano and/or composition lessons for students of all ages</p>
-		<a class="button" href="#offering-music-lessons"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-music-lessons"><img src="/assets/icons/dots-horizontal-circle.svg"
+				alt="expand" /> Learn more</a>
 	</div>
 
 	<div class="card">
@@ -291,7 +301,8 @@
 			looking to satisfy Proof of Progress or gain insight into their
 			child's learning
 		</p>
-		<a class="button" href="#offering-evals"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" /> Learn more</a>
+		<a class="button" href="#offering-evals"><img src="/assets/icons/dots-horizontal-circle.svg" alt="expand" />
+			Learn more</a>
 	</div>
 
 </section>
@@ -300,7 +311,8 @@
 <section class="quiet squarshed centered" id="help">
 	<h2>Helpful Links</h2>
 	<a class="button primary centered" href="/brochure">View an interactive brochure of our offerings</a>
-	<a class="button centered" href="/policies">See policies and procedures regarding scheduling, payment, and booking</a>
+	<a class="button centered" href="/policies">See policies and procedures regarding scheduling, payment, and
+		booking</a>
 </section>
 
 <!-- reviews -->
@@ -309,7 +321,10 @@
 	<div class="card">
 		<h2>C.L. Cannon</h2>
 		<blockquote>
-			I hired Amy to complete an end-of-the-year evaluation for both of my Elementary aged sons. This being our first year of independent home instruction, the task of testing and/or evaluation was daunting! Amy put my fears to rest! She was super easy to work with, had great communication skills, and answered all my questions in a timely and informative manner! I would highly recommend her services!
+			I hired Amy to complete an end-of-the-year evaluation for both of my Elementary aged sons. This being our
+			first year of independent home instruction, the task of testing and/or evaluation was daunting! Amy put my
+			fears to rest! She was super easy to work with, had great communication skills, and answered all my
+			questions in a timely and informative manner! I would highly recommend her services!
 		</blockquote>
 		<p>
 			<a href="https://goo.gl/maps/kC4aTuFqpiyLCJ2r8">View on Google</a>
@@ -326,7 +341,8 @@
 	<div class="card">
 		<h2>Lee Crabtree</h2>
 		<blockquote>
-			Amy is a wonderful tutor who helped my child (who does not like help at all) though some difficult classes where the teacher was not providing the support my child needed. Highly recommended.
+			Amy is a wonderful tutor who helped my child (who does not like help at all) though some difficult classes
+			where the teacher was not providing the support my child needed. Highly recommended.
 		</blockquote>
 		<p>
 			<a href="https://goo.gl/maps/73wWvyS7azkBBkA39">View on Google</a>
@@ -343,7 +359,10 @@
 	<div class="card">
 		<h2>Connor Fenton</h2>
 		<blockquote>
-			I was a Graduate student at the College of William and Mary who needed to pass a Latin Language test as part of my degree requirements. I was struggling with refreshing my Latin after a few years out of the classroom and Amy was both professional and helpful. With her tutoring I was able to pass my test and finish my degree. She is very considerate and easy to work with.
+			I was a Graduate student at the College of William and Mary who needed to pass a Latin Language test as part
+			of my degree requirements. I was struggling with refreshing my Latin after a few years out of the classroom
+			and Amy was both professional and helpful. With her tutoring I was able to pass my test and finish my
+			degree. She is very considerate and easy to work with.
 		</blockquote>
 		<p>
 			<a href="https://goo.gl/maps/73wWvyS7azkBBkA39">View on Google</a>
@@ -358,4 +377,4 @@
 	</div>
 
 </section>
-{% endblock %}
+{% endblock %}
\ No newline at end of file
diff --git a/templates/k12.html b/templates/k12.html
new file mode 100644
index 0000000..449b4b6
--- /dev/null
+++ b/templates/k12.html
@@ -0,0 +1,278 @@
+{% extends "base.html" %}
+
+{% block main %}
+
+<section class="quiet">
+    <h1>K-12 Services</h1>
+</section>
+
+<section class="banner">
+
+</section>
+
+<section class="quiet">
+    <h2>See your student thrive with personalized support.</h2>
+</section>
+
+<section id="offerings">
+    <div class="card full">
+        <p>
+            Jump to K-12 Services
+        </p>
+    </div>
+
+    <div class="card">
+        <p>
+            <a href="#offering-academic-coaching">
+                Academic Coaching
+            </a>
+        </p>
+    </div>
+
+    <div class="card">
+        <p>
+            <a href="#offering-application-essay-consulting">
+                Application Essay Consulting
+            </a>
+        </p>
+    </div>
+
+    <div class="card">
+        <p>
+            <a href="#offering-college-transition">
+                College Transition
+            </a>
+        </p>
+    </div>
+
+    <div class="card">
+        <p>
+            <a href="#offering-services-for-homeschoolers">
+                Services for Homeschoolers
+            </a>
+        </p>
+    </div>
+
+    <div class="card">
+        <p>
+            <a href="#offering-standardized-test-prep">
+                Standardized Test Prep
+            </a>
+        </p>
+    </div>
+
+    <div class="card">
+        <p>
+            <a href="#offering-subject-tutoring">
+                Subject Tutoring
+            </a>
+        </p>
+    </div>
+</section>
+
+<section id="offering-academic-coaching" class="quiet">
+    <h2>
+        Academic Coaching
+    </h2>
+
+    <p>
+        Academic Coaching teaches and models the skills students need for success through graduation and beyond. We work
+        together to create and execute realistic plans to handle the responsibilities of each week. Tailored to each
+        student's individual needs, Academic Coaching provides students with a partner in navigating both academic and
+        personal responsibilities with the goal of increasing confidence, autonomy, and self-sufficiency. Topics include
+        but are not limited to
+
+    <ul>
+        <li>Time and stress management</li>
+        <li>Task prioritization</li>
+        <li>Organization</li>
+        <li>Effective studio techniques</li>
+        <li>Note-taking</li>
+        <li>Motivation</li>
+        <li>Procrastination</li>
+        <li>Self-advocacy</li>
+        <li>Communication</li>
+    </ul>
+    </p>
+</section>
+
+<section>
+    <!-- TODO: need to make these bands normal bottom margins-->
+    <!-- TODO: don't use markup for style!-->
+</section>
+
+<section id="offering-application-essay-consulting" class="quiet">
+    <h2>
+        Application Essay Consulting
+    </h2>
+
+    <p>
+        Whether you're applying to competitive high schools or getting ready for college, the essay is an important part
+        of any application. From picking a topic to telling your story to editing a final draft, you have a dedicated
+        and knowledgeable partner. Students remain in control during every stage of the writing process with the added
+        benefits of real-time feedback, guidance, and recommendations. Support for supplemental essays is also
+        available.
+    </p>
+</section>
+
+<section></section>
+
+<section id="offering-college-transition" class="quiet">
+    <h2>
+        College Transition
+    </h2>
+
+    <p>
+        When I worked at colleges, I saw talented students struggle, often because they hadn't solidified the skills
+        they'd need for success in college or hadn't had the opportunity to learn about the resources and services
+        available to them on campus. The College Transition offering provides students the toolkit of techniques and
+        tips they'll need and introduces relevant university services and resources <em>before</em> students arrive for
+        their first semester to ensure a smooth transition to college life.
+    </p>
+</section>
+
+<section></section>
+
+<section id="offering-services-for-homeschoolers" class="quiet">
+    <h2>
+        Services for Homeschoolers
+    </h2>
+
+    <p>
+        Carpenter Tutoring is proud to have service homeschooling communities in Virginia and North Carolina since 2019.
+    </p>
+
+    <p>
+        We offer both supplemental and primary instruction for a range of age levels and subjects. In both cases, we are
+        happy to adapt to your curricular choices. Please see <a href="#offering-subject-tutoring">Subject Tutoring</a>
+        for all subjects in which support is available.
+    </p>
+
+    <p>
+        We also provide two levels of portfolio-based end-of-year Proof of Progress evaluations for families
+        homeschooling in Virginia. <em>Simplified Evaluations</em> consider math and language arts materials and satisfy
+        Virginia requirements with a personalized letter and evaluator credentials to be sent to the school system.
+        <em>Detailed Evaluations</em> include all the elements of Simplified Evaluations plus the option to add subjects
+        beyond math and language arts and a second letter intended for use only by families which identifies areas of
+        strength and weakness in the subjects provided and recommendations for moving forward. Please <a
+            href="/#contact">contact us</a> for more information.
+    </p>
+</section>
+
+<section></section>
+
+<section id="offering-standardized-test-prep" class="quiet">
+    <h2>
+        Standardized Test Prep
+    </h2>
+
+    <p>
+        Individualized support in mastering both the content of and strategies for a number of standardized tests
+        including but not limited to
+    <ul>
+        <li>PSAT</li>
+        <li>SAT</li>
+        <li>ACT</li>
+        <li>SOLs</li>
+        <li>ISEE</li>
+        <li>SSAT</li>
+        <li>GED</li>
+        <li>ASVAB</li>
+    </ul>
+    </p>
+</section>
+
+<section></section>
+
+<section id="offering-subject-tutoring" class="quiet">
+    <h2>
+        Subject Tutoring
+    </h2>
+
+    <p>
+        Support offered for all applicable levels of courses (regular, Honors, AP) unless otherwise noted.
+
+    <aside>* indicates a specialized course for which support is dependent on team availability.</aside>
+    </p>
+
+    <h6>Math</h6>
+    <p>
+    <ul>
+        <li>Elementary Math</li>
+        <li>Intermediate Math</li>
+        <li>Middle School Math</li>
+        <li>Pre-Algebra</li>
+        <li>Algebra I</li>
+        <li>Geometry</li>
+        <li>Algebra, Functions, and Data Analysis</li>
+        <li>Algebra 2</li>
+        <li>Algebra 3/Trigonometry</li>
+        <li>Probability and Statistics</li>
+        <li>Pre-Calculus</li>
+        <li>Calculus*</li>
+        <li>Personal Finance</li>
+    </ul>
+
+    Support may be available for courses beyond those listed. Please <a href="/#contact">contact us</a> for more
+    information.
+    </p>
+
+    <h6>Science</h6>
+    <p>
+    <aside>* High school classes offered at regular level only for content support; studying and organizational support
+        available for higher levels.</aside>
+
+    <ul>
+        <li>Elementary Science</li>
+        <li>Intermediate Science</li>
+        <li>Middle School Science</li>
+        <li>Biology</li>
+        <li>Physics</li>
+        <li>Chemistry</li>
+        <li>Environmental Science</li>
+        <li>Earth Science</li>
+    </ul>
+    </p>
+
+    <h6>Foreign Language</h6>
+    <p>
+    <ul>
+        <li>Latin I</li>
+        <li>Latin II</li>
+        <li>Latin III</li>
+        <li>Latin IV</li>
+        <li>Latin V</li>
+        <li>AP Latin IV</li>
+    </ul>
+
+    Support may be available for courses and languages beyond those listed. Please <a href="/#contact">contact
+        us</a> for more information.
+    </p>
+
+    <h6>Language Arts / English</h6>
+    <p>
+    <ul>
+        <li>Elementary level </li>
+        <li>Intermediate level </li>
+        <li>Middle School level </li>
+        <li>English I or 9</li>
+        <li>English II or 10 </li>
+        <li>English III or 11 </li>
+        <li>English IV or 12 </li>
+        <li>AP Language and Composition </li>
+        <li>AP Literature and Composition </li>
+        <li>Creative Writing </li>
+        <li>General writing / grammar support </li>
+        <li>Editing</li>
+    </ul>
+    </p>
+
+    <h6> Computer Science </h6>
+    <p>
+        Computer science course content and offerings vary widely by school. A professional software engineer is
+        available to discuss support options for specific needs. Please <a href="/#contact">contact us</a> for more
+        information.
+    </p>
+</section>
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/styles.css b/templates/styles.css
index a0d9a80..887766d 100644
--- a/templates/styles.css
+++ b/templates/styles.css
@@ -36,7 +36,7 @@ nav {
 	display: flex;
 	flex-wrap: wrap;
 	background-color: white;
-    position: fixed;
+	position: fixed;
 }
 
 nav img {
@@ -161,6 +161,7 @@ section a {
 	border-radius: 1em;
 	margin-left: 0;
 	margin-right: 0;
+	align-content: center;
 }
 
 form input,
@@ -231,7 +232,14 @@ section.flexible {
 
 #reviews .card,
 #offerings .card {
-	margin: 1em;
+	margin-left: 1em;
+	margin-right: 1em;
+	margin-top: 0.5em;
+	margin-bottom: 0.5em;
+	font-size: 0.7em;
+	padding: 0.3em;
+	flex: 1 0 21%;
+	align-items: center;
 	text-align: center;
 }
 
@@ -244,6 +252,10 @@ section.flexible {
 	justify-content: center;
 }
 
+#offerings .full {
+	flex: 1 1 100%;
+}
+
 .modal {
 	position: fixed;
 	z-index: 1;
@@ -281,4 +293,4 @@ section.flexible {
 .centered {
 	text-align: center;
 	justify-content: center;
-}
+}
\ No newline at end of file