<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FCSO | Instructor's Guide</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&display=swap" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
<style>
body {
font-family: 'Inter', sans-serif;
scroll-behavior: smooth;
}
.hero-bg {
background-image: linear-gradient(rgba(18, 28, 48, 0.8), rgba(18, 28, 48, 0.8)), url('https://placehold.co/1920x1080/1a202c/ffffff?text=TRAINING+DIVISION');
background-size: cover;
background-position: center;
background-attachment: fixed;
}
.section-title {
border-bottom: 3px solid #065f46; /* A deep green for a professional look */
padding-bottom: 10px;
display: inline-block;
}
.card-hover {
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card-hover:hover {
transform: translateY(-5px);
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
</style>
</head>
<body class="bg-gray-200 text-gray-900">
<!-- Header & Navigation -->
<header class="bg-white shadow-lg sticky top-0 z-50">
<nav class="container mx-auto px-6 py-4 flex justify-between items-center">
<div class="flex items-center space-x-4">
<img src="https://sheriff.franklincountyohio.gov/themes/custom/fcsotheme/logo.svg" alt="FCSO Logo" class="h-12 w-12" onerror="this.onerror=null;this.src='https://placehold.co/48x48/cccccc/000000?text=FCSO';">
<div>
<span class="text-xl font-bold text-gray-800 block">Franklin County Sheriff's Office</span>
<span class="text-sm text-gray-500">Training & Education Division | Instructor Guide</span>
</div>
</div>
<div class="hidden md:flex items-center space-x-6">
<a href="#mission" class="text-gray-600 hover:text-green-700 font-medium">Mission</a>
<a href="#policies" class="text-gray-600 hover:text-green-700 font-medium">Policies</a>
<a href="#procedures" class="text-gray-600 hover:text-green-700 font-medium">Procedures</a>
<a href="#instructors" class="text-gray-600 hover:text-green-700 font-medium">Instructors</a>
<a href="#resources" class="bg-green-700 text-white font-bold py-2 px-4 rounded-lg hover:bg-green-800 transition-colors">Resource Hub</a>
</div>
<div class="md:hidden">
<button id="mobile-menu-button" class="text-gray-600 focus:outline-none">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16m-7 6h7"></path></svg>
</button>
</div>
</nav>
<div id="mobile-menu" class="hidden md:hidden px-4 pt-2 pb-3 space-y-1">
<a href="#mission" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-white hover:bg-green-700">Mission</a>
<a href="#policies" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-white hover:bg-green-700">Policies</a>
<a href="#procedures" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-white hover:bg-green-700">Procedures</a>
<a href="#instructors" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-white hover:bg-green-700">Instructors</a>
<a href="#resources" class="block px-3 py-2 rounded-md text-base font-medium text-white bg-green-700">Resource Hub</a>
</div>
</header>
<!-- Main Content -->
<main>
<!-- Hero Section -->
<section class="hero-bg text-white py-24 md:py-40">
<div class="container mx-auto px-6 text-center">
<h1 class="text-4xl md:text-6xl font-black uppercase tracking-widest">Ultimate Instructor's Guide</h1>
<p class="text-lg md:text-2xl mt-4 font-light">The Official Operating Procedures and Resource Manual</p>
</div>
</section>
<!-- Section 1: Mission & Command -->
<section id="mission" class="py-20 bg-white">
<div class="container mx-auto px-6">
<h2 class="text-4xl font-bold text-center mb-12 section-title">Division Information</h2>
<div class="grid md:grid-cols-2 gap-12">
<div class="bg-gray-50 p-8 rounded-lg shadow-md border-l-4 border-green-700">
<h3 class="text-2xl font-bold mb-4">1.1 | Mission Statement</h3>
<p class="text-gray-700 leading-relaxed">The Training & Education Division is dedicated to preparing Cadets for duty through comprehensive training, mentorship, and guidance. We foster professional development and ensure readiness through a structured training phase. Our Field Training Program certifies Probationary Deputies for real-world operations, ensuring they face challenges with integrity and competence, guided by certified field trainers.</p>
</div>
<div class="bg-gray-50 p-8 rounded-lg shadow-md border-l-4 border-green-700">
<h3 class="text-2xl font-bold mb-4">1.2 | Chain of Command</h3>
<ul class="space-y-3">
<li><strong>Training & Education Commander:</strong> Major Dean Wilcox</li>
<li><strong>Field Training Officer Lead:</strong> Lieutenant (Vacant)</li>
<li><strong>Training & Education Unit:</strong> Sergeant (Vacant)</li>
<li><strong>Training & Education Unit:</strong> Sergeant (Vacant)</li>
</ul>
<p class="mt-4 text-sm text-gray-600">All concerns or requests must be directed through the proper channels.</p>
</div>
</div>
<div class="mt-12 bg-red-100 border-l-4 border-red-500 text-red-700 p-6 rounded-lg shadow-lg">
<h3 class="text-2xl font-bold mb-3">1.3 | Punishments & Appeals</h3>
<p class="mb-4">Failure to comply with division policies will result in disciplinary action, ranging from a Verbal/Written Warning to Suspension or Removal from the Division. Punishments are at the discretion of divisional administration.</p>
<div class="bg-red-200 p-4 rounded-lg">
<p class="font-black text-center text-lg uppercase"><i class="fas fa-exclamation-triangle mr-2"></i>Warning: Leaking any official documents will result in immediate termination with no appeal.</p>
</div>
</div>
</div>
</section>
<!-- Section 2: Policies and Guidelines -->
<section id="policies" class="py-20">
<div class="container mx-auto px-6">
<h2 class="text-4xl font-bold text-center mb-16 section-title">Policies & Guidelines</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<!-- Conduct -->
<div class="bg-white p-6 rounded-lg shadow-lg card-hover">
<h3 class="font-bold text-xl mb-3"><i class="fas fa-gavel mr-2 text-green-700"></i>2.1 | Conduct</h3>
<p>Demonstrate respect, professionalism, and dedication at all times. Misconduct will result in disciplinary action.</p>
</div>
<!-- Discord -->
<div class="bg-white p-6 rounded-lg shadow-lg card-hover">
<h3 class="font-bold text-xl mb-3"><i class="fab fa-discord mr-2 text-green-700"></i>2.2 | Discord</h3>
<p>All communication must be professional. Use appropriate channels and adhere to all server rules without exception.</p>
</div>
<!-- Uniform -->
<div class="bg-white p-6 rounded-lg shadow-lg card-hover">
<h3 class="font-bold text-xl mb-3"><i class="fas fa-tshirt mr-2 text-green-700"></i>2.3 | Uniform</h3>
<p>All instructors and trainees must wear designated training uniforms. New instructors must complete an intake process.</p>
</div>
<!-- Vehicle Usage -->
<div class="bg-white p-6 rounded-lg shadow-lg card-hover">
<h3 class="font-bold text-xl mb-3"><i class="fas fa-car mr-2 text-green-700"></i>2.4 | Vehicle Usage</h3>
<p>Use only marked training vehicles unless specific approval is granted by the Division Commander.</p>
</div>
<!-- Communication -->
<div class="bg-white p-6 rounded-lg shadow-lg card-hover">
<h3 class="font-bold text-xl mb-3"><i class="fas fa-headset mr-2 text-green-700"></i>2.5 | Communication</h3>
<p>Radio traffic must be clear, concise, and professional. Adhere to all RTO policies. No profanity or rambling.</p>
</div>
<!-- RTO Policy -->
<div class="bg-white p-6 rounded-lg shadow-lg card-hover">
<h3 class="font-bold text-xl mb-3"><i class="fas fa-broadcast-tower mr-2 text-green-700"></i>2.6 | RTO Policy</h3>
<p>Do not cut off transmissions. Keep statements clear and to the point. Ensure callsigns match Discord/FiveM.</p>
</div>
</div>
</div>
</section>
<!-- Section 3: Training Procedures -->
<section id="procedures" class="py-20 bg-white">
<div class="container mx-auto px-6">
<h2 class="text-4xl font-bold text-center mb-16 section-title">Field Training Procedures</h2>
<div class="grid md:grid-cols-2 gap-12">
<!-- Phase I -->
<div class="bg-gray-50 p-8 rounded-lg shadow-md">
<h3 class="text-2xl font-bold mb-4">3.1 | Phase I: Observation & Minor Involvement</h3>
<p class="mb-4"><strong>Duration:</strong> 1 hour 30 minutes</p>
<p class="mb-4"><strong>Purpose:</strong> To allow the Probationary Deputy to observe real-time scenarios, ask questions, and gain a feel for the environment.</p>
<h4 class="font-semibold mb-2">Activities Include:</h4>
<ul class="list-disc list-inside text-gray-700 space-y-1">
<li>Ridealongs & shadowing the FTO</li>
<li>Minor callout participation</li>
<li>Introduction to report writing & traffic stops</li>
</ul>
</div>
<!-- Phase II -->
<div class="bg-gray-50 p-8 rounded-lg shadow-md">
<h3 class="text-2xl font-bold mb-4">3.2 | Phase II: Full Involvement</h3>
<p class="mb-4"><strong>Duration:</strong> Until competency is demonstrated (approx. 1.5 hours)</p>
<p class="mb-4"><strong>Purpose:</strong> The trainee handles all duties independently under direct FTO supervision. FTOs must ensure reports meet department standards.</p>
<h4 class="font-semibold mb-2">Activities Include:</h4>
<ul class="list-disc list-inside text-gray-700 space-y-1">
<li>Primary on callouts & driving</li>
<li>Independent report writing</li>
<li>Community engagement</li>
</ul>
</div>
</div>
<div class="mt-12 text-center bg-gray-100 p-8 rounded-lg shadow-inner">
<h3 class="text-2xl font-bold mb-4">3.3 & 3.4 | Evaluation & Remediation</h3>
<p class="max-w-3xl mx-auto leading-relaxed">FTOs must provide structured feedback after every session. If a trainee fails Phase II, they must undergo remediation focusing on weak areas. All progress and reassessments must be documented.</p>
</div>
</div>
</section>
<!-- Cadet Examination Standards -->
<section class="py-20">
<div class="container mx-auto px-6">
<h2 class="text-4xl font-bold text-center mb-16 section-title">Cadet Examination Standards</h2>
<div class="bg-white p-10 rounded-lg shadow-xl max-w-4xl mx-auto">
<h3 class="text-2xl font-bold text-center mb-6">For Instructor Reference Only</h3>
<div class="grid md:grid-cols-2 gap-8 text-center">
<div>
<p class="text-6xl font-black text-green-700">28</p>
<p class="text-xl font-semibold">Total Points</p>
</div>
<div>
<p class="text-6xl font-black text-green-700">21</p>
<p class="text-xl font-semibold">Passing Score (75%)</p>
</div>
</div>
<div class="mt-8 border-t pt-8">
<h4 class="font-bold text-lg mb-4 text-center">Breakdown:</h4>
<ul class="space-y-2">
<li><i class="fas fa-check-circle text-green-600 mr-2"></i><strong>18 Multiple Choice Questions:</strong> 1 point each (18 total)</li>
<li><i class="fas fa-check-circle text-green-600 mr-2"></i><strong>5 Short Answer Questions:</strong> Graded out of 3 points each (15 total) on Grammar, Detail, and Understanding.</li>
</ul>
<p class="mt-4 text-sm text-center font-semibold text-red-600 uppercase">Remember: One retake is permitted. AI usage is grounds for termination.</p>
</div>
</div>
</div>
</section>
<!-- Section 4: Instructors -->
<section id="instructors" class="py-20 bg-white">
<div class="container mx-auto px-6">
<h2 class="text-4xl font-bold text-center mb-16 section-title">Division Instructors</h2>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8">
<!-- Dean W. -->
<div class="text-center">
<img class="w-32 h-32 mx-auto rounded-full shadow-lg border-4 border-green-700" src="https://placehold.co/128x128/e2e8f0/333333?text=DW" alt="Dean W.">
<h4 class="mt-4 text-xl font-bold">Major Dean W.</h4>
<p class="text-gray-600">Commander</p>
</div>
<!-- Derek S. -->
<div class="text-center">
<img class="w-32 h-32 mx-auto rounded-full shadow-lg" src="https://placehold.co/128x128/e2e8f0/333333?text=DS" alt="Derek S.">
<h4 class="mt-4 text-xl font-bold">Derek S.</h4>
<p class="text-gray-600">Instructor</p>
</div>
<!-- E. Bishara -->
<div class="text-center">
<img class="w-32 h-32 mx-auto rounded-full shadow-lg" src="https://placehold.co/128x128/e2e8f0/333333?text=EB" alt="E. Bishara">
<h4 class="mt-4 text-xl font-bold">E. Bishara</h4>
<p class="text-gray-600">Instructor</p>
</div>
<!-- Midnight -->
<div class="text-center">
<img class="w-32 h-32 mx-auto rounded-full shadow-lg" src="https://placehold.co/128x128/e2e8f0/333333?text=M" alt="Midnight">
<h4 class="mt-4 text-xl font-bold">Midnight</h4>
<p class="text-gray-600">Instructor</p>
</div>
<!-- Paul R. -->
<div class="text-center">
<img class="w-32 h-32 mx-auto rounded-full shadow-lg" src="https://placehold.co/128x128/e2e8f0/333333?text=PR" alt="Paul R.">
<h4 class="mt-4 text-xl font-bold">Paul R.</h4>
<p class="text-gray-600">Instructor</p>
</div>
<!-- Rock T. -->
<div class="text-center">
<img class="w-32 h-32 mx-auto rounded-full shadow-lg" src="https://placehold.co/128x128/e2e8f0/333333?text=RT" alt="Rock T.">
<h4 class="mt-4 text-xl font-bold">Rock T.</h4>
<p class="text-gray-600">Instructor</p>
</div>
<!-- W. Miller -->
<div class="text-center">
<img class="w-32 h-32 mx-auto rounded-full shadow-lg" src="https://placehold.co/128x128/e2e8f0/333333?text=WM" alt="W. Miller">
<h4 class="mt-4 text-xl font-bold">W. Miller</h4>
<p class="text-gray-600">Instructor</p>
</div>
</div>
</div>
</section>
<!-- Instructor Resource Hub -->
<section id="resources" class="py-20">
<div class="container mx-auto px-6">
<h2 class="text-4xl font-bold text-center mb-16 section-title">Instructor Resource Hub</h2>
<div class="max-w-4xl mx-auto grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<a href="https://trello.com/b/wSxhxOqP/upcoming-trainings-board" target="_blank" class="bg-white p-6 rounded-lg shadow-lg text-center card-hover">
<i class="fas fa-calendar-alt text-4xl text-green-700 mb-3"></i>
<h4 class="font-bold text-lg">Upcoming Trainings</h4>
</a>
<a href="https://trello.com/b/xhG8BJkC/new-recruits-swornin-board" target="_blank" class="bg-white p-6 rounded-lg shadow-lg text-center card-hover">
<i class="fas fa-user-plus text-4xl text-green-700 mb-3"></i>
<h4 class="font-bold text-lg">New Recruits</h4>
</a>
<a href="https://trello.com/b/HiO5MXUB/trainer-roster" target="_blank" class="bg-white p-6 rounded-lg shadow-lg text-center card-hover">
<i class="fas fa-users text-4xl text-green-700 mb-3"></i>
<h4 class="font-bold text-lg">Trainer Roster</h4>
</a>
<a href="https://docs.google.com/document/d/1FcjolOIqAutQl85cXYe0WO71eTXbvp2YdGan1p8hvUk/edit?tab=t.0" target="_blank" class="bg-white p-6 rounded-lg shadow-lg text-center card-hover">
<i class="fas fa-paste text-4xl text-green-700 mb-3"></i>
<h4 class="font-bold text-lg">Copy/Paste Guide</h4>
</a>
<a href="https://docs.google.com/document/d/1J4piNgMHTG80KqX67g4mg1zw3fBEBgdqCm34thPZOsw/edit?tab=t.0" target="_blank" class="bg-white p-6 rounded-lg shadow-lg text-center card-hover">
<i class="fas fa-file-alt text-4xl text-green-700 mb-3"></i>
<h4 class="font-bold text-lg">After Training Report</h4>
</a>
<a href="https://docs.google.com/spreadsheets/d/1BucPibYAFHU4dMioVsgFtiXkVXy7V8GBkiWHpkslqfk/edit?gid=0#gid=0" target="_blank" class="bg-white p-6 rounded-lg shadow-lg text-center card-hover">
<i class="fas fa-clipboard-list text-4xl text-green-700 mb-3"></i>
<h4 class="font-bold text-lg">Attendance Sheet</h4>
</a>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer class="bg-gray-900 text-white py-8">
<div class="container mx-auto px-6 text-center">
<p>© 2025 Franklin County Sheriff's Office | All Rights Reserved</p>
<p class="text-sm text-gray-400 mt-2">This is an internal resource for authorized Training & Education Division personnel only.</p>
<p class="text-xs text-gray-500 mt-1">Last Edited: 05/07/2025 by Dean Wilcox</p>
</div>
</footer>
<script>
// Mobile menu toggle
const mobileMenuButton = document.getElementById('mobile-menu-button');
const mobileMenu = document.getElementById('mobile-menu');
const navLinks = document.querySelectorAll('#mobile-menu a');
mobileMenuButton.addEventListener('click', () => {
mobileMenu.classList.toggle('hidden');
});
navLinks.forEach(link => {
link.addEventListener('click', () => {
mobileMenu.classList.add('hidden');
});
});
</script>
</body>
</html>