@font-face{font-family:MyFont;src:url(/LaFerrari-3D-Animated-Website/font/ferro-rosso/FerroRosso.ttf) format("truetype");font-weight:400;font-style:normal}*{margin:0;padding:0}body::-webkit-scrollbar{display:none}html{scroll-behavior:smooth;touch-action:pan-y;overscroll-behavior-y:contain}html,body{scroll-snap-type:y mandatory;overflow-y:scroll;height:100vh;scroll-behavior:smooth;margin:0;padding:0}body{margin:0;padding:0;height:100%;width:100dvw;background-color:#000;overflow-x:hidden}.snap-section{height:100vh;scroll-snap-align:start}body.no-scroll{overflow:hidden}.loader-container.hide-loader{opacity:0;visibility:hidden}@keyframes loader-animation{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.5}to{transform:scale(1);opacity:1}}.loader-container{background-color:#000;color:#fff;position:absolute;top:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;height:100dvh;width:100dvw}.loader-container .loader{width:90%;display:flex;align-items:center;justify-content:center;column-gap:30px}.loader-container .loader div{font-size:50px;font-family:MyFont,sans-serif;font-weight:900;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.5),0 0 20px rgba(255,255,255,.3)}.loader-container .loader div:nth-child(1){animation:loader-animation 1.5s ease-in-out infinite;animation-delay:0s}.loader-container .loader div:nth-child(2){animation:loader-animation 1.5s ease-in-out infinite;animation-delay:.2s}.loader-container .loader div:nth-child(3){animation:loader-animation 1.5s ease-in-out infinite;animation-delay:.4s}.loader-container .loader div:nth-child(4){animation:loader-animation 1.5s ease-in-out infinite;animation-delay:.6s}.loader-container .loader div:nth-child(5){animation:loader-animation 1.5s ease-in-out infinite;animation-delay:.8s}.loader-container .loader div:nth-child(6){animation:loader-animation 1.5s ease-in-out infinite;animation-delay:1s}.loader-container .loader div:nth-child(7){animation:loader-animation 1.5s ease-in-out infinite;animation-delay:1.2s}.prgress_dots{width:auto;height:auto;position:fixed;left:1%;bottom:2%;display:flex;flex-direction:column;align-items:flex-start;gap:10px;z-index:555}.dot-wrapper{display:flex;align-items:center;gap:8px}.dot{width:7px;height:7px;border:2px solid rgba(128,128,128,.477);background:#000;border-radius:50%;cursor:pointer;transition:transform .2s ease,background-color .2s ease}.dot.active{background-color:red;transform:scale(1.4)}.dot-label{opacity:0;transition:opacity .3s ease;display:inline-block;white-space:nowrap;color:red;font-weight:600;font-size:14px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.dot.active+.dot-label{opacity:1}.dot-label:before{content:"";display:inline-block;width:20px;height:1px;background-color:#fff;margin-right:6px;vertical-align:middle}.carInfo h1{opacity:0;transform:scale(.9);transition:all .6s ease-out}.carInfo.visible h1{opacity:1;transform:scale(1)}.car_name_container,.car_feature_info_container,.car_tire_container,.car_engin_container{opacity:0;transform:translateY(40px);transition:all .6s ease-out}.visible{opacity:1;transform:translateY(0)}main{width:100dvw;position:relative;display:flex;justify-content:center}main section{width:100dvw;display:flex;justify-content:center;flex-direction:column;scroll-snap-align:start}.rander{width:100dvw;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.wbgl{display:block;width:100vw;height:100vh;position:fixed;top:0;animation:first_car_animation 3s ease-in-out;background-color:transparent;pointer-events:none}.wbgl.active-controls{pointer-events:auto}main .car_brande{display:flex;align-items:center;justify-content:center;z-index:0;width:100%;height:100dvh;position:relative;z-index:20;background-color:#000}main .car_brande h1{color:#ffffffb8;font-size:7em;font-family:MyFont,sans-serif;font-weight:900;mix-blend-mode:exclusion;background-image:linear-gradient(to right bottom,#828282,#fff);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-weight:400;text-shadow:0 0 10px rgba(255,255,255,.5),0 0 20px rgba(255,255,255,.3);text-align:center;-webkit-user-select:none;user-select:none}main .car_name_container{width:100%;height:100dvh;display:flex;justify-content:center;background-image:linear-gradient(to top right,#000,#000,#2c00005f,#2c0000,#400000,#780000,#a50000)}main .car_name_container .car_name{width:100%;height:auto;margin-top:20px;position:relative;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center}main .car_name_container .car_name h1{text-align:center;color:#fff;font-size:20em;font-family:Tektur,sans-serif;animation:car_name-animation 2s ease-in-out;width:100%;text-shadow:0 0 10px rgba(255,255,255,.5),0 0 20px rgba(255,255,255,.3);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-image:linear-gradient(to right bottom,#0000,#fff);font-weight:500;margin-top:-20px;-webkit-user-select:none;user-select:none}main .car_name_container .car_name img{width:5%;height:auto;z-index:-1;opacity:.8}main .car_name_container .car_name p{color:#ffffff68;position:relative;width:60%;font-size:17px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center}main .car_feature_info_container::-webkit-scrollbar{display:none}main .car_feature_info_container{width:100%;display:flex;flex-direction:column;align-items:flex-end;height:100dvh;z-index:99;background-image:linear-gradient(to bottom,#2c0000,#b40000ae,#000,#b33a3aaf);z-index:-3;overflow-y:scroll}main .car_feature_info_container .car_feature_info{width:100%;height:100dvh;position:relative;text-align:right}main .car_feature_info_container .car_feature_info h1{width:100%;color:#fff;font-size:50px;font-family:Tektur,sans-serif;animation:car_name-animation 2s ease-in-out;text-align:center;margin-top:30px}main .car_feature_info_container .car_feature_info .feature{width:100%;display:flex;justify-content:center;margin-top:50px;color:#fff;column-gap:0px}main .car_feature_info_container .car_feature_info .feature ul:nth-child(1){list-style:none;display:flex;flex-direction:column;row-gap:20px;align-items:flex-start;padding:40px 200px 50px 0;border-top:2px #ffffffc3 solid;border-right:1px #ffffffc3 solid}main .car_feature_info_container .car_feature_info .feature ul:nth-child(2){list-style:none;display:flex;flex-direction:column;row-gap:20px;align-items:flex-start;padding:40px 0 50px 200px;border-top:2px #ffffffc3 solid;border-left:1px #ffffffc3 solid}main .car_feature_info_container .car_feature_info .feature li{font-size:17px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;justify-content:space-between;width:100%;column-gap:50px;text-align:lef40}main .car_feature_info_container .car_feature_info .feature li span{text-align:left;font-weight:600;font-size:18px}main .car_feature_info_container .car_feature_info .feature li p{font-size:17px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#ffffffe1;font-weight:500;text-align:left}main .car_tire_container{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;height:100dvh;background-image:linear-gradient(to top right,#000,#000,#2c00005f,#2c0000,#400000,#780000,#a50000)}main .car_tire_container .car_tire{color:#fff;font-size:120px;font-family:Courier New,Courier,monospace;animation:car_name-animation 2s ease-in-out;width:50%;position:relative;padding-bottom:10px}main .car_tire_container .car_tire h1{color:#fff;font-size:100px;font-family:Tektur,sans-serif;animation:car_name-animation 2s ease-in-out;margin-left:50px}main .car_tire_container .car_tire p{color:#ffffffc1;width:90%;font-size:20px;margin-left:50px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}main .car_tire_container .car_tire ul{font-size:15px;margin-top:30px;margin-left:50px;display:flex;flex-direction:column;gap:10px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;list-style:none}main .car_tire_container .car_tire ul li{position:relative;padding-left:40px;font-size:15px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin-bottom:10px}main .car_tire_container .car_tire ul li.animated_wheel{animation:animate_wheel .8s linear forwards}@keyframes animate_wheel{0%{margin-left:-50px}to{margin-left:0}}main .car_tire_container .car_tire ul li:before{content:"";position:absolute;left:0;top:0;width:25px;height:25px;background-image:url(/LaFerrari-3D-Animated-Website/image/cropped_circle_image.png);background-size:contain;background-repeat:no-repeat;background-position:center;animation:spin .2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}main .car_engin_container{width:100%;height:100dvh;display:flex;justify-content:center;position:relative;z-index:110;overflow:hidden}main .car_engin_container .car_engin{width:100%;position:relative}main .car_engin_container .car_engin .interior_image{width:100%;height:100%;position:absolute;top:0;left:0}main .car_engin_container .car_engin .interior_image img{width:100%;height:100%;object-fit:cover}main .car_engin_container .car_engin .engin_start_stop_button{top:55%;left:15%;margin:0;padding:0;width:auto;height:auto;position:absolute;border-radius:50%}main .car_engin_container .car_engin .engin_start_stop_button button{width:50px;height:50px;cursor:pointer;border-radius:50%;position:relative;border:none}main .car_engin_container .car_engin .engin_start_stop_button button:before{content:"";position:absolute;right:0%;top:41%;width:10px;height:10px;background-color:#fff;border-radius:50%;z-index:110}main .car_engin_container .car_engin .engin_start_stop_button button:after{content:"";position:absolute;right:-50px;top:50%;width:50px;height:2px;background-color:#fff}main .car_engin_container .car_engin .engin_start_stop_button button img{width:100%;height:100%;position:relative}main .car_engin_container .car_engin .engin_start_stop_button span{position:absolute;top:18%;right:-172px;color:#fff;padding:5px 10px;white-space:nowrap;background-color:#ffffff49;border-radius:3px;font-weight:800;font-size:18px;-webkit-user-select:none;user-select:none;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}main .car_engin_container .car_engin .paddels_container{position:absolute;bottom:3%;left:20%}main .car_engin_container .car_engin .paddels_container .paddel{position:relative;display:flex;align-items:end;gap:30px}main .car_engin_container .car_engin .paddels_container .paddel .brack{width:50px;position:relative}main .car_engin_container .car_engin .paddels_container .paddel .brack:before{content:"";position:absolute;left:-7%;bottom:25%;width:10px;height:10px;background-color:#fff;border-radius:50%;z-index:110}main .car_engin_container .car_engin .paddels_container .paddel .brack:after{content:"";position:absolute;left:-100%;bottom:35%;width:50px;height:2px;background-color:#fff}main .car_engin_container .car_engin .paddels_container .paddel .brack span{position:absolute;bottom:0%;left:-158px;color:#fff;padding:5px 10px;white-space:nowrap;background-color:#ffffff49;border-radius:3px;font-weight:800;font-size:18px;-webkit-user-select:none;user-select:none;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}main .car_engin_container .car_engin .paddels_container .paddel .brack img{width:100%;cursor:pointer}main .car_engin_container .car_engin .paddels_container .paddel .accelerator{width:50px;position:relative}main .car_engin_container .car_engin .paddels_container .paddel .accelerator img{width:100%;cursor:pointer}.paddel .accelerator img:hover,.accelerator-active,.paddel .brack img:hover,.brake-active{transform:rotateX(25deg) translateY(10px) perspective(50px);transition:transform .2s ease}main .car_engin_container .car_engin .paddels_container .paddel .accelerator:before{content:"";position:absolute;right:-7%;bottom:32%;width:10px;height:10px;background-color:#fff;border-radius:50%;z-index:110}main .car_engin_container .car_engin .paddels_container .paddel .accelerator:after{content:"";position:absolute;right:-100%;bottom:35%;width:50px;height:2px;background-color:#fff}main .car_engin_container .car_engin .paddels_container .paddel .accelerator span{position:absolute;bottom:25%;right:-180px;color:#fff;padding:5px 10px;white-space:nowrap;background-color:#ffffff49;border-radius:3px;font-weight:800;font-size:18px;-webkit-user-select:none;user-select:none;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.wbgl2 canvas{width:100%;height:100%;display:block}.carInfo{opacity:0;transform:translateY(30px);transition:opacity .6s ease-out,transform .6s ease-out}.carInfo.visible{opacity:1;transform:translateY(0)}.threeD_view{background-color:#2c0000;width:100%;height:100dvh;position:relative}.threeD_view .wbgl2{display:block;z-index:99;width:100%;height:100%;position:absolute;top:0}.threeD_view h1{text-align:center;color:#fff;font-size:7em;font-family:Tektur,sans-serif;animation:car_name-animation 2s ease-in-out;width:100%;font-weight:500;margin-top:20px}.threeD_view .color{position:absolute;left:0%;bottom:2%;display:flex;justify-content:center;align-items:center;gap:20px;z-index:999;width:100%}.threeD_view .color .color_black{background-color:#000;width:20px;height:20px;border-radius:50%;outline:2px white solid;padding:5px;cursor:pointer}.threeD_view .color .color_black:hover{transform:scale(.8);transition:all .1s ease-in}.threeD_view .color .color_red{background-color:red;width:20px;height:20px;border-radius:50%;outline:2px white solid;padding:5px;cursor:pointer}.threeD_view .color .color_red:hover{transform:scale(.8);transition:all .1s ease-in}.threeD_view .color .color_white{background-color:#fff;width:20px;height:20px;border-radius:50%;outline:2px white solid;padding:5px;cursor:pointer}.threeD_view .color .color_white:hover{transform:scale(.8);transition:all .1s ease-in}@media (max-width:1440px){main .car_name_container .car_name h1{font-size:15em}}@media (max-width:1161px){main .car_name_container .car_name h1{font-size:10em}}@media (max-width:1000px){main .car_name_container .car_name img{width:15%}main .car_feature_info_container{height:100dvh;position:relative;display:flex;align-items:start}main .car_feature_info_container .car_feature_info{height:50dvh}main .car_feature_info_container .car_feature_info h1{font-size:20px}main .car_feature_info_container .car_feature_info .feature{flex-direction:column;align-items:center;justify-content:center}main .car_feature_info_container .car_feature_info .feature ul{padding:0}main .car_feature_info_container .car_feature_info .feature li{font-size:15px}main .car_feature_info_container .car_feature_info .feature ul:nth-child(1),main .car_feature_info_container .car_feature_info .feature ul:nth-child(2){row-gap:20px;padding:15px 10px}main .car_engin_container{background-image:linear-gradient(to top,#350000,#000,#000,#000,#000,#000,#350000);position:relative}main .car_engin_container .car_engin .interior_image{width:100dvw;position:relative}main .car_engin_container .car_engin .engin_start_stop_button button{width:30px;height:30px}main .car_engin_container .car_engin .interior_image img{object-fit:contain;position:absolute;top:0;left:0;height:100dvh}main .car_engin_container .car_engin .paddels_container .paddel{justify-content:center;width:100%;left:50%;margin-bottom:0}main .car_engin_container .car_engin .paddels_container .paddel .brack span{font-size:12px;left:-150%}main .car_engin_container .car_engin .paddels_container .paddel .accelerator span{font-size:12px;right:-300%}main .car_engin_container .car_engin .paddels_container .paddel .brack:after{content:"";width:0}main .car_engin_container .car_engin .paddels_container .paddel .accelerator:after{content:"";width:0}main .car_engin_container .car_engin .paddels_container .paddel .accelerator{width:35px}.threeD_view h1{font-size:30px}}@media (max-width:786px){.loader-container .loader div{font-size:20px}.dot{width:2px;height:2px}.dot-label{font-size:10px}.dot-label:before{width:5px;margin:0 2px 0 -2px}main .car_brande h1{font-size:50px}main .car_name_container .car_name p{width:90%}main .car_name_container .car_name img{width:10%;position:absolute;bottom:10%}main .car_name_container .car_name h1{font-size:80px}main .car_feature_info_container{overflow:hidden}main .car_feature_info_container .car_feature_info h1{font-size:20px}main .car_feature_info_container .car_feature_info .feature li{font-size:15px}main .car_tire_container .car_tire h1{font-size:80px}main .car_engin_container .car_engin h1{font-size:80px}main .car_tire_container{justify-content:flex-end;height:100dvh;overflow:hidden}main .car_tire_container .car_tire{height:50dvh;margin-bottom:50px;width:100%;overflow:hidden;display:flex;flex-direction:column;align-items:center;position:relative}main .car_tire_container .car_tire h1{text-align:center;font-size:40px}main .car_tire_container .car_tire p{margin-left:0;margin-top:30px;padding:0;font-size:12px;width:90%;text-align:justify}main .car_tire_container .car_tire ul{font-size:12px;padding:0;margin:0;position:absolute;left:5%;bottom:0}main .car_tire_container .car_tire ul li:before{width:12px;height:12px}main .car_tire_container .car_tire ul li{font-size:12px;padding-left:20px;display:flex;align-items:center}}@media (max-width:428px){main .car_name_container .car_name h1{font-size:3em}}
