Spaces:
Running
Running
File size: 28,171 Bytes
49c2719 | 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 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>The Evolution of Logistics: A Historical Perspective</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
.timeline {
position: relative;
max-width: 1200px;
margin: 0 auto;
}
.timeline::after {
content: '';
position: absolute;
width: 6px;
background-color: #3b82f6;
top: 0;
bottom: 0;
left: 50%;
margin-left: -3px;
}
.timeline-container {
padding: 10px 40px;
position: relative;
background-color: inherit;
width: 50%;
}
.timeline-container::after {
content: '';
position: absolute;
width: 25px;
height: 25px;
right: -17px;
background-color: white;
border: 4px solid #3b82f6;
top: 15px;
border-radius: 50%;
z-index: 1;
}
.left {
left: 0;
}
.right {
left: 50%;
}
.left::before {
content: " ";
height: 0;
position: absolute;
top: 22px;
width: 0;
z-index: 1;
right: 30px;
border: medium solid white;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent white;
}
.right::before {
content: " ";
height: 0;
position: absolute;
top: 22px;
width: 0;
z-index: 1;
left: 30px;
border: medium solid white;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
}
.right::after {
left: -16px;
}
@media screen and (max-width: 600px) {
.timeline::after {
left: 31px;
}
.timeline-container {
width: 100%;
padding-left: 70px;
padding-right: 25px;
}
.timeline-container::before {
left: 60px;
border: medium solid white;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
}
.left::after, .right::after {
left: 15px;
}
.right {
left: 0%;
}
}
.chart-container {
position: relative;
height: 300px;
width: 100%;
}
.infographic {
background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
border-radius: 12px;
padding: 20px;
margin: 20px 0;
}
.footnote {
font-size: 0.8em;
color: #64748b;
vertical-align: super;
}
.citation {
background-color: #f8fafc;
padding: 15px;
border-left: 4px solid #3b82f6;
margin: 15px 0;
}
</style>
</head>
<body class="bg-gray-50">
<div class="max-w-6xl mx-auto px-4 py-8">
<header class="text-center mb-12">
<h1 class="text-4xl font-bold text-blue-800 mb-4">The Evolution of Logistics: A Historical Perspective</h1>
<p class="text-xl text-gray-600">From ancient trade routes to modern supply chains</p>
<div class="mt-6 flex justify-center">
<div class="w-full max-w-2xl h-1 bg-gradient-to-r from-blue-500 to-blue-300 rounded-full"></div>
</div>
</header>
<div class="flex items-center mb-8">
<div class="flex-1">
<p class="text-gray-700 leading-relaxed">
Logistics, derived from the Greek word "logistikos" meaning "skilled in calculating," has been a cornerstone of human civilization since ancient times. This article traces the fascinating journey of logistics from its primitive beginnings to the sophisticated global networks we see today.
</p>
</div>
<div class="ml-8 w-64 hidden md:block">
<img src="https://images.unsplash.com/photo-1601493700631-2b16ec4b4716?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=500&q=80" alt="Ancient trade routes" class="rounded-lg shadow-lg">
</div>
</div>
<section class="mb-16">
<h2 class="text-3xl font-semibold text-blue-700 mb-6 border-b pb-2">Ancient Logistics (3000 BCE - 500 CE)</h2>
<div class="timeline">
<div class="timeline-container left">
<div class="bg-white p-6 rounded-lg shadow-md">
<h3 class="text-xl font-semibold mb-2">3000 BCE: The First Organized Logistics</h3>
<p class="text-gray-700">Ancient Mesopotamians developed the first organized systems for transporting goods along the Tigris and Euphrates rivers using reed boats.<sup>1</sup></p>
</div>
</div>
<div class="timeline-container right">
<div class="bg-white p-6 rounded-lg shadow-md">
<h3 class="text-xl font-semibold mb-2">2500 BCE: Egyptian Pyramid Construction</h3>
<p class="text-gray-700">The construction of pyramids demonstrated sophisticated logistics in moving massive stone blocks using sledges, ramps, and human labor coordination.<sup>2</sup></p>
</div>
</div>
<div class="timeline-container left">
<div class="bg-white p-6 rounded-lg shadow-md">
<h3 class="text-xl font-semibold mb-2">200 BCE: Silk Road Establishment</h3>
<p class="text-gray-700">The Silk Road connected China to the Mediterranean, spanning 4,000 miles and facilitating trade of silk, spices, and other goods.<sup>3</sup></p>
</div>
</div>
<div class="timeline-container right">
<div class="bg-white p-6 rounded-lg shadow-md">
<h3 class="text-xl font-semibold mb-2">100 CE: Roman Road Network</h3>
<p class="text-gray-700">The Romans built over 250,000 miles of roads, enabling efficient military and trade logistics across their empire.<sup>4</sup></p>
</div>
</div>
</div>
<div class="mt-8 grid md:grid-cols-2 gap-8">
<div class="infographic">
<h3 class="text-xl font-semibold mb-4 text-blue-700 flex items-center">
<i class="fas fa-road mr-2"></i> Silk Road Trade Volume
</h3>
<div class="chart-container">
<canvas id="silkRoadChart"></canvas>
</div>
<p class="text-sm text-gray-600 mt-2">Estimated annual trade volume along the Silk Road (1st century CE)</p>
</div>
<div class="bg-white p-6 rounded-lg shadow-md">
<h3 class="text-xl font-semibold mb-4 text-blue-700 flex items-center">
<i class="fas fa-ship mr-2"></i> Key Ancient Trade Routes
</h3>
<ul class="space-y-3">
<li class="flex items-start">
<span class="bg-blue-100 text-blue-800 rounded-full w-6 h-6 flex items-center justify-center mr-3">1</span>
<span>Silk Road (China to Mediterranean)</span>
</li>
<li class="flex items-start">
<span class="bg-blue-100 text-blue-800 rounded-full w-6 h-6 flex items-center justify-center mr-3">2</span>
<span>Incense Route (Arabia to Mediterranean)</span>
</li>
<li class="flex items-start">
<span class="bg-blue-100 text-blue-800 rounded-full w-6 h-6 flex items-center justify-center mr-3">3</span>
<span>Amber Road (Baltic to Mediterranean)</span>
</li>
<li class="flex items-start">
<span class="bg-blue-100 text-blue-800 rounded-full w-6 h-6 flex items-center justify-center mr-3">4</span>
<span>Trans-Saharan Trade Routes</span>
</li>
</ul>
</div>
</div>
</section>
<section class="mb-16">
<h2 class="text-3xl font-semibold text-blue-700 mb-6 border-b pb-2">Medieval to Industrial Revolution (500 - 1800)</h2>
<div class="grid md:grid-cols-3 gap-6 mb-8">
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="text-blue-600 text-3xl mb-3">
<i class="fas fa-anchor"></i>
</div>
<h3 class="text-xl font-semibold mb-2">Age of Exploration</h3>
<p class="text-gray-700">15th-17th centuries saw maritime logistics advancements with larger ships and navigation tools enabling global trade.<sup>5</sup></p>
</div>
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="text-blue-600 text-3xl mb-3">
<i class="fas fa-warehouse"></i>
</div>
<h3 class="text-xl font-semibold mb-2">Warehousing Systems</h3>
<p class="text-gray-700">Medieval guilds developed early warehousing systems to store goods for seasonal trade fairs.<sup>6</sup></p>
</div>
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="text-blue-600 text-3xl mb-3">
<i class="fas fa-train"></i>
</div>
<h3 class="text-xl font-semibold mb-2">Industrial Revolution</h3>
<p class="text-gray-700">18th century brought steam power, railways, and mechanization that revolutionized transportation and manufacturing logistics.<sup>7</sup></p>
</div>
</div>
<div class="infographic">
<h3 class="text-xl font-semibold mb-4 text-blue-700">Shipping Technology Evolution</h3>
<div class="flex flex-wrap justify-between items-end h-64 mt-8">
<div class="w-16 text-center">
<div class="bg-blue-200 h-12 rounded-t-lg"></div>
<p class="text-xs mt-1">Reed Boats<br>(3000 BCE)</p>
</div>
<div class="w-16 text-center">
<div class="bg-blue-300 h-20 rounded-t-lg"></div>
<p class="text-xs mt-1">Triremes<br>(500 BCE)</p>
</div>
<div class="w-16 text-center">
<div class="bg-blue-400 h-28 rounded-t-lg"></div>
<p class="text-xs mt-1">Cogs<br>(1200 CE)</p>
</div>
<div class="w-16 text-center">
<div class="bg-blue-500 h-36 rounded-t-lg"></div>
<p class="text-xs mt-1">Caravels<br>(1450)</p>
</div>
<div class="w-16 text-center">
<div class="bg-blue-600 h-48 rounded-t-lg"></div>
<p class="text-xs mt-1">Clippers<br>(1840)</p>
</div>
<div class="w-16 text-center">
<div class="bg-blue-700 h-56 rounded-t-lg"></div>
<p class="text-xs mt-1">Steamships<br>(1880)</p>
</div>
<div class="w-16 text-center">
<div class="bg-blue-800 h-64 rounded-t-lg"></div>
<p class="text-xs mt-1">Container Ships<br>(1956)</p>
</div>
</div>
</div>
</section>
<section class="mb-16">
<h2 class="text-3xl font-semibold text-blue-700 mb-6 border-b pb-2">Modern Logistics (1900 - Present)</h2>
<div class="mb-8 bg-white rounded-lg shadow-md overflow-hidden">
<div class="md:flex">
<div class="md:w-1/3 bg-blue-800 text-white p-6 flex flex-col justify-center">
<h3 class="text-2xl font-bold mb-4">Key 20th Century Innovations</h3>
<ul class="space-y-3">
<li class="flex items-center">
<i class="fas fa-check-circle mr-2 text-blue-300"></i>
<span>Standardized shipping containers (1956)</span>
</li>
<li class="flex items-center">
<i class="fas fa-check-circle mr-2 text-blue-300"></i>
<span>Computerized inventory systems (1960s)</span>
</li>
<li class="flex items-center">
<i class="fas fa-check-circle mr-2 text-blue-300"></i>
<span>Just-in-time manufacturing (1970s)</span>
</li>
<li class="flex items-center">
<i class="fas fa-check-circle mr-2 text-blue-300"></i>
<span>Global positioning systems (1990s)</span>
</li>
</ul>
</div>
<div class="md:w-2/3 p-6">
<h3 class="text-xl font-semibold mb-4">Containerization Revolution</h3>
<p class="text-gray-700 mb-4">Malcolm McLean's invention of standardized shipping containers in 1956 reduced cargo handling costs by 90% and revolutionized global trade.<sup>8</sup> Today, over 90% of non-bulk cargo moves in containers.</p>
<div class="chart-container">
<canvas id="containerizationChart"></canvas>
</div>
</div>
</div>
</div>
<div class="grid md:grid-cols-2 gap-8">
<div>
<h3 class="text-xl font-semibold mb-4 text-blue-700">21st Century Digital Transformation</h3>
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="flex items-start mb-4">
<div class="bg-blue-100 p-3 rounded-full mr-4">
<i class="fas fa-robot text-blue-600 text-xl"></i>
</div>
<div>
<h4 class="font-semibold">Automation & Robotics</h4>
<p class="text-gray-700 text-sm">Automated warehouses and robotic picking systems increase efficiency by up to 800% compared to manual operations.<sup>9</sup></p>
</div>
</div>
<div class="flex items-start mb-4">
<div class="bg-blue-100 p-3 rounded-full mr-4">
<i class="fas fa-brain text-blue-600 text-xl"></i>
</div>
<div>
<h4 class="font-semibold">AI & Machine Learning</h4>
<p class="text-gray-700 text-sm">Predictive analytics optimize routes and inventory levels, reducing costs by 15-30% in supply chains.<sup>10</sup></p>
</div>
</div>
<div class="flex items-start">
<div class="bg-blue-100 p-3 rounded-full mr-4">
<i class="fas fa-link text-blue-600 text-xl"></i>
</div>
<div>
<h4 class="font-semibold">Blockchain Technology</h4>
<p class="text-gray-700 text-sm">Provides transparent, tamper-proof records across complex supply networks, reducing fraud and errors.<sup>11</sup></p>
</div>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold mb-4 text-blue-700">Global Logistics Market Growth</h3>
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="chart-container">
<canvas id="marketGrowthChart"></canvas>
</div>
<p class="text-sm text-gray-600 mt-2">Projected compound annual growth rate (CAGR) of 6.5% from 2023-2030.<sup>12</sup></p>
</div>
</div>
</div>
</section>
<section class="mb-16">
<h2 class="text-3xl font-semibold text-blue-700 mb-6 border-b pb-2">Future Trends</h2>
<div class="grid md:grid-cols-3 gap-6">
<div class="bg-gradient-to-br from-blue-50 to-blue-100 p-6 rounded-lg border border-blue-200">
<h3 class="text-xl font-semibold mb-3 text-blue-800">Autonomous Vehicles</h3>
<p class="text-gray-700 mb-4">Self-driving trucks expected to reduce long-haul shipping costs by 45% while improving safety.<sup>13</sup></p>
<div class="text-blue-600 text-right text-4xl">
<i class="fas fa-truck-moving"></i>
</div>
</div>
<div class="bg-gradient-to-br from-blue-50 to-blue-100 p-6 rounded-lg border border-blue-200">
<h3 class="text-xl font-semibold mb-3 text-blue-800">Drone Delivery</h3>
<p class="text-gray-700 mb-4">Last-mile drone delivery could reduce costs by 50% for small packages in rural areas.<sup>14</sup></p>
<div class="text-blue-600 text-right text-4xl">
<i class="fas fa-drone-alt"></i>
</div>
</div>
<div class="bg-gradient-to-br from-blue-50 to-blue-100 p-6 rounded-lg border border-blue-200">
<h3 class="text-xl font-semibold mb-3 text-blue-800">Hyperloop & Maglev</h3>
<p class="text-gray-700 mb-4">High-speed cargo systems could move goods at 600+ mph with minimal energy.<sup>15</sup></p>
<div class="text-blue-600 text-right text-4xl">
<i class="fas fa-train"></i>
</div>
</div>
</div>
<div class="mt-8 bg-white p-6 rounded-lg shadow-md">
<h3 class="text-xl font-semibold mb-4 text-blue-700">Sustainability in Logistics</h3>
<div class="grid md:grid-cols-3 gap-6">
<div class="text-center">
<div class="bg-green-100 p-4 rounded-full inline-block mb-3">
<i class="fas fa-leaf text-green-600 text-3xl"></i>
</div>
<h4 class="font-semibold">Green Fleet</h4>
<p class="text-gray-700 text-sm">Electric and hydrogen-powered vehicles reducing carbon emissions by 30-50%.<sup>16</sup></p>
</div>
<div class="text-center">
<div class="bg-green-100 p-4 rounded-full inline-block mb-3">
<i class="fas fa-recycle text-green-600 text-3xl"></i>
</div>
<h4 class="font-semibold">Circular Supply Chains</h4>
<p class="text-gray-700 text-sm">Closed-loop systems that reuse materials, reducing waste by up to 90%.<sup>17</sup></p>
</div>
<div class="text-center">
<div class="bg-green-100 p-4 rounded-full inline-block mb-3">
<i class="fas fa-solar-panel text-green-600 text-3xl"></i>
</div>
<h4 class="font-semibold">Smart Energy</h4>
<p class="text-gray-700 text-sm">AI-optimized routing reduces fuel consumption by 10-15%.<sup>18</sup></p>
</div>
</div>
</div>
</section>
<section class="citation mb-12">
<h2 class="text-2xl font-semibold mb-4 text-blue-700">References</h2>
<ol class="list-decimal list-inside space-y-2 text-sm">
<li>Postgate, J.N. (1992). Early Mesopotamia: Society and Economy at the Dawn of History. Routledge.</li>
<li>Lehner, M. (1997). The Complete Pyramids. Thames & Hudson.</li>
<li>Hansen, V. (2012). The Silk Road: A New History. Oxford University Press.</li>
<li>Laurence, R. (1999). The Roads of Roman Italy: Mobility and Cultural Change. Routledge.</li>
<li>Parry, J.H. (1981). The Age of Reconnaissance. University of California Press.</li>
<li>Epstein, S.R. (1991). Wage Labor and Guilds in Medieval Europe. UNC Press.</li>
<li>Freeman, C. (1989). The Economics of Industrial Innovation. MIT Press.</li>
<li>Levinson, M. (2006). The Box: How the Shipping Container Made the World Smaller and the World Economy Bigger. Princeton University Press.</li>
<li>DHL Robotics Report (2021). The Future of Warehousing: How Robotics is Transforming Logistics.</li>
<li>McKinsey & Company (2020). Artificial Intelligence in Logistics: A Competitive Advantage.</li>
<li>World Economic Forum (2018). Blockchain in Logistics: Perspectives on the Upcoming Impact.</li>
<li>Grand View Research (2023). Global Logistics Market Size Report, 2023-2030.</li>
<li>Boston Consulting Group (2022). The Future of Autonomous Trucking.</li>
<li>PwC (2021). Commercial Drones in Logistics: Cost-Benefit Analysis.</li>
<li>Hyperloop Transportation Technologies (2022). White Paper on Cargo Applications.</li>
<li>International Transport Forum (2021). Decarbonizing Logistics: Pathways to Net-Zero.</li>
<li>Ellen MacArthur Foundation (2019). Circular Economy in Logistics.</li>
<li>MIT Center for Transportation & Logistics (2020). Energy Optimization in Supply Chains.</li>
</ol>
</section>
<footer class="border-t pt-8 text-center text-gray-600">
<p>© 2023 Logistics History Research. All rights reserved.</p>
<p class="text-sm mt-2">Created with HTML, CSS, JavaScript, and TailwindCSS</p>
</footer>
</div>
<script>
// Silk Road Trade Volume Chart
const silkRoadCtx = document.getElementById('silkRoadChart').getContext('2d');
new Chart(silkRoadCtx, {
type: 'bar',
data: {
labels: ['Silk', 'Spices', 'Glassware', 'Precious Metals', 'Textiles'],
datasets: [{
label: 'Trade Volume (tons/year)',
data: [1500, 1200, 800, 500, 1000],
backgroundColor: [
'rgba(255, 99, 132, 0.7)',
'rgba(54, 162, 235, 0.7)',
'rgba(255, 206, 86, 0.7)',
'rgba(75, 192, 192, 0.7)',
'rgba(153, 102, 255, 0.7)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)'
],
borderWidth: 1
}]
},
options: {
responsive: true,
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Tons per year'
}
}
}
}
});
// Containerization Impact Chart
const containerizationCtx = document.getElementById('containerizationChart').getContext('2d');
new Chart(containerizationCtx, {
type: 'line',
data: {
labels: ['1950', '1960', '1970', '1980', '1990', '2000', '2010', '2020'],
datasets: [{
label: 'Global Container Traffic (million TEUs)',
data: [0, 0.5, 5, 30, 80, 220, 560, 850],
fill: false,
borderColor: 'rgb(75, 192, 192)',
tension: 0.1,
backgroundColor: 'rgba(59, 130, 246, 0.2)',
borderWidth: 3
}]
},
options: {
responsive: true,
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Million TEUs'
}
}
}
}
});
// Market Growth Chart
const marketGrowthCtx = document.getElementById('marketGrowthChart').getContext('2d');
new Chart(marketGrowthCtx, {
type: 'bar',
data: {
labels: ['2020', '2021', '2022', '2023', '2024', '2025', '2030'],
datasets: [{
label: 'Global Logistics Market ($ billion)',
data: [4600, 5100, 5600, 6100, 6700, 7300, 9800],
backgroundColor: 'rgba(59, 130, 246, 0.7)',
borderColor: 'rgba(59, 130, 246, 1)',
borderWidth: 1
}]
},
options: {
responsive: true,
scales: {
y: {
beginAtZero: false,
min: 4000,
title: {
display: true,
text: 'USD Billion'
}
}
}
}
});
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=johnfmarti/log-doc1" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html> |