F1 analyze
Codes (Approximately 13,300 lines and more than 300,000 words)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="google-site-verification" content="6I1DK2DK4lDTkBtbGc7H0FT1GUInkNh6uiYk0xLuDKE" />
<!-- Google tag (gtag.js) -->
<script async src="<https://www.googletagmanager.com/gtag/js?id=G-XKFT75GJB7>"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XKFT75GJB7');
</script>
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Kanit:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Oswald:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<link rel="stylesheet" href="<https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css>">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/index.css') }}">
<style>
@font-face {
font-family: 'Formula1Regular';
src: url('/static/asset/fonts/F1 Font/Formula1-Bold.otf') format('opentype');
font-weight: bold;
font-style: normal;
}
</style>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a>
<!-- <div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div> -->
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<main>
<div class="slider">
<!-- Countdown Block -->
<div id="countdown" class="countdown"></div>
<div class="slide">
<div class="overlay-text">
<h1>Formula One Analyze</h1>
<h2>F1 News, Team Information, Codes, Experiences</h2>
<button id="about-button" onclick="scrollToWelcome()">MORE</button>
</div>
<img src="{{ url_for('static', filename='asset/images/bg3.avif') }}" alt="bg">
</div>
<!-- Slider content -->
<div class="slides">
<div class="slide"><img src="{{ url_for('static', filename='asset/images/bg3.avif') }}"
alt="bg"></div>
<!-- <div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/alpine.png') }}"
alt="alpine"></div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/aston.png') }}"
alt="aston"></div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/ferrari.png') }}"
alt="ferrari"></div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/haas.png') }}" alt="haas">
</div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/mclaren.png') }}"
alt="mclaren"></div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/mercedes.png') }}"
alt="mercedes"></div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/redbull.png') }}"
alt="redbull"></div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/sauber.png') }}"
alt="sauber"></div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/visa.png') }}" alt="visa">
</div>
<div class="slide"><img src="{{ url_for('static', filename='asset/images/Cars/williams.png') }}"
alt="williams"></div> -->
</div>
</div>
</main>
<main>
<!-- Welcome Section -->
<section id="welcome-section" class="welcome-section">
<h1 class="fade-in-text">CONTENT</h1>
<p class="fade-in-text">Analyzing Formula One Teams and Machines News • Teams • Lab</p>
<!-- Highlights Section -->
<div class="highlights">
<div class="highlight-card fade-in-text">
<h3>NEWS</h3>
<i class="fas fa-newspaper icon"></i>
<p>Stay updated with the latest F1 news and insights.</p>
</div>
<div class="highlight-card fade-in-text">
<h3>TEAMS</h3>
<i class="fas fa-users icon"></i>
<p>Explore the statistics of all F1 teams and their drivers, cars, and photos.</p>
</div>
<div class="highlight-card fade-in-text">
<h3>LAB</h3>
<i class="fas fa-flask icon"></i>
<p>My own F1-related experiences (updates whenever I have experiences related to F1).</p>
</div>
</div>
<div class="more">
<!-- Image Section -->
<div class="image-section fade-in-text">
<img src="{{ url_for('static', filename='asset/images/sgp_bg.jpeg') }}" alt="Background Image">
<div class="overlay-text">About My Website</div>
</div>
<section class="about-section">
<h2>Welcome to my website, dedicated to the sport, Formula One.</h2>
<p>This website was made from my passion for F1, aiming to serve as a bridge between experienced fans and those just discovering F1.</p>
<hr style="border: solid 0.2px white;">
<h3>My Mission and Purpose</h3>
<p>The primary goal of this website is to inform, engage, and inspire people with everything about F1. I hope to allow anyone to enjoy learning information about F1 through my website. I believe F1 isn’t just about the cars or the drivers, but about the strategy, engineering, and advanced skill that makes it one of the most exciting sports.</p>
<hr style="border: solid 0.2px white;">
<h3>Why I Built This Website</h3>
<p>Creating this website involved writing thousands of lines of code, creating each page to reflect the aspects of Formula One. I wanted a place where fans could not only stay updated with the latest technology of Formula One cars, but also learn about the detailed information of the sport—the technology, the history, the people, and the evolution.</p>
<p>By providing easily accessible information, I hope this site encourages a deeper appreciation of F1 and, resultingly, brings more fans into F1. I wanted newcomers to find it easy to understand the sport, and long-time enthusiasts to discover new information with every visit.</p>
<hr style="border: solid 0.2px white;">
<h3>What You Will Find Here</h3>
<p>Explore pages dedicated to F1 teams, drivers, my own experiences, and news about Formula One. You will find information on each team’s history, engineering insights, and major figures.</p>
<p>Thank you for visiting, and I hope you enjoy exploring Formula One as much as I have enjoyed bringing it all the way to here.</p>
</section>
</section>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/alpine.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/astonmartin.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/ferrari.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/haas.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mclaren.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mercedes.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/racingbulls.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/redbull.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/williams2.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- 외부 JavaScript 파일 불러오기 -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
var countdownElement = document.getElementById('countdown');
// Variables to track mouse and element positions
var offsetX = 0, offsetY = 0, isDragging = false;
countdownElement.addEventListener('mousedown', function (e) {
isDragging = true;
countdownElement.classList.add('dragging');
offsetX = e.clientX - countdownElement.offsetLeft;
offsetY = e.clientY - countdownElement.offsetTop;
});
document.addEventListener('mousemove', function (e) {
if (isDragging) {
var newX = e.clientX - offsetX;
var newY = e.clientY - offsetY;
countdownElement.style.left = `${newX}px`;
countdownElement.style.top = `${newY}px`;
}
});
document.addEventListener('mouseup', function () {
isDragging = false;
countdownElement.classList.remove('dragging');
});
// Countdown logic
var targetDate = new Date('October 25, 2024 12:00:00 GMT+0900');
function updateCountdown() {
var now = new Date();
var difference = targetDate - now;
if (difference > 0) {
var days = Math.floor(difference / (1000 * 60 * 60 * 24));
var hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((difference % (1000 * 60)) / 1000);
countdownElement.innerHTML = `<div><span>${days}</span> Days</div><div><span>${hours}</span> Hours</div><div><span>${minutes}</span> Minutes</div><div><span>${seconds}</span> Seconds</div>`;
} else {
countdownElement.innerHTML = "Countdown Ended!";
}
}
setInterval(updateCountdown, 1000); // Update countdown every second
});
</script>
<script>
document.addEventListener('DOMContentLoaded', function () {
var countdownElement = document.getElementById('countdown');
var slideElement = document.querySelector('.slides');
// Variables to track mouse and element positions for dragging
var offsetX = 0, offsetY = 0, isDragging = false;
countdownElement.addEventListener('mousedown', function (e) {
isDragging = true;
countdownElement.classList.add('dragging');
offsetX = e.clientX - countdownElement.offsetLeft;
offsetY = e.clientY - countdownElement.offsetTop;
});
document.addEventListener('mousemove', function (e) {
if (isDragging) {
var newX = e.clientX - offsetX;
var newY = e.clientY - offsetY;
countdownElement.style.left = `${newX}px`;
countdownElement.style.top = `${newY}px`;
}
});
document.addEventListener('mouseup', function () {
isDragging = false;
countdownElement.classList.remove('dragging');
});
// Countdown logic
var targetDate = new Date('October 25, 2024 12:00:00 GMT+0900');
function updateCountdown() {
var now = new Date();
var difference = targetDate - now;
if (difference > 0) {
var days = Math.floor(difference / (1000 * 60 * 60 * 24));
var hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((difference % (1000 * 60)) / 1000);
countdownElement.innerHTML = `<div><span>${days}</span> Days</div><div><span>${hours}</span> Hours</div><div><span>${minutes}</span> Minutes</div><div><span>${seconds}</span> Seconds</div>`;
} else {
countdownElement.innerHTML = "Countdown Ended!";
}
}
setInterval(updateCountdown, 1000); // Update countdown every second
// Handle scroll event to adjust opacity of the background image
window.addEventListener('scroll', function () {
var scrollY = window.scrollY || window.pageYOffset; // Current scroll position
var opacityValue = Math.max(0.3, 1 - scrollY / 4800); // Reduce opacity as user scrolls, minimum 0.3
slideElement.style.opacity = opacityValue; // Apply opacity to the image
});
});
</script>
<script>
document.addEventListener('DOMContentLoaded', function () {
// Select each section container
const sections = document.querySelectorAll('.welcome-section, .news-updates, .team-highlights');
const observerOptions = {
threshold: 0.2 // Trigger when 10% of the section is visible
};
// Observer callback
const fadeInSection = (entries, observer) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
// Apply fade-in to all .fade-in-text elements within this section
const texts = entry.target.querySelectorAll('.fade-in-text');
texts.forEach(text => text.classList.add('fade-in'));
observer.unobserve(entry.target); // Stop observing after fade-in
}
});
};
const observer = new IntersectionObserver(fadeInSection, observerOptions);
// Observe each section container
sections.forEach(section => observer.observe(section));
});
function scrollToWelcome() {
const welcomeSection = document.getElementById('welcome-section');
const offset = -62; // Adjust this value as needed to control the offset
const position = welcomeSection.getBoundingClientRect().top + window.scrollY + offset;
window.scrollTo({
top: position,
behavior: 'smooth'
});
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/alpine.css') }}">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a> <!-- Link to teams.html -->
<div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div>
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<!-- Car and Team Section -->
<div class="car-container">
<img src="{{ url_for('static', filename='asset/images/Cars/jpg/alpine.jpeg') }}" alt="Alpine Car">
<div class="car-text">
<h2>Alpine A524</h2>
<div class="car-details">
<ul>
<li><strong>Length:</strong> 5500mm</li>
<li><strong>Width:</strong> 2000mm</li>
<li><strong>Height:</strong> 970mm</li>
<li><strong>Weight:</strong> 798kg</li>
<li><strong>Engine:</strong> Renault V6</li>
<!-- <li><strong>Technical Director:</strong> Matthew Harman</li> -->
</ul>
</div>
</div>
</div>
<!-- Alpine Team Information Section -->
<section class="alpine-info">
<h2>Alpine Information</h2>
<!-- Drivers Section -->
<div class="driver-images">
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Alpine/gasly.avif') }}" alt="Pierre Gasly">
<div class="driver-number">10</div>
<div class="driver-name">Pierre Gasly</div>
</div>
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Alpine/ocon.avif') }}" alt="Esteban Ocon">
<div class="driver-number">31</div>
<div class="driver-name">Esteban Ocon</div>
</div>
</div>
<!-- Famous Car Section -->
<div class="famous-sections">
<!-- Famous Car Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Alpine/famouscar.jpg') }}" alt="Renault R25">
<div class="info-content">
<h3>Famous Car – R25</h3>
<p>The Renault R25 ended Ferrari’s dominance in 2005, delivering both the Drivers' and Constructors' Championships with Fernando Alonso. Known for its speed and reliability, the R25 helped establish Renault as a formidable competitor in F1.</p>
</div>
</div>
<!-- Famous Driver Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Alpine/famousdriver.jpg') }}" alt="Fernando Alonso">
<div class="info-content">
<h3>Famous Driver – Fernando Alonso</h3>
<p>Alonso’s technical skill and racecraft brought Renault its first championship, cementing his legacy as one of the most talented drivers of his generation. His intense focus and adaptability continue to make him a standout presence in F1.</p>
</div>
</div>
<!-- Base Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Alpine/base.png') }}" alt="Alpine Base">
<div class="info-content">
<h3>Base – Enstone, United Kingdom</h3>
<p>Alpine's headquarters are located in Enstone, UK. The facility is known for its cutting-edge technology and serves as the primary base for developing and maintaining Alpine's F1 cars.</p>
</div>
</div>
</div>
<section class="team-leadership">
<h2>Team Leadership</h2>
<div class="leadership-cards">
<!-- Team Chief Card -->
<div class="leadership-card">
<h3>Oliver Oakes</h3>
<p>Team Chief</p>
<p>Oliver Oakes leads the team with strategic vision and a focus on performance, driving the team forward in F1's highly competitive environment.</p>
</div>
<!-- Technical Chief Card -->
<div class="leadership-card">
<h3>David Sanchez</h3>
<p>Technical Chief</p>
<p>David Sanchez oversees technical operations, ensuring the car's engineering excellence and innovation to maximize performance on the track.</p>
</div>
</div>
</section>
<!-- Technical Specifications -->
<div class="container mt-5 car-specs">
<h3>Technical Specifications</h3>
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Monocoque
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, incorporating driver controls and fuel cell
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Bodywork
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, including engine cover, sidepods, floor, nose, front wing, and rear wing with driver-operated drag reduction system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Cockpit
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
Removable driver's seat made of anatomically formed carbon composite, six-point driver safety harness, HANS system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Safety Structures
</button>
</h5>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
Cockpit survival cell with impact-resistant construction, front and rear impact structures, side impact structures, roll structures, and halo secondary roll structure
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Front Suspension
</button>
</h5>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion">
<div class="card-body">
Carbon-fibre/titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSix">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
Rear Suspension
</button>
</h5>
</div>
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion">
<div class="card-body">
Carbon-fibre/titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
Wheels
</button>
</h5>
</div>
<div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#accordion">
<div class="card-body">
BBS standardized design 18” magnesium wheels
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEight">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
Tyres
</button>
</h5>
</div>
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion">
<div class="card-body">
Pirelli P Zero F1 with six compounds in the pool. FSC-certified
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNine">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
Brake System
</button>
</h5>
</div>
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion">
<div class="card-body">
Six piston brake calipers with master cylinders, carbon-carbon ventilated discs and pads
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTen" aria-expanded="false" aria-controls="collapseTen">
Steering
</button>
</h5>
</div>
<div id="collapseTen" class="collapse" aria-labelledby="headingTen" data-parent="#accordion">
<div class="card-body">
Power-assisted rack and pinion
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEleven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
Steering Wheel
</button>
</h5>
</div>
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion">
<div class="card-body">
Carbon fibre construction
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwelve">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
Electronics
</button>
</h5>
</div>
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion">
<div class="card-body">
McLaren Applied. Chassis control, data acquisition, sensors
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThirteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThirteen" aria-expanded="false" aria-controls="collapseThirteen">
Instrumentation
</button>
</h5>
</div>
<div id="collapseThirteen" class="collapse" aria-labelledby="headingThirteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied steering wheel display
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFourteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFourteen" aria-expanded="false" aria-controls="collapseFourteen">
Fuel System
</button>
</h5>
</div>
<div id="collapseFourteen" class="collapse" aria-labelledby="headingFourteen" data-parent="#accordion">
<div class="card-body">
ATL Kevlar-reinforced rubber bladder
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFifteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFifteen" aria-expanded="false" aria-controls="collapseFifteen">
Gearbox
</button>
</h5>
</div>
<div id="collapseFifteen" class="collapse" aria-labelledby="headingFifteen" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite gearbox casing
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSixteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSixteen" aria-expanded="false" aria-controls="collapseSixteen">
Gear Selection
</button>
</h5>
</div>
<div id="collapseSixteen" class="collapse" aria-labelledby="headingSixteen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated seamless shift
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeventeen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeventeen" aria-expanded="false" aria-controls="collapseSeventeen">
Clutch
</button>
</h5>
</div>
<div id="collapseSeventeen" class="collapse" aria-labelledby="headingSeventeen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated, carbon multi-plate
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEighteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEighteen" aria-expanded="false" aria-controls="collapseEighteen">
Engine
</button>
</h5>
</div>
<div id="collapseEighteen" class="collapse" aria-labelledby="headingEighteen" data-parent="#accordion">
<div class="card-body">
Mercedes-AMG F1 M15 E Performance
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/alpine.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/astonmartin.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/ferrari.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/haas.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mclaren.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mercedes.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/racingbulls.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/redbull.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/williams2.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- Bootstrap JS -->
<script src="<https://code.jquery.com/jquery-3.5.1.slim.min.js>"></script>
<script src="<https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js>"></script>
<script src="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js>"></script>
<!-- External JS -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/astonmartin.css') }}">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a> <!-- Link to teams.html -->
<div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div>
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<main>
<div class="car-container">
<img src="{{ url_for('static', filename='asset/images/Cars/jpg/aston.jpeg') }}" alt="Aston Car">
<div class="car-text">
<h2>Aston Martin AMR24</h2>
<div class="car-details">
<ul>
<li><strong>Length:</strong> 5500mm</li>
<li><strong>Width:</strong> 2000mm</li>
<li><strong>Height:</strong> 970mm</li>
<li><strong>Weight:</strong> 798kg</li>
<li><strong>Engine:</strong> Mercedes V6</li>
</ul>
</div>
</div>
</div>
<!-- Aston Martin Team Information Section -->
<section class="astonmartin-info">
<h2>Aston Martin Information</h2>
<!-- Drivers Section -->
<div class="driver-images">
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Astonmartin/alonso.avif') }}" alt="Fernando Alonso">
<div class="driver-number">14</div>
<div class="driver-name">Fernando Alonso</div>
</div>
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Astonmartin/stroll.avif') }}" alt="Lance Stroll">
<div class="driver-number">18</div>
<div class="driver-name">Lance Stroll</div>
</div>
</div>
<!-- Famous Car Section -->
<div class="famous-sections">
<!-- Famous Car Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Astonmartin/famouscar.avif') }}" alt="Racing Point RP20">
<div class="info-content">
<h3>Famous Car – RP20</h3>
<p>The RP20, also known as the “Pink Mercedes,” brought unprecedented success to Racing Point (now Aston Martin) in the 2020 season, highlighted by a victory at the Sakhir Grand Prix with Sergio Perez. The car’s design, closely resembling the previous year's Mercedes, sparked debate but showcased Racing Point's competitiveness and set the stage for Aston Martin’s entry.</p>
</div>
</div>
<!-- Famous Driver Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Astonmartin/famousdriver.jpg') }}" alt="Damon Hill">
<div class="info-content">
<h3>Famous Driver – Damon Hill</h3>
<p>Although Damon Hill did not race for Aston Martin specifically, he had a strong connection with its British heritage through his time with Jordan (an Aston Martin precursor). Hill won his only World Championship in 1996 and brought attention to Jordan, especially with his podium finishes later in his career, which helped elevate the team’s profile.</p>
</div>
</div>
<!-- Base Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Astonmartin/base.avif') }}" alt="Aston Martin Base">
<div class="info-content">
<h3>Base – Silverstone, United Kingdom</h3>
<p>Aston Martin's headquarters are located in Silverstone, UK, near the famous F1 circuit. This state-of-the-art facility is at the forefront of technology and innovation for the team.</p>
</div>
</div>
</div>
<!-- Team Leadership Section -->
<section class="team-leadership">
<h2>Team Leadership</h2>
<div class="leadership-cards">
<!-- Team Chief Card -->
<div class="leadership-card">
<h3>Mike Crack</h3>
<p>Team Chief</p>
<p>Mike Crack leads the Aston Martin F1 team with a strategic and collaborative approach, guiding the team through its ambitious goals in a highly competitive environment.</p>
</div>
<!-- Technical Chief Card -->
<div class="leadership-card">
<h3>Dan Fallows</h3>
<p>Technical Chief</p>
<p>Dan Fallows heads the technical operations, focusing on engineering excellence and innovation to keep Aston Martin competitive at the highest levels of F1.</p>
</div>
</div>
</section>
</section>
<div class="container mt-5 car-specs">
<h3>Technical Specifications</h3>
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Monocoque
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, incorporating driver controls and fuel cell
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Bodywork
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, including engine cover, sidepods, floor, nose, front wing and rear wing with driver-operated drag reduction system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Cockpit
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
Removable driver's seat made of anatomically formed carbon composite, six-point driver safety harness, HANS system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Safety Structures
</button>
</h5>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
Cockpit survival cell incorporating impact resistant construction and anti-penetration panels, front impact structure, prescribed side impact structures, integrated rear impact structure, front and rear roll structures, halo secondary roll structure, driver headrest protection and safety seat
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Front Suspension
</button>
</h5>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSix">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
Rear Suspension
</button>
</h5>
</div>
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
Wheels
</button>
</h5>
</div>
<div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#accordion">
<div class="card-body">
BBS standardised design 18” magnesium wheels
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEight">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
Tyres
</button>
</h5>
</div>
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion">
<div class="card-body">
Pirelli P Zero F1. Now with an additional compound, the C0 – bringing our total to six compounds in the pool. Pirelli select three for each event. FSC-certified (Forest Stewardship Council).
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNine">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
Brake System
</button>
</h5>
</div>
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion">
<div class="card-body">
Six piston brake calipers with front / rear master cylinders. ‘Brake by wire’ rear brake control system. Carbon-carbon ventilated discs and pads
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEleven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
Steering
</button>
</h5>
</div>
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion">
<div class="card-body">
Power-assisted rack and pinion
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwelve">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
Steering Wheel
</button>
</h5>
</div>
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion">
<div class="card-body">
Carbon fibre construction
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThirteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThirteen" aria-expanded="false" aria-controls="collapseThirteen">
Electronics
</button>
</h5>
</div>
<div id="collapseThirteen" class="collapse" aria-labelledby="headingThirteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied. Including chassis control, power unit control, data acquisition, sensors, data analysis
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFourteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFourteen" aria-expanded="false" aria-controls="collapseFourteen">
Instrumentation
</button>
</h5>
</div>
<div id="collapseFourteen" class="collapse" aria-labelledby="headingFourteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied steering wheel display
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFifteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFifteen" aria-expanded="false" aria-controls="collapseFifteen">
Fuel System
</button>
</h5>
</div>
<div id="collapseFifteen" class="collapse" aria-labelledby="headingFifteen" data-parent="#accordion">
<div class="card-body">
ATL Kevlar-reinforced rubber bladder
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSixteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSixteen" aria-expanded="false" aria-controls="collapseSixteen">
Gearbox
</button>
</h5>
</div>
<div id="collapseSixteen" class="collapse" aria-labelledby="headingSixteen" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite gearbox casing,
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeventeen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeventeen" aria-expanded="false" aria-controls="collapseSeventeen">
Gear Selection
</button>
</h5>
</div>
<div id="collapseSeventeen" class="collapse" aria-labelledby="headingSeventeen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated seamless shift
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEighteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEighteen" aria-expanded="false" aria-controls="collapseEighteen">
Clutch
</button>
</h5>
</div>
<div id="collapseEighteen" class="collapse" aria-labelledby="headingEighteen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated, carbon multi-plate
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNineteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#Nineteen" aria-expanded="false" aria-controls="collapseSeventeen">
Engine
</button>
</h5>
</div>
<div id="Nineteen" class="collapse" aria-labelledby="Nineteen" data-parent="#accordion">
<div class="card-body">
Mercedes-AMG F1 M15 E Performance
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Alpine_logo.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Aston_Martin_Aramco-Mercedes_logo.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Scuderia_Ferrari_Logo.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Haas_F1_Team_logo.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Logo_of_Stake_F1_Team_Kick_Sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/McLaren_Racing_logo.svg.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Mercedes-Benz_in_Formula_One_logo.svg.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Red_Bull_Racing.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Logotipo_da_RB_F1_Team.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/F1-logos/Logo_Williams_F1.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- 부트스트랩 JS -->
<script src="<https://code.jquery.com/jquery-3.5.1.slim.min.js>"></script>
<script src="<https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js>"></script>
<script src="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js>"></script>
<!-- 외부 JavaScript 파일 불러오기 -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/ferrari.css') }}">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a> <!-- Link to teams.html -->
<div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div>
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<main>
<div class="car-container">
<img src="{{ url_for('static', filename='asset/images/Cars/jpg/ferrari.jpeg') }}" alt="Ferrari Car">
<div class="car-text">
<h2>Ferrari Sf-24</h2>
<div class="car-details">
<ul>
<li><strong>Length:</strong> 5500mm</li>
<li><strong>Width:</strong> 2000mm</li>
<li><strong>Height:</strong> 970mm</li>
<li><strong>Weight:</strong> 798kg</li>
<li><strong>Engine:</strong> Ferrari V6</li>
</ul>
</div>
</div>
</div>
<!-- Ferrari Team Information Section -->
<section class="ferrari-info">
<h2>Ferrari Information</h2>
<!-- Drivers Section -->
<div class="driver-images">
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Ferrari/leclerc.avif') }}" alt="Charles Leclerc">
<div class="driver-number">16</div>
<div class="driver-name">Charles Leclerc</div>
</div>
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Ferrari/sainz.avif') }}" alt="Carlos Sainz">
<div class="driver-number">55</div>
<div class="driver-name">Carlos Sainz</div>
</div>
</div>
<!-- Famous Car Section -->
<div class="famous-sections">
<!-- Famous Car Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Ferrari/famouscar.jpg') }}" alt="Ferrari F2004">
<div class="info-content">
<h3>Famous Car – F2004</h3>
<p>Ferrari’s F2004 is one of the fastest and most reliable cars in F1 history, delivering Michael Schumacher 13 wins in a single season. Known for its superior aerodynamics and Ferrari’s V10 engine, the F2004 set numerous lap records, some of which held for over a decade.</p>
</div>
</div>
<!-- Famous Driver Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Ferrari/famousdriver.avif') }}" alt="Michael Schumacher">
<div class="info-content">
<h3>Famous Driver – Michael Schumacher</h3>
<p>Michael Schumacher led Ferrari to five consecutive championships, embodying the team’s competitive spirit and relentless drive. His era at Ferrari transformed the team into a dominant force and cemented his legacy as one of the sport’s greatest drivers.</p>
</div>
</div>
<!-- Base Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Ferrari/base2.avif') }}" alt="Ferrari Base">
<div class="info-content">
<h3>Base – Maranello, Italy</h3>
<p>Ferrari's headquarters are located in Maranello, Italy. This historic facility is home to the Ferrari brand and serves as the center for developing and maintaining Ferrari's F1 cars.</p>
</div>
</div>
</div>
<!-- Team Leadership Section -->
<section class="team-leadership">
<h2>Team Leadership</h2>
<div class="leadership-cards">
<!-- Team Chief Card -->
<div class="leadership-card">
<h3>Frederic Vasseur</h3>
<p>Team Chief</p>
<p>Frederic Vasseur leads Ferrari with a strategic vision and a focus on performance, driving the team forward in F1's highly competitive environment.</p>
</div>
<!-- Technical Chief Card -->
<div class="leadership-card">
<h3>Loic Serra / Enrico Gualtieri</h3>
<p>Technical Chiefs</p>
<p>Loic Serra and Enrico Gualtieri head the technical operations, ensuring Ferrari's engineering excellence and innovation to maximize performance on the track.</p>
</div>
</div>
</section>
</section>
<div class="container mt-5 car-specs">
<h3>Technical Specifications</h3>
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Monocoque
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, incorporating driver controls and fuel cell
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Bodywork
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, including engine cover, sidepods, floor, nose, front wing and rear wing with driver-operated drag reduction system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Cockpit
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
Removable driver's seat made of anatomically formed carbon composite, six-point driver safety harness, HANS system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Safety Structures
</button>
</h5>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
Cockpit survival cell incorporating impact resistant construction and anti-penetration panels, front impact structure, prescribed side impact structures, integrated rear impact structure, front and rear roll structures, halo secondary roll structure, driver headrest protection and safety seat
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Front Suspension
</button>
</h5>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSix">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
Rear Suspension
</button>
</h5>
</div>
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
Wheels
</button>
</h5>
</div>
<div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#accordion">
<div class="card-body">
BBS standardised design 18” magnesium wheels
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEight">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
Tyres
</button>
</h5>
</div>
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion">
<div class="card-body">
Pirelli P Zero F1. Now with an additional compound, the C0 – bringing our total to six compounds in the pool. Pirelli select three for each event. FSC-certified (Forest Stewardship Council).
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNine">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
Brake System
</button>
</h5>
</div>
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion">
<div class="card-body">
Six piston brake calipers with front / rear master cylinders. ‘Brake by wire’ rear brake control system. Carbon-carbon ventilated discs and pads
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEleven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
Steering
</button>
</h5>
</div>
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion">
<div class="card-body">
Power-assisted rack and pinion
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwelve">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
Steering Wheel
</button>
</h5>
</div>
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion">
<div class="card-body">
Carbon fibre construction
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThirteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThirteen" aria-expanded="false" aria-controls="collapseThirteen">
Electronics
</button>
</h5>
</div>
<div id="collapseThirteen" class="collapse" aria-labelledby="headingThirteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied. Including chassis control, power unit control, data acquisition, sensors, data analysis
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFourteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFourteen" aria-expanded="false" aria-controls="collapseFourteen">
Instrumentation
</button>
</h5>
</div>
<div id="collapseFourteen" class="collapse" aria-labelledby="headingFourteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied steering wheel display
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFifteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFifteen" aria-expanded="false" aria-controls="collapseFifteen">
Fuel System
</button>
</h5>
</div>
<div id="collapseFifteen" class="collapse" aria-labelledby="headingFifteen" data-parent="#accordion">
<div class="card-body">
ATL Kevlar-reinforced rubber bladder
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSixteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSixteen" aria-expanded="false" aria-controls="collapseSixteen">
Gearbox
</button>
</h5>
</div>
<div id="collapseSixteen" class="collapse" aria-labelledby="headingSixteen" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite gearbox casing,
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeventeen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeventeen" aria-expanded="false" aria-controls="collapseSeventeen">
Gear Selection
</button>
</h5>
</div>
<div id="collapseSeventeen" class="collapse" aria-labelledby="headingSeventeen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated seamless shift
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEighteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEighteen" aria-expanded="false" aria-controls="collapseEighteen">
Clutch
</button>
</h5>
</div>
<div id="collapseEighteen" class="collapse" aria-labelledby="headingEighteen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated, carbon multi-plate
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNineteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#Nineteen" aria-expanded="false" aria-controls="collapseSeventeen">
Engine
</button>
</h5>
</div>
<div id="Nineteen" class="collapse" aria-labelledby="Nineteen" data-parent="#accordion">
<div class="card-body">
Mercedes-AMG F1 M15 E Performance
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/alpine.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/astonmartin.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/ferrari.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/haas.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mclaren.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mercedes.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/racingbulls.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/redbull.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/williams2.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- 부트스트랩 JS -->
<script src="<https://code.jquery.com/jquery-3.5.1.slim.min.js>"></script>
<script src="<https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js>"></script>
<script src="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js>"></script>
<!-- 외부 JavaScript 파일 불러오기 -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/haas.css') }}">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a> <!-- Link to teams.html -->
<div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div>
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<main>
<div class="car-container">
<img src="{{ url_for('static', filename='asset/images/Cars/jpg/haas.jpeg') }}" alt="Haas Car">
<div class="car-text">
<h2>Hass VF24</h2>
<div class="car-details">
<ul>
<li><strong>Length:</strong> 5500mm</li>
<li><strong>Width:</strong> 2000mm</li>
<li><strong>Height:</strong> 970mm</li>
<li><strong>Weight:</strong> 798kg</li>
<li><strong>Engine:</strong> Ferrari V6</li>
</ul>
</div>
</div>
</div>
<!-- Haas Team Information Section -->
<section class="haas-info">
<h2>Haas Information</h2>
<!-- Drivers Section -->
<div class="driver-images">
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Haas/hulkenberg.avif') }}" alt="Nico Hulkenberg">
<div class="driver-number">27</div>
<div class="driver-name">Nico Hulkenberg</div>
</div>
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Haas/magnussen.avif') }}" alt="Kevin Magnussen">
<div class="driver-number">20</div>
<div class="driver-name">Kevin Magnussen</div>
</div>
</div>
<!-- Famous Car Section -->
<div class="famous-sections">
<!-- Famous Car Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Haas/famouscar.webp') }}" alt="Haas VF-19">
<div class="info-content">
<h3>Famous Car – VF-19</h3>
<p>The VF-19 showcased Haas's potential to compete as a strong midfield team, finishing 5th in the Constructors' Championship in 2018. This success highlighted Haas’s rapid progress as a newer F1 team, drawing attention to its impressive competitiveness.</p>
</div>
</div>
<!-- Famous Driver Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Haas/famousdriver.jpg') }}" alt="Nico Hulkenberg">
<div class="info-content">
<h3>Famous Driver – Nico Hulkenberg</h3>
<p>Renowned for his consistency and resilience, Hulkenberg has been a key driver for Haas, known for his ability to maximize the car’s performance. His experience across various teams brings stability and development insights to the relatively young team.</p>
</div>
</div>
<!-- Base Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Haas/base.jpeg') }}" alt="Haas Base">
<div class="info-content">
<h3>Base – Kannapolis, United States</h3>
<p>Haas's headquarters are located in Kannapolis, United States. The facility serves as the primary base for developing and maintaining Haas's F1 cars, marking its presence as the only American team in F1.</p>
</div>
</div>
</div>
<!-- Team Leadership Section -->
<section class="team-leadership">
<h2>Team Leadership</h2>
<div class="leadership-cards">
<!-- Team Chief Card -->
<div class="leadership-card">
<h3>Ayao Komatsu</h3>
<p>Team Chief</p>
<p>Ayao Komatsu leads Haas with a strategic approach and a commitment to performance, focusing on building the team's competitiveness within the F1 grid.</p>
</div>
<!-- Technical Chief Card -->
<div class="leadership-card">
<h3>Andrea De Zordo</h3>
<p>Technical Chief</p>
<p>Andrea De Zordo oversees the technical operations, ensuring Haas's engineering standards and innovations meet the demands of the F1 competition.</p>
</div>
</div>
</section>
</section>
<div class="container mt-5 car-specs">
<h3>Technical Specifications</h3>
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Monocoque
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, incorporating driver controls and fuel cell
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Bodywork
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, including engine cover, sidepods, floor, nose, front wing and rear wing with driver-operated drag reduction system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Cockpit
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
Removable driver's seat made of anatomically formed carbon composite, six-point driver safety harness, HANS system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Safety Structures
</button>
</h5>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
Cockpit survival cell incorporating impact resistant construction and anti-penetration panels, front impact structure, prescribed side impact structures, integrated rear impact structure, front and rear roll structures, halo secondary roll structure, driver headrest protection and safety seat
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Front Suspension
</button>
</h5>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSix">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
Rear Suspension
</button>
</h5>
</div>
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
Wheels
</button>
</h5>
</div>
<div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#accordion">
<div class="card-body">
BBS standardised design 18” magnesium wheels
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEight">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
Tyres
</button>
</h5>
</div>
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion">
<div class="card-body">
Pirelli P Zero F1. Now with an additional compound, the C0 – bringing our total to six compounds in the pool. Pirelli select three for each event. FSC-certified (Forest Stewardship Council).
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNine">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
Brake System
</button>
</h5>
</div>
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion">
<div class="card-body">
Six piston brake calipers with front / rear master cylinders. ‘Brake by wire’ rear brake control system. Carbon-carbon ventilated discs and pads
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEleven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
Steering
</button>
</h5>
</div>
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion">
<div class="card-body">
Power-assisted rack and pinion
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwelve">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
Steering Wheel
</button>
</h5>
</div>
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion">
<div class="card-body">
Carbon fibre construction
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThirteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThirteen" aria-expanded="false" aria-controls="collapseThirteen">
Electronics
</button>
</h5>
</div>
<div id="collapseThirteen" class="collapse" aria-labelledby="headingThirteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied. Including chassis control, power unit control, data acquisition, sensors, data analysis
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFourteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFourteen" aria-expanded="false" aria-controls="collapseFourteen">
Instrumentation
</button>
</h5>
</div>
<div id="collapseFourteen" class="collapse" aria-labelledby="headingFourteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied steering wheel display
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFifteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFifteen" aria-expanded="false" aria-controls="collapseFifteen">
Fuel System
</button>
</h5>
</div>
<div id="collapseFifteen" class="collapse" aria-labelledby="headingFifteen" data-parent="#accordion">
<div class="card-body">
ATL Kevlar-reinforced rubber bladder
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSixteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSixteen" aria-expanded="false" aria-controls="collapseSixteen">
Gearbox
</button>
</h5>
</div>
<div id="collapseSixteen" class="collapse" aria-labelledby="headingSixteen" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite gearbox casing,
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeventeen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeventeen" aria-expanded="false" aria-controls="collapseSeventeen">
Gear Selection
</button>
</h5>
</div>
<div id="collapseSeventeen" class="collapse" aria-labelledby="headingSeventeen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated seamless shift
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEighteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEighteen" aria-expanded="false" aria-controls="collapseEighteen">
Clutch
</button>
</h5>
</div>
<div id="collapseEighteen" class="collapse" aria-labelledby="headingEighteen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated, carbon multi-plate
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNineteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#Nineteen" aria-expanded="false" aria-controls="collapseSeventeen">
Engine
</button>
</h5>
</div>
<div id="Nineteen" class="collapse" aria-labelledby="Nineteen" data-parent="#accordion">
<div class="card-body">
Mercedes-AMG F1 M15 E Performance
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/alpine.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/astonmartin.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/ferrari.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/haas.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mclaren.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mercedes.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/racingbulls.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/redbull.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/williams2.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- 부트스트랩 JS -->
<script src="<https://code.jquery.com/jquery-3.5.1.slim.min.js>"></script>
<script src="<https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js>"></script>
<script src="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js>"></script>
<!-- 외부 JavaScript 파일 불러오기 -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/kicksauber.css') }}">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a> <!-- Link to teams.html -->
<div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div>
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<main>
<div class="car-container">
<img src="{{ url_for('static', filename='asset/images/Cars/jpg/sauber.jpeg') }}" alt="Sauber Car">
<div class="car-text">
<h2>Kick Sauber C44</h2>
<div class="car-details">
<ul>
<li><strong>Length:</strong> 5000mm</li>
<li><strong>Width:</strong> 2000mm</li>
<li><strong>Height:</strong> 970mm</li>
<li><strong>Weight:</strong> 798kg</li>
<li><strong>Engine:</strong> V6</li>
</ul>
</div>
</div>
</div>
<!-- Kick Sauber Team Information Section -->
<section class="sauber-info">
<h2>Kick Sauber Information</h2>
<!-- Drivers Section -->
<div class="driver-images">
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Sauber/bottas.avif') }}" alt="Valtteri Bottas">
<div class="driver-number">77</div>
<div class="driver-name">Valtteri Bottas</div>
</div>
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Sauber/zhou.avif') }}" alt="Zhou Guanyu">
<div class="driver-number">24</div>
<div class="driver-name">Zhou Guanyu</div>
</div>
</div>
<!-- Famous Car Section -->
<div class="famous-sections">
<!-- Famous Car Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Sauber/famouscar.jpg') }}" alt="BMW Sauber F1.08">
<div class="info-content">
<h3>Famous Car – F1.08</h3>
<p>The F1.08 brought BMW Sauber its only F1 victory at the 2008 Canadian Grand Prix, marking a high point in the team’s history. Known for its sleek design and powerful BMW engine, the F1.08 was competitive throughout the season, finishing 3rd in the Constructors' standings.</p>
</div>
</div>
<!-- Famous Driver Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Sauber/famousdriver.avif') }}" alt="Kimi Raikkonen">
<div class="info-content">
<h3>Famous Driver – Kimi Raikkonen</h3>
<p>Known as “The Iceman,” Raikkonen’s unique personality and racing skill have made him a fan favorite and a valuable asset for Sauber. His tenure with the team added experience and notoriety, helping elevate Sauber’s reputation on the grid.</p>
</div>
</div>
</div>
<!-- Team Leadership Section -->
<section class="team-leadership">
<h2>Team Leadership</h2>
<div class="leadership-cards">
<!-- Team Chief Card -->
<div class="leadership-card">
<h3>Alessandro Alunni Bravi</h3>
<p>Team Chief</p>
<p>Alessandro Alunni Bravi leads Kick Sauber with a strategic vision, focusing on innovation and competitive performance within the F1 grid.</p>
</div>
<!-- Technical Chief Card -->
<div class="leadership-card">
<h3>James Key</h3>
<p>Technical Chief</p>
<p>James Key oversees technical operations, ensuring the engineering and innovation standards are met to maximize performance on the track.</p>
</div>
</div>
</section>
</section>
<div class="container mt-5 car-specs">
<h3>Technical Specifications</h3>
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Monocoque
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, incorporating driver controls and fuel cell
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Bodywork
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, including engine cover, sidepods, floor, nose, front wing and rear wing with driver-operated drag reduction system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Cockpit
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
Removable driver's seat made of anatomically formed carbon composite, six-point driver safety harness, HANS system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Safety Structures
</button>
</h5>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
Cockpit survival cell incorporating impact resistant construction and anti-penetration panels, front impact structure, prescribed side impact structures, integrated rear impact structure, front and rear roll structures, halo secondary roll structure, driver headrest protection and safety seat
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Front Suspension
</button>
</h5>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSix">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
Rear Suspension
</button>
</h5>
</div>
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
Wheels
</button>
</h5>
</div>
<div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#accordion">
<div class="card-body">
BBS standardised design 18” magnesium wheels
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEight">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
Tyres
</button>
</h5>
</div>
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion">
<div class="card-body">
Pirelli P Zero F1. Now with an additional compound, the C0 – bringing our total to six compounds in the pool. Pirelli select three for each event. FSC-certified (Forest Stewardship Council).
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNine">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
Brake System
</button>
</h5>
</div>
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion">
<div class="card-body">
Six piston brake calipers with front / rear master cylinders. ‘Brake by wire’ rear brake control system. Carbon-carbon ventilated discs and pads
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEleven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
Steering
</button>
</h5>
</div>
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion">
<div class="card-body">
Power-assisted rack and pinion
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwelve">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
Steering Wheel
</button>
</h5>
</div>
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion">
<div class="card-body">
Carbon fibre construction
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThirteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThirteen" aria-expanded="false" aria-controls="collapseThirteen">
Electronics
</button>
</h5>
</div>
<div id="collapseThirteen" class="collapse" aria-labelledby="headingThirteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied. Including chassis control, power unit control, data acquisition, sensors, data analysis
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFourteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFourteen" aria-expanded="false" aria-controls="collapseFourteen">
Instrumentation
</button>
</h5>
</div>
<div id="collapseFourteen" class="collapse" aria-labelledby="headingFourteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied steering wheel display
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFifteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFifteen" aria-expanded="false" aria-controls="collapseFifteen">
Fuel System
</button>
</h5>
</div>
<div id="collapseFifteen" class="collapse" aria-labelledby="headingFifteen" data-parent="#accordion">
<div class="card-body">
ATL Kevlar-reinforced rubber bladder
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSixteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSixteen" aria-expanded="false" aria-controls="collapseSixteen">
Gearbox
</button>
</h5>
</div>
<div id="collapseSixteen" class="collapse" aria-labelledby="headingSixteen" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite gearbox casing,
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeventeen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeventeen" aria-expanded="false" aria-controls="collapseSeventeen">
Gear Selection
</button>
</h5>
</div>
<div id="collapseSeventeen" class="collapse" aria-labelledby="headingSeventeen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated seamless shift
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEighteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEighteen" aria-expanded="false" aria-controls="collapseEighteen">
Clutch
</button>
</h5>
</div>
<div id="collapseEighteen" class="collapse" aria-labelledby="headingEighteen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated, carbon multi-plate
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNineteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#Nineteen" aria-expanded="false" aria-controls="collapseSeventeen">
Engine
</button>
</h5>
</div>
<div id="Nineteen" class="collapse" aria-labelledby="Nineteen" data-parent="#accordion">
<div class="card-body">
Mercedes-AMG F1 M15 E Performance
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/alpine.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/astonmartin.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/ferrari.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/haas.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mclaren.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mercedes.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/racingbulls.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/redbull.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/williams2.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- 부트스트랩 JS -->
<script src="<https://code.jquery.com/jquery-3.5.1.slim.min.js>"></script>
<script src="<https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js>"></script>
<script src="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js>"></script>
<!-- 외부 JavaScript 파일 불러오기 -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/mclaren.css') }}">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a> <!-- Link to teams.html -->
<div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div>
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<main>
<div class="car-container">
<img src="{{ url_for('static', filename='asset/images/Cars/jpg/mclaren.jpeg') }}" alt="Mclaren Car">
<div class="car-text">
<h2>Mclaren MCL38</h2>
<div class="car-details">
<ul>
<li><strong>Length:</strong> 5500mm</li>
<li><strong>Width:</strong> 2000mm</li>
<li><strong>Height:</strong> 970mm</li>
<li><strong>Weight:</strong> 798kg</li>
<li><strong>Engine:</strong> Mercedes V6</li>
</ul>
</div>
</div>
</div>
<!-- Alpine Team Information Section -->
<section class="mclaren-info">
<h2>McLaren Information</h2>
<!-- Drivers Section -->
<div class="driver-images">
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Mclaren/norris.avif') }}" alt="Lando Norris">
<div class="driver-number">4</div>
<div class="driver-name">Lando Norris</div>
</div>
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Mclaren/piastri.avif') }}" alt="Oscar Piastri">
<div class="driver-number">81</div>
<div class="driver-name">Oscar Piastri</div>
</div>
</div>
<!-- Famous Car Section -->
<div class="famous-sections">
<!-- Famous Car Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Mclaren/famouscar.jpg') }}" alt="McLaren MP4/4">
<div class="info-content">
<h3>Famous Car – MP4/4</h3>
<p>The MP4/4 dominated the 1988 season, winning an astounding 15 out of 16 races, a record still admired today. Known for its low-line chassis and powerful Honda engine, this car was nearly unbeatable, setting a high standard for F1 performance.</p>
</div>
</div>
<!-- Famous Driver Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Mclaren/famousdriver.avif') }}" alt="Ayrton Senna">
<div class="info-content">
<h3>Famous Driver – Ayrton Senna</h3>
<p>Ayrton Senna is remembered for his intense passion and precision on the track, winning three championships with McLaren. His duels with teammate Alain Prost and his mastery in wet conditions made him an F1 legend, celebrated for his charisma and competitive spirit.</p>
</div>
</div>
<!-- Base Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Mclaren/base.webp') }}" alt="McLaren Base">
<div class="info-content">
<h3>Base – Woking, United Kingdom</h3>
<p>McLaren's headquarters are located in Woking, UK. This state-of-the-art facility serves as the hub for innovation, development, and refinement of McLaren's F1 technology.</p>
</div>
</div>
</div>
<!-- Team Leadership Section -->
<section class="team-leadership">
<h2>Team Leadership</h2>
<div class="leadership-cards">
<!-- Team Chief Card -->
<div class="leadership-card">
<h3>Andrea Stella</h3>
<p>Team Chief</p>
<p>Andrea Stella leads McLaren with strategic insight and a focus on performance, driving the team forward in F1's competitive environment.</p>
</div>
<!-- Technical Chief Card -->
<div class="leadership-card">
<h3>Peter Prodromou / Neil Houldey</h3>
<p>Technical Chief</p>
<p>Peter Prodromou and Neil Houldey head the technical department, ensuring McLaren's cars maintain engineering excellence and competitiveness.</p>
</div>
</div>
</section>
</section>
<div class="container mt-5 car-specs">
<h3>Technical Specifications</h3>
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Monocoque
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, incorporating driver controls and fuel cell
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Bodywork
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite, including engine cover, sidepods, floor, nose, front wing and rear wing with driver-operated drag reduction system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Cockpit
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
Removable driver's seat made of anatomically formed carbon composite, six-point driver safety harness, HANS system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Safety Structures
</button>
</h5>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
Cockpit survival cell incorporating impact resistant construction and anti-penetration panels, front impact structure, prescribed side impact structures, integrated rear impact structure, front and rear roll structures, halo secondary roll structure, driver headrest protection and safety seat
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Front Suspension
</button>
</h5>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSix">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
Rear Suspension
</button>
</h5>
</div>
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion">
<div class="card-body">
Carbon-fibre / titanium suspension legs, pullrod operating inboard torsion bar, spring and damper system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
Wheels
</button>
</h5>
</div>
<div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#accordion">
<div class="card-body">
BBS standardised design 18” magnesium wheels
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEight">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
Tyres
</button>
</h5>
</div>
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion">
<div class="card-body">
Pirelli P Zero F1. Now with an additional compound, the C0 – bringing our total to six compounds in the pool. Pirelli select three for each event. FSC-certified (Forest Stewardship Council).
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNine">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
Brake System
</button>
</h5>
</div>
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion">
<div class="card-body">
Six piston brake calipers with front / rear master cylinders. ‘Brake by wire’ rear brake control system. Carbon-carbon ventilated discs and pads
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEleven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
Steering
</button>
</h5>
</div>
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion">
<div class="card-body">
Power-assisted rack and pinion
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwelve">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
Steering Wheel
</button>
</h5>
</div>
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion">
<div class="card-body">
Carbon fibre construction
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThirteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThirteen" aria-expanded="false" aria-controls="collapseThirteen">
Electronics
</button>
</h5>
</div>
<div id="collapseThirteen" class="collapse" aria-labelledby="headingThirteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied. Including chassis control, power unit control, data acquisition, sensors, data analysis
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFourteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFourteen" aria-expanded="false" aria-controls="collapseFourteen">
Instrumentation
</button>
</h5>
</div>
<div id="collapseFourteen" class="collapse" aria-labelledby="headingFourteen" data-parent="#accordion">
<div class="card-body">
McLaren Applied steering wheel display
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFifteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFifteen" aria-expanded="false" aria-controls="collapseFifteen">
Fuel System
</button>
</h5>
</div>
<div id="collapseFifteen" class="collapse" aria-labelledby="headingFifteen" data-parent="#accordion">
<div class="card-body">
ATL Kevlar-reinforced rubber bladder
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSixteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSixteen" aria-expanded="false" aria-controls="collapseSixteen">
Gearbox
</button>
</h5>
</div>
<div id="collapseSixteen" class="collapse" aria-labelledby="headingSixteen" data-parent="#accordion">
<div class="card-body">
Carbon-fibre composite gearbox casing,
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeventeen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeventeen" aria-expanded="false" aria-controls="collapseSeventeen">
Gear Selection
</button>
</h5>
</div>
<div id="collapseSeventeen" class="collapse" aria-labelledby="headingSeventeen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated seamless shift
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEighteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEighteen" aria-expanded="false" aria-controls="collapseEighteen">
Clutch
</button>
</h5>
</div>
<div id="collapseEighteen" class="collapse" aria-labelledby="headingEighteen" data-parent="#accordion">
<div class="card-body">
Electro-hydraulically operated, carbon multi-plate
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNineteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#Nineteen" aria-expanded="false" aria-controls="collapseSeventeen">
Engine
</button>
</h5>
</div>
<div id="Nineteen" class="collapse" aria-labelledby="Nineteen" data-parent="#accordion">
<div class="card-body">
Mercedes-AMG F1 M15 E Performance
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/alpine.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/astonmartin.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/ferrari.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/haas.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mclaren.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mercedes.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/racingbulls.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/redbull.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/williams2.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- 부트스트랩 JS -->
<script src="<https://code.jquery.com/jquery-3.5.1.slim.min.js>"></script>
<script src="<https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js>"></script>
<script src="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js>"></script>
<!-- 외부 JavaScript 파일 불러오기 -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="{{ url_for('static', filename='asset/images/f1analyzelogo.png') }}">
<title>F1 analyze</title>
<!-- 부트스트랩 CSS -->
<link href="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css>" rel="stylesheet">
<!-- Google Fonts: Bebas Neue, Roboto, Lora -->
<link href="<https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lora:wght@400;700&family=Roboto:wght@400;700&display=swap>" rel="stylesheet">
<link href="<https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;700&display=swap>" rel="stylesheet">
<!-- 외부 CSS 파일 불러오기 -->
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='asset/css/mercedes.css') }}">
</head>
<body>
<!-- 헤더 -->
<header>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/">Home</a></li>
<li class="teams-menu">
<a href="/teams">Teams</a> <!-- Link to teams.html -->
<div class="dropdown-content">
<ul>
<li><a href="/alpine">Alpine</a></li>
<li><a href="/astonmartin">Aston Martin</a></li>
<li><a href="/ferrari">Ferrari</a></li>
<li><a href="/haas">Haas</a></li>
<li><a href="/kicksauber">Kick Sauber</a></li>
<li><a href="/mclaren">Mclaren</a></li>
<li><a href="/mercedes">Mercedes</a></li>
<li><a href="/redbull">Redbull</a></li>
<li><a href="/visacashapprb">Visa Cash App RB</a></li>
<li><a href="/williams">Williams</a></li>
</ul>
</div>
</li>
<li><a href="<https://different-cashew-851.notion.site/Channy-s-F1-Lab-9e87c55859d44c2d9e4ef56a1c25b67c?pvs=4>"
target="_blank">Lab</a></li>
</ul>
</nav>
</header>
<main>
<div class="car-container">
<img src="{{ url_for('static', filename='asset/images/Cars/jpg/mercedes.jpeg') }}" alt="Mercedes Car">
<div class="car-text">
<h2>Mercedes-AMG F1 W15 E Performance</h2>
<div class="car-details">
<ul>
<li><strong>Length:</strong> 5500mm</li>
<li><strong>Width:</strong> 2000mm</li>
<li><strong>Height:</strong> 970mm</li>
<li><strong>Weight:</strong> 798kg</li>
<li><strong>Engine:</strong> V6</li>
<li><strong>Technical Director:</strong> James Allison</li>
</ul>
</div>
</div>
</div>
<!-- Mercedes Team Information Section -->
<section class="mercedes-info">
<h2>Mercedes Information</h2>
<!-- Drivers Section -->
<div class="driver-images">
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Mercedes/hamilton.avif') }}" alt="Lewis Hamilton">
<div class="driver-number">44</div>
<div class="driver-name">Lewis Hamilton</div>
</div>
<div class="driver-card">
<img src="{{ url_for('static', filename='asset/images/Teams/Mercedes/russell.avif') }}" alt="George Russell">
<div class="driver-number">63</div>
<div class="driver-name">George Russell</div>
</div>
</div>
<!-- Famous Car Section -->
<div class="famous-sections">
<!-- Famous Car Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Mercedes/famouscar.avif') }}" alt="Mercedes W11">
<div class="info-content">
<h3>Famous Car – W11</h3>
<p>The W11 became an icon of technical excellence, featuring groundbreaking aerodynamic design and the power of Mercedes’ hybrid engine. Winning 13 of 17 races in 2020, it helped Mercedes secure its seventh consecutive Constructors' title and Hamilton’s record-tying seventh Drivers’ Championship.</p>
</div>
</div>
<!-- Famous Driver Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Mercedes/famousdriver.avif') }}" alt="Lewis Hamilton">
<div class="info-content">
<h3>Famous Driver – Lewis Hamilton</h3>
<p>Hamilton’s skill and consistency have made him synonymous with Mercedes’ success, where he has set multiple records, including the highest number of pole positions. His dedication and social impact have elevated him as a global ambassador for the sport.</p>
</div>
</div>
<!-- Base Section -->
<div class="info-box">
<img src="{{ url_for('static', filename='asset/images/Teams/Mercedes/base.jpg') }}" alt="Mercedes Base">
<div class="info-content">
<h3>Base – Brackley, United Kingdom</h3>
<p>Mercedes' headquarters are located in Brackley, UK. The facility is known for its advanced technology and is the primary base for developing and maintaining Mercedes' F1 cars.</p>
</div>
</div>
</div>
<!-- Team Leadership Section -->
<section class="team-leadership">
<h2>Team Leadership</h2>
<div class="leadership-cards">
<!-- Team Chief Card -->
<div class="leadership-card">
<h3>Toto Wolff</h3>
<p>Team Chief</p>
<p>Toto Wolff leads the team with a strategic vision, focusing on maintaining Mercedes' dominance in the F1 grid and supporting innovation within the team.</p>
</div>
<!-- Technical Chief Card -->
<div class="leadership-card">
<h3>James Allison</h3>
<p>Technical Chief</p>
<p>James Allison oversees technical operations, ensuring engineering excellence and innovative advancements to maximize Mercedes' performance on the track.</p>
</div>
</div>
</section>
</section>
<div class="container mt-5 car-specs">
<h3>Technical Specifications</h3>
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Monocoque
</button>
</h5>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
Moulded carbon fibre and honeycomb composite structure
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Bodywork
</button>
</h5>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
Carbon fibre composite including engine cover, sidepods, floor, nose, front wing, and rear wing
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Cockpit
</button>
</h5>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body">
Removable driver's seat made of anatomically formed carbon composite, six-point driver safety harness, HANS system
</div>
</div>
</div>
<!-- Add more cards here for other specifications -->
<div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Safety Structures
</button>
</h5>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
<div class="card-body">
Cockpit survival cell incorporating impact-resistant construction and penetration panels, front impact structure, prescribed side impact structures, integrated rear impact structure, front and rear roll structures, titanium driver protection structure (halo)
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Front Suspension
</button>
</h5>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordion">
<div class="card-body">
Carbon fibre wishbone and push rod-activated springs and dampers
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSix">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
Rear Suspension
</button>
</h5>
</div>
<div id="collapseSix" class="collapse" aria-labelledby="headingSix" data-parent="#accordion">
<div class="card-body">
Carbon fibre wishbone and push rod-activated inboard springs & dampers
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
Wheels
</button>
</h5>
</div>
<div id="collapseSeven" class="collapse" aria-labelledby="headingSeven" data-parent="#accordion">
<div class="card-body">
BBS forged magnesium
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEight">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEight" aria-expanded="false" aria-controls="collapseEight">
Tyres
</button>
</h5>
</div>
<div id="collapseEight" class="collapse" aria-labelledby="headingEight" data-parent="#accordion">
<div class="card-body">
Pirelli
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNine">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNine" aria-expanded="false" aria-controls="collapseNine">
Brake System
</button>
</h5>
</div>
<div id="collapseNine" class="collapse" aria-labelledby="headingNine" data-parent="#accordion">
<div class="card-body">
Carbone Industries Carbon / Carbon discs and pads with rear brake-by-wire. Brembo monobloc calipers in nickel-plated aluminium alloy machined from solid block (front and rear)
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEleven">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEleven" aria-expanded="false" aria-controls="collapseEleven">
Steering
</button>
</h5>
</div>
<div id="collapseEleven" class="collapse" aria-labelledby="headingEleven" data-parent="#accordion">
<div class="card-body">
Power-assisted rack and pinion
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwelve">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwelve" aria-expanded="false" aria-controls="collapseTwelve">
Steering Wheel
</button>
</h5>
</div>
<div id="collapseTwelve" class="collapse" aria-labelledby="headingTwelve" data-parent="#accordion">
<div class="card-body">
Carbon fibre construction
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThirteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThirteen" aria-expanded="false" aria-controls="collapseThirteen">
Electronics
</button>
</h5>
</div>
<div id="collapseThirteen" class="collapse" aria-labelledby="headingThirteen" data-parent="#accordion">
<div class="card-body">
FIA standard ECU and FIA homologated electronic and electrical system
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFourteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFourteen" aria-expanded="false" aria-controls="collapseFourteen">
Instrumentation
</button>
</h5>
</div>
<div id="collapseFourteen" class="collapse" aria-labelledby="headingFourteen" data-parent="#accordion">
<div class="card-body">
McLaren Electronic Systems (MES)
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFifteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseFifteen" aria-expanded="false" aria-controls="collapseFifteen">
Fuel System
</button>
</h5>
</div>
<div id="collapseFifteen" class="collapse" aria-labelledby="headingFifteen" data-parent="#accordion">
<div class="card-body">
ATL Kevlar-reinforced rubber bladder
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSixteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSixteen" aria-expanded="false" aria-controls="collapseSixteen">
Lubricants & Fluids
</button>
</h5>
</div>
<div id="collapseSixteen" class="collapse" aria-labelledby="headingSixteen" data-parent="#accordion">
<div class="card-body">
PETRONAS Tutela
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingSeventeen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseSeventeen" aria-expanded="false" aria-controls="collapseSeventeen">
Gearbox
</button>
</h5>
</div>
<div id="collapseSeventeen" class="collapse" aria-labelledby="headingSeventeen" data-parent="#accordion">
<div class="card-body">
Eight speed forward, one reverse unit with carbon fibre main case
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingEighteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseEighteen" aria-expanded="false" aria-controls="collapseEighteen">
Gear Selection
</button>
</h5>
</div>
<div id="collapseEighteen" class="collapse" aria-labelledby="headingEighteen" data-parent="#accordion">
<div class="card-body">
Sequential, semi-automatic, hydraulic activation
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingNineteen">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseNineteen" aria-expanded="false" aria-controls="collapseNineteen">
Clutch
</button>
</h5>
</div>
<div id="collapseNineteen" class="collapse" aria-labelledby="headingNineteen" data-parent="#accordion">
<div class="card-body">
Carbon plate
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwenty">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#Twenty" aria-expanded="false" aria-controls="collapseEighteen">
Engine
</button>
</h5>
</div>
<div id="Twenty" class="collapse" aria-labelledby="Twenty" data-parent="#accordion">
<div class="card-body">
Mercedes-AMG F1 M15 E Performance
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer-content">
<h3>Contact Us</h3>
<p>Email: [email protected]</p>
</div>
<div class="footer-bottom">
<p>© 2024 Channy Kim. All rights reserved. <a href="/releasenotes" target="_blank">Release Notes</a></p>
</div>
<div class="f1-logos">
<ul>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/alpine.png') }}"
alt="Team 1 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/astonmartin.png') }}"
alt="Team 2 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/ferrari.png') }}"
alt="Team 3 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/haas.png') }}"
alt="Team 4 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/sauber.png') }}"
alt="Team 5 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mclaren.png') }}"
alt="Team 6 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/mercedes.png') }}"
alt="Team 7 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/racingbulls.png') }}"
alt="Team 8 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/redbull.png') }}"
alt="Team 9 Logo"></li>
<li><img src="{{ url_for('static', filename='asset/images/Team-logo/williams2.png') }}"
alt="Team 10 Logo"></li>
</ul>
</div>
</footer>
<!-- 부트스트랩 JS -->
<script src="<https://code.jquery.com/jquery-3.5.1.slim.min.js>"></script>
<script src="<https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js>"></script>
<script src="<https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js>"></script>
<!-- 외부 JavaScript 파일 불러오기 -->
<script src="{{ url_for('static', filename='asset/js/index.js') }}"></script>
<script src="{{ url_for('static', filename='asset/js/header.js') }}"></script>
</body>
</html>