.hero__flash--percent { color: #ff7901; font-size: 84px; font-style: normal; font-weight: 900; line-height: 110%; text-transform: uppercase; } .hero__timer { border-radius: 50px; background: rgba(0, 0, 0, 0.5); padding: 16px 24px; justify-content: space-between; width: 92%; margin: 0 auto; margin-top: 30px; } .animation { margin-top: 62px; } .hero__timer .hero__btn { margin: 0; color: #000; font-size: 22px; border-radius: 50px; background: #ffa500; box-shadow: 0 8px 18px -10px rgba(119, 50, 0, 0.12); width: 347px; } .hero__timer .hero__btn::after { display: none; } .timer { width: auto; margin-right: 40px; } .timer__title { font-size: 16px; } .price::before { display: none; } .hero__title { opacity: 0; display: block; transform: translateY(40px); animation: fadeUp 0.6s ease-out forwards; animation-delay: 0.2s; } .hero__flash--percent { opacity: 0; display: block; transform: translateY(40px); animation: fadeUp 0.6s ease-out forwards; animation-delay: 0.4s; } @keyframes fadeUp { to { opacity: 1; transform: translateY(0); } } .price .timer { margin-right: 0; margin-top: 32px; } .price h1 { font-size: 64px; } .price .get-up__percent { font-size: 72px; } .price .timer .timer__title { color: #ff7901; font-size: 22px; } .price .timer__time { font-size: 40px; } .price .timer__time > div > span:nth-child(2) { font-size: 12px; } .price .timer { animation-delay: 0s; } .price a.btn { border-radius: 50px; border: 3px solid #ffa500; background: #000; box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.15); color: #fff; } .price .timer__time > div { min-width: 70px; } @media screen and (max-width: 1100px) { .dark-version .hero { background-size: contain !important; } } @media screen and (max-width: 768px) { .price h1, .price h2 { font-size: 44px !important; color: #ff7901 !important; margin-top: 30px; } .hero { position: relative; } .hero::before { position: absolute; content: ' '; width: 100%; height: 100%; top: 0; background: url('https://landing.investing.com/mobile_html/prod//web-landing/ProPricing/assets/img/interactive/grad_legendary_vector.svg') center center no-repeat; background-size: cover; } .price .get-up__percent { font-size: 50px; } .price .timer .timer__title { color: #fff; font-size: 14≤≥px; } .price .timer__time { font-size: 24px; } .price .timer__time > div > span:nth-child(2) { font-size: 9px; } .price .timer__time > div { min-width: 40px; } .hero__logo { display: block !important; margin-top: 0px; padding-top: 16px; } .hero__logo img { margin: 0; } .hero__timer { background: none; padding: 0; width: 100%; } .timer { margin-right: 0px; } .hero__timer .hero__btn { color: #fff; border-radius: 50px; border: 4px solid #ff7901; background: #000; box-shadow: 0 8px 18px -10px rgba(240, 97, 255, 0.12); margin-top: 15px; width: 100%; } .hero__title { margin-top: 100px; } .dark-version .timer { margin-top: 20px; } } @media screen and (max-width: 500px) { .hero__title { margin-top: 85px; } }