Car_Dealership/Safety.html at main · CodeAnup/Car_Dealership · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css ">
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-200">

    <!-- Navbar -->
 <nav class="bg-gray-800 p-2">
    <div class="container mx-auto flex justify-between items-center py-2">
        <ul class="hidden sm:flex space-x-4">
            <li><a href="index.html" class="text-white hover:bg-gray-700 px-3 py-2 rounded">Home</a></li>
            <li><a href="#collections" class="text-white hover:bg-gray-700 px-3 py-2 rounded">Collections</a></li>
        </ul>
        <div class="text-center sm:text-left text-white lg:text-2xl md:text-[23px]">Horizon Auto Group</div>
        <ul class="hidden sm:flex space-x-4">
            <li><a href="#about" class="text-white hover:bg-gray-700 px-3 py-2 rounded">About</a></li>
            <li><a href="#contact" class="text-white hover:bg-gray-700 px-3 py-2 rounded">Contact</a></li>
        </ul>
        <div class="sm:hidden text-white">
            <i class="fa-solid fa-bars pr-2 sm:text-xl cursor-pointer" id="menu-toggle"></i>
        </div>
    </div>
    <div class="hidden sm:hidden transition-max-height duration-300 ease-out" id="mobile-menu">
        <ul class="space-y-2 p-2">
            <li><a href="index.html" class="text-white hover:bg-gray-700 block px-3 py-2 rounded">Home</a></li>
            <li><a href="#collections" class="text-white hover:bg-gray-700 block px-3 py-2 rounded">Collections</a></li>
            <li><a href="#about" class="text-white hover:bg-gray-700 block px-3 py-2 rounded">About</a></li>
            <li><a href="#contact" class="text-white hover:bg-gray-700 block px-3 py-2 rounded">Contact</a></li>
        </ul>
    </div>
</nav>

<div class="mx-w-[1260px] mx-auto">
    <h1 class="text-center py-5 pb-8 text-4xl">Safety Features:</h1><hr>
</div>

<section class="flex flex-col lg:flex-row items-center lg:items-start lg:justify-between mx-w-[1260px] mx-auto p-4 bg-gray-400 odd">
    <img src="https://etimg.etb2bimg.com/photo/77786834.cms" alt="ADAS" class="w-full lg:w-[50%] h-auto object-cover mb-4 lg:mb-0 lg:mr-4">
    <div class="w-full lg:w-[50%]">
        <h1 class="text-4xl lg:text-left mb-4 pb-2">1.] Advanced Driver Assistance Systems (ADAS)</h1>
        <p class="text-lg">Advanced Driver Assistance Systems (ADAS) include features like adaptive cruise control, lane-keeping assist, and automatic emergency braking to enhance driver safety.</p>
    </div>
</section>

<!-- Even numbered section -->
<section class="flex flex-col lg:flex-row items-center lg:items-start lg:justify-between mx-w-[1260px] mx-auto p-4 even">
    <div class="w-full lg:w-[50%]">
        <h1 class="text-4xl lg:text-left mb-4 pb-2">2.] Crash testing rating</h1>
        <p class="text-lg pb-5">At Horizon Auto Group, our vehicles excel in crash test ratings, providing you and your passengers with the highest safety standards through rigorous impact testing and evaluation, ensuring peace of mind on the road.</p>
    </div>
    <img src="https://imgeng.jagran.com/images/2023/dec/ancap1702626880885.jpg" alt="ADAS" class="w-full lg:w-[50%] h-auto object-cover mb-4 lg:mb-0 lg:mr-4">
</section>

<section class="flex flex-col lg:flex-row items-center lg:items-start lg:justify-between mx-w-[1260px] mx-auto p-4 bg-gray-400 odd">
    <img src="https://images.moneycontrol.com/static-mcnews/2021/06/Safety-6-Airbags-770x433.jpg?impolicy=website&width=770&height=431" alt="Air Bags" class="w-full lg:w-[50%] h-auto object-cover mb-4 lg:mb-0 lg:mr-4">
    <div class="w-full lg:w-[50%]">
        <h1 class="text-4xl lg:text-left mb-4 pb-2">3.] Air Bags</h1>
        <p class="text-lg">Horizon Auto Group vehicles are equipped with advanced airbag systems, including front, side, and curtain airbags, ensuring maximum protection and safety for all passengers in the event of a collision.</p>
    </div>
</section>

<section class="flex flex-col lg:flex-row items-center lg:items-start lg:justify-between mx-w-[1260px] mx-auto p-4 even">
    <div class="w-full lg:w-[50%]">
        <h1 class="text-4xl lg:text-left mb-4 pb-2">4.] Child Safety</h1>
        <p class="text-lg pb-5">At Horizon Auto Group, we prioritize child safety with features like ISOFIX mounts, rear door child locks, and advanced seatbelt systems to ensure the utmost protection for your little ones.</p>
    </div>
    <img src="https://www.carandbike.com/_next/image?url=https%3A%2F%2Fc.ndtvimg.com%2F2022-06%2F6q9q2c4_car_625x300_16_June_22.jpg&w=828&q=75" alt="ADAS" class="w-full lg:w-[50%] h-auto object-cover mb-4 lg:mb-0 lg:mr-4">
</section>

<section class="flex flex-col lg:flex-row items-center lg:items-start lg:justify-between mx-w-[1260px] mx-auto p-4 bg-gray-400 odd">
    <img src="https://media.licdn.com/dms/image/C4D12AQHUyVWBHfWrtQ/article-cover_image-shrink_720_1280/0/1644307923783?e=1726099200&v=beta&t=Vv73zdO26XZxxb2PG6cDtsWWNE91lchSOdIqSESYImg" alt="Air Bags" class="w-full lg:w-[50%] h-auto object-cover mb-4 lg:mb-0 lg:mr-4">
    <div class="w-full lg:w-[50%]">
        <h1 class="text-4xl lg:text-left mb-4 pb-2">5.] Auto Poilet</h1>
        <p class="text-lg">Autopilot systems automate driving tasks like steering, acceleration, and braking in certain conditions, enhancing convenience and safety by reducing driver workload, though they require driver supervision for safe operation.</p>
    </div>
</section>

<section class="flex flex-col lg:flex-row items-center lg:items-start lg:justify-between mx-w-[1260px] mx-auto p-4 even">
    <div class="w-full lg:w-[50%]">
        <h1 class="text-4xl lg:text-left mb-4 pb-2">6.] Blind Spot Monitering</h1>
        <p class="text-lg pb-5">Blind spot monitoring systems in our vehicles use sensors to detect nearby vehicles outside the driver's field of view, providing alerts to enhance safety during lane changes and reducing the risk of accidents.</p>
    </div>
    <img src="https://www.kbb.com/wp-content/uploads/2020/08/636390095186612150-Blind-spot-monitoring-e1560213971965.jpg?w=918" alt="ADAS" class="w-full lg:w-[50%] h-auto object-cover mb-4 lg:mb-0 lg:mr-4">
</section>

<section class="flex flex-col lg:flex-row items-center lg:items-start lg:justify-between mx-w-[1260px] mx-auto p-4 bg-gray-400 odd">
    <img src="https://etimg.etb2bimg.com/photo/73308832.cms" alt="Air Bags" class="w-full lg:w-[50%] h-auto object-cover mb-4 lg:mb-0 lg:mr-4">
    <div class="w-full lg:w-[50%]">
        <h1 class="text-4xl lg:text-left mb-4 pb-2">7.] Pedestrian Detection</h1>
        <p class="text-lg">Autopilot systems automate driving tasks like steering, acceleration, and braking in certain conditions, enhancing convenience and safety by reducing driver workload, though they require driver supervision for safe operation.</p>
    </div>
</section>

<hr><div class="container mx-auto py-8">
    <h2 class="text-2xl font-bold mb-4 pl-3 text-center sm:text-left">Leave a Reply</h2>
    <p class="mb-4 pl-3 text-center sm:text-left pb-2">Your email address will not be published. Required fields are marked *</p>

    <form class="flex flex-wrap mb-4">
        <div class="w-full md:w-1/2 px-3 mb-6 md:mb-0">
            <label for="name" class="block text-gray-700 text-sm font-bold mb-2">Name *</label>
            <input type="text" id="name" name="name" class="w-full px-3 py-2 border rounded-md text-gray-700 focus:outline-none focus:border-blue-500">
        </div>
        <div class="w-full md:w-1/2 px-3 mb-6 md:mb-0">
            <label for="email" class="block text-gray-700 text-sm font-bold mb-2">Email Address *</label>
            <input type="email" id="email" name="email" class="w-full px-3 py-2 border rounded-md text-gray-700 focus:outline-none focus:border-blue-500">
        </div>
    </form>

    <div class="mb-4 pr-3 pl-3">
        <label for="comment" class="block text-gray-700 text-sm font-bold mb-2">Comment</label>
        <textarea id="comment" name="comment" rows="4" class="w-full px-3 py-2 border rounded-md text-gray-700 focus:outline-none focus:border-blue-500"></textarea>
    </div>

    <button type="submit" class="bg-gray-500 hover:bg-blue-700 text-white px-4 py-2 ml-4 rounded-md hover:scale-110 duration-500">Submit</button>
</div>

<!-- end -->
 <hr><section>
    <div class="container mx-auto bg-gray-500">
        <div class="terms bg-white shadow-md rounded-md p-6">
            <h2 class="text-2xl font-bold mb-4">Terms and Conditions</h2>
            <p class="mb-4">Users must agree to terms and conditions; content accuracy not guaranteed and subject to change without notice.</p>
            <p class="mb-4">Horizon Auto Group is not liable for any damages arising from the use or inability to use the website.</p>
            <p class="mb-4">All website content, including logos and images, is protected by copyright and must not be used without permission.</p>
            <p class="mb-4">Users must not post any unlawful, harmful, or offensive material; such content will be removed.</p>
            <p class="mb-4">By using this website, you agree to comply with all applicable laws and regulations governing its use.</p>
        </div>
        <div class="mt-8 text-center text-white pb-8">
            <p>&copy; 2024 Horizon Auto Group. All rights reserved.</p>
        </div>
    </div>
 </section>

<script src="safety.js"></script>
</body>
</html>