-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathlogobiz.html
140 lines (137 loc) · 16 KB
/
logobiz.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" type="image/jpg" href="favicon.png"/>
<link rel="stylesheet" href="./packages/shared.css">
<link rel="stylesheet" href="logbiz.css">
<title>LogiBiz</title>
</head>
<body>
<header class="main-header">
<div>
<a class="brand-logo" href="">LogiBiz</a>
</div>
<nav class="main-nav">
<ul class="main-nav-links">
<li class="main-nav-link">
<a href="./packages/index.html">Packages</a>
</li>
<li class="main-nav-link">
<a href="customers/index.html">Customer</a>
</li>
<li class="main-nav-link main-nav-link-cta">
<a href="">Join Now!</a>
</li>
</ul>
</nav>
</header>
<main>
<div class="overview">
<h1>Greater Logistics</h1>
</div>
<div class="plans">
<h2 class="plans-title">Choose A Plan</h2>
<div>
<article class="plan">
<h2 class="plan-title">FREE</h2>
<h3 class="plan-price">$0/month</h3>
<h3>For small deliveries</h3>
<ul class="plan-features">
<li>1 rider</li>
<li>lorem lorem</li>
<li>lorem lorem</li>
<li>lorem lorem</li>
</ul>
<button>
CHOOSE PLAN
</button>
</article>
<article class="plan plan-highlighted">
<h2 class="recommended">recommended</h2>
<h2 class="plan-title">PLUS</h2>
<h3 class="plan-price">$30/month</h3>
<h3>For medium deliveries</h3>
<ul class="plan-features">
<li>5 riders</li>
<li>lorem lorem</li>
<li>lorem lorem</li>
<li>lorem lorem</li>
</ul>
<button>
CHOOSE PLAN
</button>
</article>
<article class="plan">
<h2 class="plan-title">PREMIUM</h2>
<h3 class="plan-price">$50/month</h3>
<h3>For major deliveries</h3>
<ul class="plan-features">
<li></li>
<li>10 riders</li>
<li>lorem lorem</li>
<li>lorem lorem</li>
</ul>
<button>
CHOOSE PLAN
</button>
</article>
</div>
</div>
<div id="key-features">
<h1 class="key-features-title">Great Reasons To Stick Around</h1>
<ul class="key-features-list">
<li class="key-feature left">
<div><svg width="96" height="96" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_103_11)">
<path d="M95.265 68.985H89.625V22.5C89.625 18.585 86.46 15.405 82.545 15.405H13.47C9.555 15.405 6.375 18.585 6.375 22.5V68.985H0.735C0.33 68.985 0 69.315 0 69.72V73.65C0 77.49 3.135 80.61 6.975 80.61H89.055C92.895 80.61 96.015 77.49 96.015 73.65V69.72C96 69.315 95.685 68.985 95.265 68.985ZM83.805 68.985H62.175C61.77 68.985 61.44 69.315 61.44 69.72V74.16H34.56V69.72C34.56 69.315 34.245 68.985 33.825 68.985H12.21V22.5C12.21 21.81 12.765 21.255 13.455 21.255H82.53C83.205 21.255 83.775 21.81 83.775 22.5V68.985H83.805Z" fill="#3A459B"/>
<path d="M73.6501 45.345L66.8851 36.585C65.6551 34.995 63.8101 34.095 61.8001 34.095H57.6151C56.7751 34.095 56.0851 34.77 56.0851 35.625V46.335C56.0851 46.335 56.0851 46.35 56.1001 46.35V50.52H30.9751C30.1201 50.52 29.4451 51.195 29.4451 52.05V57.24H29.1001C28.2451 57.24 27.5701 57.93 27.5701 58.77C27.5701 59.625 28.2451 60.3 29.1001 60.3H35.2201C35.8801 62.325 37.7701 63.81 40.0051 63.81C42.2401 63.81 44.1301 62.34 44.7751 60.3H60.5851C61.2451 62.325 63.1201 63.81 65.3551 63.81C67.5901 63.81 69.4801 62.34 70.1251 60.3H73.5901C75.0601 60.3 76.2601 59.1 76.2601 57.63V50.145C76.2601 48.9 75.7951 47.73 74.9851 46.815L73.6501 45.345ZM59.1451 37.155H61.8001C62.8501 37.155 63.8251 37.635 64.4701 38.46L69.3601 44.805H59.1301V37.155H59.1451ZM40.0201 60.75C38.9401 60.75 38.0401 59.88 38.0401 58.785V58.77C38.0401 57.675 38.9251 56.79 40.0201 56.79C41.1001 56.79 42.0001 57.675 42.0001 58.77C41.9851 59.865 41.1001 60.75 40.0201 60.75ZM65.3701 60.75C64.2901 60.75 63.3901 59.88 63.3901 58.785C63.3901 58.77 63.3901 58.77 63.3901 58.77C63.3901 57.69 64.2751 56.79 65.3701 56.79C66.4651 56.79 67.3501 57.675 67.3501 58.77C67.3351 59.865 66.4501 60.75 65.3701 60.75ZM40.9201 37.14C40.9201 36.3 40.2301 35.61 39.3901 35.61H22.6501C21.8101 35.61 21.1201 36.3 21.1201 37.14C21.1201 37.98 21.8101 38.67 22.6501 38.67H39.3901C40.2451 38.67 40.9201 37.98 40.9201 37.14Z" fill="#3A459B"/>
<path d="M45.3301 41.535C45.3301 40.695 44.6401 40.005 43.8001 40.005H27.0451C26.2051 40.005 25.5151 40.695 25.5151 41.535C25.5151 42.375 26.2051 43.065 27.0451 43.065H43.8001C44.6401 43.065 45.3301 42.39 45.3301 41.535ZM28.8151 46.035C28.8151 46.875 29.5051 47.565 30.3451 47.565H47.1001C47.9401 47.565 48.6301 46.875 48.6301 46.035C48.6301 45.195 47.9401 44.505 47.1001 44.505H30.3451C29.5051 44.505 28.8151 45.195 28.8151 46.035Z" fill="#3A459B"/>
</g>
<defs>
<clipPath id="clip0_103_11">
<rect width="96" height="96" fill="white"/>
</clipPath>
</defs>
</svg>
</div>
<p class="key-paragraph">830,000 Trusting Customers</p>
</li>
<li class="key-feature middle">
<div>
<svg width="96" height="96" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M48 96C74.5097 96 96 74.5097 96 48C96 21.4903 74.5097 0 48 0C21.4903 0 0 21.4903 0 48C0 74.5097 21.4903 96 48 96Z" fill="#245372"/>
<path d="M48.0001 65.205C47.8351 65.205 47.6701 65.16 47.5351 65.085L27.7951 53.595C27.5101 53.43 27.3301 53.115 27.3301 52.785V29.82C27.3301 29.49 27.5101 29.175 27.7951 29.01C28.0801 28.845 28.4401 28.845 28.7251 29.01L48.4651 40.5C48.7501 40.665 48.9301 40.98 48.9301 41.31V64.275C48.9301 64.605 48.7501 64.92 48.4651 65.085C48.3151 65.16 48.1651 65.205 48.0001 65.205ZM29.1901 52.26L47.0701 62.655V41.85L29.1901 31.455V52.26Z" fill="white"/>
<path d="M47.9999 42.24C47.6849 42.24 47.3699 42.075 47.1899 41.775C46.9349 41.325 47.0849 40.755 47.5199 40.5L55.7549 35.715C56.2049 35.46 56.7749 35.61 57.0299 36.045C57.2849 36.495 57.1349 37.065 56.6999 37.32L48.4649 42.105C48.3149 42.195 48.1649 42.24 47.9999 42.24ZM47.9999 65.205C47.6849 65.205 47.3699 65.04 47.1899 64.74C46.9349 64.29 47.0849 63.72 47.5199 63.465L66.7949 52.26V31.44L61.3349 34.62C60.8849 34.875 60.3149 34.725 60.0599 34.29C59.8049 33.84 59.9549 33.27 60.3899 33.015L67.2449 29.025C67.5299 28.86 67.8899 28.86 68.1749 29.025C68.4599 29.19 68.6399 29.505 68.6399 29.835V52.8C68.6399 53.13 68.4599 53.445 68.1749 53.61L48.4349 65.085C48.3149 65.16 48.1649 65.205 47.9999 65.205Z" fill="white"/>
<path d="M67.7401 30.75C67.5751 30.75 67.4101 30.705 67.2751 30.615L48.0001 19.26L28.7251 30.615C28.2751 30.87 27.7051 30.735 27.4501 30.285C27.1951 29.835 27.3301 29.265 27.7801 29.01L47.5201 17.37C47.8051 17.205 48.1801 17.205 48.4651 17.37L68.2051 29.01C68.6551 29.265 68.7901 29.85 68.5351 30.285C68.3701 30.585 68.0701 30.75 67.7401 30.75Z" fill="white"/>
<path d="M56.2348 44.43C56.0698 44.43 55.9198 44.385 55.7698 44.31C55.4848 44.145 55.3048 43.83 55.3048 43.5V37.035L36.7648 25.305C36.3298 25.035 36.1948 24.45 36.4798 24.015C36.7498 23.58 37.3348 23.445 37.7698 23.73L56.7448 35.73C57.0148 35.895 57.1798 36.195 57.1798 36.51V41.865L59.9548 40.23V34.32L41.3848 22.575C40.9498 22.305 40.8148 21.72 41.0998 21.285C41.3698 20.85 41.9548 20.715 42.3898 21L61.3948 33.03C61.6648 33.195 61.8298 33.495 61.8298 33.81V40.77C61.8298 41.1 61.6498 41.4 61.3648 41.58L56.7148 44.31C56.5648 44.385 56.3998 44.43 56.2348 44.43ZM52.1098 57.495C51.5998 57.495 51.1798 57.075 51.1798 56.565V52.755C51.1798 52.245 51.5998 51.825 52.1098 51.825C52.6198 51.825 53.0398 52.245 53.0398 52.755V56.565C53.0398 57.075 52.6348 57.495 52.1098 57.495ZM54.6298 56.16C54.1198 56.16 53.6998 55.74 53.6998 55.23V52.74C53.6998 52.23 54.1198 51.81 54.6298 51.81C55.1398 51.81 55.5598 52.23 55.5598 52.74V55.23C55.5598 55.74 55.1398 56.16 54.6298 56.16ZM28.6348 78.75C26.3398 78.75 24.4648 76.875 24.4648 74.58C24.4648 72.285 26.3398 70.41 28.6348 70.41C30.9298 70.41 32.8048 72.285 32.8048 74.58C32.8048 76.875 30.9298 78.75 28.6348 78.75ZM28.6348 72.27C27.3598 72.27 26.3248 73.305 26.3248 74.58C26.3248 75.855 27.3598 76.89 28.6348 76.89C29.9098 76.89 30.9448 75.855 30.9448 74.58C30.9448 73.305 29.9098 72.27 28.6348 72.27ZM47.9998 78.75C45.7048 78.75 43.8298 76.875 43.8298 74.58C43.8298 72.285 45.7048 70.41 47.9998 70.41C50.2948 70.41 52.1698 72.285 52.1698 74.58C52.1698 76.875 50.2948 78.75 47.9998 78.75ZM47.9998 72.27C46.7248 72.27 45.6898 73.305 45.6898 74.58C45.6898 75.855 46.7248 76.89 47.9998 76.89C49.2748 76.89 50.3098 75.855 50.3098 74.58C50.3098 73.305 49.2748 72.27 47.9998 72.27ZM67.3648 78.75C65.0698 78.75 63.1948 76.875 63.1948 74.58C63.1948 72.285 65.0698 70.41 67.3648 70.41C69.6598 70.41 71.5348 72.285 71.5348 74.58C71.5348 76.875 69.6748 78.75 67.3648 78.75ZM67.3648 72.27C66.0898 72.27 65.0548 73.305 65.0548 74.58C65.0548 75.855 66.0898 76.89 67.3648 76.89C68.6398 76.89 69.6748 75.855 69.6748 74.58C69.6748 73.305 68.6398 72.27 67.3648 72.27Z" fill="white"/>
<path d="M44.7598 75.51H31.8748C31.3648 75.51 30.9448 75.09 30.9448 74.58C30.9448 74.07 31.3648 73.65 31.8748 73.65H44.7598C45.2698 73.65 45.6898 74.07 45.6898 74.58C45.6898 75.09 45.2698 75.51 44.7598 75.51ZM64.1248 75.51H51.2398C50.7298 75.51 50.3098 75.09 50.3098 74.58C50.3098 74.07 50.7298 73.65 51.2398 73.65H64.1248C64.6348 73.65 65.0548 74.07 65.0548 74.58C65.0548 75.09 64.6348 75.51 64.1248 75.51Z" fill="white"/>
<path d="M47.9998 72.27C47.4898 72.27 47.0698 71.85 47.0698 71.34V67.17C47.0698 66.66 47.4898 66.24 47.9998 66.24C48.5098 66.24 48.9298 66.66 48.9298 67.17V71.34C48.9298 71.85 48.5098 72.27 47.9998 72.27Z" fill="white"/>
</svg>
</div>
<p>99% Uptime Guarantee</p>
</li>
<li class="key-feature">
<div>
<svg width="96" height="96" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M48 96C74.5097 96 96 74.5097 96 48C96 21.4903 74.5097 0 48 0C21.4903 0 0 21.4903 0 48C0 74.5097 21.4903 96 48 96Z" fill="#245372"/>
<path d="M48.0001 65.205C47.8351 65.205 47.6701 65.16 47.5351 65.085L27.7951 53.595C27.5101 53.43 27.3301 53.115 27.3301 52.785V29.82C27.3301 29.49 27.5101 29.175 27.7951 29.01C28.0801 28.845 28.4401 28.845 28.7251 29.01L48.4651 40.5C48.7501 40.665 48.9301 40.98 48.9301 41.31V64.275C48.9301 64.605 48.7501 64.92 48.4651 65.085C48.3151 65.16 48.1651 65.205 48.0001 65.205ZM29.1901 52.26L47.0701 62.655V41.85L29.1901 31.455V52.26Z" fill="white"/>
<path d="M47.9999 42.24C47.6849 42.24 47.3699 42.075 47.1899 41.775C46.9349 41.325 47.0849 40.755 47.5199 40.5L55.7549 35.715C56.2049 35.46 56.7749 35.61 57.0299 36.045C57.2849 36.495 57.1349 37.065 56.6999 37.32L48.4649 42.105C48.3149 42.195 48.1649 42.24 47.9999 42.24ZM47.9999 65.205C47.6849 65.205 47.3699 65.04 47.1899 64.74C46.9349 64.29 47.0849 63.72 47.5199 63.465L66.7949 52.26V31.44L61.3349 34.62C60.8849 34.875 60.3149 34.725 60.0599 34.29C59.8049 33.84 59.9549 33.27 60.3899 33.015L67.2449 29.025C67.5299 28.86 67.8899 28.86 68.1749 29.025C68.4599 29.19 68.6399 29.505 68.6399 29.835V52.8C68.6399 53.13 68.4599 53.445 68.1749 53.61L48.4349 65.085C48.3149 65.16 48.1649 65.205 47.9999 65.205Z" fill="white"/>
<path d="M67.7401 30.75C67.5751 30.75 67.4101 30.705 67.2751 30.615L48.0001 19.26L28.7251 30.615C28.2751 30.87 27.7051 30.735 27.4501 30.285C27.1951 29.835 27.3301 29.265 27.7801 29.01L47.5201 17.37C47.8051 17.205 48.1801 17.205 48.4651 17.37L68.2051 29.01C68.6551 29.265 68.7901 29.85 68.5351 30.285C68.3701 30.585 68.0701 30.75 67.7401 30.75Z" fill="white"/>
<path d="M56.2348 44.43C56.0698 44.43 55.9198 44.385 55.7698 44.31C55.4848 44.145 55.3048 43.83 55.3048 43.5V37.035L36.7648 25.305C36.3298 25.035 36.1948 24.45 36.4798 24.015C36.7498 23.58 37.3348 23.445 37.7698 23.73L56.7448 35.73C57.0148 35.895 57.1798 36.195 57.1798 36.51V41.865L59.9548 40.23V34.32L41.3848 22.575C40.9498 22.305 40.8148 21.72 41.0998 21.285C41.3698 20.85 41.9548 20.715 42.3898 21L61.3948 33.03C61.6648 33.195 61.8298 33.495 61.8298 33.81V40.77C61.8298 41.1 61.6498 41.4 61.3648 41.58L56.7148 44.31C56.5648 44.385 56.3998 44.43 56.2348 44.43ZM52.1098 57.495C51.5998 57.495 51.1798 57.075 51.1798 56.565V52.755C51.1798 52.245 51.5998 51.825 52.1098 51.825C52.6198 51.825 53.0398 52.245 53.0398 52.755V56.565C53.0398 57.075 52.6348 57.495 52.1098 57.495ZM54.6298 56.16C54.1198 56.16 53.6998 55.74 53.6998 55.23V52.74C53.6998 52.23 54.1198 51.81 54.6298 51.81C55.1398 51.81 55.5598 52.23 55.5598 52.74V55.23C55.5598 55.74 55.1398 56.16 54.6298 56.16ZM28.6348 78.75C26.3398 78.75 24.4648 76.875 24.4648 74.58C24.4648 72.285 26.3398 70.41 28.6348 70.41C30.9298 70.41 32.8048 72.285 32.8048 74.58C32.8048 76.875 30.9298 78.75 28.6348 78.75ZM28.6348 72.27C27.3598 72.27 26.3248 73.305 26.3248 74.58C26.3248 75.855 27.3598 76.89 28.6348 76.89C29.9098 76.89 30.9448 75.855 30.9448 74.58C30.9448 73.305 29.9098 72.27 28.6348 72.27ZM47.9998 78.75C45.7048 78.75 43.8298 76.875 43.8298 74.58C43.8298 72.285 45.7048 70.41 47.9998 70.41C50.2948 70.41 52.1698 72.285 52.1698 74.58C52.1698 76.875 50.2948 78.75 47.9998 78.75ZM47.9998 72.27C46.7248 72.27 45.6898 73.305 45.6898 74.58C45.6898 75.855 46.7248 76.89 47.9998 76.89C49.2748 76.89 50.3098 75.855 50.3098 74.58C50.3098 73.305 49.2748 72.27 47.9998 72.27ZM67.3648 78.75C65.0698 78.75 63.1948 76.875 63.1948 74.58C63.1948 72.285 65.0698 70.41 67.3648 70.41C69.6598 70.41 71.5348 72.285 71.5348 74.58C71.5348 76.875 69.6748 78.75 67.3648 78.75ZM67.3648 72.27C66.0898 72.27 65.0548 73.305 65.0548 74.58C65.0548 75.855 66.0898 76.89 67.3648 76.89C68.6398 76.89 69.6748 75.855 69.6748 74.58C69.6748 73.305 68.6398 72.27 67.3648 72.27Z" fill="white"/>
<path d="M44.7598 75.51H31.8748C31.3648 75.51 30.9448 75.09 30.9448 74.58C30.9448 74.07 31.3648 73.65 31.8748 73.65H44.7598C45.2698 73.65 45.6898 74.07 45.6898 74.58C45.6898 75.09 45.2698 75.51 44.7598 75.51ZM64.1248 75.51H51.2398C50.7298 75.51 50.3098 75.09 50.3098 74.58C50.3098 74.07 50.7298 73.65 51.2398 73.65H64.1248C64.6348 73.65 65.0548 74.07 65.0548 74.58C65.0548 75.09 64.6348 75.51 64.1248 75.51Z" fill="white"/>
<path d="M47.9998 72.27C47.4898 72.27 47.0698 71.85 47.0698 71.34V67.17C47.0698 66.66 47.4898 66.24 47.9998 66.24C48.5098 66.24 48.9298 66.66 48.9298 67.17V71.34C48.9298 71.85 48.5098 72.27 47.9998 72.27Z" fill="white"/>
</svg>
</div>
<p>Reliable Riders</p>
</li>
</ul>
</div>
</main>
<footer>
<p>CBC DEVS 2022</p>
</footer>
</body>
</html>