474 lines
21 KiB
HTML
474 lines
21 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Connect | Christ IT Connections</title>
|
|
<meta name="description" content="Secure Remote Support Connection for Christ IT Clients.">
|
|
|
|
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M44 4V60C44 62.2 42.2 64 40 64H32C29.8 64 28 62.2 28 60V24H18C15.8 24 14 22.2 14 20V16C14 13.8 15.8 12 18 12H44Z' fill='%23004e92'/%3E%3Crect x='8' y='36' width='12' height='24' rx='2' fill='%23374151'/%3E%3Ccircle cx='14' cy='24' r='5' fill='%23f59e0b'/%3E%3C/svg%3E" type="image/svg+xml">
|
|
|
|
<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&family=Oswald:wght@500;700&display=swap" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
|
|
|
<style>
|
|
/* --- 1. GLOBAL VARIABLES (MATCHING MAIN SITE) --- */
|
|
:root {
|
|
/* Light Mode */
|
|
--bg-body: #ffffff;
|
|
--bg-offset: #f3f4f6;
|
|
--bg-highlight: #eef2ff;
|
|
--bg-card: #ffffff;
|
|
--bg-nav: rgba(255, 255, 255, 0.95);
|
|
|
|
--text-dark: #1f2937;
|
|
--text-body: #4b5563;
|
|
--text-light: #9ca3af;
|
|
|
|
--primary: #0056b3;
|
|
--primary-dark: #003d6b;
|
|
--accent: #e67e22;
|
|
|
|
--border: #e5e7eb;
|
|
--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
|
|
--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
|
|
|
|
--logo-text: #1f2937;
|
|
}
|
|
|
|
/* Dark Mode */
|
|
[data-theme="dark"] {
|
|
--bg-body: #0f172a;
|
|
--bg-offset: #1e293b;
|
|
--bg-highlight: #172554;
|
|
--bg-card: #1e293b;
|
|
--bg-nav: rgba(15, 23, 42, 0.95);
|
|
|
|
--text-dark: #f8fafc;
|
|
--text-body: #cbd5e1;
|
|
--text-light: #94a3b8;
|
|
|
|
--primary: #3b82f6;
|
|
--primary-dark: #60a5fa;
|
|
|
|
--border: #334155;
|
|
--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
|
|
--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.5);
|
|
|
|
--logo-text: #ffffff;
|
|
}
|
|
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
html { scroll-behavior: smooth; }
|
|
|
|
body {
|
|
background-color: var(--bg-body);
|
|
color: var(--text-body);
|
|
font-family: 'Inter', sans-serif;
|
|
line-height: 1.6;
|
|
min-height: 100vh;
|
|
display: flex; flex-direction: column;
|
|
transition: background-color 0.3s, color 0.3s;
|
|
}
|
|
|
|
h1, h2, h3, h4 {
|
|
font-family: 'Oswald', sans-serif;
|
|
text-transform: uppercase;
|
|
color: var(--text-dark);
|
|
line-height: 1.2;
|
|
}
|
|
|
|
a { text-decoration: none; color: inherit; transition: 0.2s; }
|
|
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; position: relative; }
|
|
|
|
/* --- BUTTONS --- */
|
|
.text-primary { color: var(--primary); }
|
|
.text-accent { color: var(--accent); }
|
|
|
|
.btn {
|
|
display: inline-flex; align-items: center; justify-content: center; gap: 10px;
|
|
padding: 12px 28px;
|
|
font-weight: 600; font-size: 1rem;
|
|
text-transform: uppercase; letter-spacing: 0.5px;
|
|
background-color: var(--primary); color: white;
|
|
border-radius: 4px; border: 2px solid transparent;
|
|
box-shadow: var(--shadow-sm); cursor: pointer;
|
|
width: 100%;
|
|
}
|
|
.btn:hover {
|
|
background-color: var(--primary-dark);
|
|
color: white !important; transform: translateY(-1px);
|
|
box-shadow: var(--shadow-md);
|
|
}
|
|
.btn-outline {
|
|
background-color: transparent; color: var(--text-dark);
|
|
border: 2px solid var(--border);
|
|
}
|
|
.btn-outline:hover {
|
|
background-color: var(--bg-offset);
|
|
border-color: var(--primary);
|
|
}
|
|
|
|
/* --- NAVIGATION --- */
|
|
nav {
|
|
padding: 15px 0; border-bottom: 1px solid var(--border);
|
|
background: var(--bg-nav); backdrop-filter: blur(10px);
|
|
position: sticky; top: 0; z-index: 100;
|
|
}
|
|
.nav-inner { display: flex; justify-content: space-between; align-items: center; }
|
|
|
|
.theme-switch-wrapper {
|
|
display: flex; align-items: center; gap: 10px;
|
|
font-size: 0.85rem; font-weight: 600; color: var(--text-body);
|
|
}
|
|
.theme-switch {
|
|
position: relative; width: 50px; height: 26px;
|
|
background: var(--border); border-radius: 20px;
|
|
cursor: pointer; transition: 0.3s;
|
|
}
|
|
.theme-switch::after {
|
|
content: ""; position: absolute; top: 3px; left: 3px;
|
|
width: 20px; height: 20px; background: white;
|
|
border-radius: 50%; transition: 0.3s;
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.3);
|
|
}
|
|
[data-theme="dark"] .theme-switch { background: var(--primary); }
|
|
[data-theme="dark"] .theme-switch::after { transform: translateX(24px); }
|
|
|
|
/* --- HERO & GRID --- */
|
|
.connect-hero { padding: 60px 0 40px; text-align: center; }
|
|
.connect-hero h1 { font-size: 3rem; margin-bottom: 15px; }
|
|
.connect-hero p {
|
|
max-width: 700px; margin: 0 auto; font-size: 1.1rem;
|
|
background: var(--bg-highlight); padding: 20px; border-radius: 8px;
|
|
border-left: 4px solid var(--accent); text-align: left;
|
|
}
|
|
|
|
.connect-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
|
gap: 30px;
|
|
padding-bottom: 60px;
|
|
}
|
|
|
|
.connect-card {
|
|
background: var(--bg-card); border-radius: 12px; padding: 30px;
|
|
border: 1px solid var(--border); box-shadow: var(--shadow-sm);
|
|
transition: 0.3s; display: flex; flex-direction: column;
|
|
}
|
|
.connect-card:hover { transform: translateY(-5px); border-color: var(--primary); box-shadow: var(--shadow-md); }
|
|
|
|
.card-header { display: flex; align-items: center; gap: 15px; margin-bottom: 20px; border-bottom: 1px solid var(--border); padding-bottom: 15px; }
|
|
.card-header i { font-size: 2rem; color: var(--primary); }
|
|
.card-title h3 { font-size: 1.4rem; margin: 0; }
|
|
.card-title span { font-size: 0.85rem; color: var(--text-light); text-transform: uppercase; letter-spacing: 1px; }
|
|
.card-desc { font-size: 0.95rem; margin-bottom: 25px; flex-grow: 1; }
|
|
|
|
/* --- DETAILED HELP SECTIONS --- */
|
|
.help-toggle {
|
|
text-align: center; margin-top: 20px; font-size: 0.9rem; font-weight: 600;
|
|
color: var(--accent); cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 5px;
|
|
}
|
|
.help-toggle:hover { text-decoration: underline; }
|
|
|
|
.help-content {
|
|
display: none; background: var(--bg-offset); margin-top: 15px;
|
|
padding: 20px; border-radius: 8px; font-size: 0.9rem; border: 1px solid var(--border);
|
|
}
|
|
.help-content ol { padding-left: 20px; margin-bottom: 15px; }
|
|
.help-content li { margin-bottom: 8px; }
|
|
|
|
.help-diagram {
|
|
background: #fff; padding: 10px; border: 1px solid #ddd;
|
|
text-align: center; margin: 10px 0; border-radius: 4px;
|
|
}
|
|
.help-diagram img { max-width: 100%; height: auto; }
|
|
.help-caption { font-size: 0.8rem; color: #666; margin-top: 5px; font-style: italic; }
|
|
|
|
.code-box {
|
|
background: #1e293b; color: #e2e8f0; padding: 15px;
|
|
border-radius: 6px; font-family: monospace; font-size: 0.8rem;
|
|
margin-bottom: 10px; word-break: break-all;
|
|
}
|
|
|
|
/* --- INFO BLOCK (Pricing/Expectations) --- */
|
|
.info-block {
|
|
background: var(--bg-offset);
|
|
padding: 80px 0;
|
|
border-top: 1px solid var(--border);
|
|
}
|
|
.info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
|
|
.info-card {
|
|
background: var(--bg-card); padding: 40px; border-radius: 8px;
|
|
box-shadow: var(--shadow-sm); border-left: 5px solid var(--primary);
|
|
}
|
|
|
|
/* --- FOOTER (MATCHING MAIN SITE) --- */
|
|
footer { padding: 60px 0 30px; background: #0f172a; color: #94a3b8; margin-top: auto; }
|
|
.footer-content { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 40px; }
|
|
.footer-logo { font-family: 'Oswald', sans-serif; font-size: 1.8rem; color: white; margin-bottom: 15px; display: block; }
|
|
.footer-bottom {
|
|
margin-top: 50px; padding-top: 20px; border-top: 1px solid #334155;
|
|
text-align: center; font-size: 0.9rem; color: #64748b;
|
|
}
|
|
|
|
@media (max-width: 900px) { .info-grid { grid-template-columns: 1fr; } }
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<nav>
|
|
<div class="container nav-inner">
|
|
<a href="index.html" class="logo" style="display:flex; align-items:center;">
|
|
<svg height="40" viewBox="0 0 340 80" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<text x="0" y="62" font-family="Montserrat, sans-serif" font-weight="900" font-size="48" fill="var(--logo-text)" letter-spacing="-2">CHRIST</text>
|
|
<g transform="translate(200, 0)">
|
|
<rect x="0" y="32" width="14" height="30" rx="4" fill="var(--logo-text)"/>
|
|
<circle cx="7" cy="18" r="7" fill="#e67e22"/>
|
|
<rect x="35" y="0" width="18" height="62" rx="4" fill="#0056b3"/>
|
|
<rect x="22" y="15" width="44" height="16" rx="4" fill="#0056b3"/>
|
|
</g>
|
|
</svg>
|
|
</a>
|
|
|
|
<div style="display: flex; align-items: center; gap: 20px;">
|
|
<a href="index.html" style="font-weight: 600; font-size: 0.9rem; color: var(--text-dark);">Back to Home</a>
|
|
<div class="theme-switch-wrapper">
|
|
<span>Dark Mode</span>
|
|
<div class="theme-switch" id="theme-toggle"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container connect-hero">
|
|
<h1>Secure <span class="text-primary">Connection</span></h1>
|
|
<p>
|
|
You have been invited to install a remote support agent.
|
|
<strong>Only proceed if you are on the phone with Christ IT.</strong>
|
|
This software allows me to view your screen and control your mouse to resolve technical issues.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="container connect-grid">
|
|
|
|
<div class="connect-card" style="border-top: 4px solid var(--accent);">
|
|
<div class="card-header">
|
|
<i class="fa-solid fa-headset"></i>
|
|
<div class="card-title">
|
|
<h3>Assistant</h3>
|
|
<span>Windows Support Tool</span>
|
|
</div>
|
|
</div>
|
|
<p class="card-desc">
|
|
The best option for one-time help. It does not install a permanent service. It only connects while the app is open.
|
|
</p>
|
|
<a href="#" id="win-assist" class="btn">Download Assistant</a>
|
|
</div>
|
|
|
|
<div class="connect-card">
|
|
<div class="card-header">
|
|
<i class="fa-brands fa-windows"></i>
|
|
<div class="card-title">
|
|
<h3>Windows Agent</h3>
|
|
<span>Unattended Access</span>
|
|
</div>
|
|
</div>
|
|
<p class="card-desc">
|
|
Installs a background service for ongoing management and updates. Best for servers or contract clients.
|
|
</p>
|
|
<a href="#" id="win-64" class="btn btn-outline" style="margin-bottom:10px;">Download 64-bit</a>
|
|
<div style="display:flex; gap:10px;">
|
|
<a href="#" id="win-32" class="btn btn-outline" style="font-size: 0.8rem; padding: 8px;">32-bit</a>
|
|
<a href="#" id="win-arm" class="btn btn-outline" style="font-size: 0.8rem; padding: 8px;">ARM64</a>
|
|
</div>
|
|
|
|
<div class="help-toggle" onclick="toggleHelp('help-smartscreen')">
|
|
<i class="fa-solid fa-circle-question"></i> Blocked by SmartScreen?
|
|
</div>
|
|
<div id="help-smartscreen" class="help-content">
|
|
<p>Windows may try to protect you because this is a custom-built tool. Follow these steps to allow it:</p>
|
|
<ol>
|
|
<li>When the blue window appears, click the <strong>"More Info"</strong> text link.</li>
|
|
|
|
<li>A new button will appear at the bottom. Click <strong>"Run Anyway"</strong>.</li>
|
|
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="connect-card">
|
|
<div class="card-header">
|
|
<i class="fa-brands fa-apple"></i>
|
|
<div class="card-title">
|
|
<h3>macOS</h3>
|
|
<span>Universal Installer</span>
|
|
</div>
|
|
</div>
|
|
<p class="card-desc">
|
|
Compatible with Intel and Apple Silicon (M1/M2/M3) Macs.
|
|
</p>
|
|
<a href="#" id="mac-univ" class="btn btn-outline">Download Installer</a>
|
|
|
|
<div class="help-toggle" onclick="toggleHelp('help-mac')">
|
|
<i class="fa-solid fa-circle-question"></i> "Unidentified Developer"?
|
|
</div>
|
|
<div id="help-mac" class="help-content">
|
|
<p>Apple blocks apps that aren't from the App Store by default. To bypass:</p>
|
|
<ol>
|
|
<li>Locate the downloaded file in your <strong>Downloads</strong> folder.</li>
|
|
<li><strong>Right-Click</strong> (or Control-Click) the file icon.</li>
|
|
<li>Select <strong>Open</strong> from the menu.</li>
|
|
<li>In the pop-up warning, click <strong>Open</strong> again to confirm.</li>
|
|
</ol>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="connect-card">
|
|
<div class="card-header">
|
|
<i class="fa-brands fa-linux"></i>
|
|
<div class="card-title">
|
|
<h3>Linux / BSD</h3>
|
|
<span>Terminal Script</span>
|
|
</div>
|
|
</div>
|
|
<p class="card-desc">Paste this command into your terminal (requires sudo/root).</p>
|
|
<div class="code-box" id="linux-install">Loading...</div>
|
|
<button class="btn btn-outline" onclick="copyLinux()">Copy Command</button>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<section class="info-block">
|
|
<div class="container info-grid">
|
|
|
|
<div class="info-card">
|
|
<h3 style="margin-bottom:15px; font-size: 1.8rem;">Before We Connect</h3>
|
|
<p style="margin-bottom:20px; font-size:1.1rem; line-height:1.6;">
|
|
Please ensure you have spoken with Jason directly before downloading these tools.
|
|
Unsolicited connection requests will be rejected for security.
|
|
</p>
|
|
<ul style="list-style: none; padding: 0;">
|
|
<li style="margin-bottom:10px;"><i class="fa-solid fa-check text-accent" style="margin-right:10px;"></i> <strong>Close Personal Files:</strong> Please close any sensitive banking or personal documents.</li>
|
|
<li style="margin-bottom:10px;"><i class="fa-solid fa-check text-accent" style="margin-right:10px;"></i> <strong>Stay Online:</strong> Do not close the laptop lid or disconnect from Wi-Fi.</li>
|
|
<li><i class="fa-solid fa-check text-accent" style="margin-right:10px;"></i> <strong>I Am Here:</strong> You will be able to see my mouse moving. You can take back control at any time by moving your mouse.</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div style="text-align: center;">
|
|
<h2 style="font-size: 2.5rem; margin-bottom: 10px;">Simple Pricing</h2>
|
|
<div style="font-size: 4rem; font-weight: 700; color: var(--primary); line-height: 1;">$150</div>
|
|
<div style="font-size: 1.2rem; margin-bottom: 25px; color: var(--text-body);">Flat Rate Per Remote Session</div>
|
|
|
|
<p style="max-width: 400px; margin: 0 auto 30px; color: var(--text-body);">
|
|
Includes full diagnostics, virus removal, speed optimization, and software repair.
|
|
<strong>"Whether it takes 5 minutes, 5 hours, or 5 days."</strong>
|
|
</p>
|
|
|
|
<a href="tel:2708898272" class="btn btn-call" style="max-width: 300px; margin: 0 auto; background: var(--text-dark); color:white; border:none;">
|
|
<i class="fa-solid fa-phone"></i> Call (270) 889-8272
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<footer>
|
|
<div class="container">
|
|
<div class="footer-content">
|
|
<div style="max-width: 400px;">
|
|
<a href="index.html" class="footer-logo">CHRIST IT</a>
|
|
<p>Providing secure, independent technology solutions to Clarksville and the region from Nashville to Hopkinsville.</p>
|
|
<p style="margin-top: 15px; color: #9ca3af; font-style: italic;">"Whatever you do, work at it with all your heart..." — Col 3:23</p>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 style="color: white; margin-bottom: 20px;">Contact</h4>
|
|
<p style="margin-bottom: 10px;"><i class="fa-solid fa-envelope text-accent"></i> jason@christit.com</p>
|
|
<p style="margin-bottom: 10px;"><i class="fa-solid fa-phone text-accent"></i> <a href="tel:2708898272" style="text-decoration:none; color:inherit;">(270) 889-8272</a></p>
|
|
<p style="margin-bottom: 10px;"><i class="fa-solid fa-map-pin text-accent"></i> Clarksville, TN</p>
|
|
<p><i class="fa-solid fa-clock text-accent"></i> Mon - Fri: 9:00 AM - 6:00 PM</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer-bottom">
|
|
© 2026 Christ IT Connections. All Rights Reserved.
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
// --- THEME ENGINE ---
|
|
const toggleBtn = document.getElementById('theme-toggle');
|
|
const root = document.documentElement;
|
|
const currentTheme = localStorage.getItem('theme') || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
|
|
|
|
if (currentTheme === 'dark') { root.setAttribute('data-theme', 'dark'); }
|
|
|
|
toggleBtn.addEventListener('click', () => {
|
|
const isDark = root.getAttribute('data-theme') === 'dark';
|
|
if (isDark) {
|
|
root.setAttribute('data-theme', 'light');
|
|
localStorage.setItem('theme', 'light');
|
|
} else {
|
|
root.setAttribute('data-theme', 'dark');
|
|
localStorage.setItem('theme', 'dark');
|
|
}
|
|
});
|
|
|
|
// --- MESH CENTRAL LOGIC ---
|
|
const BASE_URL = "https://mesh.christit.com";
|
|
const MESH_ID = "bh6wZtSrbmuRK0aCLMszdnuXxNmFKkx2T8YtfXWG4PdgHQJj86eij4yCzzWvE@WC6yr0WeZS8q496aFlQxj4zaeeltbchtF9T@8UtLukIpUqV39W8ima8Jsw@F4hztGAEDAvVimpgXr8GFUpw@trsXbxH0NdSg==";
|
|
|
|
function parseUriArgs() {
|
|
var args = {};
|
|
var query = window.location.search.substring(1);
|
|
var vars = query.split("&");
|
|
for (var i = 0; i < vars.length; i++) {
|
|
var pair = vars[i].split("=");
|
|
if (typeof args[pair[0]] === "undefined") {
|
|
args[pair[0]] = decodeURIComponent(pair[1]);
|
|
}
|
|
}
|
|
return args;
|
|
}
|
|
|
|
var urlargs = parseUriArgs();
|
|
var keyStr = (urlargs.key) ? ('&key=' + urlargs.key) : "";
|
|
|
|
function buildUrl(id, flags, extra) {
|
|
return `${BASE_URL}/meshagents?id=${id}&meshid=${MESH_ID}&installflags=${flags||0}${keyStr}${extra||''}`;
|
|
}
|
|
|
|
// Apply Links
|
|
document.getElementById('win-assist').href = buildUrl(10006, 0, '&ac=0');
|
|
document.getElementById('win-64').href = buildUrl(4);
|
|
document.getElementById('win-32').href = buildUrl(3);
|
|
document.getElementById('win-arm').href = buildUrl(43);
|
|
document.getElementById('mac-univ').href = `${BASE_URL}/meshosxagent?id=10005&meshid=${MESH_ID}${keyStr}`;
|
|
|
|
// Linux Logic
|
|
const meshid_safe = MESH_ID;
|
|
const linuxInst = `(wget "${BASE_URL}/meshagents?script=1${keyStr}" --no-check-certificate -O ./meshinstall.sh || wget "${BASE_URL}/meshagents?script=1${keyStr}" --no-proxy --no-check-certificate -O ./meshinstall.sh) && chmod 755 ./meshinstall.sh && sudo -E ./meshinstall.sh ${BASE_URL} '${meshid_safe}'`;
|
|
document.getElementById('linux-install').innerText = linuxInst;
|
|
|
|
// UI Functions
|
|
function toggleHelp(id) {
|
|
const el = document.getElementById(id);
|
|
el.style.display = (el.style.display === 'block') ? 'none' : 'block';
|
|
}
|
|
|
|
function copyLinux() {
|
|
navigator.clipboard.writeText(linuxInst).then(() => {
|
|
alert("Command copied!");
|
|
});
|
|
}
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|