|
|
@ -18,23 +18,25 @@ |
|
|
|
.exoskeleton-holder |
|
|
|
.exoskeleton-holder |
|
|
|
img.exoskeleton-holder__img1(src="../assets/images/exoskelet.png" alt="exoskeleton") |
|
|
|
img.exoskeleton-holder__img1(src="../assets/images/exoskelet.png" alt="exoskeleton") |
|
|
|
img.exoskeleton-holder__img2(src="../assets/images/back-exoskeleton.png" alt="back-exoskeleton") |
|
|
|
img.exoskeleton-holder__img2(src="../assets/images/back-exoskeleton.png" alt="back-exoskeleton") |
|
|
|
h2 Exoskeleton |
|
|
|
.exoskeleton-description |
|
|
|
p Cybertruck is built with an exterior shell made for ultimate durability and passenger protection. Starting with a nearly impenetrable exoskeleton, every component is designed for superior strength and endurance, from Ultra-Hard 30X Cold-Rolled stainless-steel structural skin to Tesla armor glass. |
|
|
|
h2.exoskeleton-description__header Exoskeleton |
|
|
|
|
|
|
|
p.exoskeleton-description__text Cybertruck is built with an exterior shell made for ultimate durability and passenger protection. Starting with a nearly impenetrable exoskeleton, every component is designed for superior strength and endurance, from Ultra-Hard 30X Cold-Rolled stainless-steel structural skin to Tesla armor glass. |
|
|
|
.container.skeleton |
|
|
|
.container.skeleton |
|
|
|
img.skeleton__img(src="../assets/images/skelet.png" alt="skeleton") |
|
|
|
img.skeleton__img(src="../assets/images/skelet.png" alt="skeleton") |
|
|
|
.description |
|
|
|
.description |
|
|
|
p ULTRA-HARD 30X COLD-ROLLED STAINLESS STEEL |
|
|
|
p ULTRA-HARD 30X COLD-ROLLED STAINLESS STEEL |
|
|
|
.container.advantages |
|
|
|
.container.advantages |
|
|
|
img.advantages__img1(src="../assets/images/cyber-from-back.png" alt="") |
|
|
|
.advantages-description |
|
|
|
img.advantages__img2(src="../assets/images/cyber-open-back.png" alt="") |
|
|
|
h2.advantages-description__header PERFORMANCE AND EFFICIENCY |
|
|
|
img.advantages__img3(src="../assets/images/cyber-inside.png" alt="") |
|
|
|
p.advantages-description__text Now entering a new class of strength, speed and versatility—only possible with an all-electric design. The powerful drivetrain and low center of gravity provides extraordinary traction control and torque—enabling acceleration from 0-60 mph in as little as 2.9 seconds and up to 500 miles of range. |
|
|
|
.description |
|
|
|
h2.advantages-description__header ADAPTIVE AIR SUSPENSION |
|
|
|
h2 PERFORMANCE AND EFFICIENCY |
|
|
|
p.advantages-description__text Raise and lower suspension four inches in either direction for easy access to Cybertruck or the vault, while self-leveling capabilities adapt to any occasion and assist with every job. |
|
|
|
p Now entering a new class of strength, speed and versatility—only possible with an all-electric design. The powerful drivetrain and low center of gravity provides extraordinary traction control and torque—enabling acceleration from 0-60 mph in as little as 2.9 seconds and up to 500 miles of range. |
|
|
|
h2.advantages-description__header FLEXIBLE INTERIOR |
|
|
|
h2 ADAPTIVE AIR SUSPENSION |
|
|
|
p.advantages-description__text Seat six comfortably with additional storage under the second-row seats. Complete with an advanced 17″ touchscreen with an all-new customized user interface. |
|
|
|
p Raise and lower suspension four inches in either direction for easy access to Cybertruck or the vault, while self-leveling capabilities adapt to any occasion and assist with every job. |
|
|
|
.advantages-img |
|
|
|
h2 FLEXIBLE INTERIOR |
|
|
|
img.advantages-img__img1(src="../assets/images/cyber-from-back.png" alt="") |
|
|
|
p Seat six comfortably with additional storage under the second-row seats. Complete with an advanced 17″ touchscreen with an all-new customized user interface. |
|
|
|
img.advantages-img__img2(src="../assets/images/cyber-open-back.png" alt="") |
|
|
|
|
|
|
|
img.advantages-img__img3(src="../assets/images/cyber-inside.png" alt="") |
|
|
|
.vid-descr |
|
|
|
.vid-descr |
|
|
|
video.vid-descr__vid(src="http://infoviolence.org/ru/vblog/v720view/infoviolence_041.mp4" autoplay controls) |
|
|
|
video.vid-descr__vid(src="http://infoviolence.org/ru/vblog/v720view/infoviolence_041.mp4" autoplay controls) |
|
|
|
h2.vid-descr__descr CYBERTRACK |
|
|
|
h2.vid-descr__descr CYBERTRACK |
|
|
@ -78,6 +80,7 @@ |
|
|
|
overflow: hidden; |
|
|
|
overflow: hidden; |
|
|
|
max-height: 1000px; |
|
|
|
max-height: 1000px; |
|
|
|
height: 100vh; |
|
|
|
height: 100vh; |
|
|
|
|
|
|
|
margin-bottom: 245px; |
|
|
|
|
|
|
|
|
|
|
|
&__bg { |
|
|
|
&__bg { |
|
|
|
height: 100%; |
|
|
|
height: 100%; |
|
|
@ -140,22 +143,53 @@ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.exoskeleton { |
|
|
|
.exoskeleton { |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
max-width: 1337px; |
|
|
|
|
|
|
|
max-height: 635px; |
|
|
|
|
|
|
|
margin-bottom: 245px; |
|
|
|
|
|
|
|
padding-bottom: 193px; |
|
|
|
|
|
|
|
|
|
|
|
&-holder { |
|
|
|
&-holder { |
|
|
|
|
|
|
|
|
|
|
|
&__img1 { |
|
|
|
&__img1 { |
|
|
|
max-height: 442px; |
|
|
|
max-height: 442px; |
|
|
|
max-width: 745px; |
|
|
|
max-width: 745px; |
|
|
|
|
|
|
|
margin: 0 75px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&__img2 { |
|
|
|
&__img2 { |
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
bottom: 0; |
|
|
|
|
|
|
|
left: -25px; |
|
|
|
max-height: 234px; |
|
|
|
max-height: 234px; |
|
|
|
max-width: 401px; |
|
|
|
max-width: 401px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
&-description { |
|
|
|
|
|
|
|
&__header { |
|
|
|
|
|
|
|
font-weight: 600; |
|
|
|
|
|
|
|
font-size: 30px; |
|
|
|
|
|
|
|
line-height: 37px; |
|
|
|
|
|
|
|
letter-spacing: 0.025em; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
margin-top: 0; |
|
|
|
|
|
|
|
margin-bottom: 45px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
&__text { |
|
|
|
|
|
|
|
max-width: 290px; |
|
|
|
|
|
|
|
font-weight: 300; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 24px; |
|
|
|
|
|
|
|
letter-spacing: 0.025em; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.skeleton { |
|
|
|
.skeleton { |
|
|
|
|
|
|
|
margin-bottom: 246px; |
|
|
|
&__img { |
|
|
|
&__img { |
|
|
|
max-height: 296px; |
|
|
|
max-height: 296px; |
|
|
|
max-width: 996px; |
|
|
|
max-width: 996px; |
|
|
@ -164,30 +198,66 @@ |
|
|
|
font-weight: 600; |
|
|
|
font-weight: 600; |
|
|
|
font-size: 20px; |
|
|
|
font-size: 20px; |
|
|
|
line-height: 24px; |
|
|
|
line-height: 24px; |
|
|
|
text-align: right; |
|
|
|
text-align: left; |
|
|
|
letter-spacing: 0.025em; |
|
|
|
letter-spacing: 0.025em; |
|
|
|
text-transform: uppercase; |
|
|
|
text-transform: uppercase; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.advantages { |
|
|
|
.advantages { |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
position: relative; |
|
|
|
margin-bottom: 246px; |
|
|
|
margin-bottom: 246px; |
|
|
|
|
|
|
|
max-width: 1240px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
&-description { |
|
|
|
|
|
|
|
max-width: 585px; |
|
|
|
|
|
|
|
&__header { |
|
|
|
|
|
|
|
font-weight: 600; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 24px; |
|
|
|
|
|
|
|
letter-spacing: 0.025em; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
&__text { |
|
|
|
|
|
|
|
font-weight: 300; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 24px; |
|
|
|
|
|
|
|
letter-spacing: 0.025em; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
margin-bottom: 91px; |
|
|
|
|
|
|
|
&:last-child { |
|
|
|
|
|
|
|
margin-bottom: 0; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
&-img { |
|
|
|
&__img1 { |
|
|
|
&__img1 { |
|
|
|
max-height: 305px; |
|
|
|
max-height: 305px; |
|
|
|
max-width: 545px; |
|
|
|
max-width: 545px; |
|
|
|
|
|
|
|
margin-left: 63px; |
|
|
|
|
|
|
|
margin-right: 45px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&__img2 { |
|
|
|
&__img2 { |
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
top: 275px; |
|
|
|
|
|
|
|
right: 0; |
|
|
|
max-height: 251px; |
|
|
|
max-height: 251px; |
|
|
|
max-width: 502px; |
|
|
|
max-width: 502px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&__img3 { |
|
|
|
&__img3 { |
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
bottom: 0; |
|
|
|
|
|
|
|
right: 220px; |
|
|
|
max-height: 188px; |
|
|
|
max-height: 188px; |
|
|
|
max-width: 376px; |
|
|
|
max-width: 376px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.vid-descr { |
|
|
|
.vid-descr { |
|
|
|
display: flex; |
|
|
|
display: flex; |
|
|
|